/*****************************************/ /* Start your style declarations here */ /*****************************************/ /****************************************/ /* */ /* */ /* Table of contents: */ /* Variables */ /* Macros */ /* Fonts */ /* Base sets */ /* Typography */ /* Forms */ /* Helpers */ /* Colors */ /* Contents */ /* Backgrounds */ /* Buttons */ /* Text Buttons */ /* Hubspot Forms */ /* */ /****************************************/ /********** Variables **********/ /* * Colors * * */ /* * Fonts * * */ /* * Spacing * * */ /* * Media queries * * */ /********** Macros **********/ /********** Fonts **********/ @import url('https://fonts.googleapis.com/css?family=Raleway:400,600,700'); @import url("https://use.typekit.net/nwe6iya.css"); @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600&display=swap'); @font-face { font-family: 'Gotham'; src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Medium.eot'); src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Medium.eot#iefix') format('embedded-opentype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Medium.woff2') format('woff2'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Medium.woff') format('woff'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Medium.ttf') format('truetype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Medium.svg#Gotham-Medium') format('svg'); font-weight: 500; font-style: normal; } @font-face { font-family: 'Gotham'; src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Book.eot'); src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Book.eot#iefix') format('embedded-opentype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Book.woff2') format('woff2'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Book.woff') format('woff'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Book.ttf') format('truetype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham/Gotham-Book.svg#Gotham-Book') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Gotham'; src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham-Bold.eot'); src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham-Bold.eot#iefix') format('embedded-opentype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham-Bold.woff2') format('woff2'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham-Bold.woff') format('woff'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham-Bold.ttf') format('truetype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/Gotham-Bold.svg#Gotham-Bold') format('svg'); font-weight: 700; font-style: normal; } @font-face { font-family: 'ArnoPro'; src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-Display.eot'); src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-Display.eot#iefix') format('embedded-opentype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-Display.woff2') format('woff2'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-Display.woff') format('woff'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-Display.ttf') format('truetype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-Display.svg#ArnoPro-Display') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'ArnoPro'; src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-LightDisplay.eot'); src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-LightDisplay.eot#iefix') format('embedded-opentype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-LightDisplay.woff2') format('woff2'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-LightDisplay.woff') format('woff'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-LightDisplay.ttf') format('truetype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/ArnoPro-LightDisplay.svg#ArnoPro-LightDisplay') format('svg'); font-weight: 300; font-style: normal; } @font-face { font-family: 'FontAwesome'; src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Regular.eot'); src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Regular.eot#iefix') format('embedded-opentype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Regular.woff2') format('woff2'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Regular.woff') format('woff'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Regular.ttf') format('truetype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Regular.svg#FontAwesome5Pro-Regular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'FontAwesome'; src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Brands-Regular.eot'); src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Brands-Regular.eot#iefix') format('embedded-opentype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Brands-Regular.woff2') format('woff2'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Brands-Regular.woff') format('woff'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Brands-Regular.ttf') format('truetype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Brands-Regular.svg#FontAwesome5Brands-Regular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'FontAwesome'; src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Solid.eot'); src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Solid.eot#iefix') format('embedded-opentype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Solid.woff2') format('woff2'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Solid.woff') format('woff'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Solid.ttf') format('truetype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Solid.svg#FontAwesome5Pro-Solid') format('svg'); font-weight: 900; font-style: normal; } @font-face { font-family: 'FontAwesome'; src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Light.eot'); src: url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Light.eot#iefix') format('embedded-opentype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Light.woff2') format('woff2'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Light.woff') format('woff'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Light.ttf') format('truetype'), url('https://5183438.fs1.hubspotusercontent-na1.net/hubfs/5183438/SphereOne/fonts/FontAwesome5Pro-Light.svg#FontAwesome5Pro-Light') format('svg'); font-weight: 300; font-style: normal; } /********** Base sets **********/ *, *::after, *::before { box-sizing: border-box; } html { scroll-behavior: smooth; } body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: 'Gotham'; margin: 0; letter-spacing: 0; } img, svg { max-width: 100%; vertical-align: middle; } a { color: #21BAD1; font-weight: 600; text-decoration: underline; } a:hover { color: #21BAD1; } label { display: block; } /* * * FontAwesome * * */ .fa, .fas, .fab, .fal, .far { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .fab { font-family: FontAwesome; } .fal { font-family: FontAwesome; font-weight: 300; } .far { font-family: FontAwesome; font-weight: 400; } .fa, .fas { font-family: FontAwesome; font-weight: 900; } /* * Hubspot override * * */ .header-container.container-fluid, .body-container.container-fluid, .footer-container.container-fluid { padding-right: 0 !important; padding-left: 0 !important; } .header-container-wrapper { position: relative; z-index: 9999; } .row-fluid [class*="span"] { min-height: auto !important; } a.cta_button { box-sizing: border-box !important; } .overflow-hidden { overflow: hidden; } /* * Bootstrap override * * */ .container { padding-left: 22px; padding-right: 22px; } .mobileP45{ padding-left: 45px; padding-right: 45px; } @media (min-width: 1200px) { .container { max-width: 1200px; } .container { padding-left: 15px; padding-right: 15px; } } /* * Lazyload * * */ img.lazyload { max-width: none; } /********** Typography **********/ body { color: #000; font-family: 'Gotham'; font-size: 18px; line-height: 1.333; } h1, h2, h3, h4, h5, .title1, .title2, .title3, .title4, .title5 { font-family: 'ArnoPro'; font-weight: 300; margin-top: 0; margin-bottom: 20px; } h1, .title1 { font-size: 40px; line-height: 35px; } h2, .title2 { font-size: 37px; line-height: 47px; } h3, .title3 { font-size: 35px; line-height: 41px; } h4, .title4 { font-size: 30px; line-height: 40px; } h5, .title5 { font-size: 25px; line-height: 30px; } .bannerTitle { font-size: 35px; line-height: 30px; } p { font-family: 'Gotham'; font-size: 16px; line-height: 26px; font-weight: 400; } .subhead { font-family: 'Gotham'; font-size: 14px; font-weight: 500; line-height: 24px; letter-spacing: 5px; text-transform: uppercase; } .button, button, input[type="submit"] { font-size: 18px; font-weight: 700; } small, small p, .small, .small p { font-size: 13px; line-height: 19.5px; } .tiny { font-size: 12px; line-height: 14px; } .fw-300 { font-weight: 300; } .fw-600 { font-weight: 600; } .fw-800 { font-weight: 800; } .text-white { color: #FFFFFF; } .text-black { color: #000; } @media (min-width: 768px) { h1, .title1 { font-size: 70px; line-height: 65px; } .bannerTitle { font-size: 70px; line-height: 65px; } } @media (min-width: 1200px) { h1, .title1 { font-size: 70px; line-height: 65px; } h2, .title2 { font-size: 42px; line-height: 52px; } h3, .title3 { font-size: 40px; line-height: 46px; } h4, .title4 { font-size: 35px; line-height: 40px; } .bannerTitle { font-size: 70px; line-height: 65px; } p { font-size: 18px; line-height: 30px; } } /********** Forms **********/ textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], select { background: #EFEFEF; border: 2px solid #EFEFEF; box-shadow: none; border-radius: 0; font-size: 18px; font-family: 'Gotham' !important; font-weight: 400; line-height: 21px; color: #8B8B8B; padding: 13px 10px !important; width: 100%; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; } select option { font-family: 'Gotham'; } textarea { min-height: 200px; } /*********** Helpers **********/ .text-align-left { text-align: left; } .text-align-center { text-align: center; } .text-align-right { text-align: right; } /********** Colors **********/ .color, .color.-black { color: #000; } .color.-white { color: #FFFFFF; } .color.-white { color: #FFFFFF; } .color.-java { color: #21BAD1; } .color.-wildBlueYonder { color: #7E7EB9; } .color.-seashell { color: #F1F1F1; } .color.-mercury { color: #E8E8E8; } .color.-gray { color: #8B8B8B; } .color.-mirage { color: #191E25; } .color.-red { color: #DA0000; } .color.-yellow { color: #FCB923; } .color.-blue { color: #007BFF; } .color.-darkBlue { color: #0A2B4E; } /********** Contents **********/ .content {} .content.-dark, .content.-dark h1, .content.-dark h2, .content.-dark h3, .content.-dark h4, .content.-dark h5, .content.-dark p, .content.-dark .title1, .content.-dark .title2, .content.-dark .title3, .content.-dark .title4, .content.-dark .title5, .content.-dark .bannerTitle { color: #FFFFFF; } .content.-light h1, .content.-light h2, .content.-light h3, .content.-light h4, .content.-light h5, .content.-light h6 { color: #21BAD1; } .content.-dark.-linkWhite a { color: #FFFFFF; } .content ul { padding-left: 25px; } .content ul li { list-style: none; margin-bottom: 15px; } .content ul li:before { content: "\2022"; color: #7E7EB9; display: inline-block; width: 1em; margin-left: -1em; font-size: 24px; } .content.no-bullet ul { list-style: none; padding-left: 0; margin: 2rem 0; } .content.no-bullet ul li::before { display: none; } .content__ul-columns { -webkit-columns: 3; -moz-columns: 3; columns: 3; -webkit-column-gap: 3%; -moz-column-gap: 3%; column-gap: 3%; } .content__ul-columns li { -webkit-margin-before: 0; -webkit-margin-after: 0; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; } @media only screen and (max-width:767px) { .content__ul-columns { -webkit-columns: 1; -moz-columns: 1; columns: 1; } } .spacer{ height: 1px; background-color: #D8D8D8; margin: 50px auto; } .animate { opacity: 0; position: relative; top: 5px; } /********** Backgrounds **********/ .background { background-repeat: no-repeat; background-position: top center; background-size: cover; } .background.-parallax { background-attachment: inherit; } .background.-black { background-color: #000; } .background.-white { background-color: #FFFFFF; } .background.-java { background-color: #21BAD1; } .background.-wildBlueYonder { background-color: #7E7EB9; } .background.-s1Gradient { background-color: #21BAD1; background: -webkit-linear-gradient(90deg,rgba(33,187,209,1),rgba(126,126,185,1)); background: -o-linear-gradient(90deg,rgba(33,187,209,1),rgba(126,126,185,1)); background: -moz-linear-gradient(90deg,rgba(33,187,209,1),rgba(126,126,185,1)); background: linear-gradient(to 90deg,rgba(33,187,209,1),rgba(126,126,185,1)); } .background.-seashell { background-color: #F1F1F1; } .background.-mercury { background-color: #E8E8E8; } .background.-gray { background-color: #8B8B8B; } .background.-mirage { background-color: #191E25; } .background.-yellow { background-color: #FCB923; } .background.-blue { background-color: #007BFF; } .background.-darkBlue { background-color: #0A2B4E; } .background.-pink { background-color: #FFC9EC; } .background.-offWhite { background-color: #FFF9EC; } .background.-lightBlue { background-color: #D6EAFF } .background.-overlay { position: relative; } .background.-overlay .container { position: relative; z-index: 10; } .background.-overlay:before { content: ''; position: absolute; background-color: rgba(10, 43, 78, 0.8); top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: 5; } @media (min-width: 1200px) { .background.-parallax { background-attachment: fixed; } } /********** Buttons **********/ .button, .button.-primary, button, input[type="submit"] { border: 2px solid #FCB923; background-color: #FCB923; color: #FFFFFF; cursor: pointer; padding: 11px 37px; display: inline-block; text-decoration: none; font-size: 18px; font-weight: 700; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; font-family: proxima-nova, sans-serif; font-size: 16px; line-height: 19px; text-transform: uppercase; } .button.-primary, input[type="submit"] { background-color: #FCB923; } .button:hover { text-decoration: none; } .button.-primary:hover, input[type="submit"]:hover { background-color: transparent; color: #FCB923; } .button.-primaryOutlined, .button.-secondaryOutlined { background-color: transparent; border: 2px solid #FFFFFF; color: #FFFFFF; } .button.-primaryOutlined:hover { background-color: #FFFFFF; border-color: #FFFFFF; color: #21BAD1; } .button.-secondaryOutlined:hover { background-color: #21BAD1; border-color: #21BAD1; color: #FFFFFF; } .button.-tertiaryOutlined{ background-color: transparent; border: 2px solid #21BAD1; color: #21BAD1; } .button.-tertiaryOutlined:hover{ background-color: #7E7EB9; border: 2px solid #7E7EB9; color: #FFFFFF; } .button.-secondary { background-color: #FFFFFF; border: 2px solid #FFFFFF; color: #21BAD1 } .button.-secondary:hover { background-color: transparent; color: #FFFFFF; } .button.-glyph { position: relative; padding-right: 50px; } .button.-glyph:after { content: '\f105'; font-family: 'FontAwesome'; font-weight: normal; position: absolute; right: 32px; -webkit-transform: translateX(-6px); transform: translateX(-6px); -webkit-transition: transform .3s ease-in; transition: transform .3s ease-in; } .button.-glyph:hover:after { -webkit-transform: none; transform: none; } /********** Text Buttons **********/ .textButton, .textButton.-primary { color: #21BAD1; cursor: pointer; text-decoration: none; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; } .textButton:after { content: "\f061"; font-family: 'FontAwesome'; font-weight: 400; margin-left: 11px; right: 0px; position: relative; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } .textButton.-primary:after, .textButton.-secondary:after { color: #7E7EB9; } .textButton:hover { text-decoration: none; } .textButton:hover:after{ -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; right: -8px; position: relative; } .textButton.-primary:hover { color: #7E7EB9; } .textButton.-secondary, .textButton.-tertiary { color: #FFFFFF; } .textButton.-tertiary:after { color: #21BAD1 } .textButton.-secondary:hover:after, .textButton.-tertiary:hover:after { color: #FFFFFF; } /********** Hubspot Forms **********/ .hubspotForm {} .hubspotForm .hs-form-field { margin-top: 50px; position: relative; } .hubspotForm .hs-form-field > label { position: absolute; display: block; color: #21BAD1; font-size: 12px; line-height: 14px; top: -15px; } .hubspotForm .hs-form-field:not(.hs-fieldtype-select):not(.hs-fieldtype-checkbox):not(.hs-fieldtype-radio)/*:not(.hs-fieldtype-textarea)*/ > label { color: #8B8B8B; font-size: 18px; line-height: 18px; top: 16px; left: 16px; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; -o-transition: all .2s ease; -ms-transition: all .2s ease; transition: all .2s ease; } .hubspotForm .hs-form-field > label.sel { color: #000 !important; font-size: 12px !important; line-height: 14px !important; top: -17px !important; left: 0 !important; } .hubspotForm .hs-form-field > label.error { color: #DA0000 !important; } .hubspotForm .hs-error-msgs { margin: 5px 0 0; padding-left: 0; } .hubspotForm .hs-error-msgs li { list-style: none; } .hubspotForm .invalid.error { border-color: #FCB923; } .hubspotForm .hs-error-msgs li label { font-size: 12px; line-height: 14px; color: #DA0000; } .hubspotForm ul.inputs-list.multi-container { list-style: none; padding-top: 24px; padding-left: 0; padding-bottom: 4px; } .hubspotForm .hs-form-checkbox .hs-form-checkbox-display, .hubspotForm .hs-form-radio .hs-form-radio-display { cursor: pointer; display: block; position: relative; margin-bottom: 20px; } .hubspotForm .hs-form-checkbox .hs-form-checkbox-display > input, .hubspotForm .hs-form-radio .hs-form-radio-display > input { position: absolute; opacity: 0; } .hubspotForm .hs-form-checkbox .hs-form-checkbox-display > i, .hubspotForm .hs-form-radio .hs-form-radio-display > i { align-items: center; -webkit-align-items: center; background-color: transparent; border: 1px solid #CDCDCD; border-radius: 4px; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; width: 20px; height: 20px; position: absolute; left: 0; top: 2px; } .hubspotForm .hs-form-radio .hs-form-radio-display > i { border-radius: 50%; } .hubspotForm .hs-form-checkbox .hs-form-checkbox-display > input:checked ~ i, .hubspotForm .hs-form-radio .hs-form-radio-display > input:checked ~ i { border-color: #21BAD1; background-color: #21BAD1; color: #FFFFFF; } .hubspotForm .hs-form-checkbox .hs-form-checkbox-display > input:checked ~ i::before { content: "\f00c"; } .hubspotForm .hs-form-radio .hs-form-radio-display>input:checked ~ i::before { background-color: #FFFFFF; border-radius: 12px; content: ""; width: 12px; height: 12px; } .hubspotForm .hs-form-checkbox .hs-form-checkbox-display > span, .hubspotForm .hs-form-radio .hs-form-radio-display > span { flex: none; -webkit-flex: none; margin-left: 40px; } .hubspotForm .hs_recaptcha { margin-bottom: 50px; } .hubspotForm .hubspot-link__container.sproket { margin-top: 20px; } .hubspotForm .hs_submit { margin-top: 30px; } /********** Mods **********/ .global-padding { --d-ptop: 3.33em; --d-pbottom: 3.33em; --t-ptop: 2.88em; --t-pbottom: 2.88em; --m-ptop: 2.33em; --m-pbottom: 2.33em; padding-top: var(--d-ptop); padding-bottom: var(--d-pbottom); } @media (max-width: 767px) { .global-padding { padding-top: var(--t-ptop); padding-bottom: var(--t-pbottom); } } @media (max-width: 690px) { .global-padding { padding-top: var(--m-ptop); padding-bottom: var(--m-pbottom); } } /********** End of _styles.css **********/