/* Theme Name: Infutor Description: Infutor Data Solutions Custom Theme Author: Damian Version: 1.0.0 */ .alert-box {position:fixed; bottom:10px; left:80px; width:60px; height:60px; background:none; font-size:20px; z-index:999; text-align:center; line-height:60px; opacity:0;} .alert-box:hover {background:#00b7c6; color:#ffffff; opacity:1;} .bottom-popup {height:auto; position:fixed; bottom:5px; left:5px; right:5px; overflow:hidden; padding:0; background:#ffffff; border:1px solid #f26b21; z-index:999999; display:none; -webkit-box-shadow:0 20px 80px 10px rgba(0,0,0,0.25); -moz-box-shadow:0 20px 80px 10px rgba(0,0,0,0.25); box-shadow:0 20px 80px 10px rgba(0,0,0,0.25);} .bottom-popup:after {content:""; position:absolute; top:2px; right:2px; bottom:2px; left:2px; border:1px solid #f26b21; z-index:-1;} .bottom-popup-container {width:92%; max-width:1380px; padding:8px 0 10px 0; margin:0 auto; position:relative;} .bottom-popup p {text-align:left !important; font-size:15px !important; line-height:22px !important; margin:0 0 0 0; max-width:1000px; padding:4px 0 !important;} .bottom-popup p a {font-weight:700 !important;} .bottom-popup p a:hover {color:#f26b21 !important;} .bottom-popup .breaker1 {display:none;} .bottom-popup .breaker2 {display:inline;} .bottom-popup .breaker3 {display:none;} .bottom-popup-close {float:right; width:50px; height:50px; margin:0; cursor:pointer; font-size:30px; height:50px; line-height:50px; text-align:right; color:#f26b21;} .bottom-popup-close span {font-size:20px;} .bottom-popup-close:hover {color:#006680 !important;} .bottom-popup-open {position:fixed; bottom:10px; left:150px; width:60px; height:60px; background:none; font-size:20px; z-index:999; text-align:center; line-height:60px; opacity:0;} .bottom-popup-open:hover {background:#00b7c6; color:#ffffff; opacity:1;} .ccpa-remove-on-mobile {display:none;} @media all and (min-width:550px) { .bottom-popup {bottom:10px; left:10px; right:10px;} .bottom-popup p {font-size:16px !important; padding:13px 0 !important;} .bottom-popup .breaker2 {display:none;} .bottom-popup .breaker3 {display:inline;} .bottom-popup-close {border-left:1px solid #cccccc;} } @media all and (min-width:700px) { .bottom-popup-container {width:96%;} .bottom-popup p {margin:0 200px 0 0;} .bottom-popup-close {width:150px; height:80px; line-height:80px; margin:10px 0 10px 20px;} .ccpa-remove-on-mobile {display:inline;} } @media all and (min-width:1200px) { .bottom-popup .breaker1 {display:inline;} } /*------ Responsive Device Breakpoint Reference -------------------------------------*/ @media all and (max-width:599px) {} /* For Mobile Devices Only */ @media all and (min-width:600px) {} /* For Mobile - Tablet Portrait Up */ @media all and (min-width:900px) {} /* For Mobile - Tablet Landscape Up */ @media all and (min-width:1200px) {} /* For Desktop Up */ @media all and (min-width:1500px) {} /* For Mid Desktop Up */ @media all and (min-width:1800px) {} /* For Big Desktop Up */ /*-------------- Normalize ----------------------------------------------------------*/ html, body, div, ul, li, a, p, span, h1, h2, h3, h4, h5, h6, img, input, textarea {margin:0; padding:0; text-decoration:none; border:none; vertical-align:top; font-family: 'Muli', sans-serif; font-size:100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-rendering: optimizeLegibility; font-variant-ligatures: none; -webkit-font-variant-ligatures: none;} html, body {width:100vw; min-width:350px; font-family: 'Muli', sans-serif; position:relative; overflow-x:hidden;} html {-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; overflow-x:hidden;} a {background-color:transparent; -webkit-text-decoration-skip:objects; color:#00657f;} a:active, a:hover, a:visited {outline-width:0;} a:visited {color:#00657f;} sub, sup {font-size: 75%; line-height:0; position:relative; vertical-align:baseline;} sub {bottom: -0.25em;} sup {top: -0.5em;} audio, video {display:inline-block;} img {display:inline-block; font-size:16px; color:#535559; font-style:italic;} em {font-style:italic;} strong {font-weight:700;} hr {border:none; height:1px; background:#b3b2b1; margin:50px 0;} @media all and (min-width:900px) {hr {margin:80px 0;}} ::selection {background:#00b7c6; color:#ffffff;} ::-moz-selection { background:#00b7c6; color:#ffffff;} .screen-reader-text {clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute !important; width: 1px; word-wrap: normal !important;} .screen-reader-text:focus {background-color: #f1f1f1; -webkit-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: 700; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000;} .preload * { -webkit-transition: none !important; -moz-transition: none !important; -ms-transition: none !important; -o-transition: none !important; transition: none !important; } /*-------------- Animations ---------------------------------------------------------*/ .full-width-cyan-fade, .bottom-cta, .growover-left { -o-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out;} .side-nav, .side-nav .searchform, .fade-this-in, .popup-vid-inner, .overlay-close, .main-nav { -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} .main-nav ul.menu > li:last-child:after, .main-nav ul.menu > li > a:before, .main-nav ul.menu li ul li a:before, .popup-link, .ham-line-1, .ham-line-2, .ham-line-3, .hamburger-anim-1, .hamburger-anim-2, .hamburger-anim-3, a.sn-top-links .sn-hover-text, .overlay-close .overlay-line-1, .overlay-close .overlay-line-2, .overlay-close .overlay-line-3, .call-to-action .top-section .client-logo-container img, .page-wrap a, .page-wrap a:before, .blog-post, .blog-post .image-overlay, .blog-post .image-container img, .blog-post .image-container-vid img, .blog-post .image-container-icon img, .blog-post .image-container-banner img, .blog-post .image-container-lander img, .categories-nav a, .categories-nav a:before, .post-page-inner p a, .post-page-inner p a:before { -o-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;} .main-nav ul.menu li ul li ul, .blog-contact-link, .team-bio-box .bio-details img, .team-bio-box2 img { -o-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;} input[type="submit"], button[type="submit"], .popup-vid-close, a.sn-top-links svg, .hero-link-1, .hero-link-2, .hero-link-2 .img-container svg, .hero-link-2 span, .hero-link-2:before, .hero-link-1:before, .featured-services .learnmore, .call-to-action .bottom-section .main-button, .cta-button, .cta-download-button, .careers-button, .blog-post h2, .blog-post h5, .blog-post p.link-more a, .blog-post .external-link span, a.blog-share-link, a.blog-search-link, .lp-cta-button, .site-footer .social-link, .site-footer .social-link:before { -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;} .side-nav a, .side-nav ul li, .side-nav ul li a { -o-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -webkit-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out;} #rotating-image, .rotate-large, .rotate-small { -o-transition: all 0.29s linear; -moz-transition: all 0.29s linear; -webkit-transition: all 0.29s linear; transition: all 0.29s linear;} .mover, .mover2 {position:relative; width:100%; max-width:550px; font-size:22px; text-align:center;} .parallax {transform:translate3d(0,0,0); will-change:transform; -o-transition: all 0s linear; -moz-transition: all 0s linear; -webkit-transition: all 0s linear; transition: all 0s linear;} @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .parallax {transition: all 0.02s linear;} } /*-------------- Popup Stuff --------------------------------------------------------*/ .popup-link {display:block; width:100%; height:auto; border-bottom:2px solid #00b7c6; border-top:2px solid #00b7c6;} .popup-link:hover {-o-transform:scale(1.02); -ms-transform:scale(1.02); -moz-transform:scale(1.02); -webkit-transform:scale(1.02); transform:scale(1.02);} .popup-vid-overlay {display:none; position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100vh; background:#a6aab3; background:rgba(83,85,89,0.5); z-index:99999; text-align:center;} .popup-vid-close {position:absolute; top:0; right:0; width:100px; height:100px; color:#ffffff; font-size:70px; line-height:100px; text-align:center; cursor:pointer; z-index:999999;} .popup-vid-close:hover {color:#00657f;} .popup-vid-inner {width:80%; max-width:150vh; margin:auto; position:relative; top:60%; -o-transform:translateY(-50%); -ms-transform:translateY(-50%); -moz-transform:translateY(-50%); -webkit-transform:translateY(-50%); transform:translateY(-50%);} .popup-vid-frame {position:relative; padding-bottom:56.25%; /* 16:9 */ padding-top:0; width:100%; height:0; -moz-box-shadow:0 20px 100px rgba(0,20,26,0.7); -webkit-box-shadow:0 20px 100px rgba(0,20,26,0.7); box-shadow:0 20px 100px rgba(0,20,26,0.7);} .popup-vid-frame iframe {position:absolute; top:0; left:0; width:100%; height:100%;} /*-------------- Text and Inputs ----------------------------------------------------*/ h1, h2, h3, h4, h5, h6 {padding:12px 0 12px 0;} h1, h1 span {font-weight:300; color:#00657f; text-align:left; vertical-align:baseline; font-family: 'Montserrat', sans-serif;} h2, h2 span {font-weight:600; color:#f26b21; text-align:left; vertical-align:baseline; font-family: 'Montserrat', sans-serif;} h3, h3 span {font-weight:700; color:#a6216a; text-align:left; vertical-align:baseline; font-family: 'Montserrat', sans-serif;} h4, h4 span {font-weight:700; color:#00b7c6; text-align:left; vertical-align:baseline; font-family: 'Montserrat', sans-serif;} h5, h5 span {font-weight:700; color:#f26b21; text-align:left; vertical-align:baseline;} h6, h6 span {font-weight:700; color:#00657f; text-align:left; vertical-align:baseline;} p { font-weight:400; color:#616060; padding:13px 0 13px 0; text-align:left; vertical-align:baseline;} p:empty {display:none;} ul, ol {padding:0px 0 4px 20px;} li {font-weight:400; padding:12px 0 12px 0; color:#616060; text-align:left; vertical-align:baseline;} ul li, ol li {padding:12px 0 12px 0;} .page-wrap ul, .lp-page-wrap ul {list-style-type:none;} .page-wrap ul li::before, .lp-page-wrap ul li::before {content:"\2022"; float:left; font-size:1em; margin:-1px 0px 0px -22px; color:#f26b21;} .callout-quote-left {font-style:italic; font-weight:300; color:#88888c; margin:50px 0 50px 0; padding:10px 0 10px 25px; text-align:right;} .callout-quote-right {font-style:italic; font-weight:300; color:#88888c; margin:50px 0 50px 0; padding:10px 25px 10px 0; text-align:left;} .callout-quote-left span, .callout-quote-right span {font-weight:bold; color:#00b7c6;} @media all and (max-width:599px) { p, li {font-size:16px; line-height:26px;} h1 {font-size:36px; line-height:42px;} h2 {font-size:24px; line-height:30px;} h3 {font-size:20px; line-height:25px;} h4 {font-size:18px; line-height:24px;} h5 {font-size:18px; line-height:24px;} h6 {font-size:18px; line-height:24px;} } @media all and (min-width:600px) { p, li {font-size:16px; line-height:26px;} h1 {font-size:40px; line-height:46px;} h2 {font-size:30px; line-height:38px;} h3 {font-size:22px; line-height:26px;} h4 {font-size:20px; line-height:26px;} h5 {font-size:20px; line-height:26px;} h6 {font-size:20px; line-height:26px;} } @media all and (min-width:900px) { p, li {font-size:17px; line-height:28px;} h1 {font-size:42px; line-height:48px;} h2 {font-size:32px; line-height:40px;} h3 {font-size:24px; line-height:30px;} h4 {font-size:22px; line-height:30px;} h5 {font-size:22px; line-height:30px;} h6 {font-size:22px; line-height:30px;} } @media all and (min-width:1200px) { p, li {font-size:18px; line-height:29px;} h1 {font-size:44px; line-height:50px;} h2 {font-size:34px; line-height:40px;} h3 {font-size:26px; line-height:32px;} h4 {font-size:24px; line-height:30px;} h5 {font-size:24px; line-height:30px;} h6 {font-size:24px; line-height:30px;} } input[type="checkbox"] {float:left; width:20px; height:20px; margin:5px 10px 0 0;} input[type="text"], input[type="tel"], input[type="email"], select {height:38px; line-height:38px; font-size:16px; color:#00657f; border:1px solid #cccccc; width:99%; padding:0 0 0 1%; background:none; margin:0 -1px 0 -1px; font-weight:400;} textarea {line-height:32px; height:120px; font-size:16px; color:#00657f; border:1px solid #cccccc; width:99%; padding:2px 0 2px 1%; background:none; margin:0 -1px 0 -1px; font-weight:400;} input[type="text"]:focus, input[type="tel"]:focus, input[type="email"]:focus, textarea:focus, select:focus {border:1px solid #00b7c6; outline:none; -moz-box-shadow:0 0 0 rgba(255,255,255,0.1); -webkit-box-shadow:0 0 0 rgba(255,255,255,0.1); box-shadow:0 0 0 rgba(255,255,255,0.1);} ::-webkit-input-placeholder {opacity:0.8 !important; font-weight:400 !important;} :-moz-placeholder {opacity:0.8 !important; font-weight:400 !important;} ::-moz-placeholder {opacity:0.8 !important; font-weight:400 !important;} :-ms-input-placeholder {opacity:0.8 !important; font-weight:400 !important;} input[type="submit"], button[type="submit"] {font-size:20px; font-weight:700; color:#ffffff; background:#f26b21; padding:5px 20px; border-radius:40px; display:inline-block; margin:15px 0 0 0; vertical-align:middle; border:2px solid #f26b21; cursor:pointer;} input[type="submit"]:hover, button[type="submit"]:hover {background:#ffffff; color:#f26b21;} input[type="submit"]:focus, button[type="submit"]:focus {-moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; border:2px solid #c92027; outline:none;} select {cursor:pointer;} .wpcf7-response-output {font-size:16px; margin:20px 0 20px 0 !important; padding:15px !important;} .wpcf7-not-valid-tip {font-size:16px !important; top:0 !important; left:0 !important; width:99%; height:35px; line-height:35px; margin:0 -1px !important; padding:0 0 0 1% !important;} /*-------------- Navigation ---------------------------------------------------------*/ .mobile-logo {display:block; position:absolute; top:20px; left:30px; width:200px; max-width:60%; padding:0; margin:0; z-index:999;} .mobile-logo img {width:100%; height:auto;} .main-nav {position:fixed; top:0; right:0; left:0; width:100%; min-width:200px; z-index:9999; text-align:center; font-size:0;} .main-nav-container {position:relative; margin:0 auto 0 auto; width:100%; min-width:290px; max-width:100vw; text-align:center;} .main-nav-left {height:70px; background:#ffffff; background:rgba(255,255,255,0.94); margin:0 70px 0 0; text-align:right; display:none; position:relative; z-index:100001; -moz-box-shadow:0 2px 14px 0 rgba(20,20,30,0.05), 0 -10px 120px 10px rgba(20,20,30,0.1); -webkit-box-shadow:0 2px 14px 0 rgba(20,20,30,0.05), 0 -10px 120px 10px rgba(20,20,30,0.1); box-shadow:0 2px 14px 0 rgba(20,20,30,0.05), 0 -10px 120px 10px rgba(20,20,30,0.1);} .main-nav .red-stripe {display:block; position:absolute; top:0; left:0; width:61px; height:70px; margin:0 0 0 0; background:url(/wp-content/uploads/2019/09/red-stripe.png); background-size:100% auto; background-repeat:no-repeat; background-position:top left;} .main-nav .nav-logo {float:left; width:123px; height:auto; padding:18px 10px 0 65px;} .main-nav .nav-logo img {width:100%; height:auto;} .main-nav ul.menu {list-style-type:none; text-align:right; display:none; padding:0;} .main-nav ul.menu li {display:inline-block; padding:0; vertical-align:top;} .main-nav ul.menu > li:last-of-type > a {cursor:pointer !important;} .main-nav ul.menu li a {font-size:15px; font-weight:600; height:43px; line-height:17px; display:block; color:#00657f; padding:27px 16px 0 16px; text-align:center;} @media all and (min-width:1100px) { .main-nav ul.menu li a {font-size:16px; padding:27px 23px 0 23px;} } @media all and (min-width:1200px) { .main-nav ul.menu li a {padding:27px 28px 0 28px; font-family: 'Montserrat', sans-serif;} } @media all and (min-width:1300px) { .main-nav ul.menu li a {padding:27px 30px 0 30px;} } .main-nav ul.menu > li:hover > a {color:#f26b21;} .main-nav ul.menu > li > a {cursor:default; position:relative;} .main-nav ul.menu > li:last-child:after {content:""; position:absolute; bottom:0; height:0; background:#f26b21; z-index:-1;} .main-nav ul.menu > li > a:before {content:""; position:absolute; bottom:0; left:50%; width:0; height:0; margin:0 0 0 -14px; border-left:14px solid transparent; border-right:14px solid transparent; border-bottom:0 solid #f26b21;} .main-nav ul.menu > li:hover > a:before {border-bottom:8px solid #f26b21;} .main-nav ul.menu > li:nth-child(1):hover ~ li:last-child:after { right:511px !important; width:130px !important; height:3px !important;} .main-nav ul.menu > li:nth-child(2):hover ~ li:last-child:after { right:348px !important; width:163px !important; height:3px !important;} .main-nav ul.menu > li:nth-child(3):hover ~ li:last-child:after { right:251px !important; width:97px !important; height:3px !important;} .main-nav ul.menu > li:nth-child(4):hover ~ li:last-child:after { right:164px !important; width:87px !important; height:3px !important;} .main-nav ul.menu > li:nth-child(5):hover ~ li:last-child:after { right:88px !important; width:76px !important; height:3px !important;} .main-nav ul.menu > li:nth-child(6):hover:after { right:0 !important; width:88px !important; height:3px !important;} @media all and (min-width:1100px) { .main-nav ul.menu > li:nth-child(1):hover ~ li:last-child:after {right:603px !important; width:150px !important;} .main-nav ul.menu > li:nth-child(2):hover ~ li:last-child:after {right:417px !important; width:186px !important;} .main-nav ul.menu > li:nth-child(3):hover ~ li:last-child:after {right:302px !important; width:115px !important;} .main-nav ul.menu > li:nth-child(4):hover ~ li:last-child:after {right:197px !important; width:105px !important;} .main-nav ul.menu > li:nth-child(5):hover ~ li:last-child:after {right:105px !important; width:92px !important;} .main-nav ul.menu > li:nth-child(6):hover:after {right:0 !important; width:105px !important;} } @media all and (min-width:1200px) { .main-nav ul.menu > li:nth-child(1):hover ~ li:last-child:after {right:696px !important; width:168px !important;} .main-nav ul.menu > li:nth-child(2):hover ~ li:last-child:after {right:483px !important; width:213px !important;} .main-nav ul.menu > li:nth-child(3):hover ~ li:last-child:after {right:350px !important; width:133px !important;} .main-nav ul.menu > li:nth-child(4):hover ~ li:last-child:after {right:228px !important; width:122px !important;} .main-nav ul.menu > li:nth-child(5):hover ~ li:last-child:after {right:121px !important; width:107px !important;} .main-nav ul.menu > li:nth-child(6):hover:after {right:0 !important; width:121px !important;} } @media all and (min-width:1300px) { .main-nav ul.menu > li:nth-child(1):hover ~ li:last-child:after {right:716px !important; width:172px !important;} .main-nav ul.menu > li:nth-child(2):hover ~ li:last-child:after {right:499px !important; width:217px !important;} .main-nav ul.menu > li:nth-child(3):hover ~ li:last-child:after {right:362px !important; width:137px !important;} .main-nav ul.menu > li:nth-child(4):hover ~ li:last-child:after {right:236px !important; width:126px !important;} .main-nav ul.menu > li:nth-child(5):hover ~ li:last-child:after {right:125px !important; width:111px !important;} .main-nav ul.menu > li:nth-child(6):hover:after {right:0 !important; width:125px !important;} } .main-nav ul.menu > li > ul {display:block; position:absolute; top:100%; opacity:0; visibility:hidden; font-size:0; width:96%; background:#ffffff; background:rgba(255,255,255,0.98); padding:20px 2% 45px 2%; text-align:left; -moz-box-shadow:0 25px 50px rgba(0,0,0,0.1); -webkit-box-shadow:0 25px 50px rgba(0,0,0,0.1); box-shadow:0 25px 50px rgba(0,0,0,0.1); } .main-nav ul.menu > li:nth-child(1) > ul {width:425px; right:345px;} .main-nav ul.menu > li:nth-child(2) > ul {width:300px; right:265px;} .main-nav ul.menu > li:nth-child(3) > ul {max-width:1365px; right:0;} .main-nav ul.menu > li:nth-child(4) > ul {width:600px; right:0;} .main-nav ul.menu > li:nth-child(5) > ul {width:300px; right:0;} .main-nav ul.menu > li:nth-child(6) > ul {} @media all and (min-width:1100px) { .main-nav ul.menu > li:nth-child(1) > ul {right:450px;} .main-nav ul.menu > li:nth-child(2) > ul {right:340px;} } @media all and (min-width:1200px) { .main-nav ul.menu > li:nth-child(1) > ul {right:540px;} .main-nav ul.menu > li:nth-child(2) > ul {right:420px;} } @media all and (min-width:1300px) { .main-nav ul.menu > li:nth-child(1) > ul {right:555px;} .main-nav ul.menu > li:nth-child(2) > ul {right:430px;} } .main-nav ul.menu > li > ul:before {content:""; position:absolute; top:0; right:10px; bottom:10px; left:10px; border:1px solid #cccccc; opacity:0.6;} .main-nav ul.menu > li:hover > ul {opacity:1; z-index:10; visibility:visible;} .main-nav ul.menu > li > ul:hover {opacity:1; z-index:10; visibility:visible;} .main-nav ul.menu li ul li {display:block; position:relative; text-align:left;} .main-nav ul.menu li ul li.nav-col-1 {display:inline-block; width:30%; margin:0 5% 0 0;} .main-nav ul.menu li ul li.nav-col-2 {display:inline-block; width:30%; margin:0 5% 0 0;} .main-nav ul.menu li ul li.nav-col-3 {display:inline-block; width:30%; margin:0 0 0 0;} .main-nav ul.menu li ul li.nav-col-full {display:inline-block; width:95%; margin:0 2.5% 0 2.5%;} .main-nav ul.menu li ul li.nav-col-two-thirds {display:inline-block; width:61.5%; margin:0 2.5% 0 2.5%;} .main-nav ul.menu li ul li.nav-col-one-thirds {display:inline-block; width:28.5%; margin:0 2.5% 0 2.5%;} .main-nav ul.menu li ul li.nav-col-one-thirds-skip-one {display:inline-block; width:28.5%; margin:0 2.5% 0 35.5%;} .main-nav ul.menu li ul li.nav-col-one-thirds-centered {display:inline-block; width:28.5%; margin:0 35.75% 0 35.75%;} .main-nav ul.menu li ul li.nav-col-one-thirds-right {display:inline-block; width:28.5%; margin:0 2.5% 0 69%;} .main-nav ul.menu li ul li.nav-col-one-quarter {display:inline-block; width:20%; margin:0 2.5% 0 2.5%;} .main-nav ul.menu li ul li.nav-col-one-quarter:nth-of-type(3) li a {line-height:22px;} .main-nav ul.menu li ul li.nav-col-one-half {display:inline-block; width:45%; margin:0 2.5% 0 2.5%;} .main-nav ul.menu li ul li a {font-size:16px; line-height:23px; font-weight:400; color:#616060; display:inline-block; text-align:left; height:auto; padding:0; margin-bottom:8px; position:relative; font-family: 'Muli', sans-serif;} .main-nav ul.menu li ul li a:hover {color:#f26b21;} .main-nav ul.menu li ul li a:before {content:""; position:absolute; bottom:-1px; left:0; width:0%; height:1px; background:#f26b21;} .main-nav ul.menu li ul li a:hover:before {width:100%;} .main-nav ul.menu li ul li ul {display:block; position:relative; top:0; padding:0; margin:0;} .main-nav ul.menu li.nav-col-head {padding:20px 0 0 0 !important;} .main-nav ul.menu li.nav-col-head > a {font-size:18px !important; line-height:24px !important; color:#981f62; font-weight:600; border-bottom:1px solid #e5e5e5; margin-bottom:15px !important; display:block !important;} .main-nav ul.menu li.nav-col-head > a:hover {color:#f26b21 !important;} .main-nav ul.menu li ul li.current-menu-item:before {content:""; position:absolute; top:3px; left:-14px; width:0; height:0; border-left:7px solid #00b7c6; border-top:8px solid transparent; border-bottom:8px solid transparent;} .main-nav ul.menu li ul li.nav-col-head.current-menu-item:before {top:24px;} .main-nav ul.menu li ul li.current-menu-item > a {font-weight:600; color:#00b7c6;} #hamburger {color:#ffffff; position:fixed; top:10px; right:10px; height:70px; width:70px; margin:0; padding:0; font-size:35px; background:#00657f; text-align:center; border:2px solid #ffffff; z-index:100000; cursor:pointer; -moz-box-shadow:0 2px 14px 0 rgba(20,20,30,0.05), 0 -10px 120px 10px rgba(20,20,30,0.1); -webkit-box-shadow:0 2px 14px 0 rgba(20,20,30,0.05), 0 -10px 120px 10px rgba(20,20,30,0.1); box-shadow:0 2px 14px 0 rgba(20,20,30,0.05), 0 -10px 120px 10px rgba(20,20,30,0.1);} .ham-line-1, .ham-line-2, .ham-line-3 {border-radius:3px; height:5px; z-index:3;} .ham-line-1 {background:#ffffff; position:absolute; top:22px; right:20px; left:20px;} .ham-line-2 {background:#ffffff; position:absolute; top:33px; right:20px; left:20px;} .ham-line-3 {background:#ffffff; position:absolute; top:44px; right:20px; left:20px;} #hamburger:hover {z-index:100002;} #hamburger:hover .ham-line-1 {background:#f26b21; position:absolute; top:25px; right:36px; left:13px; -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg);} #hamburger:hover .ham-line-2 {background:#f26b21; position:absolute; top:33px; right:26px; left:14px;} #hamburger:hover .ham-line-3 {background:#f26b21; position:absolute; top:41px; right:36px; left:13px; -o-transform: rotate(45deg); -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);} .hamburger-anim-1 {position:absolute; top:2px; right:2px; bottom:2px; left:100%; z-index:2; background:#00657f;} #hamburger:hover .hamburger-anim-1 {left:80%;} .hamburger-anim-2 {position:absolute; top:0; right:0; bottom:0; left:100%; z-index:1; background:#fff;} #hamburger:hover .hamburger-anim-2 {left:0;} .side-nav {position:fixed; top:0; right:0; bottom:0; z-index:99999; width:0; max-width:96%; min-height:100%; background:#ffffff; font-size:0; overflow-x:hidden; overflow-y:auto;} .side-nav .menu-mainnav-container {width:340px; max-width:90%; margin:0 auto;} .sidenav-active {-moz-box-shadow:0 0 300px rgba(0,0,0,0.7); -webkit-box-shadow:0 0 300px rgba(0,0,0,0.7); box-shadow:0 0 300px rgba(0,0,0,0.7);} .side-nav br {display:none;} .side-nav .topspacer {padding:25px 0; text-align:left; width:335px; margin:0 auto;} .side-nav .topspacer.stick {position:fixed; top:0;} @media all and (min-width:400px){ .side-nav .topspacer {width:400px;} } .side-nav a {display:inline-block; font-size:16px; font-weight:700; line-height:22px; color:#00657f; padding:14px 5px;} .side-nav a:hover {color:#f26b21;} .side-nav ul {list-style-type:none; text-align:left; margin:12px 0 0 0; padding:0;} .side-nav ul li {display:block; position:relative; border-top:1px solid rgba(0,0,0,0.2); padding:0 0 0 0; text-align:left;} .side-nav ul li a {font-size:18px; font-weight:600; line-height:22px; width:330px; max-width:100%; margin:0 -30px; padding:18px 35px;} .side-nav ul li.current-menu-ancestor:before, .side-nav div > ul > li.current-menu-item:before { content:""; position:absolute; top:0; left:-18px; width:4px; height:100%; background:#00b7c6; border-radius:3px;} .notactive:before {content:"+"; float:right; font-weight:bold; color:#00b7c6; border:1px solid #00b7c6; width:14px; height:14px; text-align:center; font-size:21px; vertical-align:middle; padding:2px; line-height:11px; border-radius:14px; margin:2px 0 0 0; background:#fff;} .isactive:before {content:"\2013"; float:right; font-weight:bold; color:#fff; border:1px solid #00b7c6; width:14px; height:14px; text-align:center; font-size:21px; vertical-align:middle; padding:2px; line-height:11px; border-radius:14px; margin:2px 0 0 0; background:#00b7c6;} .side-nav ul li ul {display:none; margin:0; padding:0 0 20px 0;} .side-nav ul li ul li {border-top:none;} .side-nav ul li ul li.nav-col-head {margin-top:20px;} .side-nav ul li ul li.nav-col-head:first-of-type {margin-top:0px;} .side-nav ul li ul li.nav-col-head > a {color:#981f62; font-weight:600; font-size:17px;} .side-nav ul li ul li.nav-col-head > a:hover {color:#f26b21;} .side-nav ul li ul li a {color:#616060; font-weight:400; font-size:16px; line-height:19px; padding:8px 35px;} .side-nav ul li ul li.current-menu-item > a {font-weight:700; color:#00b7c6;} .side-nav ul li ul li.current-menu-item:before {content:""; position:absolute; top:0; left:-18px; width:0; height:0; border-left:12px solid #00b7c6; border-top:16px solid transparent; border-bottom:16px solid transparent;} .side-nav ul li ul li ul {display:block; padding:0;} .side-nav .side-search {clear:both;} .side-nav .side-search-link {color:#00b8c7;} .side-nav .side-search-link:hover {color:#f26b21;} .side-nav .searchform {font-size:0; text-align:center; padding:20px 0 20px 0;} .side-nav input[type="text"] {display:inline-block; width:240px; padding:0 0 0 10px; vertical-align:middle; color:#616060; font-size:16px; margin:0 0 0 0; border-top-left-radius:20px; border-bottom-left-radius:20px; border:1px solid #00b7c6; border-right:none; background:#ffffff;} .side-nav input[type="submit"] {display:inline-block; width:68px; vertical-align:middle; margin:0 0 0 0; font-size:16px; font-weight:400; background:#00b7c6; border:none; padding:9px 0; border-top-left-radius:0; border-bottom-left-radius:0; border-top-right-radius:20px; border-bottom-right-radius:20px; border:1px solid #00b7c6; border-left:none;} .side-nav input[type="submit"]:hover {color:#fff; background:#f26b21; border-color:#f26b21;} a.sn-top-links {display:inline-block; width:65px; height:65px; font-size:26px; text-align:center; color:#00b7c6; padding:0px; margin:14px 0px 2px 22px;} a.sn-top-links:hover {color:#f26b21;} a.sn-top-links .sn-hover-text {position:absolute; top:0; left:0; right:0; width:400px; max-width:100%; height:30px; overflow:hidden; opacity:0; visibility:hidden; z-index:1; color:#00657f; font-weight:600; font-size:15px; line-height:34px; text-transform:uppercase;} a.sn-top-links:hover .sn-hover-text {opacity:1; visibility:visible; z-index:2;} a.sn-top-links .sn-hover-line {position:absolute; top:32px; left:400px; background:#00b7c6; height:1px; width:400px; max-width:100%;} a.sn-top-links:hover .sn-hover-line {left:0;} a.sn-top-links img {width:100%; height:auto;} a.sn-top-links .cyan-image {display:block;} a.sn-top-links .orange-image {display:none;} a.sn-top-links:hover .cyan-image {display:none;} a.sn-top-links:hover .orange-image {display:block;} a.sn-top-links svg {stroke:#00b7c6; stroke-width:1px;} a.sn-top-links:hover svg {stroke:#f26b21; stroke-width:2px;} @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE10+ CSS */ a.sn-top-links svg {stroke-width:10px;} a.sn-top-links:hover svg {stroke-width:12px;} } @supports (-ms-accelerator:true) { /* Edge 12+ CSS */ a.sn-top-links svg {stroke-width:10px;} a.sn-top-links:hover svg {stroke-width:12px;} } @supports (-ms-ime-align:auto) { /* Edge 16+ CSS */ a.sn-top-links svg {stroke-width:10px;} a.sn-top-links:hover svg {stroke-width:12px;} } .test-drive-login{display:none !important;} @media all and (min-width:900px) {.test-drive-login{display:inline-block !important;}} .nav-overlay {opacity:0; position:absolute; top:0; right:0; bottom:0; left:0; width:1px; z-index:99998; background:#a6aab3; background:rgba(83,85,89,0.5); cursor:pointer; -o-transition: opacity 0.4s ease-in-out; -moz-transition: opacity 0.4s ease-in-out; -webkit-transition: opacity 0.4s ease-in-out; transition: opacity 0.4s ease-in-out;} .overlay-close {position:fixed; top:10px; right:-70px; width:70px; height:70px; cursor:pointer; opacity:0; z-index:100000;} .overlay-close .overlay-line-1 {border-radius:3px; height:5px; background:#f26b21; position:absolute; top:32px; right:13px; left:13px; -o-transform: rotate(45deg); -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .overlay-close .overlay-line-2 {border-radius:3px; height:5px; background:#f26b21; position:absolute; top:33px; right:32px; left:32px;} .overlay-close .overlay-line-3 {border-radius:3px; height:5px; background:#f26b21; position:absolute; top:32px; right:13px; left:13px; -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg);} .overlay-close:hover .overlay-line-1 {background:#f26b21; top:25px; right:13px; left:36px;} .overlay-close:hover .overlay-line-2 {background:#f26b21; top:33px; right:14px; left:26px;} .overlay-close:hover .overlay-line-3 {background:#f26b21; top:41px; right:13px; left:36px;} a.up-arrow {position:fixed; right:15px; bottom:15px; z-index:99997; width:45px; height:40px; padding:5px 0 0 0; color:#ffffff; text-align:center; font-size:25px; background:#006680; border-radius:50%; border:2px solid #ffffff; display:none; -moz-box-shadow:2px 12px 30px rgba(0,56,70,0.3); -webkit-box-shadow:2px 12px 30px rgba(0,56,70,0.3); box-shadow:2px 12px 30px rgba(0,56,70,0.3);} a.up-arrow:hover {color:#006680; background:#ffffff; border:2px solid #006680;} @media all and (max-width:400px) {} @media all and (max-width:599px) {} @media all and (min-width:600px) { a.sn-top-links {margin:14px 14px 2px 14px;} .side-nav .topspacer {text-align:center;} .overlay-close .overlay-line-1 {background:#fff;} .overlay-close .overlay-line-2 {background:#fff;} .overlay-close .overlay-line-3 {background:#fff;} .overlay-close:hover .overlay-line-1 {background:#fff;} .overlay-close:hover .overlay-line-2 {background:#fff;} .overlay-close:hover .overlay-line-3 {background:#fff;} } @media all and (min-width:900px) {} @media all and (min-width:1000px) and (min-height:600px) { .main-nav ul.menu {display:inline-block;} .main-nav-left {display:block;} .mobile-logo{display:none;} #hamburger{border:none; position:absolute; top:0; right:0;}} @media all and (min-width:1200px) {} @media all and (min-width:1500px) {} @media all and (min-width:1800px) {} /*-------------- Home ---------------------------------------------------------------*/ .hero-image {position:relative; z-index:2; width:100%; height:650px; text-align:center; margin:0px auto 0 auto; background:#fff; -moz-box-shadow:0 5px 200px rgba(0,0,0,0.25); -webkit-box-shadow:0 5px 200px rgba(0,0,0,0.25); box-shadow:0 5px 200px rgba(0,0,0,0.25);} .hero-white-line {position:absolute; z-index:4; bottom:21px; left:0; width:100%; height:2px; background:#ffffff; opacity:0.35;} .hero-blue-line {position:absolute; z-index:3; bottom:0; left:0; width:100%; height:10px; background: #00a1b5; background: -o-linear-gradient(top, #00a1b5 0%, #00d2e5 75%); background: -ms-linear-gradient(top, #00a1b5 0%, #00d2e5 75%); background: -moz-linear-gradient(top, #00a1b5 0%, #00d2e5 75%); background: -webkit-gradient(top, #00a1b5 0%, #00d2e5 75%); background: -webkit-linear-gradient(top, #00a1b5 0%, #00d2e5 75%); background: linear-gradient(to bottom, #00a1b5 0%, #00d2e5 75%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00a1b5', endColorstr='#00d2e5',GradientType=0 );} .hero-purple-bar {position:absolute; top:19%; left:0; width:100%; height:100px; z-index:4; background: #981f62; background: -o-linear-gradient(top, #801a50 0%, #991f60 100%); background: -ms-linear-gradient(top, #801a50 0%, #991f60 100%); background: -moz-linear-gradient(top, #801a50 0%, #991f60 100%); background: -webkit-linear-gradient(top, #801a50 0%, #991f60 100%); background: -webkit-gradient(top, #801a50 0%, #991f60 100%); background: linear-gradient(to bottom, #801a50 0%, #991f60 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#801a50', endColorstr='#991f60', GradientType=0 ); -moz-box-shadow:0 30px 60px rgba(0,31,38,0.25); -webkit-box-shadow:0 30px 60px rgba(0,31,38,0.25); box-shadow:0 30px 60px rgba(0,31,38,0.25);} .hero-arrow {display:none; position:absolute; z-index:5; bottom:-30px; left:50%; width:106px; height:53px; margin:0 0 0 -53px;} .hero-image .banner-text {position:relative; top:0; text-align:center; z-index:5; width:88%; height:450px; margin:0; padding:140px 6% 20px 6%;} .hero-image .banner-text h1 {text-align:center; font-size:0; line-height:1px; padding:0; font-family: 'Montserrat', sans-serif; text-shadow:0 1px 5px rgba(0,0,0,0.1);} .hero-image .banner-text h1 .line1 {font-size:30px; font-weight:700; line-height:30px; color:#ffffff; font-family: 'Montserrat', sans-serif;} .hero-image .banner-text h1 .line2 {font-size:40px; font-weight:300; line-height:40px; color:#ffffff; font-family: 'Montserrat', sans-serif;} .sub-headline {max-width:450px; position:relative; margin:85px auto 50px auto; padding:4px 0 5px 0;} .sub-headline-line {display:none; position:absolute; top:0; left:0; width:4px; height:100%; background:#00657f; border-radius:2px;} .hero-image .banner-text h2 {text-align:center; font-size:0; line-height:1px; font-weight:400; padding:0; text-shadow:0 1px 3px rgba(255,255,255,0.4);} .hero-image .banner-text h2 .line3 {font-size:20px; font-weight:400; line-height:30px; color:#616060;} .hero-image .banner-text h2 .line4 {font-size:20px; font-weight:700; line-height:30px; color:#006680;} .line4-breaker {display:none;} .hero-mobile-overlay {position:absolute; top:0; right:0; bottom:0; left:0; background:#fff; background:rgba(255,255,255,0.8); z-index:2;} .hero-image .inner {position:absolute; top:0px; right:0; bottom:0; left:-580px; z-index:1; overflow:hidden; height:auto; margin:0 auto; background:url("/wp-content/uploads/2019/10/infutor-home-hero-v3.jpg"); background-size:auto 690px; background-repeat:no-repeat !important;} .hero-link-1 {display:none; background:#00b7c6; height:40px; line-height:42px; padding:10px 26px 10px 26px; font-size:24px; font-weight:400; color:#ffffff; border-radius:32px; position:relative; font-family: 'Montserrat', sans-serif; border:2px solid #fff; -moz-box-shadow:0 10px 25px rgba(0,0,0,0.3); -webkit-box-shadow:0 10px 25px rgba(0,0,0,0.3); box-shadow:0 10px 25px rgba(0,0,0,0.3); } .hero-link-1:visited {color:#ffffff;} .hero-link-1:hover {z-index:5; background:#fff; color:#00b7c6;} .hero-link-2 {display:inline-block; background:#00b7c6; width:60px; height:60px; line-height:20px; padding:0px; margin:0 0 0 5px; font-size:20px; position:relative; font-weight:400; color:#ffffff; border-radius:32px; white-space:nowrap; border:2px solid #fff; -moz-box-shadow:0 10px 25px rgba(0,0,0,0.3); -webkit-box-shadow:0 10px 25px rgba(0,0,0,0.3); box-shadow:0 10px 25px rgba(0,0,0,0.3);} .hero-link-2:hover {z-index:5; background:#ffffff;} .hero-link-2 .img-container {width:100%; height:100%; margin:0; display:inline-block; border-radius:25px;} .hero-link-2 .img-container img {width:100%; height:auto;} .hero-link-2 .white-image {display:block;} .hero-link-2 .orange-image {display:none;} .hero-link-2:hover .white-image {display:none;} .hero-link-2:hover .orange-image {display:block;} .hero-link-2 span {font-size:17px; position:absolute; top:-45%; left:50%; margin:0 0 0 -45px; width:82px; padding:4px; text-align:center; color:#00657f; font-weight:600; opacity:0; text-shadow: 0 1px 10px rgba(255,255,255,0.9);} .hero-link-2:hover span {top:-56%; opacity:1;} .hero-link-2:before, .hero-link-1:before {content:""; position:absolute; top:0; right:0; bottom:0; left:0; border:2px solid transparent; border-radius:40px;} .hero-link-2:hover:before, .hero-link-1:hover:before {top:-8px; right:-8px; bottom:-8px; left:-8px; border:2px solid #f26b21;} .hero-after {position:relative; z-index:1; width:100%; height:316px; text-align:center; margin:0 auto -316px auto; background:url('/wp-content/uploads/2019/12/home_hero_below_v9.jpg'); background-position:top center; background-size: auto 316px; background-repeat: no-repeat;} .hero-link-mobile {display:inline-block;} @media all and (min-width:400px) { .hero-image .banner-text h1 .line2 {font-size:45px; line-height:45px;} .hero-purple-bar {height:105px;} } @media all and (min-width:600px) { .hero-image .banner-text h1 {text-align:left;} .hero-image .banner-text h1 .line1 {font-size:32px; line-height:32px;} .hero-image .banner-text h1 .line2 {font-size:50px; line-height:50px;} .hero-image .banner-text h2 {text-align:left;} .hero-image .banner-text {position:relative; top:160px; text-align:left; z-index:5; width:90%; max-width:1400px; margin:0 auto; padding:0; background:none;} .sub-headline {padding:4px 0 5px 28px; margin:70px 0 60px 5px;} .sub-headline-line {display:block;} .hero-link-1 {display:inline-block;} .hero-image .inner {left:-260px;} .hero-purple-bar {top:21.8%; height:112px; width:440px;} } @media all and (min-width:700px) { .sub-headline {max-width:60%; margin:60px 0 50px 5px;} .hero-image .banner-text h2 .line3 {font-size:22px; line-height:31px;} .hero-image .banner-text h2 .line4 {font-size:22px; line-height:31px;} .hero-mobile-overlay {background:rgba(255,255,255,0.6);} } @media all and (min-width:800px) { .sub-headline {margin:65px 0 40px 5px; padding:4px 0 5px 26px;} .hero-image .banner-text h1 .line1 {font-size:34px; line-height:34px;} .hero-image .banner-text h1 .line2 {font-size:60px; line-height:54px;} .hero-purple-bar {height:122px; width:520px;} .hero-link-mobile {display:none;} } @media all and (min-width:900px) { .hero-image {height:700px; max-height:95vh; min-height:630px;} .hero-image .banner-text {top:24%;} .hero-image .banner-text h1 .line1 {font-size:35px; line-height:35px;} .hero-image .banner-text h1 .line2 {font-size:65px; line-height:60px;} .hero-image .banner-text h2 .line3 {font-size:24px; line-height:33px;} .hero-image .banner-text h2 .line4 {font-size:24px; line-height:33px;} .hero-purple-bar {top:20.5%; height:140px; width:580px;} } @media all and (min-width:1000px) { .hero-mobile-overlay {display:none;} .hero-image .banner-text h1 .line1 {font-size:35px; line-height:35px;} .hero-image .banner-text h1 .line2 {font-size:65px; line-height:60px;} .hero-purple-bar {height:140px; width:580px;} .hero-image .inner {left:-180px;} } @media all and (min-width:1100px) { .hero-image .banner-text h1 .line1 {font-size:35px; line-height:40px;} .hero-image .banner-text h1 .line2 {font-size:80px; line-height:60px;} .sub-headline {max-width:600px;} .line4-breaker {display:inline;} .hero-purple-bar {height:150px; width:690px;} } @media all and (min-width:1200px) { .hero-image .banner-text h1 .line1 {font-size:45px; line-height:50px;} .hero-image .banner-text h1 .line2 {font-size:90px; line-height:70px;} .hero-image .banner-text h2 .line3 {font-size:24px; line-height:33px;} .hero-image .banner-text h2 .line4 {font-size:24px; line-height:33px;} .hero-purple-bar {height:170px; width:770px;} .hero-image .inner {left:-80px;} } @media all and (min-width:1400px) { .hero-image .inner {left:0px;} } @media all and (min-width:1500px) { .hero-purple-bar {width:51%;} } @media all and (min-width:2000px) { .hero-image .inner {background-size:100% auto !important;} } @media all and (min-width:2500px) { .hero-image .inner {background-size:2500px auto !important;} } .top-headline {position:relative; z-index:2; width:88%; padding:0 6% 50px 6%; margin:100px auto 0 auto;} .top-headline h2 {text-align:center; padding:15px 0;} .top-headline h2.line1, .top-headline h2.line1 a {font-size:28px; line-height:36px; font-weight:600; color:#981f62; font-family: 'Montserrat', sans-serif;} .top-headline h2.line2 {font-size:18px; line-height:24px; font-weight:400; color:#6d6f73; padding:5px 0 0 0; max-width:850px; margin:0 auto; font-style:italic; font-family: 'Muli', sans-serif;} .text-rotate-container {padding:0 0 0 0; text-align:center; display:block; min-height:75px; margin:0 0 -10px 0;} @media all and (min-width:500px) {.text-rotate-container {border-bottom:3px solid #f26b21; padding:0 0 15px 0; display:inline-block; min-height:0px; margin:0 0 -17px 0;}} .text-rotate-container:hover {border-bottom:3px solid #00b7c6;} .top-headline h2 .text-rotate {font-weight:700; color:#f26b21;} #text-rotate {position:relative; top:0; display:initial; height:1em;} @media all and (min-width:500px) {#text-rotate {white-space:nowrap;}} #text-rotate a {color:#f26b21;} #text-rotate:hover a {color:#00b7c6;} @media all and (max-width:599px) { .top-headline { padding:0px 6% 0 6%; }} @media all and (min-width:600px) { .top-headline h2.line1, .top-headline h2.line1 a {font-size:32px; line-height:41px;} .top-headline h2.line2 {font-size:18px; line-height:24px;} } @media all and (min-width:900px) { .top-headline h2.line1, .top-headline h2.line1 a {font-size:34px; line-height:43px;} .top-headline h2.line2 {font-size:19px; line-height:25px;} } @media all and (min-width:1200px) { .top-headline h2.line1, .top-headline h2.line1 a {font-size:36px; line-height:46px;} .top-headline h2.line2 {font-size:20px; line-height:26px;} } @media all and (min-width:1280px) {.top-headline .breaker {display:none;}} @media all and (max-width:900px) {.top-headline h2 .line2 .linebreak {display:none;}} .featured-services {width:100%; font-size:0; position:relative; text-align:center;} .featured-services .container {width:96%; max-width:1500px; height:auto; padding:60px 0; margin:0 auto;} .featured-services .all-services {width:88%; margin:25px auto; padding:0; background:#ffffff; background:rgba(255,255,255,0.6); display:block; font-size:16px; color:#616060; position:relative; text-align:center; min-height:280px; -moz-box-shadow:0 20px 90px rgba(0,50,62,0.15); -webkit-box-shadow:0 20px 90px rgba(0,50,62,0.15); box-shadow:0 20px 90px rgba(0,31,38,0.15);} .featured-dots {position:absolute; top:-50px; left:50%; width:2000px; height:auto; z-index:-100; opacity:0.7; -o-transform: translateX(-50%); -ms-transform: translateX(-50%); -moz-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%);} .featured-services .all-services .service-container {padding:0 0 40px 0;} .featured-services .service1 .service-container {border-top:5px solid #00a2b8;} .featured-services .service2 .service-container {border-top:5px solid #981f62;} .featured-services .service3 .service-container {border-top:5px solid #f26b21;} .featured-services .service4 .service-container {border-top:5px solid #00657f;} .featured-services .service5 .service-container {border-top:5px solid #c92027;} .featured-services .service6 .service-container {border-top:5px solid #88888c;} .featured-services .all-services .service-image {display:none; text-align:center; width:90%; max-width:220px; margin:20px auto 0 auto;} .featured-services .all-services .service-image img {display:block; width:100%; height:auto;} .featured-services .all-services h3 {width:88%; margin:0; padding:25px 6% 15px 6%; text-transform:uppercase; text-align:left; max-width:300px;} .featured-services .service1 h3 {color:#00a2b8;} .featured-services .service2 h3 {color:#981f62;} .featured-services .service3 h3 {color:#f26b21;} .featured-services .service4 h3 {color:#00657f;} .featured-services .service5 h3 {color:#c92027;} .featured-services .service6 h3 {color:#88888c;} .featured-services .all-services p {width:88%; margin:0 auto; padding:10px 0 10px 0; color:#616060; text-align:left; line-height:1.5em;} .featured-services .learnmore {display:inline-block; padding:8px 18px; border-radius:20px; color:#4d4d4d; font-size:14px; line-height:14px; font-weight:600; font-family: 'Montserrat', sans-serif; font-style:normal; position:absolute; left:6%; bottom:20px;} .featured-services .service1 .learnmore {color:#00a2b8; border:1px solid #00a2b8;} .featured-services .service1 .learnmore:hover {color:#ffffff; background:#00b7c6;} .featured-services .service2 .learnmore {color:#981f62; border:1px solid #981f62;} .featured-services .service2 .learnmore:hover {color:#ffffff; background:#981f62;} .featured-services .service3 .learnmore {color:#f26b21; border:1px solid #f26b21;} .featured-services .service3 .learnmore:hover {color:#ffffff; background:#f26b21;} .featured-services .service4 .learnmore {color:#00657f; border:1px solid #00657f;} .featured-services .service4 .learnmore:hover {color:#ffffff; background:#00657f;} .featured-services .service5 .learnmore {color:#c92027; border:1px solid #c92027;} .featured-services .service5 .learnmore:hover {color:#ffffff; background:#c92027;} .featured-services .service6 .learnmore {color:#88888c; border:1px solid #88888c;} .featured-services .service6 .learnmore:hover {color:#ffffff; background:#88888c;} @media all and (max-width:599px) { .featured-services .learnmore {} } @media all and (min-width:600px) { .featured-services .all-services {display:inline-block; width:380px; margin:25px 2%;} } @media all and (min-width:1100px) { .featured-services .all-services {width:29%; min-height:340px;} } .bottom-headline {width:88%; overflow:hidden; padding:20px 0 100px 0; margin:0 auto;} .bottom-headline h3 {max-width:1100px; padding:15px 0; margin:0 auto; text-align:center;} .bottom-headline h3.line1 {font-size:28px; line-height:36px; font-weight:600; color:#981f62; font-family: 'Montserrat', sans-serif;} .bottom-headline h3.line1 a {font-family: 'Montserrat', sans-serif;} .bottom-headline h3.line2 {font-size:18px; line-height:24px; font-weight:400; color:#6d6f73; padding:5px 0 0 0; max-width:980px; margin:0 auto; font-style:italic; font-family: 'Muli', sans-serif;} .bottom-headline .callout-container {padding:0 0 15px 0;} .bottom-headline .callout-container:hover {} .bottom-headline .callout {font-weight:700; color:#f26b21; white-space:nowrap;} .bottom-headline .callout:hover {color:#00b7c6;} @media all and (max-width:599px) { .bottom-headline {padding:0px 0 60px 0;} } @media all and (min-width:500px) { .bottom-headline .callout-container {border-bottom:3px solid #f26b21;} .bottom-headline .callout-container:hover {border-bottom:3px solid #00b7c6;} } @media all and (min-width:600px) { .bottom-headline h3.line1 {font-size:32px; line-height:41px;} .bottom-headline h3.line2 {font-size:18px; line-height:24px;} } @media all and (min-width:900px) { .bottom-headline h3.line1 {font-size:34px; line-height:43px;} .bottom-headline h3.line2 {font-size:19px; line-height:25px;} } @media all and (min-width:1200px) { .bottom-headline h3.line1 {font-size:36px; line-height:46px;} .bottom-headline h3.line2 {font-size:20px; line-height:26px;} } @media all and (min-width:1400px) { .bottom-headline {padding:60px 0 100px 0;} } .vid-section {width:100%; text-align:center; font-size:0; margin:40px auto 0 auto; position:relative;} .vid-section-container {position:relative; width:650px; max-width:80%; margin:0 auto 50px auto; padding:0 0 40% 0;} @media all and (min-width:900px) { .vid-section-container {margin:0 auto 0 auto; padding:0 0 50% 0} } .vid-section-inner {position:absolute; top:0; left:0; padding-top:56.25%; width:100%; height:0; overflow:hidden; margin:-25px auto; z-index:5; -moz-box-shadow:4px 17px 55px rgba(0,0,0,0.2); -webkit-box-shadow:4px 17px 55px rgba(0,0,0,0.2); box-shadow:4px 17px 55px rgba(0,0,0,0.2);} .vid-section-inner iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;} .vid-section-inside {position:absolute; top:0; left:0; margin:0; width:100%; z-index:5; -moz-box-shadow:4px 17px 55px rgba(0,0,0,0.2); -webkit-box-shadow:4px 17px 55px rgba(0,0,0,0.2); box-shadow:4px 17px 55px rgba(0,0,0,0.2);} .vid-section-crowd-left {position:absolute; top:50px; right:65%; width:840px; max-width:100%;} .vid-section-crowd-right {position:absolute; top:50px; left:65%; width:840px; max-width:100%;} .vid-section-crowd-left img, .vid-section-crowd-right img {width:100%; height:auto;} @media all and (min-width:800px) { .vid-section {margin:40px auto 90px auto; min-height:300px;} .vid-section-container {padding:0; height:280px;} } .stats-section {width:88%; max-width:1450px; padding:40px 6% 0 6%; margin:0 auto 0 auto; position:relative; z-index:60; min-height:300px;} .stats-section .maintext {width:96%; padding:60px 0 20px 0; float:none; margin:0 auto;} .stats-section .maintext h2 {font-size:28px; line-height:36px; font-weight:600; color:#981f62; font-family: 'Montserrat', sans-serif; padding:15px 0;} .stats-section .maintext h2 .callout-container {padding: 0 0 15px 0;} @media all and (min-width:500px) {.stats-section .maintext h2 .callout-container {border-bottom: 3px solid #f26b21;}} .stats-section .maintext h2 .callout-container:hover {border-bottom: 3px solid #00b7c6;} .stats-section .maintext h2 .callout {font-weight:700; color:#f26b21; font-family: 'Montserrat', sans-serif; } .stats-section .maintext h2 .callout:hover {color:#00b7c6;} @media all and (min-width:600px) { .stats-section .maintext h2 {font-size:32px; line-height:41px;} } @media all and (min-width:900px) { .stats-section .maintext h2 {font-size:34px; line-height:43px;} } @media all and (min-width:1200px) { .stats-section .maintext h2 {font-size:36px; line-height:46px;} } .stats-section .circles {position:relative; float:none; width:82%; margin:0 0 0 15%; padding:0;} .stats-section .circlebox {clear:both; min-height:154px; margin:40px 0;} .stats-section .circlebox p {padding:40px 0 0 0; font-size:18px;} .stats-section .circlebox .emphasis1 {font-weight:700; color:#00a2b8;} .stats-section .circlebox .emphasis2 {font-weight:700; color:#981f62;} .stats-section .circlebox .emphasis3 {font-weight:700; color:#f26b21;} .stats-section .statcircles {width:150px; height:112px; border-radius:50%; text-align:center; float:left; font-family: 'Montserrat', sans-serif; font-size:60px; color:#c92027; font-weight:600; padding:38px 0 0 0; background:#ffffff; -moz-box-shadow:10px 30px 70px rgba(0,31,38,0.1); -webkit-box-shadow:10px 30px 70px rgba(0,31,38,0.1); box-shadow:10px 30px 70px rgba(0,31,38,0.1);} .stats-section .circle1 {margin:0 50px 0 -78px; color:#00a2b8; border:2px solid #00a2b8;} .stats-section .circle2 {margin:0 50px 0 -78px; color:#981f62; border:2px solid #981f62;} .stats-section .circle3 {margin:0 50px 0 -78px; color:#f26b21; border:2px solid #f26b21;} #upcircle1, #upcircle2, #upcircle3 {font-family: 'Montserrat', sans-serif;} .circle-separator-1 {display:none; position:absolute; top:194px; left:0; width:2px; height:40px; background: #00b7c6; background: -o-linear-gradient(top, #00b7c6 0%, #981f62 100%); background: -ms-linear-gradient(top, #00b7c6 0%, #981f62 100%); background: -moz-linear-gradient(top, #00b7c6 0%, #981f62 100%); background: -webkit-gradient(top, #00b7c6 0%, #981f62 100%); background: -webkit-linear-gradient(top, #00b7c6 0%, #981f62 100%); background: linear-gradient(to bottom, #00b7c6 0%, #981f62 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7c6', endColorstr='#981f62', GradientType=0 );} .circle-separator-2 {display:none; position:absolute; top:388px; left:0; width:2px; height:40px; background:#00b8c7; background: -o-linear-gradient(top, #981f62 0%, #f26b21 100%); background: -ms-linear-gradient(top, #981f62 0%, #f26b21 100%); background: -moz-linear-gradient(top, #981f62 0%, #f26b21 100%); background: -webkit-gradient(top, #981f62 0%, #f26b21 100%); background: -webkit-linear-gradient(top, #981f62 0%, #f26b21 100%); background: linear-gradient(to bottom, #981f62 0%, #f26b21 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#981f62', endColorstr='#f26b21', GradientType=0 );} @media all and (max-width:599px) { .stats-section {padding:0 3% 0 3%;} .stats-section .maintext {padding:40px 0 20px 0;} } @media all and (min-width:1100px) { .stats-section {padding:80px 3% 0 3%;} .stats-section .maintext {width:42%; padding:40px 0 0 0; float:left;} .stats-section .circles {float:right; width:40%; max-width:500px; padding:0;} .circle-separator-1, .circle-separator-2 {display:block;} } @media all and (max-width:700px) { .stats-section .circlebox p {max-width:400px; text-align:center; margin:0 auto;} .stats-section .circles {width:96%; border-left:none; margin:0 auto;} .stats-section .statcircles {float:none; margin:60px auto 0 auto;} .stats-section .circlebox p {padding:30px 0 0 0;} } .call-to-action {min-height:1110px; position:relative; margin:0 0 0 0; padding:0 0 0 0; background:url("/wp-content/uploads/2019/09/home-lower-image.jpg"); background-size:250% auto; background-position:center bottom; background-repeat:no-repeat;} @media all and (min-width:800px) { .call-to-action {background-size:2000px auto;} } .call-to-action .spacer-fix {width:100%; height:60px;} .call-to-action .top-section {width:100%; position:relative; margin:-20px 0 0 0;} .call-to-action .top-section .container {width:72%; max-width:1450px; margin:0 auto; padding:20px 0;} .call-to-action .top-section h3 {color:#f26b21; position:relative; padding:12px 0 0 0; z-index:52;} .call-to-action .top-section p {max-width:100%; line-height:1.5em; font-weight:400; color:#ffffff; text-align:left; position:relative; z-index:52;} .call-to-action .top-section a {color:#f26b21; border-bottom:1px solid #f26b21;} .call-to-action .top-section a:hover {color:#00b7c6; border-bottom:1px solid #00b7c6;} .call-to-action .top-section .purple-bar {position:absolute; top:0; left:8%; width:84%; height:100%; z-index:51; background: #981f62; background: -o-linear-gradient(top, #801a50 0%, #991f60 100%); background: -ms-linear-gradient(top, #801a50 0%, #991f60 100%); background: -moz-linear-gradient(top, #801a50 0%, #991f60 100%); background: -webkit-linear-gradient(top, #801a50 0%, #991f60 100%); background: -webkit-gradient(top, #801a50 0%, #991f60 100%); background: linear-gradient(to bottom, #801a50 0%, #991f60 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#801a50', endColorstr='#991f60', GradientType=0 ); -moz-box-shadow:0 30px 60px rgba(0,31,38,0.25); -webkit-box-shadow:0 30px 60px rgba(0,31,38,0.25); box-shadow:0 30px 60px rgba(0,31,38,0.25);} .call-to-action .top-section .client-logos {display:none; position:absolute; top:0; right:0; width:100%; height:100%; overflow:hidden;} .call-to-action .top-section .client-logo-container {width:3000px; font-size:0; height:auto; padding:0; position:absolute; top:50%; right:0; left:0; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%);} .call-to-action .top-section .client-logo-container a {border:none; display:inline-block; vertical-align:middle; margin:0;} .call-to-action .top-section .client-logo-container img {width:1500px; height:auto; display:inline-block; vertical-align:middle;} .first { -webkit-animation: bannermove 60s linear infinite; -moz-animation: bannermove 60s linear infinite; -ms-animation: bannermove 60s linear infinite; -o-animation: bannermove 60s linear infinite; animation: bannermove 60s linear infinite; } @keyframes "bannermove" {0% {margin-left: 0;} 100% {margin-left: -1500px;}} @-moz-keyframes bannermove {0% {margin-left: 0;} 100% {margin-left: -1500px;}} @-webkit-keyframes "bannermove" {0% {margin-left: 0;} 100% {margin-left: -1500px;}} @-o-keyframes "bannermove" {0% {margin-left: 0;} 100% {margin-left: -1500px;}} .call-to-action .bottom-section {width:100%; position:relative; margin:60px 0 0 0; text-align:center;} .call-to-action .bottom-section .container {width:90%; max-width:1450px; margin:0 auto; padding:30px 0 10px 0;} .call-to-action .bottom-section h3 {font-weight:700; color:#54565a; display:block; text-align:center; padding:0px 4%; margin:0 auto 0 auto; text-transform:uppercase; position:relative; z-index:55;} .call-to-action .bottom-section h3.line1 {font-size:31px; line-height:34px; font-weight:300; color:#ffffff;} .call-to-action .bottom-section h3.line2 {font-size:36px; line-height:36px; font-weight:700; color:#00b7c6;} .call-to-action .bottom-section .main-button {font-size:20px; line-height:20px; font-weight:bold; color:#ffffff; padding:14px 20px; border-radius:40px; position:relative; z-index:54; display:inline-block; border:2px solid #00b7c6; margin:15px auto 15px auto;} .call-to-action .bottom-section .main-button:visited {color:#ffffff;} .call-to-action .bottom-section .main-button:hover {background:#00b7c6; text-decoration:none !important;} .call-to-action .bottom-section .blue-bar {position:absolute; top:0; right:8%; width:84%; height:100%; z-index:53; background: #00657f; background: -o-linear-gradient(top, #005266 0%, #007a99 100%); background: -ms-linear-gradient(top, #005266 0%, #007a99 100%); background: -moz-linear-gradient(top, #005266 0%, #007a99 100%); background: -webkit-linear-gradient(top, #005266 0%, #007a99 100%); background: -webkit-gradient(top, #005266 0%, #007a99 100%); background: linear-gradient(to bottom, #005266 0%, #007a99 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#005266', endColorstr='#007a99', GradientType=0 ); -moz-box-shadow:0 30px 60px rgba(0,31,38,0.25); -webkit-box-shadow:0 30px 60px rgba(0,31,38,0.25); box-shadow:0 30px 60px rgba(0,31,38,0.25);} @media all and (min-width:600px) { .call-to-action {margin:-80px 0 0 0;} .call-to-action .spacer-fix {height:160px;} } @media all and (min-width:800px) { .call-to-action {margin:-50px 0 0 0;} .call-to-action .spacer-fix {height:120px;} .call-to-action .bottom-section {text-align:left;} .call-to-action .bottom-section .main-button {margin:10px 0 20px 10%;} .call-to-action .bottom-section .blue-bar {right:0; width:90%;} .call-to-action .bottom-section h3 {text-align:left; margin:0 0 0 10%; padding:0; width:700px;} .call-to-action .top-section .container {width:88%;} .call-to-action .top-section p {max-width:68%;} .call-to-action .top-section .purple-bar { left:0; width:70%;} .call-to-action .top-section .client-logos {display:block; width:48%;} } @media all and (min-width:1000px) { .call-to-action .bottom-section .main-button {margin:-62px 0 0 14%;} .call-to-action .bottom-section .blue-bar {width:85%;} .call-to-action .bottom-section h3 {margin:0 0 0 40%;} } @media all and (min-width:1200px) { .call-to-action .bottom-section .main-button {margin:-62px 0 0 20%;} .call-to-action .bottom-section .blue-bar {width:80%;} .call-to-action .bottom-section h3 {margin:0 0 0 42%;} .call-to-action .bottom-section h3.line1 {font-size:34px; line-height:34px;} .call-to-action .bottom-section h3.line2 {font-size:39px; line-height:39px;} .call-to-action .top-section .purple-bar {width:60%;} .call-to-action .top-section p {max-width:58%;} } @media all and (min-width:1400px) { .call-to-action {margin:-100px 0 0 0;} .call-to-action .spacer-fix {height:180px;} .call-to-action .bottom-section .main-button {margin:-62px 0 0 33%;} .call-to-action .bottom-section .blue-bar {width:68%;} .call-to-action .bottom-section h3 {margin:0 0 0 52%;} } @media all and (min-width:1600px) { .call-to-action .bottom-section .main-button {margin:-62px 0 0 40%;} .call-to-action .bottom-section .blue-bar {width:61%;} .call-to-action .bottom-section h3 {margin:0 0 0 57%;} } /*-------------- Pages --------------------------------------------------------------*/ .page-header {position:relative; text-align:center; padding:0; -moz-box-shadow:0 5px 200px rgba(0,0,0,0.25); -webkit-box-shadow:0 5px 200px rgba(0,0,0,0.25); box-shadow:0 5px 200px rgba(0,0,0,0.25);} .page-header-inner {position:absolute; top:0; right:0; left:0; bottom:0; min-height:300px; padding:0; z-index:2; opacity:0.3; -o-background-size:auto 100% !important; -moz-background-size:auto 100% !important; -webkit-background-size:auto 100% !important; background-size:auto 100% !important;} .page-header-container {padding:250px 0 0 0; width:88%; max-width:1300px; margin:0 auto 0 auto; text-align:left;} .page-header h1 {width:100%; min-height:110px; margin:0 auto; padding:0 0 50px 0; color:#00657f; font-weight:400; display:inline-block; text-align:center; position:relative; z-index:65; text-shadow:1px 2px 5px rgba(255,255,255,0.5);} .page-header-short {min-height:100px; position:relative; text-align:center; padding:0;} .page-header-short-container {padding:150px 0 0 0; width:88%; max-width:1300px; margin:0 auto 0 auto; text-align:left;} .page-header-short h1 {width:100%; margin:0 auto; padding:0; color:#00657f; font-weight:400; display:inline-block; text-align:center; position:relative; z-index:65; text-shadow:0 1px 4px rgba(255,255,255,0.2);} @media all and (max-width:599px) { .page-header-container {padding:170px 0 0 0;} .page-header h1, .page-header-short h1 {font-size:42px; line-height:48px;} } @media all and (min-width:600px) { .page-header-container {padding:180px 0 0 0;} .page-header h1, .page-header-short h1 {font-size:46px; line-height:54px;} } @media all and (min-width:900px) { .page-header {min-height:460px;} .page-header-container {padding:0; display:table; height:460px;} .page-header h1 {font-size:48px; line-height:58px; text-align:left; display:table-cell; vertical-align:middle; padding:120px 45% 40px 0;} .page-header-short h1 {font-size:48px; line-height:58px;} .page-header-inner{opacity:1; -o-background-size: cover !important; -moz-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important;} } @media all and (min-width:1000px) {} @media all and (min-width:1200px) { .page-header h1 {font-size:58px; line-height:62px;} .page-header-short h1 {font-size:58px; line-height:62px;} } @media all and (min-width:2500px) { .page-header-inner{-o-background-size:2500px auto !important; -moz-background-size:2500px auto !important; -webkit-background-size:2500px auto !important; background-size:2500px auto !important;} } .header-accent {position:relative; top:30px; width:88%; max-width:1300px; margin:-70px auto 15px auto; padding:10px 0; z-index:70; background:#ffffff; background:rgba(255,255,255,1); border-left:5px solid #f26b21;} .header-accent h3 {margin:0 auto; padding:12px 4%; color:#a6216a; font-weight:600; text-align:center; display:inline-block; vertical-align:baseline; font-family: 'Montserrat', sans-serif;} .header-accent h3 a {white-space:nowrap; display:inline-block; vertical-align:baseline; padding:2px 12px; border-radius:30px; font-family: 'Montserrat', sans-serif;} .header-accent h3 a:hover {color:#fff; background:#00b7c6; text-decoration:none; border:none;} .content-area {min-height:200px; position:relative; overflow:hidden; padding:60px 0 80px 0;} .page-wrap {width:88%; max-width:1300px; margin:0 auto; padding:0 6%; font-size:0;} @media all and (min-width:600px) {.content-area {padding:80px 0 100px 0;}} .page-wrap a {position:relative; color:#00a2b8; padding:0 1px 2px 1px; border-bottom:1px solid #e0e0e0; font-family: 'Muli', sans-serif; font-weight:600;} .page-wrap a:visited {color:#00a2b8;} .page-wrap a:hover {color:#f26b21;} .page-wrap a:before {content:""; position:absolute; bottom:-1px; left:50%; width:0; height:1px; background:#981f62;} .page-wrap a:hover:before {left:0; width:100%;} .page-wrap a:active {color:#981f62;} @media all and (min-width:600px) { .page-wrap a {white-space:nowrap;} } .premise-icon-right {width:100%; max-width:150px; text-align:center; margin:0 auto; border:2px solid #00b7c6; border-radius:50%;} .premise-icon-left {width:100%; max-width:150px; text-align:center; margin:0 auto; border:2px solid #00b7c6; border-radius:50%;} @media all and (min-width:900px) { .premise-icon-right {float:right; width:100%; max-width:200px;} .premise-icon-left {float:left; width:100%; max-width:200px;} } .five-circles {width:16%; max-width:120px; display:inline-block; margin:18px 2%;} .five-circles img {width:85%; min-width:75px; height:auto; border-radius:50%; border:2px solid #00b7c6;} .data-headers {border-bottom:2px solid #00b7c6; font-weight:700; color:#00657f; padding:0; margin:0 0 15px 0; text-transform:uppercase;} .challenge-solution-headers {border-bottom:2px solid #00b7c6; line-height:1.1em; font-weight:400; color:#981f62; padding:0 0 8px 0; margin:0 0 10px 0; font-family: 'Montserrat', sans-serif;} @media all and (min-width:900px) { .challenge-solution-headers {min-height:56px;} } @media all and (max-width:900px) { .challenge-solution-headers br {display:none;} } .solutions-third-container {} .solution-box-third-spacer1 {float:none; display:block; width:4%; height:60px;} .solution-box-third-spacer2 {float:none; display:block; width:4%; height:60px;} .solution-box-third {float:none; display:inline-block; position:relative; width:90%; height:100%; padding:30px 5% 60px 5%; box-shadow:0 20px 90px rgba(0,31,38,0.15); border-top:5px solid #00b7c6;} .solution-box-third-empty {display:inline-block; position:relative; width:90%; height:100%; padding:0 5% 0 5%;} .solutions-quarter-container {} .solution-box-quarter-spacer1 {display:inline-block; width:3%; height:60px;} .solution-box-quarter-spacer2 {display:inline-block; width:3%; height:60px;} .solution-box-quarter {display:inline-block; position:relative; width:90%; height:100%; padding:30px 5% 60px 5%; box-shadow:0 20px 90px rgba(0,31,38,0.15); border-top:5px solid #00b7c6;} .solution-box-quarter-empty {display:inline-block; position:relative; width:22%; height:100%; padding:0 5% 0 5%;} .challenge-solution-headers {line-height:1.1em; font-weight:400; color:#981f62; padding:0 0 10px 0; margin:0; font-family: 'Montserrat', sans-serif;} .challenge-solution-headers br {display:none;} @media all and (min-width:800px) { .solution-box-third-spacer1 {float:left; display:inline-block;} .solution-box-third-spacer2 {display:block; clear:left;} .solution-box-third {float:left; width:42%; padding:30px 3% 60px 3%;} .solution-box-third-empty {width:42%;} .solution-box-quarter-spacer1 {} .solution-box-quarter-spacer2 {display:block;} .solution-box-quarter {width:42.5%; padding:30px 3% 60px 3%;} .solution-box-quarter-empty {width:42.5%; padding:0 3% 0 3%;} } @media all and (min-width:900px) { .challenge-solution-headers {min-height:56px;} .challenge-solution-headers br {display:inline-block;} } @media all and (min-width:1000px) {.solution-box-third-empty {padding:30px 3% 60px 3%;}} @media all and (min-width:1400px) { .solutions-third-container {display:table;} .solution-box-third-spacer1 {float:none; display:table-cell;} .solution-box-third-spacer2 {float:none; display:table-cell;} .solution-box-third {float:none; display:table-cell; width:30.666%; padding:30px 2% 60px 2%;} .solution-box-third-empty {float:none; display:table-cell; width:30.666%; padding:0 2% 0 2%;} .solutions-quarter-container {display:table;} .solution-box-quarter-spacer1 {display:table-cell;} .solution-box-quarter-spacer2 {display:table-cell;} .solution-box-quarter {display:table-cell; width:22.75%; padding:30px 2% 60px 2%;} .solution-box-quarter-empty {display:table-cell; width:22.75%; padding:0 2% 0 2%;} } a.solution-button {position:absolute; left:6%; bottom:20px; padding:8px 18px; border-radius:20px; font-size:14px; line-height:14px; font-weight:600; font-family:'Montserrat', sans-serif; text-transform:uppercase; color:#099cb3; border:1px solid #099cb3;} a.solution-button:before {content:none;} a.solution-button:visited {color:#099cb3;} a.solution-button:hover {color:#ffffff; background:#00b7c6; border:1px solid #00b7c6;} .hidden1400{display:none;} @media all and (min-width:1400px) {.hidden1400{display:block;}} .full-width {width:100%; margin:30px 0 30px 0; text-align:center;} .full-width-cyan {width:100%; background:#00b7c6; margin:60px 0 60px 0; text-align:center;} .full-width-cyan-fade {width:100%; margin:60px 0 60px 0; text-align:center; background: #006680; background: -o-linear-gradient(left, #006680 0%, #00b8c7 100%); background: -ms-linear-gradient(left, #006680 0%, #00b8c7 100%); background: -moz-linear-gradient(left, #006680 0%, #00b8c7 100%); background: -webkit-gradient(left, #006680 0%, #00b8c7 100%); background: -webkit-linear-gradient(left, #006680 0%, #00b8c7 100%); background: linear-gradient(to right, #006680 0%, #00b8c7 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006680', endColorstr='#00b8c7', GradientType=1 );} .full-width-cyan-gradient {background: #006680; background: -o-linear-gradient(left, #006680 0%, #00b8c7 100%); background: -ms-linear-gradient(left, #006680 0%, #00b8c7 100%); background: -moz-linear-gradient(left, #006680 0%, #00b8c7 100%); background: -webkit-gradient(left, #006680 0%, #00b8c7 100%); background: -webkit-linear-gradient(left, #006680 0%, #00b8c7 100%); background: linear-gradient(to right, #006680 0%, #00b8c7 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006680', endColorstr='#00b8c7', GradientType=1 );} .full-width-inner {width:100vw; margin:0 auto; padding:60px 0; position:relative; z-index:2;} .full-width-inner .row {width:88%; max-width:1300px;} @media all and (min-width:900px) {.full-width-inner{width:100vw;}} .full-width-inner p, .full-width-inner li {color:#ffffff;} .full-width-inner h2, .full-width-inner h3, .full-width-inner h4 {color:#ffffff; font-style:italic; padding:0; font-weight:300;} .row {width:100%; margin:0 auto 0 auto; text-align:center; font-size:0;} a.big-button {display:block; width:100%; max-width:500px; height:auto; font-size:30px; line-height:36px; text-align:center; font-weight:bold; background:#f26b21; border:2px solid #f26b21 !important; border-radius:100px; color:#ffffff; white-space:normal; padding:15px 0; margin:0 auto;} a.big-button:visited {color:#ffffff;} a.big-button:hover {color:#f26b21; background:#ffffff;} a.big-button:before {content:none;} .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {position:relative;} .col-12{display:inline-block; width:100%; padding:0;} .col-8 {display:inline-block; width:100%; padding:0;} .col-7 {display:inline-block; width:100%; padding:0;} .col-6 {display:inline-block; width:100%; padding:0;} .col-5 {display:inline-block; width:100%; padding:0;} .col-4 {display:inline-block; width:100%; padding:0;} .col-3 {display:inline-block; width:100%; padding:0;} .col-2 {display:inline-block; width:100%; padding:0;} .col-third {display:inline-block; width:100%; padding:0;} @media all and (min-width:1000px) { .col-12{width:100%; padding:0;} .col-8 {width:60.666%; padding:0 0 0 6%;} .col-8:first-child {padding:0 6% 0 0;} .col-7 {width:52%; padding:0 0 0 6%;} .col-7:first-child {padding:0 6% 0 0;} .col-6 {width:44%; padding:0 0 0 6%;} .col-6:first-child {padding:0 6% 0 0;} .col-5 {width:36%; padding:0 0 0 6%;} .col-5:first-child {padding:0 6% 0 0;} .col-4 {width:27.333%; padding:0 0 0 6%;} .col-4:first-child {padding:0 6% 0 0;} .col-3 {width:44%; padding:0 3%;} .col-3:nth-of-type(1) {padding:0 6% 0 0;} .col-3:nth-of-type(2) {padding:0 0 0 6%;} .col-3:nth-of-type(3) {padding:0 6% 0 0;} .col-3:nth-of-type(4) {padding:0 0 0 6%;} .col-2 {width:27.333%; padding:0 3%;} .col-third:nth-of-type(1) {width:27.333%; padding:0 6% 0 0;} .col-third:nth-of-type(2) {width:27.333%; padding:0 3% 0 3%;} .col-third:nth-of-type(3) {width:27.333%; padding:0 0 0 6%;} .full-width-cyan {margin:100px 0 100px 0;} .full-width-cyan-fade {margin:100px 0 100px 0;} } @media all and (min-width:1200px) { .col-12{width:100%; padding:0;} .col-8 {width:60.666%; padding:0 0 0 6%;} .col-8:first-child {padding:0 6% 0 0;} .col-7 {width:52%; padding:0 0 0 6%;} .col-7:first-child {padding:0 6% 0 0;} .col-6 {width:44%; padding:0 0 0 6%;} .col-6:first-child {padding:0 6% 0 0;} .col-5 {width:36%; padding:0 0 0 6%;} .col-5:first-child {padding:0 6% 0 0;} .col-4 {width:27.333%; padding:0 0 0 6%;} .col-4:first-child {padding:0 6% 0 0;} .col-3 {width:19%; padding:0 3%;} .col-3:nth-of-type(1) {padding:0 4% 0 0;} .col-3:nth-of-type(2) {padding:0 4% 0 4%;} .col-3:nth-of-type(3) {padding:0 4% 0 4%;} .col-3:nth-of-type(4) {padding:0 0 0 4%;} .col-2 {width:14%; padding:0 3%;} } /*-------------- Call To Actions ----------------------------------------------------*/ .page-cta {width:100%; text-align:center; margin:0; padding:50px 0; position:relative; overflow:hidden; background: #006680; background: -o-linear-gradient(left, #006680 0%, #00b8c7 100%); background: -ms-linear-gradient(left, #006680 0%, #00b8c7 100%); background: -moz-linear-gradient(left, #006680 0%, #00b8c7 100%); background: -webkit-gradient(left, #006680 0%, #00b8c7 100%); background: -webkit-linear-gradient(left, #006680 0%, #00b8c7 100%); background: linear-gradient(to right, #006680 0%, #00b8c7 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006680', endColorstr='#00b8c7', GradientType=1 ); } .bottom-cta {width:80%; max-width:1300px; margin:0 auto; padding:30px 5%; border:1px solid rgba(255,255,255,0.4); text-align:center; font-size:0; position:relative; z-index:10;} .bottom-cta h4 {color:#ffffff; text-align:center; font-weight:300;} @media all and (max-width:599px) {.bottom-cta h4 {font-size:30px; line-height:33px;}} @media all and (min-width:600px) {.bottom-cta h4 {font-size:35px; line-height:41px;}} @media all and (min-width:900px) {.bottom-cta h4 {font-size:40px; line-height:46px;}} @media all and (min-width:1200px) {.bottom-cta h4 {font-size:44px; line-height:50px;}} .bottom-cta input[type="text"], .bottom-cta input[type="email"], .bottom-cta input[type="tel"], .bottom-cta textarea {width:99%; height:40px !important; line-height:40px !important; margin:30px 0 0 0; padding:0 0 0 1%; border-bottom:1px solid #ffffff !important; border-top:none !important; border-right:none !important; border-left:none !important; display:inline-block !important; color:#ffffff !important; font-size:20px !important; overflow:hidden !important;} @media all and (min-width:900px) {.bottom-cta input[type="text"], .bottom-cta input[type="email"], .bottom-cta input[type="tel"], .bottom-cta textarea {margin:55px 0 0 0}} .bottom-cta input[type="submit"], .bottom-cta button[type="submit"] {background:none; border:2px solid #ffffff; margin:40px auto 0 auto; padding:7px 20px 8px 20px; display:inline-block;} .bottom-cta input[type="submit"]:hover, .bottom-cta button[type="submit"]:hover {background:#ffffff; color:#00b7c6;} .bottom-cta .ajax-loader {position:absolute; top:5px; left:50%; margin:0 0 0 -8px;} .bottom-cta ::-webkit-input-placeholder {opacity:0.8 !important; font-weight:400 !important; color:#ffffff !important;} .bottom-cta :-moz-placeholder {opacity:0.8 !important; font-weight:400 !important; color:#ffffff !important;} .bottom-cta ::-moz-placeholder {opacity:0.8 !important; font-weight:400 !important; color:#ffffff !important;} .bottom-cta :-ms-input-placeholder {opacity:0.8 !important; font-weight:400 !important; color:#ffffff !important;} .bottom-cta .wpcf7-not-valid-tip {color:#ffffff; display:inline-block; background:#981f62 !important;} .cta-button, .careers-button {font-size:20px; font-weight:bold; color:#ffffff; padding:5px 20px; border-radius:40px; display:inline-block; vertical-align:middle; border:2px solid #ffffff; margin:10px auto 0 auto;} .cta-button:visited, .careers-button:visited {color:#ffffff;} .cta-button:hover, .careers-button:hover {background:#ffffff; color:#00b7c6;} .bottom-cta .wpcf7-response-output {color:#ffffff; font-size:20px; margin:20px 0 0 0 !important;} .bottom-cta div.wpcf7-mail-sent-ok {font-size:30px !important; background:#00657f; border:2px solid #ffffff !important;} .bottom-cta .mktoForm select.mktoField {height:50px !important; border:1px solid #fff; border-radius:25px; font-size:18px; background:#00b7c6; color:#fff; padding:2px 10px; margin:-9px auto 0px auto;} @media all and (max-width:500px) {.bottom-cta .mktoForm select.mktoField {margin:10px auto 0px auto;}} .bottom-cta .mktoFormCol {width:50% !important;} @media all and (max-width:500px) { .bottom-cta .mktoFormCol {width:100% !important;} } .bottom-cta-graphic {background:none; background-size:2000px auto; background-position:center top; background-repeat:no-repeat; position:absolute; top:0; right:0; left:0; bottom:0; z-index:9; opacity:0.6;} @media all and (min-width:600px) {.bottom-cta-graphic {background:url('/wp-content/uploads/2018/05/white-graph-image.png');}} @media all and (min-width:2000px) {.bottom-cta-graphic {background-size:100% auto;}} .download-cta {text-align:center; font-size:0; color:#ffffff; font-weight:300;} @media all and (max-width:599px) {.download-cta h4 {font-size:35px; line-height:41px;}} @media all and (min-width:600px) {.download-cta h4 {font-size:38px; line-height:44px;}} @media all and (max-width:900px) {.download-cta {padding-bottom:30px;}} @media all and (min-width:900px) {.download-cta h4 {font-size:41px; line-height:47px;}} @media all and (min-width:1200px) {.download-cta h4 {font-size:44px; line-height:50px;}} .download-cta input[type="text"], .download-cta input[type="email"], .download-cta input[type="tel"] {width:99%; height:40px; line-height:40px; margin:30px 0 0 0; border-bottom:1px solid #00657f; border-top:none; border-right:none; border-left:none; padding:0 0 0 1%; display:inline-block; color:#00657f; font-size:20px;} @media all and (min-width:900px) {.download-cta input[type="text"], .download-cta input[type="email"], .download-cta input[type="tel"] {margin:55px 0 0 0;}} .download-cta input[type="submit"] {background:none; border:2px solid #00b7c6; margin:40px auto 0 auto; padding:7px 20px 8px 20px; display:inline-block; color:#00b7c6;} .download-cta input[type="submit"]:hover {background:#00b7c6; color:#ffffff;} .download-cta .ajax-loader {position:absolute; top:5px; left:50%; margin:0 0 0 -8px;} .download-cta ::-webkit-input-placeholder {opacity:0.8 !important; font-weight:400 !important; color:#00657f !important;} .download-cta :-moz-placeholder {opacity:0.8 !important; font-weight:400 !important; color:#00657f !important;} .download-cta ::-moz-placeholder {opacity:0.8 !important; font-weight:400 !important; color:#00657f !important;} .download-cta :-ms-input-placeholder {opacity:0.8 !important; font-weight:400 !important; color:#00657f !important;} .download-cta .wpcf7-not-valid-tip {color:#ffffff; display:inline-block; background:#981f62 !important;} .cta-download-button {font-size:20px; font-weight:bold; color:#ffffff; background:#00b7c6; padding:5px 20px; border-radius:40px; display:inline-block; vertical-align:middle; border:2px solid #ffffff; margin:10px auto 0 auto;} .cta-download-button:visited {color:#ffffff;} .cta-download-button:hover {background:#ffffff; color:#00b7c6; text-decoration:none !important;} .download-cta .wpcf7-response-output {color:#00657f; font-size:20px; margin:20px 0 0 0 !important;} .download-cta div.wpcf7-mail-sent-ok {font-size:30px !important; background:#00657f; border:2px solid #ffffff !important;} /*-------------- Team ---------------------------------------------------------------*/ .team-bio-box {width:96%; max-width:450px; min-height:200px; margin:22px 2%; padding:0; display:inline-block; position:relative; background:#ffffff; overflow:hidden; border-left:4px solid #f26b21; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -o-box-shadow:0 1px 4px rgba(0,0,0,0.3); -moz-box-shadow:0 1px 4px rgba(0,0,0,0.3); -webkit-box-shadow:0 1px 4px rgba(0,0,0,0.3); box-shadow:0 1px 4px rgba(0,0,0,0.3);} .team-bio-box .bio-details {width:100%;} .team-bio-box .bio-details img {float:left; width:156px; max-width:46%; height:auto; clear:left; margin:0 20px 0 0; -webkit-filter:grayscale(100%); filter:grayscale(100%); opacity:0.9;} .team-bio-box:hover .bio-details img {-webkit-filter:grayscale(0%); filter:grayscale(0%); opacity:1;} .team-bio-box .bio-details h2 {padding:20px 20px 5px 20px; text-align:left; font-weight:300; line-height:30px; color:#00657f;} .team-bio-box .bio-details h2 span {font-weight:700; color:#00657f;} .team-bio-box .bio-details .bio-jobtitle {padding:5px 20px 20px 20px; text-align:left; font-style:italic; line-height:22px;} .team-bio-box .bio-details .social-link {height:32px; width:32px; border-radius:18px; line-height:32px; border:none; color:#00b7c6; display:inline-block; text-align:center; margin:0 5px 0 0; font-size:16px; padding:0; position:absolute; bottom:0px; right:75px;} .team-bio-box .bio-details .social-link:hover {color:#fff; background:#00b7c6;} .team-bio-box .bio-details .social-link:before {content:none;} .team-bio-box .bio-details .full-bio-link {height:32px; width:80px; border-radius:18px; line-height:32px; border:none; color:#00b7c6; text-align:center; display:inline-block; font-weight:bold; font-size:16px; padding:0; position:absolute; bottom:0px; right:0px;} .team-bio-box .bio-details .full-bio-link:hover {color:#fff; background:#00b7c6;} .team-bio-box .bio-details .full-bio-link:before {content:none;} .team-bio-box .bio-box-questions {display:none; opacity:0; position:fixed; top:5%; right:5%; bottom:5%; left:5%; max-width:900px; margin:0px auto; padding:40px; background:#fff; z-index:99999; overflow-y:auto; border-left:5px solid #f26b21;} .team-bio-box .bio-box-questions p {margin:0 auto;} .team-bio-box .bio-box-questions p strong {color:#981f62;} .team-bio-box3 {width:96%; max-width:450px; min-height:200px; margin:22px 2%; padding:0; display:inline-block; position:relative; background:#ffffff; overflow:hidden; border-left:4px solid #f26b21; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -o-box-shadow:0 1px 4px rgba(0,0,0,0.3); -moz-box-shadow:0 1px 4px rgba(0,0,0,0.3); -webkit-box-shadow:0 1px 4px rgba(0,0,0,0.3); box-shadow:0 1px 4px rgba(0,0,0,0.3);} .team-bio-box3 .bio-details {width:100%;} .team-bio-box3 .bio-details img {float:left; width:156px; max-width:46%; height:auto; clear:left; margin:0 20px 0 0; -webkit-filter:grayscale(100%); filter:grayscale(100%); opacity:0.9;} .team-bio-box3:hover .bio-details img {-webkit-filter:grayscale(0%); filter:grayscale(0%); opacity:1;} .team-bio-box3 .bio-details h2 {padding:20px 20px 5px 20px; text-align:left; font-weight:300; line-height:30px; color:#00657f;} .team-bio-box3 .bio-details h2 span {font-weight:700; color:#00657f;} .team-bio-box3 .bio-details .bio-jobtitle {padding:5px 20px 20px 20px; text-align:left; font-style:italic; line-height:22px;} .team-bio-box3 .bio-details .social-link {height:32px; width:32px; border-radius:18px; line-height:32px; border:none; color:#00b7c6; display:inline-block; text-align:center; margin:0 5px 0 0; font-size:16px; padding:0; position:absolute; bottom:0px; right:75px;} .team-bio-box3 .bio-details .social-link:hover {color:#fff; background:#00b7c6;} .team-bio-box3 .bio-details .social-link:before {content:none;} .team-bio-box3 .bio-details .full-bio-link {height:32px; width:80px; border-radius:18px; line-height:32px; border:none; color:#00b7c6; text-align:center; display:inline-block; font-weight:bold; font-size:16px; padding:0; position:absolute; bottom:0px; right:0px;} .team-bio-box3 .bio-details .full-bio-link:hover {color:#fff; background:#00b7c6;} .team-bio-box3 .bio-details .full-bio-link:before {content:none;} .team-bio-box3 .bio-box-questions {display:none; opacity:0; position:fixed; top:5%; right:5%; bottom:5%; left:5%; max-width:900px; margin:0px auto; padding:40px; background:#fff; z-index:99999; overflow-y:auto; border-left:5px solid #f26b21;} .team-bio-box3 .bio-box-questions p {margin:0 auto;} .team-bio-box3 .bio-box-questions p strong {color:#981f62;} a.bio-close {position:absolute; top:10px; right:10px; display:block; width:40px; height:40px; font-size:24px; line-height:44px; font-weight:800; border:2px solid #00b7c6;} .team-bio-box2 {width:93%; max-width:200px; margin:35px 3%; padding:0 1% 0 0; display:inline-block; position:relative; text-align:center;} .team-bio-box2 img {margin:5px auto 5px auto;} .team-bio-box2 .bio-box-questions {margin:0 0 0 200px; padding:0 0 0 50px; border-left:2px solid #e5e5e5;} .team-bio-box2 .bio-box-questions p {margin:0 auto;} .team-bio-box2 .bio-box-questions p strong {color:#981f62;} .team-bio-box2 h2 {padding:20px 0 5px 0; text-align:center; font-weight:300; font-size:28px; line-height:28px; color:#00657f;} .team-bio-box2 h2 span {font-weight:700; color:#00657f;} .team-bio-box2 .bio-jobtitle {padding:5px 0 5px 0; text-align:center; font-style:italic; line-height:22px;} @media all and (min-width:500px) { .team-bio-box3{width:46%; margin:22px 2%;} } @media all and (min-width:800px) { .team-bio-box {width:46%; margin:22px 2%;} .team-bio-box3{width:29%; margin:22px 2%;} .team-bio-box2{width:39%; margin:35px 5%;} } @media all and (min-width:1200px) { .team-bio-box {width:30%; margin:22px 1.5%;} .team-bio-box3{width:22%; margin:22px 1.5%;} .team-bio-box2{width:13%; margin:35px 3%;} } .team-bio-box5 {width:96%; max-width:450px; min-height:200px; margin:25px 2%; padding:0; display:inline-block; position:relative;} .team-bio-box5 .bio-details {width:100%;} .team-bio-box5 .bio-details img {width:98%; max-width:280px; height:auto; margin:0 auto;} .team-bio-box5:hover .bio-details img {} .team-bio-box5 .bio-details h2 {padding:25px 0 10px 0; text-align:center; font-weight:400; font-size:22px; line-height:22px; color:#00657f; text-transform:uppercase;} .team-bio-box5 .bio-details h2 span {font-weight:700; font-size:30px; line-height:30px; color:#00657f;} .team-bio-box5 .bio-details .bio-jobtitle {padding:5px 20px 0px 20px; text-align:center; line-height:22px; min-height:45px;} .team-bio-box5 .bio-details hr {width:90%; margin:10px auto 0px auto; background:#ccc;} .team-bio-box5 .bio-details .social-link {height:32px; width:32px; border-radius:18px; line-height:32px; border:none; color:#00b7c6; display:inline-block; text-align:center; margin:0 5px 0 0; font-size:16px; padding:0;} .team-bio-box5 .bio-details .social-link:hover {color:#fff; background:#00b7c6;} .team-bio-box5 .bio-details .social-link:before {content:none;} .team-bio-box5 .bio-details .full-bio-link {height:32px; width:80px; border-radius:18px; line-height:32px; border:none; color:#00b7c6; text-align:center; display:inline-block; font-weight:bold; font-size:16px; padding:0; font-style:normal;} .team-bio-box5 .bio-details .full-bio-link:hover {color:#fff; background:#00b7c6;} .team-bio-box5 .bio-details .full-bio-link:before {content:none;} .team-bio-box5 .bio-box-questions {display:none; opacity:0; position:fixed; top:5%; right:5%; bottom:5%; left:5%; max-width:900px; margin:0px auto; padding:40px; background:#fff; z-index:99999; overflow-y:auto; border-left:5px solid #f26b21;} .team-bio-box5 .bio-box-questions p {margin:0 auto;} .team-bio-box5 .bio-box-questions p strong {color:#981f62;} @media all and (min-width:500px) { .team-bio-box5{width:46%; margin:22px 2%;} } @media all and (min-width:800px) { .team-bio-box5{width:29%; margin:22px 2%;} } @media all and (min-width:1200px) { .team-bio-box5{width:22%; margin:22px 1.5%;} } /*-------------- Cluster Explorer ---------------------------------------------------*/ .connex-nav {width:1016px; text-align:center; margin:0px auto; font-size:0px; border-bottom:3px solid #f26b21;} .connex-nav a {font-size:18px; display:inline-block; width:20%; border-top-right-radius:10px; border-top-left-radius:10px; background:rgba(255,255,255,0.2); padding:8px 0px; text-transform:uppercase; color:#f2f2f2; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out;} .connex-nav a:hover {color:#ffffff; background:rgba(255,255,255,0.5);} .connex-nav .active {background:#f2f2f2; color:#00657f; font-weight:bold;} .connex-set-1, .connex-set-2, .connex-set-3, .connex-set-4, .connex-set-5 { transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; } .connex-description {display:none; background:#ffffff; position:absolute; top:5px; left:5px; right:5px; z-index:15; text-align:center; padding:0px; border:1px solid #f26b21; box-shadow:0px 5px 30px rgba(0,0,0,0.3); -moz-box-shadow:0px 5px 30px rgba(0,0,0,0.3); -webkit-box-shadow:0px 5px 30px rgba(0,0,0,0.3);} .connex-description p {text-align:center; padding:28px 25px 30px 25px;} .connex-description p span {font-weight:bold; color:#00657f; font-size:22px; text-decoration:underline;} /*-------------- Privacy Policy -----------------------------------------------------*/ .priv-policy-main {max-width:860px; margin:0 auto; padding:0 0 0 340px; position:relative;} .sidebar-nav {position:absolute; top:0; left:0; max-width:220px; padding:0 50px 0 0; text-align:left; border-right: 1px solid #cccccc;} .sidebar-nav li::before {content:none;} .page-wrap .sidebar-nav a {white-space:normal; border-bottom:none;} .page-wrap .sidebar-nav a:before {content:none;} @media all and (max-width:1000px) { .priv-policy-main {padding:0 0 0 0;} .sidebar-nav {display:none;} } /*-------------- Blog ---------------------------------------------------------------*/ .post-header {position:relative; text-align:center; padding:0; overflow:hidden; -moz-box-shadow:0 2px 160px rgba(0,0,0,0.25), 0 1px 40px rgba(0,0,0,0.15); -webkit-box-shadow:0 2px 160px rgba(0,0,0,0.25), 0 1px 40px rgba(0,0,0,0.15); box-shadow:0 2px 160px rgba(0,0,0,0.25), 0 1px 40px rgba(0,0,0,0.15);} .post-header-inner {position:absolute; top:0; right:0; left:0; bottom:0; min-height:300px; padding:0; z-index:2; background-size:auto 100% !important; opacity:0.3;} .post-header-container {padding:160px 0 0 0; width:88%; max-width:1300px; margin:0 auto 0 auto; text-align:center; position:relative; z-index:3;} .post-header h1 {width:100%; font-size:36px; line-height:40px; min-height:110px; margin:0 auto; padding:0 0 50px 0; color:#00657f; font-weight:400; display:inline-block; text-align:center; position:relative; z-index:65; text-shadow:0 1px 4px rgba(255,255,255,0.2);} @media all and (min-width:600px) { .post-header-container {padding:200px 3% 10px 3%;} .post-header h1 {font-size:42px; line-height:50px;} } @media all and (min-width:900px) { .post-header {min-height:460px;} .post-header-container {padding:0; display:table; height:460px;} .post-header h1 {font-size:46px; line-height:54px; text-align:left; display:table-cell; vertical-align:middle; min-height:0px; padding: 120px 45% 40px 0;} .post-header-inner{opacity:0.6; background-size:2000px auto !important;} } @media all and (min-width:1200px) { .post-header-container {} .post-header h1 {font-size:50px; line-height:60px;} } @media all and (min-width:2000px) { .post-header-inner{background-size:100% auto !important;} } .blog-page {width:88%; max-width:1700px; padding:0; margin:0 auto; font-size:0; text-align:center;} .blog-post {padding:0 0 20px 0; width:23%; max-width:400px; margin:20px 1% 40px 1%; display:inline-block; background:#ffffff; position:relative; border-top:5px solid #f26b21; overflow:hidden; min-height:455px; -moz-box-shadow:0 0 1px 0 rgba(0,0,0,0.15); -webkit-box-shadow:0 0 1px 0 rgba(0,0,0,0.15); box-shadow:0 0 1px 0 rgba(0,0,0,0.15);} @media all and (min-width:900px) { .blog-post:hover {-o-transform:scale(1.02); -ms-transform:scale(1.02); -moz-transform:scale(1.02); -webkit-transform:scale(1.02); transform:scale(1.02); -moz-box-shadow:0 0 1px 0 rgba(0,0,0,0.15), 0 18px 35px -14px rgba(0,0,0,0.3); -webkit-box-shadow:0 0 1px 0 rgba(0,0,0,0.15), 0 18px 35px -14px rgba(0,0,0,0.3); box-shadow:0 0 1px 0 rgba(0,0,0,0.15), 0 18px 35px -14px rgba(0,0,0,0.3);} } @media all and (max-width:1700px) {.blog-post {width:31%;}} @media all and (max-width:1200px) {.blog-post {width:48%;}} @media all and (max-width:800px) {.blog-post {width:98%; margin:20px auto;}} .blog-post .blog-full-link {position:absolute; top:0; right:0; bottom:0; left:0;} .blog-post .image-container, .blog-post .image-container-vid, .blog-post .image-container-icon, .blog-post .image-container-banner, .blog-post .image-container-lander { width:100%; height:180px; margin:0 0 15px 0; overflow:hidden; position:relative; } .blog-post .image-container .image-overlay, .blog-post .image-container-vid .image-overlay, .blog-post .image-container-icon .image-overlay, .blog-post .image-container-banner .image-overlay, .blog-post .image-container-lander .image-overlay { position:absolute; top:0; right:0; bottom:0; left:0; background:#00657f; background:rgba(0,101,127,0); z-index:5; font-size:24px; font-weight:700; color:#ffffff; line-height:180px; opacity:0; } .blog-post .image-container:hover .image-overlay, .blog-post .image-container-vid:hover .image-overlay, .blog-post .image-container-icon:hover .image-overlay, .blog-post .image-container-banner:hover .image-overlay, .blog-post .image-container-lander:hover .image-overlay { background:#00657f; background:rgba(0,101,127,0.6); opacity:1; } .blog-post .image-container img, .blog-post .image-container-vid img, .blog-post .image-container-icon img, .blog-post .image-container-banner img, .blog-post .image-container-lander img { position:absolute; -o-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); -moz-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%);} .blog-post .image-container img {height:auto; width:200%; top:0; left:0; opacity:0.3;} .blog-post .image-container-vid img {height:auto; width:100%; top:50%; left:50%;} .blog-post .image-container-icon img {height:auto; max-height:80%; width:auto; max-width:75%; top:50%; left:50%;} .blog-post .image-container-banner img {height:100%; max-height:100%; width:auto; top:50%; left:35%;} .blog-post .image-container-lander img {height:100%; max-height:100%; width:auto; top:50%; left:50%;} .blog-post h2 {font-size:19px; line-height:23px; color:#00657f; font-family: 'Muli', sans-serif; text-align:left; width:88%; margin:0 auto; padding:8px 0 18px 0; position:relative; font-weight:600;} .blog-post h2:hover {color:#00b7c6;} .blog-post h2 strong {font-weight:600;} .blog-post h2 br {display:none;} .blog-post h5 {font-size:12px; font-weight:600; line-height:16px; text-transform:uppercase; text-align:right; font-family: 'Montserrat', sans-serif; padding:0; color:#b3b2b1; min-height:16px; position:absolute; bottom:10px; right:6%;} .blog-post h5 a {color:#b3b2b1; font-family: 'Montserrat', sans-serif;} .blog-post h5 a:hover {color:#f26b21;} .blog-post p {font-size:15px; line-height:23px; text-align:left; width:88%; margin:0 auto; padding:0;} .blog-post p.link-more {text-align:center; font-size:14px; font-weight:700; text-transform:uppercase; padding:0 0 0 0; width:90%; margin:0 auto;} .blog-post p.link-more a {position:absolute; bottom:-35px; right:-1px; color:#ffffff; background:#00657f; width:126px; height:30px; line-height:32px; padding:0; border-top-left-radius:18px; border:1px solid #00657f; margin:0;} .blog-post:hover p.link-more a {bottom:-1px;} .blog-post p.link-more a:hover {background:#ffffff; color:#00657f;} .blog-post .external-link {position:absolute; bottom:11px; left:6%; font-size:15px; color:#b3b2b1; text-align:left; line-height:20px;} .blog-post .external-link span {display:inline-block; width:0; overflow:hidden; white-space:nowrap; color:#616060; font-size:14px; line-height:16px; vertical-align:bottom;} .blog-post .external-link:hover span {width:100px;} .blog-social-links {text-align:right; width:90%; margin:0 auto; display:none;} a.blog-share-link {display:inline-block; font-size:22px; color:#ffffff; background:#b2b1b1; width:40px; height:40px; border-radius:50%; text-align:center; padding:0; margin:5px 5px 0 5px; border:none !important; line-height:40px;} a.blog-search-link {display:block; font-size:22px; color:#b2b1b1; background:#ffffff; width:36px; height:36px; border-radius:50%; text-align:center; padding:0; margin:0; border:2px solid #b2b1b1 !important; line-height:36px; float:right;} a.blog-search-link:hover {background:#00657f; color:#ffffff !important; border:2px solid #00657f !important;} a.share-link-fb:hover {background:#3b5998; color:#ffffff !important;} a.share-link-tw:hover {background:#55acee; color:#ffffff !important;} a.share-link-li:hover {background:#007bb5; color:#ffffff !important;} a.share-link-em:hover {background:#00657f; color:#ffffff !important;} a.share-link-go:hover {background:#dd4b39; color:#ffffff !important;} @media all and (max-width:1200px) { .post-bottom-social {display:none;}} .categories-nav {text-align:center; color:#cccccc; margin:-50px 0 30px 0; padding:13px 0; font-size:0;} @media all and (min-width:600px) {.categories-nav{margin:-80px 0 30px 0;}} .categories-nav ul {list-style-type:none; padding:0; margin:0;} .categories-nav ul li {display:inline-block; position:relative; padding:5px 18px 5px 20px; margin:0; font-size:16px; line-height:22px; border-right: 2px solid #cccccc;} .categories-nav ul li:last-of-type {border-right:none;} .categories-nav ul li ul {display:none; position:absolute; top:100%; left:0; padding:10px 2px 15px 0px; background:#ffffff; z-index:15; -moz-box-shadow: 0 25px 50px rgba(0,0,0,0.1); -webkit-box-shadow: 0 25px 50px rgba(0,0,0,0.1); box-shadow: 0 25px 50px rgba(0,0,0,0.1);} .categories-nav ul li:hover ul {display:block;} .categories-nav ul li ul li {border-right:none; line-height:30px;} .categories-nav a {position:relative; color:#00657f; padding:0 1px 2px 1px; border-bottom:1px solid #f2f2f2; white-space:nowrap; font-family: 'Muli', sans-serif; font-weight:400;} .categories-nav a:visited {color:#00657f;} .categories-nav a:hover {color:#f26b21;} .categories-nav a:before {content:""; position:absolute; bottom:-1px; left:50%; width:0; height:1px; background:#981f62;} .categories-nav a:hover:before {left:0; width:100%;} .categories-nav a:active {color:#981f62;} .categories-nav a .fa-chevron-down {font-size:16px; vertical-align:bottom; margin:0 0 1px 0;} .blog-sidebar {text-align:left; margin:50px auto 0 auto; padding:35px 0 0 0; border-top:1px solid #cccccc;} .blog-contact-link {display:block; text-align:center; width:100%; max-width:260px; height:40px; font-size:16px; font-weight:700; line-height:40px; margin:20px auto 0 auto; border:2px solid #00657f; color:#00657f; border-radius:50px;} .blog-contact-link:hover {background:#00657f; color:#ffffff;} .blog-sidebar section {display:block; width:100%; margin:0 auto; padding:0; vertical-align:top;} .blog-sidebar h2 {font-size:24px; line-height:34px; margin:0; padding:40px 0 6px 0; clear:both;} .blog-sidebar ul {list-style-type:none; padding:0 0 10px 2px;} .blog-sidebar ul li {padding:0; font-size:16px; line-height:24px; font-weight:400; color:#b2b1b1; text-align:right; clear:both; display:block;} .blog-sidebar ul li a {font-size:16px; line-height:21px; font-weight:400; color:#00657f; float:left; text-align:left; padding:8px 0 8px 0; margin:0 0 0 0;} .blog-sidebar ul li a:hover {color:#f26b21; border-left:2px solid #00b7c6; padding:8px 0 8px 6px; margin:0 0 0 -8px;} .blog-sidebar #cat {width:100%; height:40px; line-height:25px; border:1px solid #cccccc; font-size:16px; color:#00657f; font-family:'Muli', sans-serif; font-weight:400; padding:6px; cursor:pointer;} @media all and (min-width:450px) { .blog-contact-link {display:inline-block; margin:0 0 0 10px;} .blog-sidebar .widget_recent_entries {float:none;} .blog-sidebar .widget_categories {float:none;} .blog-sidebar .widget_archive {float:none;} } @media all and (min-width:800px) { .blog-sidebar #sidebar {margin:20px auto 0 auto;} .blog-sidebar section {display:inline-block; width:40%; padding:0 2%; vertical-align:top;} .blog-sidebar .widget_recent_entries {float:left;} .blog-sidebar .widget_categories {float:right;} .blog-sidebar .widget_archive {float:right;} } @media all and (min-width:1200px) { .blog-sidebar {width:270px; position:absolute; top:0; right:0; margin:0; border-top:none; padding:0;} .blog-sidebar #sidebar {margin:0 auto 0 auto;} .blog-sidebar section {display:block; width:100%; padding:0;} .blog-contact-link {margin:20px 0 0 0;} a.blog-share-link {margin:0 10px 0 0;} .blog-sidebar .widget_recent_entries {float:none;} .blog-sidebar .widget_categories {float:none;} .blog-sidebar .widget_archive {float:none;} } #archives-dropdown-3 {height:35px; line-height:35px; font-size:15px; color:#00657f; border:1px solid #cccccc; width:100%; background:none; margin:0 -1px 0 -1px; font-weight:400;} #archives-dropdown-3 > option { line-height:50px;} .post-page-wrap {width:88%; max-width:1300px; margin:0 auto; padding:0; font-size:0; position:relative;} .post-page-inner {padding:0;} .post-page-inner p a {position:relative; color:#099cb3; padding:0 1px 2px 1px; border-bottom:1px solid #e0e0e0; font-family: 'Muli', sans-serif; font-weight:700;} .post-page-inner p a:visited {color:#099cb3;} .post-page-inner p a:hover {color:#f26b21;} .post-page-inner p a:before {content:""; position:absolute; bottom:-1px; left:50%; width:0; height:1px; background:#981f62;} .post-page-inner p a:hover:before {left:0; width:100%;} .post-page-inner p a:active {color:#981f62;} .post-page-inner img {max-width:100%; height:auto;} .post-page-inner .top-cats, .post-page-inner .top-cats span {font-size:13px; font-weight:400; line-height:16px; text-transform:uppercase; text-align:left; padding:0 0 0 0; color:#999999;} .post-page-inner .top-cats span {font-weight:600;} .post-page-inner .top-cats a {font-weight:600; border-bottom:none; color:#999999; padding: 0 0 7px 0;} .post-page-inner .top-cats a:hover {color:#00b7c6; font-weight:600; text-decoration:none; border-bottom:2px solid #f26b21;} @media all and (min-width:600px) { .post-page-inner p a {white-space:nowrap;} } @media all and (min-width:1200px) { .post-page-inner {padding:0 380px 0 0;} } .blog-column1 {width:45%; display:inline-block; margin:0px 5% 0px 0px;} .blog-column2 {width:45%; display:inline-block; margin:0px 0px 0px 5%;} .blog-column1 p a, .blog-column2 p a {white-space:normal;} @media all and (max-width:800px) { .blog-column1 {width:100%; display:inline-block; margin:0px 0px 0px 0px;} .blog-column2 {width:100%; display:inline-block; margin:0px 0px 0px 0px;} } #related_posts {width:88%; margin:0 auto 0 auto; padding:30px 6% 50px 6%; text-align:center; background:#f2f2f2; font-size:0px; border-top:1px solid #e5e5e5; clear:both;} #related_posts h3 {text-align:center;} .post-page-icon {width: auto; max-width:90%; height:auto; max-height:300px; margin:-30px auto 20px auto;} @media all and (min-width:900px) { .post-page-icon {max-width:38%; height:auto; max-height:80%; position:absolute; top:50%; right:0; z-index:65; margin:50px 0 0 0; -o-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);} } .post-video-frame {position:relative; margin:10px 0 20px 0; padding-bottom:56.25%; /* 16:9 */ padding-top:25px; height:0;} .post-video-frame iframe {position:absolute; top:0; left:0; width:100%; height:100%;} .pagination {padding:75px 0 20px 0;} .pagination .nav-links .page-numbers {display:inline-block; width:40px; height:40px; line-height:40px; margin:5px; background:#b2b1b1; color:#ffffff; font-size:20px;} .pagination .nav-links .page-numbers:hover {background:#00b7c6;} .pagination .nav-links .page-numbers.prev, .pagination .nav-links .page-numbers.next {width:80px;} .pagination .nav-links .page-numbers.current {background:#00657f;} .progress-bar {position:fixed; top:0; left:0; z-index:100; height:5px; width:10px; background:#f26b21; margin:0 0 0 0;} .blog-resource-cta {border-top:2px solid #00b7c6; border-right:2px solid #00b7c6; border-bottom:2px solid #00b7c6; border-left:8px solid #00b7c6; padding:10px 20px 10px 25px; margin:25px 0 35px 0; text-align:center;} .blog-resource-cta img {float:none; width:220px; height:auto; margin:10px auto 10px auto;} .blog-resource-cta p a {border:2px solid #00b7c6 !important; background:#00b7c6; display:inline-block; padding:2px 15px !important; border-radius:20px; color:#ffffff;} .blog-resource-cta p a:before {content:none !important;} .blog-resource-cta p a:visited {color:#ffffff !important;} .blog-resource-cta a:hover {border:2px solid #00b7c6 !important; background:#ffffff !important; color:#00b7c6 !important;} @media all and (min-width:700px) { .blog-resource-cta img {float:right; width:220px; height:auto; margin:10px 0px 0px 20px;} } /*-------------- Landing Pages ------------------------------------------------------*/ .lp-header {background:#00657f; background:rgba(0,101,127,1); width:100%; height:100%; position:relative;} .lp-header-container {width:88%; max-width:1300px; padding:40px 0 50px 0; margin:90px auto 0 auto; position:relative;} .lp-headlines {position:relative; z-index:50; max-width:1300px; margin:0 0 0 0; padding:0 6% 0 6%;} .lp-headlines h1, .lp-headlines h1 span {font-size:6.5vw; line-height:6.8vw; color:#ffffff; text-align:center;} .lp-headlines h2, .lp-headlines h2 span {font-size:22px; line-height:30px; color:#ffffff; text-align:center; font-weight:400; font-family: 'Muli', sans-serif;} .lp-form {width:100%; max-width:600px; margin:0 auto; text-align:center; font-size:14px;} .lp-form-container {width:100%; padding: 0 0 10px 0;} .lp-form .above-form {display:none; padding:0 0 15px 0;} .lp-form img {width:100%; height:auto; max-width:240px; margin:0 auto;} .lp-form h4 {text-align:center; padding:15px 0 0 0; color:#00b7c6; font-size:24px; line-height:26px;} .lp-form p {padding:0; margin:0; text-align:center; color:#ffffff;} .lp-form hr {margin:15px 10px 15px 10px; background:rgba(255,255,255,0.3);} .lp-form input {width:100% !important; border-top:none; border-right:none; border-left:none; border-bottom:1px solid #ffffff; color:#ffffff !important; font-size:16px !important; font-family: 'Muli', sans-serif; max-width:100% !important;} .lp-form select.mktoField {width:100% !important; height:34px !important; border:1px solid #fff; border-radius:19px; font-size:16px; color:#fff; padding:2px 10px; margin:15px 0 0 0; background:#00657f; font-weight:400; font-family: 'Muli', sans-serif;} .lp-form .mktoForm {width: 100% !important;} .lp-form .mktoForm .mktoLabel {width:100% !important; color:#ffffff !important; font-size:16px !important; font-weight:300 !important; padding:0 !important; font-family: 'Muli', sans-serif; max-width:100% !important; text-align:center !important;} .lp-form .mktoForm input[type="radio"] {display:inline-block !important; float:none !important; width:17px !important; height:17px !important; margin:0 6px 0 8px;} .lp-form .mktoForm .mktoRadioList {text-align:center !important; margin:8px 0 0 0; padding:0 !important; float:left !important;} .lp-form .mktoForm .mktoRadioList label {display:inline-block !important; float:none !important; height:16px !important; line-height:16px !important; color:#ffffff !important; font-size:16px !important; font-weight:300 !important; font-family: 'Muli', sans-serif; margin:0 12px 0 0 !important;} .lp-form .mktoFormRow {width:100% !important; margin:5px auto;} .lp-form .mktoButtonRow {width:100% !important; text-align:center !important;} .lp-form .mktoButtonWrap {margin-left:0 !important;} .lp-form .mktoGutter {display:none !important;} .lp-form .mktoFieldWrap {width:100% !important; padding:0 !important;} .lp-form .mktoAsterix {position:absolute; top:5px; right:0px; color:#f26b21 !important; padding:0 !important;} .lp-form ::-webkit-input-placeholder {opacity:0.8 !important; font-weight:300 !important; color:#ffffff !important;} .lp-form :-moz-placeholder {opacity:0.8 !important; font-weight:300 !important; color:#ffffff !important;} .lp-form ::-moz-placeholder {opacity:0.8 !important; font-weight:300 !important; color:#ffffff !important;} .lp-form :-ms-input-placeholder {opacity:0.8 !important; font-weight:300 !important; color:#ffffff !important;} .lp-form button[type="submit"], .lp-form .resource-link {background:#f26b21 !important; color:#ffffff !important; border:2px solid #fff !important; font-size:20px !important; padding:7px 25px 8px 25px !important; font-family: 'Muli', sans-serif; border-radius:24px; font-weight:400; display:inline-block; margin:35px auto 0 auto;} .lp-form button[type="submit"]:hover, .lp-form .resource-link:hover {background:#ffffff !important; color:#f26b21 !important;} .lp-form .mktoOffset {display:none !important;} .lp-form .mktoFormCol {width:100% !important; margin-bottom:5px !important;} .lp-form .mktoForm button.mktoButton {margin:35px auto 0 auto !important;} .lp-hero-image {display:none;} .lp-hero-image-inner {display:none;} .lp-vid-left h1 {font-size:6.5vw; line-height:6.8vw; color:#ffffff; text-align:center; padding:0 20px 0 20px;} .lp-vid-left h2 {font-size:18px; line-height:28px; color:#ffffff; text-align:center; padding:0 20px 40px 20px; font-weight:300; font-style:italic;} .lp-vid-left a {display:block; height:40px; line-height:40px; font-size:20px; font-weight:700; color:#00b7c6; text-align:center; border:2px solid #00b7c6; border-radius:22px;} .lp-vid-left a:hover {background:#ffffff; color:#00b7c6;} .lp-vid-right {width:90%; max-width:550px; margin:50px auto -70px auto; -moz-box-shadow:0 5px 70px rgba(0,20,26,0.3); -webkit-box-shadow:0 5px 70px rgba(0,20,26,0.3); box-shadow:0 5px 70px rgba(0,20,26,0.3);} .lp-content-area {padding:50px 0 50px 0; min-height:200px; width:88%; max-width:1300px; margin:0 auto; position:relative;} .lp-page-wrap {margin:0 auto; padding:0 0 0 0; font-size:0;} .lp-resource {width:100%; max-width:350px; margin:40px auto 0 auto; text-align:center;} .lp-resource img {max-width:100%;} .lp-resource h2 {text-align:center;} .lp-resource h3 {text-align:center;} .lp-resource h4 {text-align:center;} .lp-resource h5 {text-align:center;} .lp-resource p {text-align:center; line-height:1.2em;} .lp-resource a {color:#00b7c6; font-weight:bold;} .lp-resource a:hover {color:#00657f;} .lp-resource .lp-download-button {display:inline-block; border:1px solid #00b7c6; border-radius:15px; padding:3px 15px; margin:5px auto 0 auto;} .lp-resource .lp-download-button:hover {background:#00b7c6; color:#ffffff;} .lp-dataeval-form .mktoOffset {display:none !important;} .lp-dataeval-form .mktoFormCol {width:100% !important;} .lp-dataeval-form .mktoFieldWrap {margin:0 !important; padding:0 !important;} .lp-dataeval-form input {width:100% !important; max-width:100% !important; color:#00657f !important; font-size:16px !important; font-weight:400 !important; margin:10px auto 0px auto !important; border-top:none; border-right:none; border-left:none; border-bottom:1px solid #00657f;} .lp-dataeval-form button[type="submit"] {background:#ffffff; color:#981f62; border:2px solid #981f62; margin:20px auto 0px auto !important; line-height:30px;} .lp-dataeval-form button[type="submit"]:hover {background:#981f62; color:#ffffff; border:2px solid #981f62;} .lp-cta-button {font-size:20px; font-weight:bold; color:#ffffff; background:none; padding:5px 20px; border-radius:40px; display:inline-block; vertical-align:middle; border:2px solid #ffffff; margin:10px auto 0 auto;} .lp-cta-button:visited {color:#ffffff;} .lp-cta-button:hover {background:#ffffff; color:#00b7c6;} @media only screen and (max-width: 480px) {.mktoForm .mktoOffset {display:block !important;}} @media all and (max-width:615px) {.lp-headlines h1{font-size:40px; line-height:42px;}} @media all and (min-width:1000px) { .lp-header {padding:0 0 0 0; background:none; margin:120px 0 0 0;} .lp-header-container {height:600px; padding:0; margin:0 auto; position:relative;} .lp-header-shorten {height:500px;} .lp-form-container {position:absolute; top:50%; left:0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);} .lp-headlines {position:absolute; top:50%; left:0; z-index:50; background:#ffffff; background:rgba(255,255,255,0.9); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); margin:0 400px 0 0; padding:20px 3% 20px 3%; border-left:5px solid #00b7c6; -moz-box-shadow:4px 15px 70px rgba(0,20,26,0.25); -webkit-box-shadow:4px 15px 70px rgba(0,20,26,0.25); box-shadow:4px 15px 70px rgba(0,20,26,0.25);} .lp-headlines h1, .lp-headlines h1 span {font-size:52px; line-height:58px; color:#981f62; text-align:left;} .lp-headlines h2, .lp-headlines h2 span {font-size:25px; line-height:34px; color:#535559; text-align:left; font-weight:400; font-style:italic;} .lp-form {position:absolute; top:-15px; right:0; bottom:-25px; z-index:70; width:100%; max-width:350px; background:#00657f; background:rgba(0,101,127,0.95); text-align:center; padding:0; border-top: 5px solid #f26b21; -moz-box-shadow:4px 15px 70px rgba(0,20,26,0.25); -webkit-box-shadow:4px 15px 70px rgba(0,20,26,0.25); box-shadow:4px 15px 70px rgba(0,20,26,0.25);} .lp-form .above-form {display:block;} .lp-hero-image {display:block; position:absolute; top:0; right:0; left:0; bottom:0; width:100%; height:100%; overflow:hidden;} .lp-hero-image:before {content:''; position:absolute; top:8px; right:-2px; bottom:8px; left:-2px; border:2px solid rgba(255,255,255,0.5); z-index:1;} .lp-hero-image-inner {display:block; position:absolute; top:0; right:0; left:0; width:100%; height:700px; margin:-50px 0 0 0;} .lp-content-area {padding:80px 0 90px 0; min-height:200px;} .lp-resource {width:100%; max-width:350px; position:absolute; top:90px; right:0; margin:0; text-align:center;} .lp-page-wrap {margin:0 auto; padding:0 450px 0 0; font-size:0;} .lp-resource img {max-width:100%;} .lp-vid-left {position:absolute; top:-20px; left:0; z-index:70; width:100%; max-width:450px; min-height:620px; background:#00657f; background:rgba(0,101,127,0.95); text-align:center; border-top:5px solid #f26b21; padding:0 0 20px 0; -moz-box-shadow:4px 15px 70px rgba(0,20,26,0.25); -webkit-box-shadow:4px 15px 70px rgba(0,20,26,0.25); box-shadow:4px 15px 70px rgba(0,20,26,0.25);} .lp-vid-left h1 {font-size:52px; line-height:56px; text-align:left; padding:0 40px 0 40px;} .lp-vid-left h2 {font-size:20px; line-height:30px; text-align:left; padding:0 40px 40px 40px;} .lp-vid-right {position:absolute; top:50%; right:0; z-index:50; background:#ffffff; background:rgba(255,255,255,0.9); margin:0; padding:0; width:auto; max-width:620px; -o-transform:translatey(-50%); -moz-transform:translatey(-50%); -webkit-transform:translatey(-50%); transform:translatey(-50%); -moz-box-shadow:4px 15px 70px rgba(0,20,26,0.3); -webkit-box-shadow:4px 15px 70px rgba(0,20,26,0.3); box-shadow:4px 15px 70px rgba(0,20,26,0.3);} } @media all and (min-width:1200px) { .lp-headlines {margin:0 500px 0 0;} } .third-box-1, .third-box-2, .third-box-3 {width:96%; max-width:350px; display:block; text-align:center; padding:50px 2% 20px 2%; min-height:445px; position:relative; background:rgba(255,255,255,0.9); -moz-box-shadow:4px 17px 55px rgba(0,0,0,0.2); -webkit-box-shadow:4px 17px 55px rgba(0,0,0,0.2); box-shadow:4px 17px 55px rgba(0,0,0,0.2);} .third-box-1 {margin:20px auto 20px auto;} .third-box-2 {margin:20px auto 20px auto;} .third-box-3 {margin:20px auto 20px auto;} .third-box-1 h3, .third-box-2 h3, .third-box-3 h3 {position:absolute; top:0px; left:0px; height:20px; width:100%; margin:0px; padding:0px; font-size:14px; line-height:20px; color:#fff; text-align:center; font-weight:600; letter-spacing:1px;} .third-box-1 h3 {background:#00b7c6;} .third-box-2 h3 {background:#f26b21;} .third-box-3 h3 {background:#981f62;} .third-box-1 h4 {text-align:center; padding:0px 0px 12px 0px; color:#00b7c6;} .third-box-2 h4 {text-align:center; padding:0px 0px 12px 0px; color:#f26b21;} .third-box-3 h4 {text-align:center; padding:0px 0px 12px 0px; color:#981f62;} .third-box-1 p, .third-box-2 p, .third-box-3 p {text-align:center;} .box-button {display:inline-block; padding:5px 20px 5px 20px; margin:7px auto 0 auto; background:#fff; border-radius:40px; font-size:20px; font-size:20px; font-weight:700; line-height:30px;} .third-box-1 .box-button {color:#00b7c6; border:2px solid #00b7c6;} .third-box-1 .box-button:hover {color:#fff; background:#00b7c6;} .third-box-2 .box-button {color:#f26b21; border:2px solid #f26b21;} .third-box-2 .box-button:hover {color:#fff; background:#f26b21;} .third-box-3 .box-button {color:#981f62; border:2px solid #981f62;} .third-box-3 .box-button:hover {color:#fff; background:#981f62;} @media all and (min-width:1200px) { .third-box-1, .third-box-2, .third-box-3 {width:26%; display:inline-block;} .third-box-1 {margin:20px 3.5% 20px 0;} .third-box-2 {margin:20px 1.5% 20px 1.5%;} .third-box-3 {margin:20px 0 20px 3.5%;} } .thank-you-scrolling { -webkit-animation: thankyouscrolling 40s linear infinite; -moz-animation: thankyouscrolling 40s linear infinite; -ms-animation: thankyouscrolling 40s linear infinite; -o-animation: thankyouscrolling 40s linear infinite; animation: thankyouscrolling 40s linear infinite; } @keyframes "thankyouscrolling" {0% {margin-left: 0;} 100% {margin-left: -2280px;}} @-moz-keyframes thankyouscrolling {0% {margin-left: 0;} 100% {margin-left: -2280px;}} @-webkit-keyframes "thankyouscrolling" {0% {margin-left: 0;} 100% {margin-left: -2280px;}} @-o-keyframes "thankyouscrolling" {0% {margin-left: 0;} 100% {margin-left: -2280px;}} /*-------------- Footer -------------------------------------------------------------*/ .site-footer {background:#54565a; font-size:0; padding:0 2%; width:96%; border-top:5px solid #f26b21;} .site-footer .wrap {width:100%; max-width:1200px; margin:0 auto;} .site-footer .all-columns {display:none; padding:40px 2%;} .site-footer .all-columns p {font-size:15px; color:#ffffff;} .site-footer .first-column {width:21%;} .site-footer .second-column {width:21%;} .site-footer .third-column {width:21%;} .site-footer .fourth-column {width:21%;} .site-footer .foot-blocks {width:600px; height:auto; margin:0 auto; padding:50px 0 30px 0;} .site-footer .foot-block-1 {float:left; width:250px; height:auto; padding:15px 30px 14px 0; border-right:1px solid rgba(255,255,255,0.2);} .site-footer .foot-block-1 p {color:#ffffff; text-align:right; font-size:16px; line-height:20px;} .site-footer .foot-block-2 {float:right; width:289px; height:auto; padding:10px 0 25px 30px; text-align:left; border-bottom:1px solid rgba(255,255,255,0.2);} .site-footer .foot-block-3 {float:right; width:300px; height:auto; padding:25px 0 10px 14px; text-align:left;} .site-footer .foot-block-3 p {color:#fff; font-size:13px; padding:10px 0 0 0; margin:0 0 0 10px;} .site-footer .foot-block-3 a {color:#fff;} .site-footer .foot-block-3 a:hover {text-decoration:underline;} .site-footer .social-link {display:inline-block; width:50px; height:50px; border-radius:50%; text-align:center; position:relative; font-size:32px; line-height:50px; margin:0 10px 0 10px; padding:0; background:#00b7c6; color:#54565a !important;} .site-footer .social-link:hover {background:#ffffff;} .site-footer .social-link:before {content:""; position:absolute; top:0;right:0; bottom:0; left:0; border:0 solid #f26b21; border-radius:50%;} .site-footer .social-link:hover:before {top:-6px;right:-6px; bottom:-6px; left:-6px; border:2px solid #f26b21;} .footer-group-logos {text-align:center; padding:0 0 40px 0; width:100%; max-width:750px; margin:0 auto;} .footer-group-logos .foot-logo-dma {width:125px; height:auto; margin:16px 16px 10px 16px;} .footer-group-logos .foot-logo-bui {width:92px; height:auto; margin:3px 18px 10px 22px;} .footer-group-logos .foot-logo-inc {width:124px; height:auto; margin:14px 16px 10px 16px;} .footer-group-logos .foot-logo-lcg {width:125px; height:auto; margin:0 16px 10px 16px;} .footer-group-logos .foot-logo-pac {width:115px; height:auto; margin:10px 16px 10px 16px;} .footer-group-logos .foot-logo-mba {width:134px; height:auto; margin:0 14px 10px 16px;} .foot-privacy-line {border-top:1px solid rgba(255,255,255,0.2); border-bottom:1px solid rgba(255,255,255,0.2); padding:7px 0px 5px 0px; margin:-10px auto 30px auto; max-width:600px;} .foot-privacy-line p {text-align:center; padding:0; color:#ffffff; font-size:16px; line-height:1.5em; font-family: 'Montserrat', sans-serif;} .foot-privacy-line a {color:#ffffff; padding:0 5px 0 5px; font-family: 'Montserrat', sans-serif;} .foot-privacy-line a:hover {color:#00b7c6; text-decoration:underline;} @media all and (max-width:650px) { .site-footer .foot-blocks {width:100%; padding: 30px 0 50px 0;} .site-footer .foot-block-1 {float:none; width:100%; text-align:center; padding:15px 0 14px 0; border-right:none;} .site-footer .foot-block-1 p {text-align:center;} .site-footer .foot-block-2 {float:none; width:100%; text-align:center; padding:5px 0 25px 0;} .site-footer .foot-block-3 {float:none; width:100%; text-align:center; padding:25px 0 0 0;} .site-footer .foot-block-3 p {text-align:center;} .footer-group-logos {text-align:center; padding:10px 0 30px 0;} .footer-group-logos .foot-logo-dma {width:95px; max-width:22%; margin:16px 2% 10px 2%;} .footer-group-logos .foot-logo-bui {width:55px; max-width:14%; margin:3px 2% 10px 2%;} .footer-group-logos .foot-logo-inc {width:80px; max-width:21%; margin:10px 2% 10px 2%;} .footer-group-logos .foot-logo-lcg {width:72px; max-width:20%; margin:0 2% 10px 2%;} .footer-group-logos .foot-logo-pac {width:85px; max-width:21%; margin:10px 2% 10px 2%;} .footer-group-logos .foot-logo-mba {width:87px; max-width:21%; margin:0 2% 10px 2%;} } /*-------------- Popup --------------------------------------------------------------*/ .pop-overlay {position:fixed; top:10px; right:10px; bottom:10px; left:10px; background:#e5e5e5; z-index:99999;} /*-------------- Misc ---------------------------------------------------------------*/ .shadowed {height:auto; -moz-box-shadow:4px 17px 55px rgba(0,0,0,0.1); -webkit-box-shadow:4px 17px 55px rgba(0,0,0,0.1); box-shadow:4px 17px 55px rgba(0,0,0,0.1);} .linedimg, .linedcircimg {position:relative;} .linedimg:before, .linedcircimg:before {content:''; position:absolute; top:6px; right:6px; bottom:6px; left:6px; border:2px solid rgba(255,255,255,0.4);} .linedcircimg:before {border-radius:50%;} @keyframes animatedBackground { from { background-position: 0 0; } to { background-position: 100% 0; } } @-o-keyframes animatedBackground { from { background-position: 0 0; } to { background-position: 100% 0; } } @-moz-keyframes animatedBackground { from { background-position: 0 0; } to { background-position: 100% 0; } } @-webkit-keyframes animatedBackground { from { background-position: 0 0; } to { background-position: 100% 0; } } @keyframes animatedBackground2 { from { background-position: -50% 0; } to { background-position: 50% 0; } } @-o-keyframes animatedBackground2 { from { background-position: -50% 0; } to { background-position: 50% 0; } } @-moz-keyframes animatedBackground2 { from { background-position: -50% 0; } to { background-position: 50% 0; } } @-webkit-keyframes animatedBackground2 { from { background-position: -50% 0; } to { background-position: 50% 0; } } @keyframes animatedBackgroundRev { from { background-position: 100% 0; } to { background-position: 0 0; } } @-o-keyframes animatedBackgroundRev { from { background-position: 100% 0; } to { background-position: 0 0; } } @-moz-keyframes animatedBackgroundRev { from { background-position: 100% 0; } to { background-position: 0 0; } } @-webkit-keyframes animatedBackgroundRev { from { background-position: 100% 0; } to { background-position: 0 0; } } @keyframes animatedBackgroundVert1 { 0% { background-position: left 10px top 0; } 100% { background-position: left 10px top 202px; } } @-o-keyframes animatedBackgroundVert1 { 0% { background-position: left 10px top 0; } 100% { background-position: left 10px top 202px; } } @-moz-keyframes animatedBackgroundVert1 { 0% { background-position: left 10px top 0; } 100% { background-position: left 10px top 202px; } } @-webkit-keyframes animatedBackgroundVert1 { 0% { background-position: left 10px top 0; } 100% { background-position: left 10px top 202px; } } @keyframes animatedBackgroundVert2 { 0% { background-position: left 10px top 270px; } 100% { background-position: left 10px top 0; } } @-o-keyframes animatedBackgroundVert2 { 0% { background-position: left 10px top 270px; } 100% { background-position: left 10px top 0; } } @-moz-keyframes animatedBackgroundVert2 { 0% { background-position: left 10px top 270px; } 100% { background-position: left 10px top 0; } } @-webkit-keyframes animatedBackgroundVert2 { 0% { background-position: left 10px top 270px; } 100% { background-position: left 10px top 0; } } @keyframes animatedBackgroundVert3 { 0% { background-position: left 10px top -50px; } 100% { background-position: left 10px top 120px; } } @-o-keyframes animatedBackgroundVert3 { 0% { background-position: left 10px top -50px; } 100% { background-position: left 10px top 120px; } } @-moz-keyframes animatedBackgroundVert3 { 0% { background-position: left 10px top -50px; } 100% { background-position: left 10px top 120px; } } @-webkit-keyframes animatedBackgroundVert3 { 0% { background-position: left 10px top -50px; } 100% { background-position: left 10px top 120px; } } @media all and (min-width:900px) { .scroll-back {background-image: url("/wp-content/uploads/2018/05/scrolling-heads.jpg"); background-position: 0 0; background-size:auto 100%; background-repeat: repeat-x; animation: animatedBackground 70s linear infinite; -o-animation: animatedBackground 70s linear infinite; -moz-animation: animatedBackground 70s linear infinite; -webkit-animation: animatedBackground 70s linear infinite; } .scroll-back2 {background-image: url("/wp-content/uploads/2018/05/scrolling-heads.jpg"); background-position: -50% 0; background-size:auto 100%; background-repeat: repeat-x; animation: animatedBackground2 40s linear infinite; -o-animation: animatedBackground2 40s linear infinite; -moz-animation: animatedBackground2 40s linear infinite; -webkit-animation: animatedBackground2 40s linear infinite; } .scroll-back-reverse {background-image: url("/wp-content/uploads/2018/05/scrolling-heads.jpg"); background-position: 100% 0; background-size:auto 100%; background-repeat: repeat-x; animation: animatedBackgroundRev 70s linear infinite; -o-animation: animatedBackgroundRev 70s linear infinite; -moz-animation: animatedBackgroundRev 70s linear infinite; -webkit-animation: animatedBackgroundRev 70s linear infinite; } .scroll-back-vert1 {background-image: url("/wp-content/uploads/2018/08/email-symbols.jpg"); background-position: left 10px top 0; background-size:60px 202px; background-repeat: repeat-y; animation: animatedBackgroundVert1 11s linear infinite; -o-animation: animatedBackgroundVert1 11s linear infinite; -moz-animation: animatedBackgroundVert1 11s linear infinite; -webkit-animation: animatedBackgroundVert1 11s linear infinite; } .scroll-back-vert2 {background-image: url("/wp-content/uploads/2018/08/email-symbols.jpg"); background-position: left 10px top 270px; background-size:80px 270px; background-repeat: repeat-y; animation: animatedBackgroundVert2 15s linear infinite; -o-animation: animatedBackgroundVert2 15s linear infinite; -moz-animation: animatedBackgroundVert2 15s linear infinite; -webkit-animation: animatedBackgroundVert2 15s linear infinite; } .scroll-back-vert3 {background-image: url("/wp-content/uploads/2018/08/email-symbols.jpg"); background-position: left 10px top -50px; background-size:50px 170px; background-repeat: repeat-y; animation: animatedBackgroundVert3 10s linear infinite; -o-animation: animatedBackgroundVert3 10s linear infinite; -moz-animation: animatedBackgroundVert3 10s linear infinite; -webkit-animation: animatedBackgroundVert3 10s linear infinite; } .scroll-back3 { background-position: 0 0; background-size:100% auto; background-repeat: repeat-x; animation: animatedBackground 70s linear infinite; -o-animation: animatedBackground 70s linear infinite; -moz-animation: animatedBackground 70s linear infinite; -webkit-animation: animatedBackground 70s linear infinite; } .scroll-back4 { background-position: -50% 0; background-size:auto 100%; background-repeat: repeat-x; animation: animatedBackground2 40s linear infinite; -o-animation: animatedBackground2 40s linear infinite; -moz-animation: animatedBackground2 40s linear infinite; -webkit-animation: animatedBackground2 40s linear infinite; } .scroll-back5 { background-position: 100% 0; background-size:auto 100%; background-repeat: repeat-x; animation: animatedBackgroundRev 70s linear infinite; -o-animation: animatedBackgroundRev 70s linear infinite; -moz-animation: animatedBackgroundRev 70s linear infinite; -webkit-animation: animatedBackgroundRev 70s linear infinite; } } .color1, .color-red {color:#c92027 !important;} .color2, .color-teal {color:#00657f !important;} .color3, .color-black {color:#211e1e !important;} .color4, .color-dark {color:#535559 !important;} .color5, .color-neutral {color:#88888c !important;} .color6, .color-light {color:#b2b1b1 !important;} .color7, .color-cyan {color:#00b7c6 !important;} .color8, .color-orange {color:#f26b21 !important;} .color9, .color-plum {color:#981f62 !important;} .color10, .color-ltgray {color:#f0f0f0 !important;} .color11, .color-ltcyan {color:#daf1f7 !important;} .color12, .color-ltplum {color:#f7e9f0 !important;} .color13, .color-ltorange {color:#fceee3 !important;} .back1, .back-red {background:#c92027 !important;} .back2, .back-teal {background:#00657f !important;} .back3, .back-black {background:#211e1e !important;} .back4, .back-dark {background:#535559 !important;} .back5, .back-neutral {background:#88888c !important;} .back6, .back-light {background:#b2b1b1 !important;} .back7, .back-cyan {background:#00b7c6 !important;} .back8, .back-orange {background:#f26b21 !important;} .back9, .back-plum {background:#981f62 !important;} .back10, .back-ltgray {background:#f0f0f0 !important;} .back11, .back-ltcyan {background:#daf1f7 !important;} .back12, .back-ltplum {background:#f7e9f0 !important;} .back13, .back-ltorange {background:#fceee3 !important;} .spacer5 {width:100%; height:5px;} .spacer10 {width:100%; height:10px;} .spacer15 {width:100%; height:15px;} .spacer20 {width:100%; height:20px;} .spacer25 {width:100%; height:25px;} .spacer30 {width:100%; height:30px;} .spacer35 {width:100%; height:35px;} .spacer40 {width:100%; height:40px;} .spacer45 {width:100%; height:45px;} .spacer50 {width:100%; height:50px;} .spacer55 {width:100%; height:55px;} .spacer60 {width:100%; height:60px;} .spacer65 {width:100%; height:65px;} .spacer70 {width:100%; height:70px;} .spacer75 {width:100%; height:75px;} .spacer80 {width:100%; height:80px;} .spacer85 {width:100%; height:85px;} .spacer90 {width:100%; height:90px;} .spacer95 {width:100%; height:95px;} .spacer100 {width:100%; height:60px;} @media all and (min-width:1000px) {.spacer100 {width:100%; height:100px;}} .clearfix {clear:both;} .mobile-hidden {display:none !important;} @media all and (min-width:1000px) {.mobile-hidden{display:block !important;}} .sr-only {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip: rect(0,0,0,0); border:0; color:#000000 !important;} .donut {position:relative; background:#f0f0f0; border-radius:50%; margin:0 auto; overflow:hidden; -moz-box-shadow: 2px 5px 12px rgba(0,0,0,0.2); -webkit-box-shadow: 2px 5px 12px rgba(0,0,0,0.2); box-shadow: 2px 5px 12px rgba(0,0,0,0.2);} .donut .circle .mask, .donut .circle .fill, .donut .circle .shadow { width:100%; height:100%; position:absolute; top:0; right:0; bottom:0; left:0;} .donut .circle .mask, .donut .circle .fill { -webkit-backface-visibility: hidden; transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } .donut .circle .mask {overflow:hidden; width:100%; height:100%;} .donut .circle .mask.half {margin:0 0 0 50%;} .donut .circle .mask.full {margin:0 0 0 0;} .donut .circle .mask.half .fill { transform-origin:center left; overflow:hidden; width:100%; height:100%; margin:0 0 0 0; background-color: #00b7c6;} .donut .circle .mask.full .fill { transform-origin:center left; overflow:hidden; width:100%; height:100%; margin:0 0 0 50%; background-color: #00b7c6;} .donut .inset {width:64%; height:64%; position: absolute; margin-left:18%; margin-top:18%; background-color:#ffffff; border-radius:50%; display:table; -moz-box-shadow: 2px 5px 12px rgba(0,0,0,0.2) inset; -webkit-box-shadow: 2px 5px 12px rgba(0,0,0,0.2) inset; box-shadow: 2px 5px 12px rgba(0,0,0,0.2) inset; } .donut .inset .percentage { width:100%; height:100%; text-align:center; display:table-cell; vertical-align:middle; color:#981f62; font-weight:300; font-size:30px; transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } .donut .inset .percentage:hover {font-weight:700;} .donut[data-progress="0"] .circle .mask.full {display:none;} .donut[data-progress="0"] .circle .mask.half {display:none;} .donut[data-progress="1"] .circle .mask.full{display:none;} .donut[data-progress="1"] .circle .mask.half .fill {-webkit-transform: rotate(-176.4deg); -ms-transform: rotate(-176.4deg); transform: rotate(-176.4deg);} .donut[data-progress="2"] .circle .mask.full{display:none;} .donut[data-progress="2"] .circle .mask.half .fill {-webkit-transform: rotate(-172.8deg); -ms-transform: rotate(-172.8deg); transform: rotate(-172.8deg);} .donut[data-progress="3"] .circle .mask.full{display:none;} .donut[data-progress="3"] .circle .mask.half .fill {-webkit-transform: rotate(-169.2deg); -ms-transform: rotate(-169.2deg); transform: rotate(-169.2deg);} .donut[data-progress="4"] .circle .mask.full{display:none;} .donut[data-progress="4"] .circle .mask.half .fill {-webkit-transform: rotate(-165.6deg); -ms-transform: rotate(-165.6deg); transform: rotate(-165.6deg);} .donut[data-progress="5"] .circle .mask.full{display:none;} .donut[data-progress="5"] .circle .mask.half .fill {-webkit-transform: rotate(-162deg); -ms-transform: rotate(-162deg); transform: rotate(-162deg);} .donut[data-progress="6"] .circle .mask.full{display:none;} .donut[data-progress="6"] .circle .mask.half .fill {-webkit-transform: rotate(-158.4deg); -ms-transform: rotate(-158.4deg); transform: rotate(-158.4deg);} .donut[data-progress="7"] .circle .mask.full{display:none;} .donut[data-progress="7"] .circle .mask.half .fill {-webkit-transform: rotate(-154.8deg); -ms-transform: rotate(-154.8deg); transform: rotate(-154.8deg);} .donut[data-progress="8"] .circle .mask.full{display:none;} .donut[data-progress="8"] .circle .mask.half .fill {-webkit-transform: rotate(-151.2deg); -ms-transform: rotate(-151.2deg); transform: rotate(-151.2deg);} .donut[data-progress="9"] .circle .mask.full{display:none;} .donut[data-progress="9"] .circle .mask.half .fill {-webkit-transform: rotate(-147.6deg); -ms-transform: rotate(-147.6deg); transform: rotate(-147.6deg);} .donut[data-progress="10"] .circle .mask.full{display:none;} .donut[data-progress="10"] .circle .mask.half .fill {-webkit-transform: rotate(-144deg); -ms-transform: rotate(-144deg); transform: rotate(-144deg);} .donut[data-progress="11"] .circle .mask.full{display:none;} .donut[data-progress="11"] .circle .mask.half .fill {-webkit-transform: rotate(-140.4deg); -ms-transform: rotate(-140.4deg); transform: rotate(-140.4deg);} .donut[data-progress="12"] .circle .mask.full{display:none;} .donut[data-progress="12"] .circle .mask.half .fill {-webkit-transform: rotate(-136.8deg); -ms-transform: rotate(-136.8deg); transform: rotate(-136.8deg);} .donut[data-progress="13"] .circle .mask.full{display:none;} .donut[data-progress="13"] .circle .mask.half .fill {-webkit-transform: rotate(-133.2deg); -ms-transform: rotate(-133.2deg); transform: rotate(-133.2deg);} .donut[data-progress="14"] .circle .mask.full{display:none;} .donut[data-progress="14"] .circle .mask.half .fill {-webkit-transform: rotate(-129.6deg); -ms-transform: rotate(-129.6deg); transform: rotate(-129.6deg);} .donut[data-progress="15"] .circle .mask.full{display:none;} .donut[data-progress="15"] .circle .mask.half .fill {-webkit-transform: rotate(-126deg); -ms-transform: rotate(-126deg); transform: rotate(-126deg);} .donut[data-progress="16"] .circle .mask.full{display:none;} .donut[data-progress="16"] .circle .mask.half .fill {-webkit-transform: rotate(-122.4deg); -ms-transform: rotate(-122.4deg); transform: rotate(-122.4deg);} .donut[data-progress="17"] .circle .mask.full{display:none;} .donut[data-progress="17"] .circle .mask.half .fill {-webkit-transform: rotate(-118.8deg); -ms-transform: rotate(-118.8deg); transform: rotate(-118.8deg);} .donut[data-progress="18"] .circle .mask.full{display:none;} .donut[data-progress="18"] .circle .mask.half .fill {-webkit-transform: rotate(-115.2deg); -ms-transform: rotate(-115.2deg); transform: rotate(-115.2deg);} .donut[data-progress="19"] .circle .mask.full{display:none;} .donut[data-progress="19"] .circle .mask.half .fill {-webkit-transform: rotate(-111.6deg); -ms-transform: rotate(-111.6deg); transform: rotate(-111.6deg);} .donut[data-progress="20"] .circle .mask.full{display:none;} .donut[data-progress="20"] .circle .mask.half .fill {-webkit-transform: rotate(-108deg); -ms-transform: rotate(-108deg); transform: rotate(-108deg);} .donut[data-progress="21"] .circle .mask.full{display:none;} .donut[data-progress="21"] .circle .mask.half .fill {-webkit-transform: rotate(-104.4deg); -ms-transform: rotate(-104.4deg); transform: rotate(-104.4deg);} .donut[data-progress="22"] .circle .mask.full{display:none;} .donut[data-progress="22"] .circle .mask.half .fill {-webkit-transform: rotate(-100.8deg); -ms-transform: rotate(-100.8deg); transform: rotate(-100.8deg);} .donut[data-progress="23"] .circle .mask.full{display:none;} .donut[data-progress="23"] .circle .mask.half .fill {-webkit-transform: rotate(-97.2deg); -ms-transform: rotate(-97.2deg); transform: rotate(-97.2deg);} .donut[data-progress="24"] .circle .mask.full{display:none;} .donut[data-progress="24"] .circle .mask.half .fill {-webkit-transform: rotate(-93.6deg); -ms-transform: rotate(-93.6deg); transform: rotate(-93.6deg);} .donut[data-progress="25"] .circle .mask.full{display:none;} .donut[data-progress="25"] .circle .mask.half .fill {-webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg);} .donut[data-progress="26"] .circle .mask.full{display:none;} .donut[data-progress="26"] .circle .mask.half .fill {-webkit-transform: rotate(-86.4deg); -ms-transform: rotate(-86.4deg); transform: rotate(-86.4deg);} .donut[data-progress="27"] .circle .mask.full{display:none;} .donut[data-progress="27"] .circle .mask.half .fill {-webkit-transform: rotate(-82.8deg); -ms-transform: rotate(-82.8deg); transform: rotate(-82.8deg);} .donut[data-progress="28"] .circle .mask.full{display:none;} .donut[data-progress="28"] .circle .mask.half .fill {-webkit-transform: rotate(-79.2deg); -ms-transform: rotate(-79.2deg); transform: rotate(-79.2deg);} .donut[data-progress="29"] .circle .mask.full{display:none;} .donut[data-progress="29"] .circle .mask.half .fill {-webkit-transform: rotate(-75.6deg); -ms-transform: rotate(-75.6deg); transform: rotate(-75.6deg);} .donut[data-progress="30"] .circle .mask.full{display:none;} .donut[data-progress="30"] .circle .mask.half .fill {-webkit-transform: rotate(-72deg); -ms-transform: rotate(-72deg); transform: rotate(-72deg);} .donut[data-progress="31"] .circle .mask.full{display:none;} .donut[data-progress="31"] .circle .mask.half .fill {-webkit-transform: rotate(-68.4deg); -ms-transform: rotate(-68.4deg); transform: rotate(-68.4deg);} .donut[data-progress="32"] .circle .mask.full{display:none;} .donut[data-progress="32"] .circle .mask.half .fill {-webkit-transform: rotate(-64.8deg); -ms-transform: rotate(-64.8deg); transform: rotate(-64.8deg);} .donut[data-progress="33"] .circle .mask.full{display:none;} .donut[data-progress="33"] .circle .mask.half .fill {-webkit-transform: rotate(-61.2deg); -ms-transform: rotate(-61.2deg); transform: rotate(-61.2deg);} .donut[data-progress="34"] .circle .mask.full{display:none;} .donut[data-progress="34"] .circle .mask.half .fill {-webkit-transform: rotate(-57.6deg); -ms-transform: rotate(-57.6deg); transform: rotate(-57.6deg);} .donut[data-progress="35"] .circle .mask.full{display:none;} .donut[data-progress="35"] .circle .mask.half .fill {-webkit-transform: rotate(-54deg); -ms-transform: rotate(-54deg); transform: rotate(-54deg);} .donut[data-progress="36"] .circle .mask.full{display:none;} .donut[data-progress="36"] .circle .mask.half .fill {-webkit-transform: rotate(-50.4deg); -ms-transform: rotate(-50.4deg); transform: rotate(-50.4deg);} .donut[data-progress="37"] .circle .mask.full{display:none;} .donut[data-progress="37"] .circle .mask.half .fill {-webkit-transform: rotate(-46.8deg); -ms-transform: rotate(-46.8deg); transform: rotate(-46.8deg);} .donut[data-progress="38"] .circle .mask.full{display:none;} .donut[data-progress="38"] .circle .mask.half .fill {-webkit-transform: rotate(-43.2deg); -ms-transform: rotate(-43.2deg); transform: rotate(-43.2deg);} .donut[data-progress="39"] .circle .mask.full{display:none;} .donut[data-progress="39"] .circle .mask.half .fill {-webkit-transform: rotate(-39.6deg); -ms-transform: rotate(-39.6deg); transform: rotate(-39.6deg);} .donut[data-progress="40"] .circle .mask.full{display:none;} .donut[data-progress="40"] .circle .mask.half .fill {-webkit-transform: rotate(-36deg); -ms-transform: rotate(-36deg); transform: rotate(-36deg);} .donut[data-progress="41"] .circle .mask.full{display:none;} .donut[data-progress="41"] .circle .mask.half .fill {-webkit-transform: rotate(-32.4deg); -ms-transform: rotate(-32.4deg); transform: rotate(-32.4deg);} .donut[data-progress="42"] .circle .mask.full{display:none;} .donut[data-progress="42"] .circle .mask.half .fill {-webkit-transform: rotate(-28.8deg); -ms-transform: rotate(-28.8deg); transform: rotate(-28.8deg);} .donut[data-progress="43"] .circle .mask.full{display:none;} .donut[data-progress="43"] .circle .mask.half .fill {-webkit-transform: rotate(-25.2deg); -ms-transform: rotate(-25.2deg); transform: rotate(-25.2deg);} .donut[data-progress="44"] .circle .mask.full{display:none;} .donut[data-progress="44"] .circle .mask.half .fill {-webkit-transform: rotate(-21.6deg); -ms-transform: rotate(-21.6deg); transform: rotate(-21.6deg);} .donut[data-progress="45"] .circle .mask.full{display:none;} .donut[data-progress="45"] .circle .mask.half .fill {-webkit-transform: rotate(-18deg); -ms-transform: rotate(-18deg); transform: rotate(-18deg);} .donut[data-progress="46"] .circle .mask.full{display:none;} .donut[data-progress="46"] .circle .mask.half .fill {-webkit-transform: rotate(-14.4deg); -ms-transform: rotate(-14.4deg); transform: rotate(-14.4deg);} .donut[data-progress="47"] .circle .mask.full{display:none;} .donut[data-progress="47"] .circle .mask.half .fill {-webkit-transform: rotate(-10.8deg); -ms-transform: rotate(-10.8deg); transform: rotate(-10.8deg);} .donut[data-progress="48"] .circle .mask.full{display:none;} .donut[data-progress="48"] .circle .mask.half .fill {-webkit-transform: rotate(-7.2deg); -ms-transform: rotate(-7.2deg); transform: rotate(-7.2deg);} .donut[data-progress="49"] .circle .mask.full{display:none;} .donut[data-progress="49"] .circle .mask.half .fill {-webkit-transform: rotate(-3.6deg); -ms-transform: rotate(-3.6deg); transform: rotate(-3.6deg);} .donut[data-progress="50"] .circle .mask.full{display:none;} .donut[data-progress="50"] .circle .mask.half .fill {-webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(-0deg);} .donut[data-progress="51"] .circle .mask.full .fill{-webkit-transform: rotate(3.6deg); -ms-transform: rotate(3.6deg); transform: rotate(3.6deg);} .donut[data-progress="52"] .circle .mask.full .fill{-webkit-transform: rotate(7.2deg); -ms-transform: rotate(7.2deg); transform: rotate(7.2deg);} .donut[data-progress="53"] .circle .mask.full .fill{-webkit-transform: rotate(10.8deg); -ms-transform: rotate(10.8deg); transform: rotate(10.8deg);} .donut[data-progress="54"] .circle .mask.full .fill{-webkit-transform: rotate(14.4deg); -ms-transform: rotate(14.4deg); transform: rotate(14.4deg);} .donut[data-progress="55"] .circle .mask.full .fill{-webkit-transform: rotate(18deg); -ms-transform: rotate(18deg); transform: rotate(18deg);} .donut[data-progress="56"] .circle .mask.full .fill{-webkit-transform: rotate(21.6deg); -ms-transform: rotate(21.6deg); transform: rotate(21.6deg);} .donut[data-progress="57"] .circle .mask.full .fill{-webkit-transform: rotate(25.2deg); -ms-transform: rotate(25.2deg); transform: rotate(25.2deg);} .donut[data-progress="58"] .circle .mask.full .fill{-webkit-transform: rotate(28.8deg); -ms-transform: rotate(28.8deg); transform: rotate(28.8deg);} .donut[data-progress="59"] .circle .mask.full .fill{-webkit-transform: rotate(32.4deg); -ms-transform: rotate(32.4deg); transform: rotate(32.4deg);} .donut[data-progress="60"] .circle .mask.full .fill{-webkit-transform: rotate(36deg); -ms-transform: rotate(36deg); transform: rotate(36deg);} .donut[data-progress="61"] .circle .mask.full .fill{-webkit-transform: rotate(39.6deg); -ms-transform: rotate(39.6deg); transform: rotate(39.6deg);} .donut[data-progress="62"] .circle .mask.full .fill{-webkit-transform: rotate(43.2deg); -ms-transform: rotate(43.2deg); transform: rotate(43.2deg);} .donut[data-progress="63"] .circle .mask.full .fill{-webkit-transform: rotate(46.8deg); -ms-transform: rotate(46.8deg); transform: rotate(46.8deg);} .donut[data-progress="64"] .circle .mask.full .fill{-webkit-transform: rotate(50.4deg); -ms-transform: rotate(50.4deg); transform: rotate(50.4deg);} .donut[data-progress="65"] .circle .mask.full .fill{-webkit-transform: rotate(54deg); -ms-transform: rotate(54deg); transform: rotate(54deg);} .donut[data-progress="66"] .circle .mask.full .fill{-webkit-transform: rotate(57.6deg); -ms-transform: rotate(57.6deg); transform: rotate(57.6deg);} .donut[data-progress="67"] .circle .mask.full .fill{-webkit-transform: rotate(61.2deg); -ms-transform: rotate(61.2deg); transform: rotate(61.2deg);} .donut[data-progress="68"] .circle .mask.full .fill{-webkit-transform: rotate(64.8deg); -ms-transform: rotate(64.8deg); transform: rotate(64.8deg);} .donut[data-progress="69"] .circle .mask.full .fill{-webkit-transform: rotate(68.4deg); -ms-transform: rotate(68.4deg); transform: rotate(68.4deg);} .donut[data-progress="70"] .circle .mask.full .fill{-webkit-transform: rotate(72deg); -ms-transform: rotate(72deg); transform: rotate(72deg);} .donut[data-progress="71"] .circle .mask.full .fill{-webkit-transform: rotate(75.6deg); -ms-transform: rotate(75.6deg); transform: rotate(75.6deg);} .donut[data-progress="72"] .circle .mask.full .fill{-webkit-transform: rotate(79.2deg); -ms-transform: rotate(79.2deg); transform: rotate(79.2deg);} .donut[data-progress="73"] .circle .mask.full .fill{-webkit-transform: rotate(82.8deg); -ms-transform: rotate(82.8deg); transform: rotate(82.8deg);} .donut[data-progress="74"] .circle .mask.full .fill{-webkit-transform: rotate(86.4deg); -ms-transform: rotate(86.4deg); transform: rotate(86.4deg);} .donut[data-progress="75"] .circle .mask.full .fill{-webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg);} .donut[data-progress="76"] .circle .mask.full .fill{-webkit-transform: rotate(93.6deg); -ms-transform: rotate(93.6deg); transform: rotate(93.6deg);} .donut[data-progress="77"] .circle .mask.full .fill{-webkit-transform: rotate(97.2deg); -ms-transform: rotate(97.2deg); transform: rotate(97.2deg);} .donut[data-progress="78"] .circle .mask.full .fill{-webkit-transform: rotate(100.8deg); -ms-transform: rotate(100.8deg); transform: rotate(100.8deg);} .donut[data-progress="79"] .circle .mask.full .fill{-webkit-transform: rotate(104.4deg); -ms-transform: rotate(104.4deg); transform: rotate(104.4deg);} .donut[data-progress="80"] .circle .mask.full .fill{-webkit-transform: rotate(108deg); -ms-transform: rotate(108deg); transform: rotate(108deg);} .donut[data-progress="81"] .circle .mask.full .fill{-webkit-transform: rotate(111.6deg); -ms-transform: rotate(111.6deg); transform: rotate(111.6deg);} .donut[data-progress="82"] .circle .mask.full .fill{-webkit-transform: rotate(115.2deg); -ms-transform: rotate(115.2deg); transform: rotate(115.2deg);} .donut[data-progress="83"] .circle .mask.full .fill{-webkit-transform: rotate(118.8deg); -ms-transform: rotate(118.8deg); transform: rotate(118.8deg);} .donut[data-progress="84"] .circle .mask.full .fill{-webkit-transform: rotate(122.4deg); -ms-transform: rotate(122.4deg); transform: rotate(122.4deg);} .donut[data-progress="85"] .circle .mask.full .fill{-webkit-transform: rotate(126deg); -ms-transform: rotate(126deg); transform: rotate(126deg);} .donut[data-progress="86"] .circle .mask.full .fill{-webkit-transform: rotate(129.6deg); -ms-transform: rotate(129.6deg); transform: rotate(129.6deg);} .donut[data-progress="87"] .circle .mask.full .fill{-webkit-transform: rotate(133.2deg); -ms-transform: rotate(133.2deg); transform: rotate(133.2deg);} .donut[data-progress="88"] .circle .mask.full .fill{-webkit-transform: rotate(136.8deg); -ms-transform: rotate(136.8deg); transform: rotate(136.8deg);} .donut[data-progress="89"] .circle .mask.full .fill{-webkit-transform: rotate(140.4deg); -ms-transform: rotate(140.4deg); transform: rotate(140.4deg);} .donut[data-progress="90"] .circle .mask.full .fill{-webkit-transform: rotate(144deg); -ms-transform: rotate(144deg); transform: rotate(144deg);} .donut[data-progress="91"] .circle .mask.full .fill{-webkit-transform: rotate(147.6deg); -ms-transform: rotate(147.6deg); transform: rotate(147.6deg);} .donut[data-progress="92"] .circle .mask.full .fill{-webkit-transform: rotate(151.2deg); -ms-transform: rotate(151.2deg); transform: rotate(151.2deg);} .donut[data-progress="93"] .circle .mask.full .fill{-webkit-transform: rotate(154.8deg); -ms-transform: rotate(154.8deg); transform: rotate(154.8deg);} .donut[data-progress="94"] .circle .mask.full .fill{-webkit-transform: rotate(158.4deg); -ms-transform: rotate(158.4deg); transform: rotate(158.4deg);} .donut[data-progress="95"] .circle .mask.full .fill{-webkit-transform: rotate(162deg); -ms-transform: rotate(162deg); transform: rotate(162deg);} .donut[data-progress="96"] .circle .mask.full .fill{-webkit-transform: rotate(165.6deg); -ms-transform: rotate(165.6deg); transform: rotate(165.6deg);} .donut[data-progress="97"] .circle .mask.full .fill{-webkit-transform: rotate(169.2deg); -ms-transform: rotate(169.2deg); transform: rotate(169.2deg);} .donut[data-progress="98"] .circle .mask.full .fill{-webkit-transform: rotate(172.8deg); -ms-transform: rotate(172.8deg); transform: rotate(172.8deg);} .donut[data-progress="99"] .circle .mask.full .fill{-webkit-transform: rotate(176.4deg); -ms-transform: rotate(176.4deg); transform: rotate(176.4deg);} .donut[data-progress="100"] .circle .mask.full .fill{-webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}