@import 'https://fonts.googleapis.com/css?family=Istok+Web:400,700&display=swap'; /** * CSS @imports must be at the top of the file. * Add them above this section. */ /*//////////////////////////////////// /////////// Hubl Variables//////////// ////////////////////////////////////*/ /** * Colors */ /* Brand colors */ /** * Scaffolding */ /* Background color for '' */ /* Global text color for '' */ /* Global textual link color */ /* Link hover color set via `darken()` function */ /* Link hover decoration */ /** * Typography */ /* Font weights */ /* By default, this inherits from the '' */ /** * Media Queries */ /* Custom, iPhone Retina */ /* Extra Small Devices, Phones */ /* Small Devices, Tablets */ /* Medium Devices, Desktops */ /* Large Devices, Wide Screens */ /* Large Devices, Wide Screens */ /*//////////////////////////////////// /////////// Resets and Base/////////// ////////////////////////////////////*/ /* Ensure no horizontal scroll */ html, body{ overflow-x: hidden; } /* Smoother fonts */ body{ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body{ font-family: Istok Web, sans-serif; color: #000010; font-size: 16px; line-height: normal; letter-spacing: normal; font-weight: 400; } /** * Heading styles */ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{ font-family: Istok Web, sans-serif; font-style: normal; font-weight: 700; line-height: normal; color: #000010; text-transform: none; letter-spacing: normal; margin: 0; } h1{ font-size: 48px; } h2{ font-size: 40px; } h3{ font-size: 32px; } h4{ font-size: 24px; } h5{ font-size: 18px; } h6{ font-size: 16px; } /* Links */ a, a:hover, a:focus{ color: #75c7b9; text-decoration: ; outline: 0; } /* Responsive images */ img{ max-width: 100%; height: auto; } /* Font sizes */ .font-small{ font-size: 12px; } .font-normal{ font-size: 16px; } .font-medium{ font-size: 20px; } .font-large{ font-size: 24px; } /*///////////////////////////// /////////// Buttons//////////// /////////////////////////////*/ /** * Button styles */ .btn{ -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-family: Istok Web, sans-serif; font-weight: 400; line-height: normal; letter-spacing: normal; text-transform: uppercase; padding-top: 10px; padding-right: 20px; padding-bottom: 10px; padding-left: 20px; margin-bottom: 5px; margin-right: 5px; } .btn.active .btn:active, .btn:focus, .btn:hover{ outline: 0; } .btn-primary{ color: #ffffff; background: ; border-color: ; } .btn-primary.active .btn-primary:active, .btn-primary:focus, .btn-primary:hover{ color: #ffffff; background: transparent; border: 1px solid #ffffff; } /*//////////////////////////// /////////// Header//////////// ////////////////////////////*/ .site-header .navbar{ -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; border: 0 solid transparent; min-height: 50px; margin-bottom: 0; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .site-header .navbar.navbar-default{ background: #ffffff; } /* site-header-nav - Main Navigation - Sticky Main Menu */ .site-header .navbar.sticky .site-header-nav{ -webkit-box-shadow: -10px 3px 6px rgba(0, 0, 0, .1); -moz-box-shadow: -10px 3px 6px rgba(0, 0, 0, .1); box-shadow: -10px 3px 6px rgba(0, 0, 0, .1); } /* site-header-nav - Main Navigation - Main Menu */ .site-header-nav{ padding-top: 10px; padding-right: 0; padding-bottom: 10px; padding-left: 0; } .site-header-nav .navbar-header{ padding: 0; } .site-header-nav .navbar-header .navbar-brand{ height: auto; } /*/////////////////////////////////// /////////// Header Banner//////////// ///////////////////////////////////*/ .site-header-banner{ background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: center; /*padding-top: 116px;*/ position: relative; } .site-header-banner .text-col{ text-align: center; padding: 0; margin-top: 96px; margin-right: 0; margin-bottom: 96px; margin-left: 0; } .site-header-banner .text-col h1{ color: #ffffff; font-size: 48px; font-weight: 700; letter-spacing: normal; text-shadow: 2px 0px 3px rgba(0, 0, 0, 0.16); } .site-header-banner .text-col h3{ color: #ffffff; font-size: 32px; } /*//////////////////////////////// /////////// Inner Page//////////// ////////////////////////////////*/ .site-content{ padding-top: 64px; padding-bottom: 64px; } .site-content .bullet-list{ padding: 0; margin-top: 0; margin-right: 0; margin-bottom: 16px; margin-left: 0; list-style: none; } .site-content .bullet-list li{ padding-left: 15px; margin-bottom: 16px; position: relative; } .site-content .bullet-list li:before{ content: '\f111'; color: #75c7b9; font-family: "Font Awesome 5 Free"; font-size: 10px; font-weight: 900; position: absolute; top: 5px; left: 0; } .site-content .section-marketing-webinar .left-col h4{ margin-bottom: 32px; } .site-content .section-marketing-webinar .marketing-form h3{ color: #da973a; text-align: left; margin-top: 16px; margin-bottom: 32px; } .site-content .section-marketing-webinar .marketing-form .hs-form-field{ margin-bottom: 18px; } .site-content .section-marketing-webinar .marketing-form input[type=text], .site-content .section-marketing-webinar .marketing-form input[type=email], .site-content .section-marketing-webinar .marketing-form input[type=tel], .site-content .section-marketing-webinar .marketing-form textarea{ -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: 1px solid #BEBEBE; background: #ffffff; box-shadow: none; box-sizing: border-box; padding-left: 15px; height: 40px; width: 100%; } .site-content .section-marketing-webinar .marketing-form input[type="checkbox"], .site-content .section-marketing-webinar .marketing-form input[type="radio"]{ margin-top: 0; margin-right: 10px; margin-bottom: 0; margin-left: 0; } .site-content .section-marketing-webinar .marketing-form textarea{ height: 100px; padding-top: 18px; width: 100%; resize: none; } .site-content .section-marketing-webinar .marketing-form ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: #BEBEBE; opacity: 1; /* Firefox */ } .site-content .section-marketing-webinar .marketing-form :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #BEBEBE; } .site-content .section-marketing-webinar .marketing-form ::-ms-input-placeholder { /* Microsoft Edge */ color: #BEBEBE; } .site-content .section-marketing-webinar .marketing-form .inputs-list{ padding: 0; margin: 0; list-style: none; } .site-content .section-marketing-webinar .marketing-form .inputs-list li{ margin-bottom: 18px !important; } .site-content .section-marketing-webinar .marketing-form fieldset{ margin-bottom: 18px; max-width: none; } .site-content .section-marketing-webinar .marketing-form label{ /*display: none;*/ } .site-content .section-marketing-webinar .marketing-form .hs-richtext{ margin-bottom: 18px; } .site-content .section-marketing-webinar .marketing-form .hs-error-msgs{ padding: 0; margin: 0; list-style: none; } .site-content .section-marketing-webinar .marketing-form .hs-error-msgs li{ color: red; font-size: 12px; } .site-content .section-marketing-webinar .marketing-form .hs-error-msgs li label{ display: block !important; text-align: left; } .site-content .section-marketing-webinar .marketing-form .hs-recaptcha{ margin-bottom: 18px; } .site-content .section-marketing-webinar .marketing-form .legal-consent-container label{ display: block !important; font-size: 12px; font-weight: 700; } .site-content .section-marketing-webinar .marketing-form .hs-button{ -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; color: #ffffff; background: #da973a; border: 1px solid #da973a; font-family: Istok Web, sans-serif; font-size: 20px; font-weight: 400; line-height: 1.2; letter-spacing: normal; text-transform: uppercase; padding-top: 8px; padding-right: 16px; padding-bottom: 8px; padding-left: 16px; margin-bottom: 0; margin-right: 0; } .site-content .section-marketing-webinar .marketing-form .hs-button:active, .site-content .section-marketing-webinar .marketing-form .hs-button:focus, .site-content .section-marketing-webinar .marketing-form .hs-button:hover{ outline: 0; color: #da973a; background: transparent; border: 1px solid #da973a; } /*//////////////////////////// /////////// Footer//////////// ////////////////////////////*/ .site-footer{ background: #2c2c2c; padding-top: 32px; padding-bottom: 32px; } .site-footer .site-footer-disclaimer{ color: #ffffff; font-size: 12px; } .site-footer .site-footer-disclaimer a{ color: #ffffff; } /*======= Bootstrap 3 Media Queries =======*/ /*========== Mobile First Method ==========*/ /* Custom, iPhone Retina */ /* min-width : 320px */ @media only screen and (min-width : 320px){ } /* Extra Small Devices, Phones */ /* min-width : 480px */ @media only screen and (min-width : 480px){ } /* Small Devices, Tablets */ /* min-width : 768px */ @media only screen and (min-width : 768px){ } /* Medium Devices, Desktops */ /* min-width : 992px */ @media only screen and (min-width : 992px){ .site-content .section-marketing-webinar .left-col{ padding-right: 64px; } .site-content .section-marketing-webinar .right-col{ border-left-width: 1px; border-left-style: solid; border-left-color: #000010; padding-left: 32px; } .site-content .section-marketing-webinar .marketing-form h3{ margin-top: 0; } } /* Large Devices, Wide Screens */ /* min-width : 1200px */ @media only screen and (min-width : 1200px){ }