/* @import url('http://example.com/example_style.css'); */ /***********************************************/ /* CSS @imports must be at the top of the file */ /* Add them above this section */ /***********************************************/ /****************************************/ /* HubSpot Style Boilerplate */ /****************************************/ /* These includes are optional, but helpful. */ /* Images */ img { max-width: 100%; border: 0; -ms-interpolation-mode: bicubic; vertical-align: bottom; /* Suppress the space beneath the baseline */ } /* Videos */ video { max-width: 100%; height: auto; } /* Embed Container (iFrame, Object, Embed) */ .hs-responsive-embed { position: relative; height: auto; overflow: hidden; padding-top: 0; padding-left: 0; padding-right: 0; } .hs-responsive-embed iframe, .hs-responsive-embed object, .hs-responsive-embed embed { width: 100%; height: 100%; border: 0; } .hs-responsive-embed, .hs-responsive-embed.hs-responsive-embed-youtube, .hs-responsive-embed.hs-responsive-embed-wistia, .hs-responsive-embed.hs-responsive-embed-vimeo { padding-bottom: 2%; } .hs-responsive-embed.hs-responsive-embed-instagram { padding-bottom: 116.01%; } .hs-responsive-embed.hs-responsive-embed-pinterest { height: auto; overflow: visible; padding: 0; } .hs-responsive-embed.hs-responsive-embed-pinterest iframe { position: static; width: auto; height: auto; } iframe[src^="http://www.slideshare.net/slideshow/embed_code/"] { width: 100%; max-width: 100%; } @media (max-width: 568px) { iframe { max-width: 100%; } } /* Forms */ textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], select { padding: 6px; display: inline-block; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Menus */ .hs-menu-wrapper ul { padding: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal ul { list-style: none; margin: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: inline-block; margin-bottom: 20px; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul:before { content: " "; display: table; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul:after { content: " "; display: table; clear: both; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-1 { float: left; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a { display: inline-block; padding: 10px 20px; white-space: nowrap; max-width: 140px; overflow: hidden; text-overflow: ellipsis; text-decoration: none; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children { position: relative; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s; position: absolute; z-index: 10; left: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { display: block; white-space: nowrap; width: 140px; overflow: hidden; text-overflow: ellipsis; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li.hs-item-has-children ul.hs-menu-children-wrapper { left: 180px; top: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 1; visibility: visible; } .row-fluid-wrapper:last-child .hs-menu-wrapper.hs-menu-flow-horizontal > ul { margin-bottom: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch { position: relative; margin-bottom: 20px; min-height: 7em; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul { margin-bottom: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children { position: static; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children ul.hs-menu-children-wrapper { display: none; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper { display: block; visibility: visible; opacity: 1; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper:before { content: " "; display: table; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper:after { content: " "; display: table; clear: both; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li { float: left; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li a { display: inline-block; padding: 10px 20px; white-space: nowrap; max-width: 140px; width: auto; overflow: hidden; text-overflow: ellipsis; text-decoration: none; } .hs-menu-wrapper.hs-menu-flow-vertical { width: 100%; } .hs-menu-wrapper.hs-menu-flow-vertical ul { list-style: none; margin: 0; } .hs-menu-wrapper.hs-menu-flow-vertical li a { display: block; white-space: nowrap; width: 140px; overflow: hidden; text-overflow: ellipsis; } .hs-menu-wrapper.hs-menu-flow-vertical > ul { margin-bottom: 20px; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-menu-depth-1 > a { width: auto; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li a { padding: 10px 20px; text-decoration: none; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children { position: relative; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s; position: absolute; z-index: 10; top: 0; left: 180px; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 1; visibility: visible; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li a { min-width: 140px; width: auto; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul { max-width: 100%; overflow: hidden; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul li.hs-item-has-children ul.hs-menu-children-wrapper { display: none; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper, .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li.hs-item-has-children > ul.hs-menu-children-wrapper { display: block; visibility: visible; opacity: 1; position: static; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-2 > a { padding-left: 4em; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-3 > a { padding-left: 6em; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-4 > a { padding-left: 8em; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-5 > a { padding-left: 140px; } .hs-menu-wrapper.hs-menu-not-show-active-branch li.hs-menu-depth-1 ul { box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18); -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18); } @media (max-width: 568px) { .hs-menu-wrapper, .hs-menu-wrapper * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 100%; } .hs-menu-wrapper.hs-menu-flow-horizontal ul { list-style: none; margin: 0; display: block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-1 { float: none; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a, .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a, .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li a { display: block; max-width: 100%; width: 100%; } } .hs-menu-wrapper.hs-menu-flow-vertical.no-flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper, .hs-menu-wrapper.hs-menu-flow-horizontal.no-flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: visible; opacity: 1; } /* Space Module */ .widget-type-space { visibility: hidden; } /* Blog Author Section */ .hs-author-listing-header { margin: 0 0 .75em 0; } .hs-author-social-links { display: inline-block; } .hs-author-social-links a.hs-author-social-link { width: 24px; height: 24px; border-width: 0px; border: 0px; line-height: 24px; background-size: 24px 24px; background-repeat: no-repeat; display: inline-block; text-indent: -99999px; } .hs-author-social-links a.hs-author-social-link.hs-social-facebook { background-image: url("//static.hubspot.com/final/img/common/icons/social/facebook-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-linkedin { background-image: url("//static.hubspot.com/final/img/common/icons/social/linkedin-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-twitter { background-image: url("//static.hubspot.com/final/img/common/icons/social/twitter-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-google-plus { background-image: url("//static.hubspot.com/final/img/common/icons/social/googleplus-24x24.png"); } /* * jQuery FlexSlider v2.0 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the GPLv2 license. * http://www.gnu.org/licenses/gpl-2.0.html * * Contributing author: Tyler Smith (@mbmufffin) */ /* Wrapper */ .hs_cos_wrapper_type_image_slider { display: block; overflow: hidden } /* Browser Resets */ .hs_cos_flex-container a:active, .hs_cos_flex-slider a:active, .hs_cos_flex-container a:focus, .hs_cos_flex-slider a:focus {outline: none;} .hs_cos_flex-slides, .hs_cos_flex-control-nav, .hs_cos_flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* FlexSlider Necessary Styles *********************************/ .hs_cos_flex-slider {margin: 0; padding: 0;} .hs_cos_flex-slider .hs_cos_flex-slides > li {display: none; -webkit-backface-visibility: hidden; position: relative;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .hs_cos_flex-slider .hs_cos_flex-slides img {width: 100%; display: block; border-radius: 0px;} .hs_cos_flex-pauseplay span {text-transform: capitalize;} /* Clearfix for the .hs_cos_flex-slides element */ .hs_cos_flex-slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} html[xmlns] .hs_cos_flex-slides {display: block;} * html .hs_cos_flex-slides {height: 1%;} /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ /* FlexSlider Default Theme *********************************/ .hs_cos_flex-slider {margin: 0 0 60px; background: #fff; border: 0; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; zoom: 1;} .hs_cos_flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;} .loading .hs_cos_flex-viewport {max-height: 300px;} .hs_cos_flex-slider .hs_cos_flex-slides {zoom: 1;} .carousel li {margin-right: 5px} /* Direction Nav */ .hs_cos_flex-direction-nav {*height: 0;} .hs_cos_flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url(//static.hsappstatic.net/content_shared_assets/static-1.3935/img/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;} .hs_cos_flex-direction-nav .hs_cos_flex-next {background-position: 100% 0; right: -36px; } .hs_cos_flex-direction-nav .hs_cos_flex-prev {left: -36px;} .hs_cos_flex-slider:hover .hs_cos_flex-next {opacity: 0.8; right: 5px;} .hs_cos_flex-slider:hover .hs_cos_flex-prev {opacity: 0.8; left: 5px;} .hs_cos_flex-slider:hover .hs_cos_flex-next:hover, .hs_cos_flex-slider:hover .hs_cos_flex-prev:hover {opacity: 1;} .hs_cos_flex-direction-nav .hs_cos_flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;} /* Direction Nav for the Thumbnail Carousel */ .hs_cos_flex_thumbnavs-direction-nav { margin: 0px; padding: 0px; list-style: none; } .hs_cos_flex_thumbnavs-direction-nav {*height: 0;} .hs_cos_flex_thumbnavs-direction-nav a {width: 30px; height: 140px; margin: -60px 0 0; display: block; background: url(//static.hsappstatic.net/content_shared_assets/static-1.3935/img/bg_direction_nav.png) no-repeat 0 40%; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 1; -webkit-transition: all .3s ease;} .hs_cos_flex_thumbnavs-direction-nav .hs_cos_flex_thumbnavs-next {background-position: 100% 40%; right: 0px; } .hs_cos_flex_thumbnavs-direction-nav .hs_cos_flex_thumbnavs-prev {left: 0px;} .hs-cos-flex-slider-control-panel img { cursor: pointer; } .hs-cos-flex-slider-control-panel img:hover { opacity:.8; } .hs-cos-flex-slider-control-panel { margin-top: -30px; } /* Control Nav */ .hs_cos_flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;} .hs_cos_flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;} .hs_cos_flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);} .hs_cos_flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); } .hs_cos_flex-control-paging li a.hs_cos_flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; } .hs_cos_flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;} .hs_cos_flex-control-thumbs li {width: 25%; float: left; margin: 0;} .hs_cos_flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;} .hs_cos_flex-control-thumbs img:hover {opacity: 1;} .hs_cos_flex-control-thumbs .hs_cos_flex-active {opacity: 1; cursor: default;} @media screen and (max-width: 860px) { .hs_cos_flex-direction-nav .hs_cos_flex-prev {opacity: 1; left: 0;} .hs_cos_flex-direction-nav .hs_cos_flex-next {opacity: 1; right: 0;} } .hs_cos_flex-slider .caption { background-color: rgba(0,0,0,0.5); position: absolute; font-size: 2em; line-height: 1.1em; color: white; padding: 0px 5% 0px 5%; width: 100%; bottom: 0; text-align: center; } .hs_cos_flex-slider .superimpose .caption { color: white; font-size: 3em; line-height: 1.1em; position: absolute; padding: 0px 5% 0px 5%; width: 90%; top: 40%; text-align: center; background-color: transparent; } @media all and (max-width: 400px) { .hs_cos_flex-slider .superimpose .caption { background-color: black; position: static; font-size: 2em; line-height: 1.1em; color: white; width: 90%; padding: 0px 5% 0px 5%; top: 40%; text-align: center; } /* beat recaptcha into being responsive, !importants and specificity are necessary */ #recaptcha_area table#recaptcha_table {width: 300px !important;} #recaptcha_area table#recaptcha_table .recaptcha_r1_c1 {width: 300px !important;} #recaptcha_area table#recaptcha_table .recaptcha_r4_c4 { width: 67px !important;} #recaptcha_area table#recaptcha_table #recaptcha_image {width:280px !important;} } .hs_cos_flex-slider h1, .hs_cos_flex-slider h2, .hs_cos_flex-slider h3, .hs_cos_flex-slider h4, .hs_cos_flex-slider h5, .hs_cos_flex-slider h6, .hs_cos_flex-slider p { color: white; } /* Thumbnail only version of the gallery */ .hs-gallery-thumbnails li { display: inline-block; margin: 0px; padding: 0px; margin-right:-4px; } .hs-gallery-thumbnails.fixed-height li img { max-height: 150px; margin: 0px; padding: 0px; border-width: 0px; } /* responsive pre elements */ pre { overflow-x: auto; } /* responsive pre tables */ table pre { white-space: pre-wrap; } /* adding minimal spacing for blog comments */ .comment { margin: 10px 0 10px 0; } /* make sure lines with no whitespace don't interefere with layout */ .hs_cos_wrapper_type_rich_text, .hs_cos_wrapper_type_text, .hs_cos_wrapper_type_header, .hs_cos_wrapper_type_section_header, .hs_cos_wrapper_type_raw_html, .hs_cos_wrapper_type_raw_jinja, .hs_cos_wrapper_type_page_footer { word-wrap: break-word; } /* HTML 5 Reset */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } audio:not([controls]) { display: none; } /* Support migrations from wordpress */ .wp-float-left { float: left; margin: 0 20px 20px 0; } .wp-float-right { float: right; margin: 0 0 20px 20px; } /* Responsive Google Maps */ #map_canvas img, .google-maps img { max-width: none; } /* line height fix for reCaptcha theme */ #recaptcha_table td {line-height: 0;} .recaptchatable #recaptcha_response_field {min-height: 0;line-height: 12px;} /* ========================================================================== Index: 1. BASE STYLES - Variables - Macros - Base - Typography 2. COS STRUCTURE - Structure - Header - Content - Footer 3. MAIN NAVIGATION - Custom Menu Primary - Mobile Menu 4. TEMPLATE MODULE CLASSES - Common Template Classes - Site Pages - Landing Pages - System Pages 5. COS COMPONENTS - Blog - Forms - Buttons - Custom Modules 6. MISCELLANOUS 7. MOBILE MEDIA QUERIES ========================================================================== */ /* ========================================================================== 1. BASE STYLES ========================================================================== */ /* -------------------------------------------------------------------------- Variables -------------------------------------------------------------------------- */ /** * Find the most consistently used font styles, colors, and container widths * for your site and assign them to the jinja variables below for easy use * and reference. * * Apply the variable as shown below. Ignore the jingja comment tags. * * */ /* Colors */ /* Cassling Colors */ /* Knowledge Center */ /* Typography */ /* Links */ /* Containers */ /* Used on '.page-center' in 'Base' and in the 'Portrait tablet to landscape and desktop' media query */ /* -------------------------------------------------------------------------- Macros -------------------------------------------------------------------------- */ /** * Create jinja macros for CSS3 properties that need browser prefixes. * * Apply the style as shown below on it's own CSS property line. * Ignore the jinja comment tags. * * */ /* Animation Delay */ /* Box Shadow */ /* Background Size */ /* Border Radius */ /* User Select */ /* Opacity*/ /* Transform*/ /* -------------------------------------------------------------------------- Base -------------------------------------------------------------------------- */ .bodyContainer{ float:none!important; margin:0px auto!important; max-width:800px!important; } /** * Box Sizing * * Applies a natural box layout model to all elements so that width and padding * are essentially combined, making responsive styles easier to manage. */ *, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } /* Clearing */ .clr:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; zoom: 1; } .clear{ clear:both; } html, body {min-height: 100%; margin: 0; padding: 0;} /* Website background color and default font styles */ body {background: #fff; color: #333; font-family: 'Lato', sans-serif; font-size: 1.125rem; line-height: 1.625; font-weight: 300; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;} /** * Page Center * * Apply .page-center to full-width modules. */ /*.container-fluid .row-fluid .page-center { float: none; max-width: 1200px !important; margin: 0 auto; }*/ .row-fluid .page-center, .row-fluid .page-center[class*="span"], .row-fluid .page-center[class*="span"]:first-child {float: none; max-width: 1200px; margin: 0 auto; padding-left: 1.2500rem; padding-right: 1.2500rem;} .max-width .page-center, .row-fluid-wrapper .page-center.max-width {max-width: 60rem;} a { color: #00afe7; text-decoration: none; transition: -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; -ms-transition: .3s ease-in-out; transition: .3s ease-in-out;;} a:hover, a:focus { color: #1a7de1; } hr {color: #ccc; background-color: #ccc; height: 1px; border: none;} /* Highlighted Text */ ::-moz-selection {color: #fff; background: #333; text-shadow: none;} ::selection {color: #fff; background: #333; text-shadow: none;} /* Corrects width issues in table elements created via the wysiwyg editor */ table tr td img {max-width: initial;} /*------------------------------------------------------------------ [Commons] -------------------------------------------------------------------*/ .display-none { display: none; } .display-block { display: block; } .display-inline { display: inline; } /* Commons > Backgrounds & Borders */ .si-bg-gray { background: #f7f7f7 } .si-bordered { border: 1px solid #eee } /* Commons > Positions */ .si-relative { position: relative; z-index: 1; } .si-absolute { position: absolute; z-index: 1; } /* Commons > Visibility */ .hidden, .si-hidden { display: none; } /* Commons > Background Styles */ .bg-cover { background-repeat: no-repeat; background-position: center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .bg-repeat { background-repeat: repeat; } .bg-repeat-x { background-repeat: repeat-x;} .bg-repeat-y { background-repeat: repeat-y; } .bg-fixed-top, .bg-fixed-bottom, .bg-fixed { background-repeat: no-repeat; background-attachment: fixed; background-position: center center; } .bg-fixed-top { background-position: center top; } .bg-fixed-bottom { background-position: center bottom; } /* Commons > Colors */ .si-color-white, .si-color-white a, .si-color-white a:hover { color: #fff !important; } .light-text, .white-text, .white-text h1, .white-text h2, .white-text h3, .white-text h4, .white-text h5, .white-text h6, .white-text p, .white-text a, .white-text a:hover { color: #fff !important; } .dark-text, .dark-text h1, .dark-text h2, .dark-text h3, .dark-text h4, .dark-text h5, .dark-text h6, .dark-text p {color: #333 !important;} /* Commons > Alignments & Floats */ .textcenter, .text-center { text-align: center; } .textright, .text-right { text-align: right; } .textleft, .text-left { text-align: left; } .float-left, .fl { float: left; } .float-right, fr { float: right; } .fa-left { margin-right: 10px; } .fa-right { margin-left: 10px; } /* Commons > Image Classes */ .image-shadow { background: #fff; box-shadow: 0px 1px 3px rgba(0,0,0,0.1); } .image-border { background: #fff; padding: 4px; border: 1px solid #ddd; } .image-rounded { background: #fff; border-radius: 3px; } .image-circle { background: #fff; border-radius: 99px; } .image-hover:hover { opacity: 0.8; -webkit-opacity: 0.8; -moz-opacity: 0.8; box-shadow: 0px 1px 5px rgba(0,0,0,0.2); } .image-fancy { background: #fff; padding: 4px; border: 1px solid #ddd; border-radius: 99px; -moz-border-radius: 99px; -webkit-border-radius: 99px; } .image-fancy:hover { opacity: 0.8; -webkit-opacity: 0.8; -moz-opacity: 0.8; box-shadow: 0px 1px 5px rgba(0,0,0,0.2); } /* PX Conversion */ /* PX Conversion */ .padding0 { padding: 0; } .padding10 { padding: 0.625rem; } .padding20 { padding: 1.250rem; } .padding30 { padding: 1.875rem; } .padding40 { padding: 2.500rem; } .padding50 { padding: 3.125rem; } .padding60 { padding: 3.75rem; } .padding70 { padding: 4.375em; } .padding80 { padding: 5.000em; } .padding90 { padding: 5.625em; } .padding100 { padding: 6.250em; } .padding110 { padding: 6.875em; } .padding120 { padding: 7.500em; } .padding130 { padding: 8.125em; } .padding140 { padding: 8.750em; } .padding150 { padding: 9.375em; } .padding160 { padding: 10.000em; } .padding170 { padding: 10.625em; } .padding180 { padding: 11.250em; } .padding10tb { padding: 0.625rem 0; } .padding20tb { padding: 1.250rem 0; } .padding30tb { padding: 1.875rem 0; } .padding40tb { padding: 2.500rem 0; } .padding50tb { padding: 3.125rem 0; } .padding60tb { padding: 3.75rem 0; } .padding70tb { padding: 4.375em 0; } .padding80tb { padding: 5.000em 0; } .padding90tb { padding: 5.625em 0; } .padding100tb { padding: 6.250em 0; } .padding110tb { padding: 6.875em 0; } .padding120tb { padding: 7.500em 0; } .padding130tb { padding: 8.125em 0; } .padding140tb { padding: 8.750em 0; } .padding150tb { padding: 9.375em 0; } .padding160tb { padding: 10.000em 0; } .padding170tb { padding: 10.625em 0; } .padding180tb { padding: 11.250em 0; } .padding10t { padding-top: 0.625rem; } .padding20t { padding-top: 1.250rem; } .padding30t { padding-top: 1.875rem; } .padding40t { padding-top: 2.500rem; } .padding50t { padding-top: 3.125rem; } .padding60t { padding-top: 3.75rem; } .padding70t { padding-top: 4.375em; } .padding80t { padding-top: 5.000em; } .padding90t { padding-top: 5.625em; } .padding100t { padding-top: 6.250em; } .padding110t { padding-top: 6.875em; } .padding120t { padding-top: 7.500em; } .padding130t { padding-top: 8.125em; } .padding140t { padding-top: 8.750em; } .padding150t { padding-top: 9.375em; } .padding160t { padding-top: 10.000em; } .padding170t { padding-top: 10.625em; } .padding180t { padding-top: 11.250em; } .padding10b { padding-bottom: 0.625rem } .padding20b { padding-bottom: 1.250rem; } .padding30b { padding-bottom: 1.875rem; } .padding40b { padding-bottom: 2.500rem; } .padding50b { padding-bottom: 3.125rem; } .padding60b { padding-bottom: 3.75rem; } .padding70b { padding-bottom: 4.375em; } .padding80b { padding-bottom: 5.000em; } .padding90b { padding-bottom: 5.625em; } .padding100b { padding-bottom: 6.250em; } .padding110b { padding-bottom: 6.875em; } .padding120b { padding-bottom: 7.500em; } .padding130b { padding-bottom: 8.125em; } .padding140b { padding-bottom: 8.750em; } .padding150b { padding-bottom: 9.375em; } .padding160b { padding-bottom: 10.000em; } .padding170b { padding-bottom: 10.625em; } .padding180b { padding-bottom: 11.250em; } .vertial-center { -webkit-box-align: center; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center; } /* -------------------------------------------------------------------------- $Typography -------------------------------------------------------------------------- */ /* Basic text */ p { font-family: 'Lato', sans-serif; } small {} strong {font-weight: bold; font-weight: 700; } em {} cite {} code {} pre {} sup, sub {position: relative; font-size: 75%; line-height: 0; vertical-align: baseline;} sup, sub { vertical-align: baseline; position: relative; top: -0.4em; } sub { top: 0.4em } /* Headings */ h1, h2, h3, h4, h5, h6 {font-family: 'Lato', sans-serif; color: #333; line-height: 1.625; margin: 1.65rem 0 1rem; background: none;} h1 a,h2 a,h3 a,h4 a,h5 a,h6 a { color: inherit; } h1 a:hover,h2 a:hover,a:hover h2,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover { text-decoration: none; } h1 { font-size: 3.375rem; line-height: 1.1; font-weight: 300;} h2 { font-size: 2.500rem; line-height: 1.2; font-weight: 300; color: #273c55;} h3 { font-size: 1.500rem; line-height: 1.3; font-weight: 700; color: #273c55; margin: 0 0 1rem;} h4 { font-size: 1.250rem; line-height: 1.4; font-weight: 700; color: #273c55;} h5 { font-size: 1.000rem; font-weight: 400; color: #666; text-transform: uppercase; margin: 30px 0 5px;} h6 { font-size: .875rem; font-weight: 700;} /* Typography > Paragraph */ p { margin: 0 0 1rem } p.lead { font-size: 1.313em; line-height: 27px; color: #333; } /* Lists */ ul, ol { margin: 0 0 1.25rem 1.75rem; padding: 0 0 0 1.5rem; } ul { list-style: disc } ol { list-style: decimal } /*checklist*/ ul.check-list { margin: 0 0 1.2500rem; list-style: none; } ul.check-list li { margin: 0 0 5px } ul.check-list li:before { font-family: "FontAwesome"; content: "\f00c"; margin-right: 10px; opacity: 0.8; } ul.unstyled, ol.unstyled {list-style: none;margin: 0;padding: 0;} /* Typography > Blockquote */ /* blockquote { background: url('//100330.fs1.hubspotusercontent-na1.net/hubfs/100330/Handwork_2015_Website/base/quote.png') left 4px no-repeat; padding-left: 55px; margin: 2.500rem 0; font-size: 1.231em; color: #ababab; } */ blockquote p:last-child { margin: 0 } blockquote.left { margin-right: 1.2500rem; text-align: right; margin-left: 0; width: 33%; float: left; } blockquote.right { margin-left: 1.2500rem; text-align: left; margin-right: 0; width: 33%; float: right; } q:before, q:after, blockquote:before, blockquote:after {} /* Typography > Address */ address { letter-spacing: 0.5px; margin: 1.2500rem 0; } /* Typography > Dropcaps */ .dropcap { display: block; float: left; margin-right: 10px; margin-bottom: 10px; font-size: 3.231em; line-height: 100%; } .dropcap.boxed { color: #fff; background: #000; padding: 5px 10px; } /* Rows */ .row-fluid [class*="span"] {min-height: 1px;} .row-fluid .widget-type-raw_jinja[class*="span"], .row-fluid .widget-type-raw_html[class*="span"] {min-height: 0;} img {max-width: 100% !important; height: auto; border: 0; -ms-interpolation-mode: bicubic; vertical-align: bottom;} /*-----------------------------------------------------------------------------------*/ /* $UI Elements /*-----------------------------------------------------------------------------------*/ /* Theme Button --------------------------------------------------------------*/ /* Theme Button */ .theme-button-wrapper { display: block; text-align: center; margin: 12px 0; } .theme-button { background: #00afe7; color: #fff; padding: .975rem 1.5rem; font-size: 1rem; font-weight: 700; text-transform: uppercase; border: none; transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; display: inline-block; } .theme-button:hover { background: #1a7de1; color: #fff; } .theme-button:focus { outline: none; } .theme-button-text { text-transform: uppercase; font-size: .95rem; font-weight: 700; display: inline-block; } .theme-button-text:after { content: '\f054'; font-family: "FontAwesome"; padding-left: 5px; margin-right: 10px; font-size: .875rem; } /* ========================================================================== 2. COS STRUCTURE ========================================================================== */ /* ========================================================================== Structure ========================================================================== */ /* The outer wrappers of your website */ .header-container-wrapper, .body-container-wrapper, .footer-container-wrapper {} /* The inner wrappers of your website */ .header-container, .body-container, .footer-container {} /* ========================================================================== Header ========================================================================== */ .header-container-wrapper {} .header-container {} /* Top Bar */ .top-bar { background: #273c55; color: #fff; } .top__bar__inner { text-align: right; } .top--bar--phone, .top--bar--social, .top--bar--search, .top--bar--quote { display: inline-block; } .top__bar__inner { float: right; } .top__bar__inner ul { list-style: none; margin: 0; padding: 0; } .top__bar__inner ul li { display: inline-block; font-size: 15px; } .top__bar__inner ul li a { color: #fff; display: inline-block; line-height: 27px; } .top__bar__inner ul li a:hover { background-color: #1a7de1; } .top__bar__menu__phone a { padding: 5px 1.2500rem 5px 1.2500rem; font-weight: 700; } .top__bar__menu__phone a:before { content: '\f095'; font-family: "FontAwesome"; padding-right: 10px; } .top--bar--social a { padding: 5px 3px; } .top__bar__menu__search a { padding: 5px 1.5000rem 5px 1.5000rem; line-height: 26px; } .top__bar__menu__quote { background: #00afe7; padding: 5px 15px; display: inline-block; font-weight: 700; } .top__bar__menu__schedule{ background: #0cc6cb; padding: 5px 15px; display: inline-block; font-weight: 700; } .top__bar__menu__signup { background: #73c167; padding: 5px 15px; display: inline-block; font-weight: 700; } .top--bar--social--mobile, .top--bar--search--mobile { display: none; } /*.hs-search-module {display: none;}*/ /* Header */ .nav { padding: 15px 0 0; background: rgba(255, 255, 255, .7); } /* Logo styling */ .header-container .hs_cos_wrapper_type_logo {} .header-container .hs_cos_wrapper_type_logo a {} .header-container .hs_cos_wrapper_type_logo a img { min-width: 200px; margin-top: -5px; } /* Main Menu */ .main-menu {} .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul { float: right; } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li a { overflow: inherit; max-width: none; text-transform: uppercase; } .main-menu li.hs-menu-item.hs-menu-depth-1.hs-item-has-children { padding-bottom: 15px; } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li:last-child a { padding-right: 0; } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts>ul li.hs-item-has-children ul.hs-menu-children-wrapper { top: 59px; } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts>ul li.hs-item-has-children:first-child ul.hs-menu-children-wrapper { left: 0px; } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { padding: 0.25rem 1.2500rem 0.25rem 1.2500rem; text-transform: none; font-weight: 400; width: auto; } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children:hover>ul.hs-menu-children-wrapper { opacity: 1; visibility: visible; background: rgba(255, 255, 255, .9); padding: 0.625rem 0; box-shadow: 0 5px 10px rgba(0,0,0,.3); } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a:hover { color: #1a7de1; } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children:nth-child(2)>ul.hs-menu-children-wrapper, .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children:nth-child(2):hover>ul.hs-menu-children-wrapper { width: auto; min-width: 490px; } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children:nth-child(2)>ul.hs-menu-children-wrapper li.hs-menu-item.hs-menu-depth-2, .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children:nth-child(2):hover>ul.hs-menu-children-wrapper li.hs-menu-item.hs-menu-depth-2 { float: left; width: 48%; -ms-flex: 1 1 50%; } .main-menu .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children a:after { content: '\f107'; font-family: "FontAwesome"; color: #999; padding-left: 5px; font-size: 13px; } .main-menu li.hs-menu-item.hs-menu-depth-2 a:after { display: none; } .main-menu ul li { position: relative; } .main-menu ul li:last-child {} .main-menu ul li a { font-size: 15px; font-weight: 700; color: #273c55; } .main-menu ul li a:hover { color: ; } .main-menu li.hs-menu-item.hs-menu-depth-1:first-child:before {} .main-menu li.hs-menu-item.hs-menu-depth-1:last-child:after {} .main-menu li.hs-menu-item:last-child a:before { content: ""; width: 10px; height: 100%; position: absolute; left: -5px; top: 0; } .main-menu li.hs-menu-item.hs-menu-depth-1.hs-item-has-children:last-child ul.hs-menu-children-wrapper { right: 0; left: initial; } /* Search */ #hs_cos_wrapper_google_search { display: inline-block; } #hs_cos_wrapper_google_search .input { padding-right: 0; } #hs_cos_wrapper_google_search .input input { margin-bottom: 0; border: 2px solid rgba(255,255,255,0); transition: .75s; -webkit-transition: .75s; padding: 0; width: 0; color: #fff; background: transparent; opacity: 0; font-size: 14px; } #hs_cos_wrapper_google_search .input input.open { width: 200px; border: 2px solid rgba(255,255,255,1); padding: 0 5px 2px; opacity: 1; height: 27px; } #hs_cos_wrapper_google_search .hs-button.primary { display: none; } /* SIDR */ .sidr { background: #273c55; font-family: 'Lato', sans-serif; } .sidr ul { margin: 0; } .sidr ul li { border-bottom: 1px solid rgba(255,255,255,.2); font-size: 1rem; font-weight: normal; text-transform: uppercase; } .sidr ul li a:hover { background: rgba(0,0,0,.2); color: #fff; } .sidr ul li ul li { font-size: .95rem; text-transform: none; } .sidr ul li ul li a, .sidr ul li ul li span { padding-left: 15px; } #sidr-main { -webkit-box-shadow: 0px 0 10px 0 rgba(0,0,0,.5); -moz-box-shadow: 0px 0 10px 0 rgba(0,0,0,.5); box-shadow: 0px 0 10px 0 rgba(0,0,0,.5); } .sidr-class-top--bar--search, .sidr-class-top--bar--social { display: none; } .sidr-class-top__bar__menu__phone a:before { content: '\f095'; font-family: "FontAwesome"; padding-right: 10px; } form.sidr-class-hs-form { margin: 0; } .sidr input[type="text"] { margin: 10px 0; color: #fff; font-size: 1.125rem; font-family: 'Lato', sans-serif; padding: 7px 10px 10px; } /* Placeholder Text */ form.sidr-class-hs-form ::-webkit-input-placeholder { /* Webkit Browsers */ color: #fff; opacity: 1; font-size: 1.125rem; } form.sidr-class-hs-form :-moz-placeholder { /* Firefox 18- */ color: #fff; opacity: 1; font-size: 1.125rem; } form.sidr-class-hs-form ::-moz-placeholder { /* Firefox 19+ */ color: #fff; opacity: 1; font-size: 1.125rem; } form.sidr-class-hs-form :-ms-input-placeholder { /* IE10 */ color: #fff; opacity: 1; font-size: 1.125rem; } .header-container-wrapper .header-container .sidr-wrap { display: none; } #header-sidr { position: relative; margin: 0; } #header-dropdown { position: absolute; right: 0; width: 225px; display: none; } div#header-dropdown ul li, ul.hs-menu-children-wrapper li, ul.hs-menu-children-wrapper li:last-child{ /*background: #f7f7f7; */ text-align: left; } /*ul.hs-menu-children-wrapper li { border-bottom: 1px solid #ccc; }*/ ul.hs-menu-children-wrapper li:last-child { border-bottom: none; } .main-menu li.hs-item-has-children ul.hs-menu-children-wrapper li:first-child a {} .main-menu li.hs-item-has-children ul.hs-menu-children-wrapper li:last-child a {} li.hs-item-has-children ul.hs-menu-children-wrapper li:last-child a:before { display: none; } div#header-dropdown ul li a:hover{ color: ; } div#header-dropdown ul li a, ul.hs-menu-children-wrapper li a { font-size: 1rem; } #header-dropdown ul li a { border: none; color: #fff; } .menu { height: 50px; width: 50px; position: absolute; right: 0; margin: auto; padding-top: 8px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s; cursor: pointer; } .bar { height: 4px; width: 35px; display: block; margin: 6px auto; position: relative; background-color: #273c55; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -moz-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; } body.sidr-open .menu .bar:nth-of-type(1) { -moz-transform: translateY(5px) rotate(45deg); -ms-transform: translateY(5px) rotate(45deg); -webkit-transform: translateY(5px) rotate(45deg); transform: translateY(5px) rotate(45deg); } body.sidr-open .menu .bar:nth-of-type(2) { opacity: 0; } body.sidr-open .menu .bar:nth-of-type(3) { -moz-transform: translateY(-15px) rotate(-45deg); -ms-transform: translateY(-15px) rotate(-45deg); -webkit-transform: translateY(-15px) rotate(-45deg); transform: translateY(-15px) rotate(-45deg); } .bar:nth-of-type(1) { -moz-animation: rotateR 1.5s cubic-bezier(0.5, 0.2, 0.2, 1); -webkit-animation: rotateR 1.5s cubic-bezier(0.5, 0.2, 0.2, 1); animation: rotateR 1.5s cubic-bezier(0.5, 0.2, 0.2, 1); } .bar:nth-of-type(2) { -moz-animation: fade 1.5s cubic-bezier(0.1, 0.8, 0.1, 1); -webkit-animation: fade 1.5s cubic-bezier(0.1, 0.8, 0.1, 1); animation: fade 1.5s cubic-bezier(0.1, 0.8, 0.1, 1); } .bar:nth-of-type(3) { -moz-animation: rotateL 1.5s cubic-bezier(0.5, 0.2, 0.2, 1); -webkit-animation: rotateL 1.5s cubic-bezier(0.5, 0.2, 0.2, 1); animation: rotateL 1.5s cubic-bezier(0.5, 0.2, 0.2, 1); } #sidr-main .mobile-icon { cursor: pointer; float: right; } #sidr-main .mobile-icon .fa { -moz-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; } #sidr-main .mobile-icon.open .fa { -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } #sidr-main .sidr-class-hs-menu-item.sidr-class-hs-menu-depth-1:hover .mobile-icon { color: ; } #sidr-main li.sidr-class-hs-menu-item.sidr-class-hs-menu-depth-2 .mobile-icon, #sidr-main li.sidr-class-hs-menu-item.sidr-class-hs-menu-depth-2 .mobile-icon.open { display: none; } #sidr-main ul.sidr-class-hs-menu-children-wrapper { display: none; } /* ========================================================================== Content ========================================================================== */ .body-container-wrapper {} .body-container {} /* Unique Pages ========================================================================== */ /* Homepage */ .header { width: 100%; min-height: 650px; z-index: 1; padding: 0; } .header .vidbg-container:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(255,255,255,.8) 30%, rgba(255,255,255,0.2) 100%); } .hero-text-wrap { margin: 108px 0; line-height: 1; } .hero__text { max-width: 55%; -webkit-font-smoothing: auto; } .hero__text h1 { line-height: 1; display: inline-block; -webkit-font-smoothing: auto; font-family: 'Lato', sans-serif; } .hero__text p { -webkit-font-smoothing: auto; font-weight: 400; line-height: 1.4; font-family: 'Lato', sans-serif; } .tabset--section.first a { color: #333; } .tabset--section a:hover { color: #00afe7; } .twitter-feed h3 { margin-bottom: 46px; } .twitter-feed h3:before { content:'\f099'; font-family: "FontAwesome"; padding-right: 7px; } .home-rss h3 { margin-bottom: 46px; } .home-rss h3:before { content:'\f09e'; font-family: "FontAwesome"; padding-right: 7px; } .home-rss .hs-rss-item.hs-with-featured-image { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: row-reverse; margin-bottom: 45px; } .home-rss .hs-rss-item.hs-with-featured-image:nth-child(3) { margin-bottom: 35px; } .home-rss .hs-rss-item.hs-with-featured-image .hs-rss-item-text { padding-right: 0; padding-left: 1.2500rem; line-height: 1.5; } .home-rss .hs-rss-title { color: #333; font-size: 1.2500rem; font-weight: 300; line-height: 1.625; } .home-rss .hs-rss-byline { opacity: 1; font-size: .875rem; color: #999; } .home-rss .hs-rss-item.hs-with-featured-image .hs-rss-item-image-wrapper .hs-rss-featured-image { width: 80px; height: 80px; } /* New Home Blog Feed */ .home-rss h3 { margin-bottom: 46px; } .home--blog--feed { margin-bottom: 28px; } .home--blog--feed:last-child { margin-bottom: 18px; } .home--blog--feed--img { width: 80px !important; max-width: 80px !important; min-height: 80px !important; max-height: 80px !important; background-size: cover; background-position: center center; background-repeat: no-repeat; } .home--blog--feed--title { font-size: 1.2500rem; font-weight: 300; line-height: 1.625; padding-right: 0; padding-left: 1.2500rem; } .home--blog--feed--title a { color: #333; } .home__blog__title { margin: 0; } .home__blog__date { font-size: .875rem; color: #999; } .knowledge-feed { background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; width: 100%; min-height: 250px; position: relative; } .knowledge--feed--wrap .row-fluid { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .knowledge__feed__block { display: -webkit-box !important; display: -moz-box !important; display: -ms-flexbox !important; display: -webkit-flex !important; display: flex !important; } .overlay { padding: 30px; height: 100%; width: 100%; position: absolute; } .overlay.case__study { background: rgba(74,130,67, .8); transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; } .overlay.white__paper { background: rgba(27,124,125, .8); transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; } .overlay.trend__report { background: rgba(27,91,130, .8); transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; } .overlay.webinar { background: rgba(35,112,78, .8); transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; } .knowledge-feed a:hover .overlay.case__study { background: rgba(37,65,33, .8); } .knowledge-feed a:hover .overlay.white__paper { background: rgba(13,62,62, .8); } .knowledge-feed a:hover .overlay.trend__report { background: rgba(13,45,65, .8); } .knowledge-feed a:hover .overlay.webinar { background: rgba(17,56,39, .8); } .feed__name { position: absolute; top: 10px; left: -5px; font-size: .875rem; text-transform: uppercase; padding: 5px 1.250rem; font-weight: 900; } .feed__name.case__study { background: #72c267; } .feed__name.white__paper { background: #0cc6cb; } .feed__name.trend__report { background: #0095e2; } .feed__name.webinar { background: #22d185; } /* Modular & Reusable Components ========================================================================== */ /* Callouts */ /* Social Media Custom Icons */ /* Subpage Header */ .subpage-header { position: relative; width: 100%; min-height: 500px; z-index: 1; padding: 0; } .subpage-header:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(255,255,255,.8) 30%, rgba(255,255,255,0.2) 100%); } .subpage--hero--text--wrap { margin: 103px 0; line-height: 1; } .subpage__hero__text { max-width: 55%; -webkit-font-smoothing: auto; } .subpage__hero__text h1 { line-height: 1; display: inline-block; -webkit-font-smoothing: auto; font-family: 'Lato', sans-serif; } .subpage__hero__text p { -webkit-font-smoothing: auto; font-weight: 400; line-height: 1.4; font-family: 'Lato', sans-serif; } /* Homepage Testimonials */ .testimonial--container { width: 100%; height: auto; position: relative; overflow: hidden; display: -webkit-tab-container; display: -webkit-flex; display: -ms-flextab-container; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; } .testimonial--nav { position: absolute; bottom: 0; display: block; width: 100%; max-height: 100px; text-align: center; background: rgba(0,0,0,.7); } .testimonial--nav--item--wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding-left: 1.2500rem; padding-right: 1.2500rem; } .testimonial--nav--item { padding: 0 15px 0; margin: 0 1.2500rem 0 0; width: auto; text-align: center; cursor: pointer; display: inline-flex; display: -ms-inline-flexbox; min-height: 100px; max-width: 16.75%; align-items: middle; font-weight: 400; } .testimonial--nav--item:nth-child(5) { margin: 0; } .testimonial--nav--item img { opacity: .5; } .testimonial--nav--item.-is--active img { opacity: 1; } .testimonial--content { position: relative; width: 500%; -webkit-tab-container-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; display: -webkit-tab-container; display: -webkit-flex; display: -ms-flextab-container; display: flex; -webkit-tab-container-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-tab-container-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-transition: 0.3s; transition: 0.3s; } [data-active-tab="testimonial-tab-1"] { left: 0; } [data-active-tab="testimonial-tab-2"] { left: -100%; } [data-active-tab="testimonial-tab-3"] { left: -200%; } [data-active-tab="testimonial-tab-4"] { left: -300%; } [data-active-tab="testimonial-tab-5"] { left: -400%; } .testimonial--section { width: 100%; min-height: 700px; text-align: center; background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; position: relative; } .testimonial__section__overlay { background: rgba(64,64,64,0.6); width: 100%; height: 100%; position: absolute; } .testimonial--active--tab__marker { width: 0; height: 0; border-left: 1.2500rem solid transparent; border-right: 1.2500rem solid transparent; border-bottom: 1.2500rem solid rgba(0,0,0,.7); position: relative; bottom: 128px; -webkit-transition: 0.24s; transition: 0.24s; } .testimonial--nav--item:nth-of-type(1).-is--active ~ .testimonial--active--tab__marker { /*left: 17%;*/ left: 10.5%; } .testimonial--nav--item:nth-of-type(2).-is--active ~ .testimonial--active--tab__marker { /*left: 33.5%;*/ left: 29.5%; } .testimonial--nav--item:nth-of-type(3).-is--active ~ .testimonial--active--tab__marker { /*left: 48.5%;*/ left: 48%; } .testimonial--nav--item:nth-of-type(4).-is--active ~ .testimonial--active--tab__marker { /*left: 64%;*/ left: 66.5%; } .testimonial--nav--item:nth-of-type(5).-is--active ~ .testimonial--active--tab__marker { /*left: 80%;*/ left: 86%; } .testimonial__caption { width: 100%; max-width: 62%; height: 100%; margin: 0 auto; position: relative; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; justify-content: center; padding: 10% 0 15%; } .testimonial__quote { font-size: 2.25rem; font-weight: 400; text-align: center; color: #fff; line-height: 1.25; margin-bottom: 1.2500rem; } .testimonial__quotee { font-size: 1.125rem; font-weight: 300; text-align: center; color: #fff; line-height: 1.25; } .testimonial__quote__icon { margin-bottom: 1.2500rem; } .testimonial__logo__mobile { display: none; } .testimonial--nav--mobile--next { display: none; position: absolute; bottom: 1.250rem; font-size: 24px; right: 40px; } .testimonial--nav--mobile--previous { display: none; position: absolute; bottom: 1.250rem; font-size: 24px; left: 40px; } .testimonial__mobile__next, .testimonial__mobile__previous { color: #fff; cursor: pointer; } /* Subpage Testimonials */ .subpage--testimonial--container { width: 100%; height: auto; position: relative; overflow: hidden; display: -webkit-tab-container; display: -webkit-flex; display: -ms-flextab-container; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; } .subpage--testimonial--nav { position: absolute; bottom: 0; display: block; width: 100%; max-height: 100px; text-align: center; background: rgba(0,0,0,.7); } .subpage--testimonial--nav--item--wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding-left: 1.2500rem; padding-right: 1.2500rem; } .subpage--testimonial--nav--item { padding: 0 15px 0; margin: 0 1.2500rem 0 0; width: auto; text-align: center; cursor: pointer; display: -webkit-inline-flex; display: inline-flex; display: -ms-inline-flexbox; min-height: 100px; max-width: 16.75%; align-items: middle; font-weight: 400; } .subpage--testimonial--nav--item:nth-child(5) { margin: 0; } .subpage--testimonial--nav--item img { opacity: .5; } .subpage--testimonial--nav--item.-is--active img { opacity: 1; } .subpage--testimonial--content { position: relative; width: 300%; -webkit-tab-container-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; display: -webkit-tab-container; display: -webkit-flex; display: -ms-flextab-container; display: flex; -webkit-tab-container-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-tab-container-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-transition: 0.3s; transition: 0.3s; } [data-active-tab="testimonial-tab-1"] { left: 0; } [data-active-tab="testimonial-tab-2"] { left: -100%; } [data-active-tab="testimonial-tab-3"] { left: -200%; } .subpage--testimonial--section { width: 100%; min-height: 600px; text-align: center; background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; position: relative; } .subpage__testimonial__section__overlay { background: rgba(64,64,64,0.6); width: 100%; height: 100%; position: absolute; } .subpage--testimonial--active--tab__marker { width: 0; height: 0; border-left: 1.2500rem solid transparent; border-right: 1.2500rem solid transparent; border-bottom: 1.2500rem solid rgba(0,0,0,.7); position: relative; bottom: 128px; -webkit-transition: 0.24s; transition: 0.24s; } .subpage--testimonial--nav--item:nth-of-type(1).-is--active ~ .subpage--testimonial--active--tab__marker { /*left: 17%;*/ left: 28.5%; } .subpage--testimonial--nav--item:nth-of-type(2).-is--active ~ .subpage--testimonial--active--tab__marker { /*left: 33.5%;*/ left: 47.5%; } .subpage--testimonial--nav--item:nth-of-type(3).-is--active ~ .subpage--testimonial--active--tab__marker { /*left: 48.5%;*/ left: 66.25%; } .subpage__testimonial__caption { width: 100%; max-width: 62%; height: 100%; margin: 0 auto; position: relative; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; justify-content: center; padding: 10% 0 15%; } .subpage__testimonial__quote { font-size: 2.25rem; font-weight: 400; text-align: center; color: #fff; line-height: 1.25; margin-bottom: 1.2500rem; } .subpage__testimonial__quotee { font-size: 1.125rem; font-weight: 300; text-align: center; color: #fff; line-height: 1.25; } .subpage__testimonial__quote__icon { margin-bottom: 1.2500rem; } .subpage__testimonial__logo__mobile { display: none; } .subpage--testimonial--nav--mobile--next { display: none; position: absolute; bottom: 1.250rem; font-size: 24px; right: 40px; } .subpage--testimonial--nav--mobile--previous { display: none; position: absolute; bottom: 1.250rem; font-size: 24px; left: 40px; } .subpage__testimonial__mobile__next, .subpage__testimonial__mobile__previous { color: #fff; cursor: pointer; } /* Tabs */ .tab-container { width: 100%; min-height: 645px; overflow: hidden; display: -webkit-tab-container; display: -webkit-flex; display: -ms-flextab-container; display: flex; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; flex-flow: column wrap; } .tabset--nav { position: relative; display: block; width: 100%; text-align: center; } .tab--nav--item { padding: 10px 15px 5px; margin: 0 1.2500rem 0 0; width: auto; text-align: center; cursor: pointer; display: inline-block; } .tab--nav--item:nth-child(3) { margin: 0; } .tab--nav--item.-is--active { border-bottom: 3px solid #00afe7; } .tabset--content { position: relative; width: 300%; -webkit-tab-container-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; display: -webkit-tab-container; display: -webkit-flex; display: -ms-flextab-container; display: flex; -webkit-tab-container-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-tab-container-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-transition: 0.3s; transition: 0.3s; } [data-active-tab="tab-1"] { left: 0; } [data-active-tab="tab-2"] { left: -100%; } [data-active-tab="tab-3"] { left: -200%; } .tabset--section { width: 100%; padding-top: 2em; margin-left: 2.3%; display: flex; display: -webkit-flex; display: -ms-flexbox; } .tabset--section a { white-space: nowrap; } /* Keeps text in tabbed sections lined up with text in page-center elements */ .tabset--content .tabset--section { margin-left: calc((34% - 1200px)/2); } .tabset--section:nth-child(1) .tab__left__column { padding-top: 45px; } .tabset--section:nth-child(3) .tab__right__column { background-position: 18%; } .span6.tab__inner__left { width: 45%; } .span6.tab__inner__right { width: 45%; margin-left: 7%; } .tab__right__content p { margin: 0 0 15px; } .tab__right__column { background-size: cover !important; background-repeat: no-repeat !important; } /* Feature Box */ .feature-box-content-left, .feature-box-content-right { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .feature-box-content-left .span6.content { padding: 40px 4% 40px 0; } .feature-box-content-right .span6.content { padding: 40px 0 40px 4%; } .feature-box-content-left .span6.content .content-inner, .feature-box-content-right .span6.content .content-inner { max-width: 540px; } .feature-box-content-left .span6.content .content-inner { float: right; } .feature-box .span6 { /*background-size: cover !important;*/ background-position: center !important; background-repeat: no-repeat !important; /*background-size: cover !important;*/ margin: 0; width: 50%; } .feature-box-content-left .span6.background-image { margin-left: 0; } .feature-box-content-left { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .feature-box-content-right { display: none; } .feature-box .change-layout .feature-box-content-right { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .feature-box .change-layout .feature-box-content-left { display: none; } /* Feature Box with Slideshow */ .feature-box.with-slideshow.vertical-center .feature-box-content-left, .feature-box.with-slideshow .feature-box-content-right { -webkit-box-align: center; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center; } .feature-box.with-slideshow .slick-initialized .slick-slide { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } @media (min-width: 768px) and (max-width: 1220px) { .feature-box-content-left .span6.content { padding: 40px 4% 40px; } .feature-box-content-right .span6.content { padding: 40px 4% 40px; } } @media (max-width: 767px) { .feature-box-content-right {display: block;} .feature-box-content-left {flex-direction: column-reverse; -ms-flex-direction: column-reverse; -webkit-flex-direction: column-reverse;} .feature-box-content-right {display: none;} .feature-box .change-layout .feature-box-content-right {display: block;} .feature-box .change-layout .feature-box-content-left {display: none;} .feature-box-content-right .span6.content, .feature-box-content-left .span6.content {padding: 20px 20px 0;} .feature-box .span6 {width: 100%; padding: 0 1.250rem;} .feature-box-content-left .feature-box .span6 {float: left;} .feature-box .span6.background-image {min-height: 350px;} .feature-box .upsell-icon {display: none;} .feature-box-content-left .span6.content .content-inner {float: none;} } @media (max-width: 479px) { .feature-box .span6.background-image {min-height: 250px; margin-top: 0;} .feature-box-content-right .span6.content, .feature-box-content-left .span6.content {padding: 15px 20px 0;} } /* ========================================================================== Footer ========================================================================== */ .footer-container-wrapper { background: #e6e6e6; padding: 35px 0 65px; } .footer-container {} .footer, .footer a { font-size: 1rem; color: #666; line-height: 1.5; } .footer a:hover { color: #1a7de1; } .footer svg#siemens__logo, .footer svg#modern__healthcare { max-width: 195px; } .modern__healthcare path, .footer .modern__healthcare .st0, .footer .modern__healthcare .st1 { fill: #999 !important; background-color: #999 !important; } .footer svg#modern__healthcare { position: relative; top: 10px; } .copyright, .copyright a { font-size: .875rem; color: #999; } .footer__social { margin: 0 0 25px; padding: 0; } .footer__social li { display: inline-block; padding-right: 1.125rem; } .footer__social li:last-child { padding-right: 0; } .footer__social li a { font-size: 1.2500rem; color: #999; } .footer__blog__subscribe__text p { margin-bottom: 0; font-size: 1rem; } .footer__blog__subscribe label { display: none; } .footer__blog__subscribe .input { width: 65%; float: left; } .footer__blog__subscribe input[type="email"] { border: none; border-radius: 0; padding: 14px 16px; font-size: 1rem; } .footer__blog__subscribe input[type="email"]:focus { outline: none; border: none; } .footer__blog__subscribe .hs_submit { width: 35%; float: left; } .footer__blog__subscribe .hs-button.primary { -webkit-appearance: none; background: #00afe7; color: #fff; padding: .875rem 0; font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 700; text-transform: uppercase; border: none; border-radius: 0; transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; width: 100%; } .footer__blog__subscribe .hs-button.primary:hover { background: #1a7de1; } .footer__blog__subscribe .hs-button.primary:focus { outline: none; } /* Placeholder Text */ .footer__blog__subscribe ::-webkit-input-placeholder { /* Webkit Browsers */ color: #999; opacity: 1; font-size: 1rem; } .footer__blog__subscribe :-moz-placeholder { /* Firefox 18- */ color: #999; opacity: 1; font-size: 1rem; } .footer__blog__subscribe ::-moz-placeholder { /* Firefox 19+ */ color: #999; opacity: 1; font-size: 1rem; } .footer__blog__subscribe :-ms-input-placeholder { /* IE10 */ color: #999; opacity: 1; font-size: 1rem; } /* ========================================================================== 3. MAIN NAVIGATION ========================================================================== */ /* ========================================================================== Custom Menu Primary ========================================================================== */ /* Set ul background color */ /* Set li background Color */ /* Set link Color */ /* Set link Hover Color */ /* Parent List */ .custom-menu-primary .hs-menu-wrapper > ul{ background:; } .custom-menu-primary .hs-menu-wrapper > ul > li{ background:; } .custom-menu-primary .hs-menu-wrapper > ul > li > a{ color:; } .custom-menu-primary .hs-menu-wrapper > ul > li > a:hover{ color:; } /* Child List */ .custom-menu-primary .hs-menu-wrapper > ul ul{} .custom-menu-primary .hs-menu-wrapper > ul ul li{ background:; } .custom-menu-primary .hs-menu-wrapper > ul ul li a{ color:; } .custom-menu-primary .hs-menu-wrapper > ul ul li a:hover{ color:; } /* Override max width on menu links */ .custom-menu-primary .hs-menu-wrapper > ul li a, .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { overflow: visible !important; max-width: none !important; width: auto !important; } /* Fix menu disappearing on desktop after toggling mobile menu */ @media screen and (min-width:768px) { .custom-menu-primary .hs-menu-wrapper { display:block !important; } } /* ========================================================================== Mobile Menu - Hubspot Standard Toggle Menu ========================================================================== */ /** * Special Note * * When the menu is open, a class of .mobile-open is applied to the body. You can * use this for custom styling on any element when the menu is in the open position. */ .mobile-trigger, .child-trigger{ display: none; /* Hide button on Desktop */ } @media (max-width: 767px){ /* Variables ========================================================================== */ /* Set Mobile Menu Background Color */ /* Set Link Color */ /* Set Link Hover Color */ /* * Menu Reset * * Remove styling from desktop version of custom-menu-primary. Place any * additional CSS you want removed from the mobile menu in this reset */ .custom-menu-primary, .custom-menu-primary .hs-menu-wrapper > ul, .custom-menu-primary .hs-menu-wrapper > ul li, .custom-menu-primary .hs-menu-wrapper > ul li a{ display: block; float: none; position: static; top: auto; right: auto; left: auto; bottom: auto; padding: 0px; margin: 0px; background-image: none; background-color: transparent; border: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; max-width: none; width: 100%; height: auto; line-height: 1; font-weight: normal; text-decoration: none; text-indent: 0px; text-align: left; color:#ffffff; } /* Toggle Button ========================================================================== */ .mobile-trigger{ display: inline-block !important; /* Show button on mobile */ cursor: pointer; /* Mouse pointer type on hover */ position: absolute; /*******************************************/ top: 0px; /* Position Button at right of screen */ right: 10px; /*******************************************/ width: auto; /* Button width */ height: auto; /* Button height */ padding: 7px 10px 8px 10px; background: #ffffff; /* Background color */ border: 1px solid #000000; font-size: 1rem; font-weight: normal; text-align: left; text-transform: uppercase; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; color: #000000; } .mobile-trigger:hover{ text-decoration: none; /* Removes link text underline on button */ color:#ffffff; background-color: #000000; border-color: transparent; } /* Change button when menu is open */ .mobile-open .mobile-trigger{ color:#ffffff; background-color: #000000; border-color: transparent; } /* Toggle Button Icon ========================================================================== */ .mobile-trigger i{ display: inline; position: relative; top: -4px; } .mobile-trigger i:before, .mobile-trigger i:after{ position: absolute; content: ''; } .mobile-trigger i, .mobile-trigger i:before, .mobile-trigger i:after{ width: 22px; /* Icon line width */ height: 2px; /* Icon line height */ -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; background-color: #000000; /* Icon color */ display: inline-block; } .mobile-trigger i:before{ top: -6px; /* Position top line */ } .mobile-trigger i:after{ top: 6px; /* Position bottom line */ } .mobile-trigger:hover i, .mobile-trigger:hover i:before, .mobile-trigger:hover i:after, .mobile-open .mobile-trigger i, .mobile-open .mobile-trigger i:before, .mobile-open .mobile-trigger i:after{ background-color: #ffffff; /* Icon color */ } /* Child Toggle Button ========================================================================== */ .child-trigger{ display: block !important; /* Hide button on Desktop */ cursor: pointer; /* Mouse pointer type on hover */ position: absolute; top: 0px; right: 0px; width: 55px !important; /* Button width */ min-width: 55px !important; height: 45px !important; /* Button height */ padding: 0 !important; border-left: 1px dotted rgba(255, 255, 255, .20); } .child-trigger:hover{ text-decoration: none; } .child-trigger i{ position: relative; top: 50%; /* Centers icon inside button */ margin: 0 auto !important; } .child-trigger i:after{ position: absolute; content: ''; } .child-trigger i, .child-trigger i:after{ width: 10px; /* Icon line width */ height: 1px; /* Icon line height */ background-color:#ffffff; /* Icon color */ display: block; } .child-trigger i:after{ -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } .child-trigger.child-open i:after{ -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); } .child-trigger.child-open i{ -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } /* Menu Styles on Mobile Devices ========================================================================== */ .custom-menu-primary.js-enabled{ position: relative; padding-top: 44px; /* Makes room for button */ margin: 10px 0 10px 0; } /* Hide menu on mobile */ .custom-menu-primary.js-enabled .hs-menu-wrapper, .custom-menu-primary.js-enabled .hs-menu-children-wrapper{ display: none; } /* Make child lists appear below parent items */ .custom-menu-primary ul.hs-menu-children-wrapper{ visibility: visible !important; opacity: 1 !important; position: static !important; display: none; } /* Mobile Menu Styles */ .custom-menu-primary.js-enabled .hs-menu-wrapper{ width: 100%; position: relative; /**************************************************************/ top: 0; /* Positions the menu to drop from the very top of the screen */ left: 0; /**************************************************************/ padding: 0; } .custom-menu-primary .hs-menu-wrapper{ background-color:#000000; /* Menu background color set off global menuColorMobile variable */ width: 100%; /* Full screen width */ } /* Level 1 Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul > li{ position: relative; } .custom-menu-primary .hs-menu-wrapper > ul > li a{ font-size: 22px; /* Font size of top level list items */ line-height: 45px; overflow: visible; } /* Level 1 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul li{ border-top: 1px dotted rgba(255, 255, 255, .35); /* Adds transparent dark highlights to top of top level list items */ } .custom-menu-primary .hs-menu-wrapper > ul li a{ padding: 0 10px; color:#ffffff; /* link color set by global mobile-aColor variable */ } .custom-menu-primary .hs-menu-wrapper > ul li a:hover{ color:#ffffff; /* link hover color set by global mobile-aColorHover variable */ } /* Level 2 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul ul li{ background-color: rgba(255, 255, 255, .08); } .custom-menu-primary .hs-menu-wrapper > ul ul li a{ text-indent: 10px; /* Indent Child lists */ font-size: 1rem; /* Font size of child lists */ } /* Level 3 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul ul ul li a{ text-indent: 30px; /* Indent Child lists */ } .custom-menu-primary .hs-menu-wrapper > ul ul ul ul li a{ text-indent: 50px; /* Indent Child lists */ } } /* ========================================================================== 4. TEMPLATE MODULE SELECTORS ========================================================================== */ /* Common Template Selectors ========================================================================== */ body.one-column {} body.two-column {} body.three-column {} .content-wrapper {} .main-content {} .sidebar{} .sidebar.right{} .sidebar.left{} /* Common One Column Selectors */ body.site-page.one-column, body.landing-page.one-column, body.error-template.one-column, body.password-template.one-column, body.subscription-template.one-column {} body.site-page.one-column .main-content, body.landing-page.one-column .main-content, body.error-template .main-content, body.password-template .main-content, body.subscription-template .main-content {} /* Common Two Column Selectors */ body.site-page.two-column, body.landing-page.two-column, body.blog {} body.site-page.two-column .main-content, body.landing-page.two-column .main-content, body.blog .blog-content {} /* Common Three Column Selectors */ body.site-page.three-column, body.landing-page.three-column {} body.site-page.three-column .main-content, body.landing-page.three-column .main-content {} /* Site Pages ========================================================================== */ /* Main Products Listing --------------------------------------------------------------*/ .products-feature-box-content-left, .products-feature-box-content-right { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .products-feature-box-content-left .span6.content, .products-feature-box-content-right .span6.content { padding: 30px 0 1.250rem 4%; } .products-feature-box-content-left .span6.content .content-inner, .products-feature-box-content-right .span6.content .content-inner { max-width: 540px; } .products-feature-box-content-left .span6.content .content-inner { float: right; } .products-feature-box .span6 { background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; margin: 0; width: 50%; } .products-feature-box-content-left .span6.background-image { margin-left: 0; } .products-feature-box-content-left { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .products-feature-box-content-right { display: none; } .products-feature-box .change-layout .products-feature-box-content-right { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .products-feature-box .change-layout .products-feature-box-content-left { display: none; } .products-feature-box h2 { margin: 0 0 1rem; } .products-feature-box ul { padding: 0 0 0 1.5rem; margin: 0 0 1rem 1.875rem; } .product-links a { color: #333; white-space: normal; } .product-links a:hover { color: #00afe7; } .product--dropdown--mobile { display: none; } .products--article { background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; min-height: 220px; width: auto; position: relative; } .products--article--overlay { padding: 30px 15px !important; position: absolute; height: 100%; background: rgba(51,51,51, 0.85); -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out; width: 100%; } .products--article--overlay h5 { text-transform: none; font-weight: 400; line-height: 1.4; } .products__article__name { position: absolute; top: 10px; left: -5px; font-size: .875rem; text-transform: uppercase; padding: 5px 1.250rem !important; font-weight: 900; } .products__article__name.case__study { background: #72c267; } .products__article__name.white__paper { background: #0cc6cb; } .products__article__name.trend__report { background: #0095e2; } .products__article__name.white__paper { background: #0cc6cb; } .products__article__name.webinar { background: #22d185; } .payment--options .feature-box-content-right { position: relative; } .payment--options .feature-box-content-right .span6.background-image { background-position: bottom center !important; background-size: auto !important; } #site-planning .feature-box-content-left .span6.content { padding: 40px 4% 40px; } @media (max-width: 850px) { .product-links { display: none; } .product--dropdown--mobile { display: block; text-align: center; } .product--dropdown--mobile .sorting .sod_select { max-width: 300px; margin-right: 0; } } @media (max-width: 767px) { .products-feature-box-content-left, .products-feature-box-content-right { display: block; } .products-feature-box-content-left { display: block; } .products-feature-box-content-right { display: none; } .products-feature-box .change-layout .products-feature-box-content-right { display: block; } .products-feature-box .change-layout .products-feature-box-content-left { display: none; } .products-feature-box-content-left .span6.content { padding: 0 4% 20px; } .products-feature-box-content-right .span6.content { padding: 20px 4% 0; } .products-feature-box .span6 { width: 100%; padding: 0 1.250rem; } .products-feature-box-content-left .products-feature-box .span6 { float: left; } .products-feature-box .span6.background-image { min-height: 230px; } .products-feature-box .upsell-icon { display: none; } .products-feature-box-content-left .span6.content .content-inner { float: none; } .products-feature-box.padding20tb { padding: .675rem 0; } .product-links { max-width: 75%; margin: 0 auto; } .product-links .span3 { width: 48% !important; float: left !important; } .product-links .span3:nth-child(2n + 1) { margin-left: 0; } } @media (max-width: 700px) { .product-links { max-width: 85%; } } @media (max-width: 600px) { .product-links { max-width: 100%; } } @media (max-width: 500px) { .product-links .span3 { width: 100% !important; float: none !important; } } /* Product Subpage with Gallery --------------------------------------------------------------*/ .product--gallery .slick-track { margin: 0 auto; } .product--gallery .hs_cos_gallery_lightbox_thumbnails .hs_cos_gallery_slide .slick-slide-inner-wrapper img { width: 100%; } .product--gallery .hs_cos_gallery_lightbox_thumbnails .hs_cos_gallery_slide:first-child .slick-slide-inner-wrapper img { margin-left: 0; } .product--gallery .hs_cos_gallery_lightbox_thumbnails .hs_cos_gallery_slide:last-child .slick-slide-inner-wrapper img { margin-right: 0; } .slick-prev, .slick-next { height: 60px; width: 60px; z-index: 1; } .slick-prev:before, .slick-next:before { font-size: 30px; } .hs_cos_gallery_lightbox .slick-prev { left: 3%; } .hs_cos_gallery_lightbox .slick-next { right: 3%; } .product--gallery .slick-slide div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } /* About --------------------------------------------------------------*/ .about--feature--img--left .feature-box .span6 { background-position: left center !important; background-size: cover !important; } .about--feature--img--right .feature-box .span6 { background-position: right center !important; background-size: cover !important; } /* Find A Rep --------------------------------------------------------------*/ #Container{ margin: 0 auto 50px; height: inherit !important; } .account--execs .span12.widget-span.widget-type-raw_jinja { display: -webkit-flex; display: -ms-flexbox; display: flex; flex-wrap: wrap; -ms-flex-wrap: wrap; } #Container .mix { display: none; } #grid .mix { display: none; opacity: 0; } .rep-item { width: 23.076923077%; position: unset !important; display: none; float: left; margin: 0 0.9615384615% 1.250rem; text-align: center; } .rep-item h3 { margin: 1rem 0 0; } .rep-item h5 { margin: 0 0 0.5rem; line-height: 1.4; } .rep-item p.phone { margin: 0; } .rep-item p { line-height: 1.4; margin-bottom: 0.5rem; } .rep-item img { position: relative; border-radius: 100%; } .rep-address{ margin: 1.250rem 0; } .rep-title { font-size: 16px; position: absolute; margin: 0; left: 0px; top: 0px; padding: 5px 10px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; transition: all 0.3s ease-out;; } .rep-image:hover .rep-title{ left:-11px; } .rep-image:hover.image-frame{ -webkit-box-shadow: 0 2px 6px rgba(31,41,51,0.5);; -moz-box-shadow: 0 2px 6px rgba(31,41,51,0.5);; -o-box-shadow: 0 2px 6px rgba(31,41,51,0.5);; -ms-box-shadow: 0 2px 6px rgba(31,41,51,0.5);; box-shadow: 0 2px 6px rgba(31,41,51,0.5);; } .find-a-rep__holder div.cell-wrapper { text-align: center; position: relative; } .mobile-map-blocker { position: absolute; width: 100%; height: 100%; z-index: -5; } .find-a-rep__map { max-width: 800px; max-height: 635px; width: 100%; } .state-item { display: none; } .state-item h2 { margin: 0; } .state-item h4 { margin-top: 0; } path.filter:hover { cursor: pointer; } path.filter.cls-3:hover, path.filter.cls-3.hover { fill: #0f6baa; } path.filter.cls-6:hover, path.filter.cls-6.hover { fill: #a2e899; } path.filter.cls-1:hover, path.filter.cls-1.hover { fill: #6dd1f2; } .tooltip-content { padding: 5px 10px; text-transform: uppercase; background-color: rgba(195, 218, 234, 0.9); color: #353533; font-weight: bold; font-size: 0.875rem; cursor: pointer; } #state-select { width: auto; } .state-select__wrapper { text-align: center; } .state-select__wrapper .sod_select .sod_option.active { color: #666; } .sorting .state-select__wrapper .sod_select .sod_label { text-transform: none; font-weight: 300; font-size: 1rem; } .sorting .state-select__wrapper .sod_select { margin-right: 0; max-width: 380px; } .state-select__wrapper .sod_select.above .sod_list_wrapper { border: 1px solid #ccc; } #tip-id-path { margin-top: 70px; display: block; } #tip-tx-path { margin-left: 40px; display: block; } .state-select__wrapper .sod_select:after { bottom: 18px !important; } /* Contact Us --------------------------------------------------------------*/ ul.tabs { margin: 0; padding: 0; /*float: left;*/ list-style: none; width: 100%; } ul.tabs li { display: inline-block; margin: 0; cursor: pointer; padding: 3px 1% 0; line-height: 34px; background-color: #fff; color: #333; font-family: 'Lato', sans-serif; font-size: 1.125rem; font-weight: 400; overflow: hidden; position: relative; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border-bottom: 3px solid transparent; } .tab_last {} ul.tabs li:hover {} ul.tabs li.active { color: #333; display: inline-block; border-bottom: 3px solid #00afe7; } ul.external--url--tabs { margin: 0; padding: 0; /*float: left;*/ list-style: none; width: 100%; } ul.external--url--tabs li { display: inline-block; margin: 0; cursor: pointer; padding: 3px 1% 0; line-height: 34px; background-color: #fff; color: #333; font-family: 'Lato', sans-serif; font-size: 1.125rem; font-weight: 400; overflow: hidden; position: relative; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } ul.external--url--tabs li a { color: #333; } ul.external--url--tabs li:hover {} .tab--container--wrap { background-color: #e5e5e5; } .tabs--wrap { text-align: center; } .tab_container { border-top: none; clear: both; float: left; width: 100%; color: #333; font-family: 'Lato', sans-serif; overflow: auto; } .tab_content { background: transparent; display: none; padding: 1.250rem 20px; } .tab__image img { border: 3px solid #ddd; border-radius: 5px; } .tab_drawer_heading { display: none; } /* Hide Select Box */ .form-select__wrapper { display: none; visibility: hidden; } #contact-forms .sorting .sod_select { margin-right: 0; } @media screen and (max-width: 767px) { .tabs { display: none; } .form-select__wrapper { display: block; visibility: visible; } .tab_drawer_heading { display: none; } } /* Subpage Forms */ .subpage--form legend.hs-field-desc { display: none !important; } .subpage--form li.hs-form-checkbox { display: inline-block; padding-right: 10px; } @media (max-width: 575px) { .subpage--form li.hs-form-checkbox { display: block; padding-right: 0; } } /* One Column Template */ body.site-page.one-column {} body.site-page.one-column .content-wrapper {} body.site-page.one-column .main-content {} /* Two Column Template */ body.site-page.two-column {} body.site-page.two-column .content-wrapper {} body.site-page.two-column .main-content {} body.site-page.two-column .sidebar.right {} /* Three Column Template */ body.site-page.three-column {} body.site-page.three-column .content-wrapper {} body.site-page.three-column .main-content {} /* Landing Pages ========================================================================== */ /* Cassling Landing Page --------------------------------------------------------------*/ .landing--page--header { background: #273c55; } .landing--page--heading h1 { line-height: 1; } .landing--page--topic--name { font-size: .875rem; text-transform: uppercase; padding: .313rem 1.25rem; font-weight: 900; display: inline-block; } .landing--page--topic--name.no-label { display: none; } .landing--page--topic--name.case-study { background: #72c267; } .landing--page--topic--name.trend-report { background: #0095e2; } .landing--page--topic--name.white-paper { background: #0cc6cb; } .landing--page--topic--name.webinar { background: #22d185; } .landing--page--topic--name.e-book { background: #6efdbf; } .landing--page--topic--name.podcast { background: #666666; } .hs-landing-page .footer-container-wrapper { padding-bottom: 1rem; } .landing--page--footer h3 { margin-top: 0; } .landing--page--footer--siemens img { max-width: 15.625rem !important; } .landing--page--offer--image img { max-width: 250px !important; } /* Form */ .landing--page--form h3 { margin-bottom: 1.75rem; } .landing--page--form .hs-form fieldset[class*="form-columns"] .hs-input { margin-bottom: 1.250rem; } /*.landing--page--form label { display: none; }*/ .landing--page--form .hs-form-booleancheckbox label { display: block; color: #333 !important; } .landing--page--form ul.hs-error-msgs.inputs-list label { display: block; position: relative; bottom: 10px; } .landing--page--form .hbspt-form .hs-field-desc { margin-bottom: 5px; } .landing--page--form .hbspt-form .hs_state_.field.hs-form-field .hs-field-desc { display: none !important; } .hs-form .sod_select { margin-left: 0; margin-bottom: 1.250rem; width: 100%; background: #fff; border: none; height: auto; font-size: 1.125rem; font-weight: 400; color: #666; padding: .563rem .375rem; border: 1px solid #ddd; } .hs-form .sod_select.focus { box-shadow: none; } .hs-form .sod_select .sod_label { white-space: inherit; line-height: 1.25; } .hs-form .sod_select:before { display: none; } .hs-form .sod_select:after { content: '\f107'; font-family: "FontAwesome"; font-size: 1rem; bottom: .625rem; } .hs-form .sod_select .sod_list_wrapper { width: 100.5%; border: 1px solid #ccc; } .hs-form .sod_select .sod_list { background: #fff; max-height: 200px; overflow-y: scroll; } .hs-form .sod_select .sod_option { color: #666; font-size: 1rem; } .hs-form .sod_select .sod_option.active { background: rgba(0,175,231,.25); cursor: pointer; } .hs-form .sod_select .sod_option.selected:before { display: none; } /* Cassling LP with Video BG Hero --------------------------------------------------------------*/ .lp-video-bg-header { width: 100%; min-height: 450px; z-index: 1; padding: 0; } .video-bg-lp .hero-text-wrap { margin: 0; } .video-bg-lp h2 { margin-top: 0; } .video-bg-lp .fse-video-row h4, .video-bg-lp .fse-video-row h5 { margin: 0; } .video-bg-lp .hs-input { margin-bottom: 20px; } .video-bg-lp label { display: none; } .video-bg-lp .hs-error-msgs label { display: block; } .video-bg-lp form.hs-form .hs-form-field ul.hs-error-msgs.inputs-list { margin: -10px 0 10px;; } /* Responsive Video */ .videoWrapper, .hs-responsive-embed { position: relative; width: 100%; padding-top: 56%; margin-bottom: 20px; } .videoWrapper_ins { padding-top: 0!important; position: static; } .videoWrapper iframe, .hs-responsive-embed iframe{ width: 100%; height: 100%; display: block; position: absolute; margin: 0; top: 0; left: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: none; } /* Footer Social */ .lp-footer-social-header { display: inline-block; margin: 0; } .lp-footer-social-sharing { padding: 0; margin: 0 0 0 1.125rem; list-style: none; display: inline-block; } .lp-footer-social-sharing li { display: inline-block; margin-right: 10px; } .lp-footer-social-sharing li:last-child { margin-right: 0; } @media (max-width: 767px) { .video-bg-lp .featured-fse .span6 { width: 48.93617020799999%; float: left; } .video-bg-lp .featured-fse .span6:last-child { margin-left: 2.127659574%; } .video-bg-lp .featured-fse .span4 { margin: 30px 0 0; } .video-bg-lp .landing--page--footer--siemens { margin-top: 20px; } } @media (max-width: 545px) { .video-bg-lp .featured-fse .span6 { width: 100%; float: none; } .video-bg-lp .featured-fse .span6:last-child { margin-left: 0; margin-top: 30px; } } @media (max-width: 375px) { .lp-footer-social-header { display: block; margin-bottom: 5px; } .lp-footer-social-sharing { display: block; margin: 0; } } /* Cassling Thank You Page --------------------------------------------------------------*/ /* Header & Hero */ .noHero .thank--you--header, .noHero .thank--you--header .header--overlay{ min-height: inherit; } .thank--you--header { width: 100%; min-height: 500px; z-index: 1; padding: 0; } .thank--you--header .header--overlay { min-height: 500px; } .thank--you--header .header--overlay.case-study { background: rgba(74,130,67, .8); } .thank--you--header .header--overlay.white-paper { background: rgba(27,124,125, .8); } .thank--you--header .header--overlay.trend-report { background: rgba(27,91,130, .8); } .thank--you--header .header--overlay.webinar { background: rgba(35,112,78, .8); } .thank--you--header .header--overlay.e-book { background: rgba(91,210,158, .8); } .thank--you--header .header--overlay.podcast { background: rgba(102,102,102, .8); } .thank--you--hero--text--wrap { margin: 95px 0 45px; line-height: 1; text-align: center; } .thank--you--post--topic { text-transform: uppercase; border: 1px solid #fff; padding: 5px 10px; display: inline; font-size: .875rem; color: #fff; } .thank__you__hero__text { -webkit-font-smoothing: auto; font-size: 1rem; } .thank__you__hero__text h1 { margin: 2.25rem 0 1.5rem; color: #fff; font-weight: 300; } /* Topics */ .topics--label { text-align: center; text-transform: uppercase; margin: 1.65rem 0 .5rem; } .topics--list { text-align: center; text-transform: uppercase; font-weight: 700; font-size: 1rem; margin: 0 0 .5rem; } /* Social Sharing */ .social--share--label { margin-top: .25rem; text-align: center; text-transform: uppercase; } .social--wrap { text-align: center; } .social--wrap a { display:inline-block; width: auto !important; margin-right: 5px; text-align:center; font-size:18px; vertical-align:middle; text-decoration:none; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease; } .social--wrap a:before { font-family:'FontAwesome'; color:#00afe7; } .social--wrap a:last-child { margin-right:0; } .social--wrap a img { display:none; } .social--wrap a[href*="facebook"]:before { content:"\f082"; } .social--wrap a[href*="twitter"]:before { content:"\f099"; } .social--wrap a[href*="linkedin"]:before { content:"\f0e1"; } .social--wrap a[href*="plus.google"]:before { content:"\f0d5"; display: none; } .social--wrap a[href*="pinterest"]:before { content:"\f0d2"; } .social--wrap a[href*="email"]:before { content:"\f0e0"; } .social--wrap a:hover:before { background:none!important; border:none!important; color: #1a7de1; } .social--wrap a[href*="twitter"]:hover {} .social--wrap a[href*="facebook"]:hover {} .social--wrap a[href*="linkedin"]:hover {} .social--wrap a[href*="google"]:hover {} .social--wrap a[href*="pinterest"]:hover {} .social--wrap a[href*="email"]:hover {} /* PDF Download Button */ .thank--you--content .theme-button { padding: .625rem 2.188rem; margin-bottom: 2.938rem; } .theme-button.pdf:before { content: '\f1c1'; font-family: "FontAwesome"; padding-right: .313rem; } /* Seminar Agenda Table */ .seminar--agenda--time { margin: 0; } .seminar__agenda__event__title { margin: 0 0 5px; font-weight: 400; } .seminar__agenda__event__title.two { margin: 10px 0 5px; } .seminar__agenda__event__title.three { margin: 10px 0 5px; } .seminar__agenda__event__title.four { margin: 10px 0 5px; } .seminar__agenda__event__title.five { margin: 10px 0 5px; } @media (max-width: 810px) { } @media (max-width: 767px) { .thank__you__hero__text h1, .landing--page--heading h1 { font-size: 3rem; } .landing--page--quote { padding-top: 3.75rem; } .landing--page--footer--siemens { padding-bottom: 1.250rem; } .seminar--agenda--time { margin: 0 0 5px; } } @media (max-width: 479px) { .thank__you__hero__text h1, .landing--page--heading h1 { font-size: 2.5rem; } } /* One Column Template */ body.landing-page.one-column {} body.landing-page.one-column .content-wrapper {} body.landing-page.one-column .main-content {} /* Two Column Template */ body.landing-page.two-column {} body.landing-page.two-column .content-wrapper {} body.landing-page.two-column .main-content {} body.landing-page.two-column .sidebar.right {} /* Three Column Template */ body.landing-page.three-column {} body.landing-page.three-column .content-wrapper {} body.landing-page.three-column .main-content {} /* System Pages ========================================================================== */ /* Error Templates 404, 500 */ body.error-template.one-column {} body.error-template.one-column .content-wrapper {} body.error-template.one-column .main-content {} /* Password template */ body.password-template.one-column {} body.password-template.one-column .content-wrapper {} body.password-template.one-column .main-content {} /* Email Subscribition templates */ body.subscription-template.one-column {} body.subscription-template.one-column .content-wrapper {} body.subscription-template.one-column .main-content {} .subscription-template .header { min-height: 0; } /* ========================================================================== 5. COS COMPONENTS ========================================================================== */ /* ========================================================================== Blog ========================================================================== */ .blog--header { position: absolute; top: 0; left: 0; width: 100% !important; z-index: 2; } .blog--header--bg { width: 100%; min-height: 500px; z-index: 1; padding: 0; position: relative; background-repeat: no-repeat; background-size: cover; background-position: center center; } .blog--hero--text--wrap { margin: 240px 0 0; line-height: 1; } .blog__hero__text { max-width: 45%; -webkit-font-smoothing: auto; } .blog__hero__text h1 { text-shadow: 0 0 10px #FFF, 0 0 15px #FFF, 0 0 1.250rem #FFF, 0 0 25px #FFF, 0 0 30px #FFF; display: inline-block; background: rgba(255,255,255,.47); -webkit-box-shadow: 0 0 45px 1.250rem rgba(255,255,255,.5); -moz-box-shadow: 0 0 45px 1.250rem rgba(255,255,255,.5); box-shadow: 0 0 45px 1.250rem rgba(255,255,255,.5); margin: 0 0 1rem; } .blog__hero__text p { text-shadow: 0 0 10px #FFF, 0 0 15px #FFF, 0 0 1.250rem #FFF, 0 0 25px #FFF, 0 0 30px #FFF; background: rgba(255,255,255,.47); -webkit-box-shadow: 0 0 45px 1.250rem rgba(255,255,255,.5); -moz-box-shadow: 0 0 45px 1.250rem rgba(255,255,255,.5); box-shadow: 0 0 45px 1.250rem rgba(255,255,255,.5); -webkit-font-smoothing: auto; font-weight: 400; line-height: 1.4; } /* Listing Page */ .blog-listing-wrapper .span4.custom-post-item:nth-child(3n + 1) { margin-left: 0; } .knowledge-center_listing { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -ms-flex-line-pack:start; align-content:flex-start; margin: 0 auto; } .knowledge-center_listing:after { content: ''; -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; width: calc(33.3% - 20px); display: inline-block; } .knowledge-center_item { width: calc(33.3% - 20px); } /* .knowledge-center_item:nth-child(3n) { margin-right: 0; } */ /* .blog-listing-wrapper .span4.visible { margin-left: 0 !important; } .blog-listing-wrapper .span4.visible:nth-of-type(2) { margin-left: 2.564102564% !important; } .blog-listing-wrapper .span4.visible:nth-of-type(3n) { margin-left: 2.564102564% !important; } .blog-listing-wrapper .span4.visible:nth-of-type(4n) { margin-left: 2.564102564% !important; } */ .knowledge--center { background-size: cover !important; background-position: center center; background-repeat: no-repeat !important; min-height: 250px; width: auto; position: relative; } .knowledge--center.hs-featured-image-link img.hs-featured-image { border-width: 0; max-height: none; max-width: 100%; height: 0; width: 100%; display: inline-block !important; float: right; margin: 0; -ms-filter: "alpha(opacity=0)"; filter: alpha(opacity=0); opacity: 0; } .knowledge--center--overlay { padding: 40px 30px 30px; position: absolute; height: 100%; width: 100%; transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; background: rgba(29, 109, 135, 0.9); } .knowledge--center--overlay.blog { background: rgba(29,109,135, .85); } .knowledge--center:hover .knowledge--center--overlay.blog { background: rgba(14,54,67, .8); } .knowledge--center--overlay.news { background: rgba(43,94,142, .8); } .knowledge--center:hover .knowledge--center--overlay.news { background: rgba(21,47,71, .8); } .knowledge--center--overlay.case-study { background: rgba(74,130,67, .8); } .knowledge--center:hover .knowledge--center--overlay.case-study { background: rgba(37,65,33, .8); } .knowledge--center--overlay.white-paper { background: rgba(27,124,125, .8); } .knowledge--center:hover .knowledge--center--overlay.white-paper { background: rgba(13,62,62, .8); } .knowledge--center--overlay.trend-report { background: rgba(27,91,130, .8); } .knowledge--center:hover .knowledge--center--overlay.trend-report { background: rgba(13,45,65, .8); } .knowledge--center--overlay.webinar { background: rgba(35,112,78, .8); } .knowledge--center:hover .knowledge--center--overlay.webinar { background: rgba(17,56,39, .8); } .knowledge--center--overlay.other { background: rgba(39,60,85, .8); } .knowledge--center:hover .knowledge--center--overlay.other { background: rgba(13,45,65, .8); } .knowledge--center--overlay.e-book { background: rgba(91,210,158, .8); } .knowledge--center--overlay.podcast{ background: rgba(102,102,102, .8); } .knowledge--center:hover .knowledge--center--overlay.e-book { background: rgba(36,86,65, .8); } .knowledge--center:hover .knowledge--center--overlay.podcast { background: rgba(40,40,40, .8); } .topic--name { position: absolute; top: 10px; left: -5px; font-size: .875rem; text-transform: uppercase; padding: 5px 1.250rem; font-weight: 900; } .topic--name.blog { background: #1a7de1; } .topic--name.news { background: #00afe7; } .topic--name.case-study { background: #72c267; } .topic--name.trend-report { background: #0095e2; } .topic--name.white-paper { background: #0cc6cb; } .topic--name.webinar { background: #22d185; } .topic--name.e-book { background: #6efdbf; } .topic--name.podcast { background: #666666; } .topic--name.other { display: none; background: #273c55; } /* Sorting & Search Filter */ .sorting .sod_select { width: 100%; margin-left: 0; margin-right: 18px; padding: 15px; border: 1px solid #ccc; box-shadow: none; } .sorting .sod_select:before { display: none; } .sorting .sod_select:after { font-family: "FontAwesome"; content: '\f078'; color: #666; } .sorting .sod_select .sod_label { text-transform: uppercase; font-family: 'Lato', sans-serif; color: #666; font-size: .875rem; font-weight: normal; } .sorting .sod_select .sod_list { background: #fff; max-height: 290px; overflow-y: scroll; } .sorting .sod_select .sod_list_wrapper { width: 100.5%; border: 1px solid #ccc; } .sorting .sod_select .sod_option { color: #666; font-size: 1rem; } .sorting .sod_select .sod_option.selected { font-weight: 400; } .sorting .sod_select .sod_option.selected:before { display: none; } .sorting .sod_select .sod_option.active { background: rgba(0,175,231,.25); cursor: pointer; } .blog.hs_cos_wrapper_type_google_search { width: 100%; } .sorting .hs-input { padding: 14px; font-size: .875rem; text-transform: none; font-weight: 700; color: #666; } .sorting input[type="text"] { border-color: #ccc; height: 47px; font-size: .875rem !important; font-weight: 700 !important; padding: 12px 36px 12px 14px; } .sorting input[type="text"]:focus { outline: none; box-shadow: none; border: 1px solid #ccc; } .sorting .hs-form ::-webkit-input-placeholder { color: #666; } /* Firefox 18- */ .sorting .hs-form :-moz-placeholder { color: #666; } /* Firefox 19+ */ .sorting .hs-form ::-moz-placeholder { color: #666; } .sorting .hs-form :-ms-input-placeholder { color: #666; } .sorting .hs-button.primary { display: none; } .sorting .input { position: relative; } .sorting .input:after { font-family: "FontAwesome"; content: '\f002'; position: absolute; right: 10px; top: 14px; font-size: .75rem; color: #666; } /* Blog and News */ .topics, .social-row { font-size: 1rem; } .blog--news--content h4 { margin: 0 0 1.5rem; } .blog--news--content .author-link, .blog--news--topic--link { font-weight: 500; font-size: 1rem; font-family: 'Lato', sans-serif; } .span12.custom-post-item.blog, .span12.custom-post-item.news { display: -webkit-flex; display: flex; -webkit-flex: 1 1 100%; flex: 1 1 100%; -ms-flexbox: 1 1 100%; margin-left: 0; } /*.author-link { text-transform: uppercase; }*/ .span12.custom-post-item.blog .knowledge--center, .span12.custom-post-item.news .knowledge--center { background-position: center center !important; background-size: cover !important; background-repeat: no-repeat !important; } .knowledge--center .hs-featured-image-link { width: 100%; height: 100%; opacity: 0; } .author--wrap { margin-top: 23px; } .span12.custom-post-item.blog img.hs-featured-image, .span12.custom-post-item.news img.hs-featured-image { display: none; } .span6.blog--news--content h3 { margin: .75rem 0 1rem } /* Post Template */ .blog--post--header--gradient { position: absolute; width: 100%; height: 100%; z-index: -1; } .blog--post--header--gradient.blog { background: rgba(29,109,135, .85); } .blog--post--header--gradient.news { background: rgba(43,94,142, .8); } .blog--post--header--gradient.case-study { background: rgba(74,130,67, .8); } .blog--post--header--gradient.trend-report { background: rgba(27,91,130, .8); } .blog--post--header--gradient.white-paper { background: rgba(27,124,125, .8); } .blog--post--header--gradient.webinar { background: rgba(35,112,78, .8); } .blog--post--header--gradient.other { background: rgba(39,60,85, .8); } .blog--post--header--gradient.e-book { background: rgba(91,210,158, .8); } .blog--post--header--gradient.podcast { background: rgba(102,102,102, .8); } .blog--post--hero--text--wrap { margin: 207px 0 80px; line-height: 1; text-align: center; } .blog__post__hero__text { -webkit-font-smoothing: auto; font-size: 1rem; } .blog__post__hero__text h1 { margin: 2.25rem 0 1.5rem; } .post--topic { text-transform: uppercase; border: 1px solid #fff; padding: 5px 10px; display: inline; font-size: .875rem; font-weight: 700; } /*.author-link { font-size: 1rem; font-weight: 500; }*/ .topics { text-align: center; text-transform: uppercase; } .topics p { margin: 0 0 .5rem; } .topic-link { font-weight: 700; } .social-row { margin-top: 1.75rem; text-align: center; text-transform: uppercase; } .social-row p { margin: 0 0 .5rem; } .span6.next { text-align: right; } /* Blog Post Social Sharing */ .blog-post-wrapper .social-wrap a { display: inline-block; text-align: center; width: auto !important; font-size: 18px; vertical-align: middle; text-decoration: none; margin-right: 5px; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } .blog-post-wrapper .social-wrap a:before { font-family: 'FontAwesome'; color: #00afe7; font-size: inherit; text-decoration: none; display: inline-block; border: none; text-rendering: auto; -webkit-font-smoothing: antialiased; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } .blog-post-wrapper .social-wrap a:last-child { margin-right: 0; } .blog-post-wrapper .social-wrap a img { display: none; } .blog-post-wrapper .social-wrap a[href*="facebook"]:before { content: "\f082"; } .blog-post-wrapper .social-wrap a[href*="twitter"]:before { content: "\f099"; } .blog-post-wrapper .social-wrap a[href*="linkedin"]:before { content: "\f0e1"; } .blog-post-wrapper .social-wrap a[href*="plus.google"]:before { content: "\f0d5"; display: none; } .blog-post-wrapper .social-wrap a[href*="plus.google"] { display: none; } .blog-post-wrapper .social-wrap a[href*="pinterest"]:before { content: "\f0d2"; } .blog-post-wrapper .social-wrap a[href*="email"]:before { content: "\f0e0"; } .blog-post-wrapper .social-wrap a:hover:before { background: none; border: none !important; color: #1a7de1; } .blog-post-wrapper .social-wrap a[href*="twitter"]:hover {} .blog-post-wrapper .social-wrap a[href*="facebook"]:hover {} .blog-post-wrapper .social-wrap a[href*="linkedin"]:hover {} .blog-post-wrapper .social-wrap a[href*="google"]:hover {} .blog-post-wrapper .social-wrap a[href*="pinterest"]:hover {} .blog-post-wrapper .social-wrap a[href*="email"]:hover {} .blog-post-wrapper .social-share-link.post-bottom { text-align: left; font-weight: 600; font-size: 1.125rem; } .blog-post-wrapper .social-links-wrap.post-bottom { text-align: left; } .blog-post-wrapper .social-links-wrap.post-bottom a:before { font-family: 'FontAwesome'; font-size: 1.25rem; text-decoration: none; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; border: none; color: #fff; width: 36px; height: 36px; line-height: 36px; opacity: .7; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; transition: all .3s ease-in-out;; } .blog-post-wrapper .social-links-wrap.post-bottom a[href*="facebook"]:before {content: "\f09a"; background-color: #3b5998;} .blog-post-wrapper .social-links-wrap.post-bottom a[href*="rss"]:before {content: "\f09e"; background-color: #ff6600;} .blog-post-wrapper .social-links-wrap.post-bottom a[href*="twitter"]:before {content: "\f099"; background-color: #55acee;} .blog-post-wrapper .social-links-wrap.post-bottom a[href*="linkedin"]:before {content: "\f0e1"; background-color: #007bb5;} .blog-post-wrapper .social-links-wrap.post-bottom a[href*="plus.google"]:before {content: "\f0d5"; background-color: #dd4b39; display: none;} .blog-post-wrapper .social-links-wrap.post-bottom a[href*="pinterest"]:before {content: "\f0d2"; background-color: #cb2027;} .blog-post-wrapper .social-links-wrap.post-bottom a[href*="email"]:before {content: "\f0e0"; background-color: #666;} .blog-post-wrapper .social-links-wrap.post-bottom a:hover:before {opacity: 1;} /* Blog Post and Listing Body Class */ body.blog {} /* Blog Post */ body.hs-blog-post {} .hs_recaptcha.hs-recaptcha.field.hs-form-field { margin-bottom: 20px; } .post-body h2 { font-size: 1.3rem; font-weight: 700; line-height: 1.625; } /* Blog Listing */ body.hs-blog-listing {} /* Blog Columns Wrapper */ .blog .content-wrapper {} /* Blog Content Column ========================================================================== */ .blog .blog-content {} /* Use this to style the main wrapper for the blog listing pages */ .blog-listing-wrapper {} /* Use this to style the main wrapper for the blog post pages */ .blog-post-wrapper {} /* Blog Title */ .hs-blog-header h1 {} .hs-blog-header h1 a{} /* Blog Post Title */ .post-header h2 {} .post-header h2 a {} /* Blog Author and Avatar */ #hubspot-author_data {} #hubspot-author_data a.author-link {} #hubspot-author_data .hs-author-avatar {} #hubspot-author_data .hs-author-avatar img {} /* Use this to set up different styling for your blog posts */ .blog-listing-wrapper .post-listing .post-item {} .blog-listing-wrapper .post-listing .post-item .post-body {} .blog-post-wrapper .post-body {} /* Post Featured Image on Listings Page */ .hs-featured-image-wrapper {} .hs-featured-image-wrapper .hs-featured-image-link {} .hs-featured-image-wrapper .hs-featured-image-link img.hs-featured-image{} /* Read More Link */ a.more-link {} /* Blog Topics List */ #hubspot-topic_data {} #hubspot-topic_data a.topic-link {} /** * Blog Social Sharing icons * * Overrides defaults to better align icons and prevent overlapping */ .hs-blog-social-share { padding: 10px 0 0 0; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; height: auto; } /** * Blog Commments * * Custom styles are listed below, as the COS does not provide default styles. */ #comments-listing { border-bottom: 1px solid #ccc; margin-bottom: 30px; margin-top: 30px; } .comment { margin: 10px 0; border-top: 1px solid #ccc; padding: 25px 0; } .comment-date { float: right; color: #aaa !important; font-weight: 700; font-size: .875rem; } .comment-from { font-weight: bold; } .comment-from h4 { color: #333; font-size: 1.125rem; font-weight: 700; margin-top: 0; } .comment-body { color: #333; padding: 0; } #comments-listing.no-comments { border-bottom: none; } .new-comments .hs-button.primary { background: #00afe7; color: #fff; padding: .975rem 1.5rem; font-size: 1rem; font-weight: 700; font-family: 'Lato', sans-serif; text-transform: uppercase; border: none; transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; display: inline-block; } .new-comments .hs-button.primary:hover { background: #1a7de1; } .new-comments .hs-button.primary:focus { outline: none; } .comments form.hs-form fieldset[class*="form-columns"] .hs-input {] border: 1px solid #ddd; } .comment-reply-to { color: #00afe7 !important; font-size: 1rem; background: none !important; padding-left: 0 !important; transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; } .comment-reply-to:before { font-family: 'FontAwesome'; content:'\f112'; padding-right: 5px; } .comment-reply-to em { font-style: normal; } .comment-reply-to:hover { cursor: pointer; color: #1a7de1 !important; } .comments .section.post-footer { padding-top: 0; } .comments .comment.depth-0:first-child { border-top: none; padding-top: 0; } .comments .hs_comment.field.hs-form-field, .comments .hs_subscribe.field.hs-form-field { margin-bottom: 0; } .comments ul.hs-error-msgs.inputs-list label { display: block; font-size: 14px; color: red; } .comments form.hs-form .hs-form-field ul.inputs-list { top: 0; margin-left: 0; margin-bottom: .75rem; } .comments form.hs-form .hs-form-field ul.inputs-list input { margin-right: 10px; } .comments .hs-form h3 { margin-bottom: 1.75rem; } .comments .hs-form ::-webkit-input-placeholder { color: #666; } /* Firefox 18- */ .comments .hs-form :-moz-placeholder { color: #666; } /* Firefox 19+ */ .comments .hs-form ::-moz-placeholder { color: #666; } .comments .hs-form :-ms-input-placeholder { color: #666; } .comments label { display: none; } .comments .hs_subscribe.field.hs-form-field label { display: block; font-size: 14px; margin-top: 10px; } .comments input { margin-bottom: 12px; } .comments .hs-form textarea { min-height: 100px; } /* Pagination */ .blog-pagination {} .blog-pagination a { font-weight: 700; text-transform: uppercase; font-size: 1rem; } .blog-pagination a.previous-posts-link {} .blog-pagination a.all-posts-link {} .blog-pagination a.next-posts-link {} .blog-pagination .span6.next { text-align: right; } .blog-pagination .previous-posts-link .fa, .blog-pagination .next-posts-link .fa { font-size: .875rem; } /** * Blog Author Page * * ALWAYS be sure to set styles to these selectors, as the COS does not provide default styles */ .author--wrapper { background: #eeeeee; margin-top: 50px; } .author-name .fa { font-size: .875rem; } .hs-author-profile {} .hs-author-profile h2.hs-author-name {} .hs-author-profile .hs-author-bio {} .hs-author-profile .hs-author-avatar {} .hs-author-profile .hs-author-avatar img {} h3.hs-author-listing-header {} /** * Blog All Posts Page * * ALWAYS be sure to set styles to these selectors, as the COS does not provide default styles */ body.hs-content-path-blog-all {} div.post-listing-simple {} div.post-listing-simple .post-item {} h2.post-listing-simple {} h2.post-listing-simple a {} /* Blog Sidebar ========================================================================== */ .blog .blog-sidebar {} /* Blog Modules */ .blog .blog-sidebar .widget-span {} /* ========================================================================== Forms ========================================================================== */ /* All Global Forms ========================================================================== */ /* Form Field */ body .hs-form-field {} /* Descriptions */ body .hs-field-desc {} /* Labels */ body label {} body .hs-form-field > label { font-size: .875rem; font-weight: 700; } /* One Line Inputs */ body input[type="text"], body input[type="password"], body input[type="datetime"], body input[type="datetime-local"], body input[type="date"], body input[type="month"], body input[type="time"], body input[type="week"], body input[type="number"], body input[type="email"], body input[type="url"], body input[type="search"], body input[type="tel"], body input[type="color"], body input[type="file"], body textarea, body select { width: 100%; font-family: 'Lato', sans-serif; font-size: 1.125rem; color: #333; margin-bottom: 10px; border: 1px solid #ddd; } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 47px; background: transparent; border-radius: 0; padding-right: 0; background: #fff; background-position:right 50%; background-repeat:no-repeat; background-image:url(//208414.fs1.hubspotusercontent-na1.net/hubfs/208414/images/dropdown-arrow-856466-edited.png); background-size: 1.25rem; padding: 12px 36px 12px 14px; font-size: .875rem !important; text-transform: none; color: #666 !important; font-weight: 700 !important; } form select { font-size: 1.125rem!important; font-weight: normal!important; padding-top: 6px; padding-bottom: 6px; height: auto; } body input[type="file"] { border: none; margin: 10px 0 15px; } body input[type="text"]:focus, body input[type="password"]:focus, body input[type="datetime"]:focus, body input[type="datetime-local"]:focus, body input[type="date"]:focus, body input[type="month"]:focus, body input[type="time"]:focus, body input[type="week"]:focus, body input[type="number"]:focus, body input[type="email"]:focus, body input[type="url"]:focus, body input[type="search"]:focus, body input[type="tel"]:focus, body input[type="color"]:focus, body input[type="file"]:focus, body textarea:focus, body select:focus { box-shadow: none; outline: none; border: 1px solid #00afe7; } /* Separate Styles for Multiple Line Inputs */ body textarea {min-height: 100px;} body textarea:focus {} /* Separate Styles for Drop Downs */ /*body select { -moz-appearance: none; -webkit-appearance: none; appearance: none; height: 37px; border-radius: 0; }*/ body select:focus {} /* Multiple Selection Inputs */ body form.hs-form .hs-form-field ul.inputs-list { list-style: none; padding: 0; margin: 0 0 5px; font-size: .875rem; } body form.hs-form .hs-form-field ul.hs-error-msgs.inputs-list {color: red; margin-top: 10px;} body form.hs-form .hs-form-field ul.inputs-list li input {} body input[type="radio"] {} body .hs-form-radio label, body .hs-form-checkbox label { display: block; color: #333; font-family: 'Lato', sans-serif; font-size: 1.125rem; } body .hs-form-checkbox label span { padding-left: 5px; position: relative; top: 2px; } body label.hs-form-radio-display { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } body .hs-form-radio label span { padding-left: 5px; } body label.hs-form-radio-display input[type="radio"] { width: 20px !important; height: 20px !important; margin: 0 !important; } body input[type="checkbox"] {} .hs-form-booleancheckbox label { display: block; color: #333 !important; } body .hs-form-radio:last-child, body .hs-form-checkbox:last-child { margin-bottom: 20px; } /* Required */ body input:focus:required:invalid, body textarea:focus:required:invalid, body select:focus:required:invalid {} body input:focus:required:invalid:focus, body textarea:focus:required:invalid:focus, body select:focus:required:invalid:focus {} /* Placeholder Text */ ::-webkit-input-placeholder { /* Webkit Browsers */ color: #666; opacity: 1; } :-moz-placeholder { /* Firefox 18- */ color: #666; opacity: 1; } ::-moz-placeholder { /* Firefox 19+ */ color: #666; opacity: 1; } :-ms-input-placeholder { /* IE10 */ color: #666; opacity: 1; } .hbspt-form .sod_select { margin-left: 0; margin-bottom: 10px; width: 100%; background: #fff; height: auto; font-size: 1.125rem; font-weight: 400; color: #666; padding: 6px; border: 1px solid #ddd; } .hbspt-form .sod_select.focus { box-shadow: none; } .hbspt-form .sod_select .sod_label { white-space: inherit; line-height: 1.25; } .hbspt-form .sod_select:before { display: none; } .hbspt-form .sod_select:after { content: '\f107'; font-family: "FontAwesome"; font-size: 1rem; bottom: 10px; } .hbspt-form .sod_select .sod_list_wrapper { width: 100.5%; border: 1px solid #ccc; } .hbspt-form .sod_select .sod_list { background: #fff; max-height: 200px; overflow-y: scroll; } .hbspt-form .sod_select .sod_option { color: #666; font-size: 1rem; } .hbspt-form .sod_select .sod_option.active { background: rgba(0,175,231,.25); cursor: pointer; } .hbspt-form .sod_select .sod_option.selected:before { display: none; } /* Form Module ========================================================================== */ /* Form Field */ .hs_cos_wrapper_type_form .hs-form-field {} /* Descriptions */ .hs_cos_wrapper_type_form .hs-field-desc {} /* Labels */ .hs_cos_wrapper_type_form label {} .hs_cos_wrapper_type_form .hs-form-field > label {} /* One Line Inputs */ .hs_cos_wrapper_type_form input[type="text"], .hs_cos_wrapper_type_form input[type="password"], .hs_cos_wrapper_type_form input[type="datetime"], .hs_cos_wrapper_type_form input[type="datetime-local"], .hs_cos_wrapper_type_form input[type="date"], .hs_cos_wrapper_type_form input[type="month"], .hs_cos_wrapper_type_form input[type="time"], .hs_cos_wrapper_type_form input[type="week"], .hs_cos_wrapper_type_form input[type="number"], .hs_cos_wrapper_type_form input[type="email"], .hs_cos_wrapper_type_form input[type="url"], .hs_cos_wrapper_type_form input[type="search"], .hs_cos_wrapper_type_form input[type="tel"], .hs_cos_wrapper_type_form input[type="color"], .hs_cos_wrapper_type_form input[type="file"], .hs_cos_wrapper_type_form textarea, .hs_cos_wrapper_type_form select {} .hs_cos_wrapper_type_form input[type="text"]:focus, .hs_cos_wrapper_type_form input[type="password"]:focus, .hs_cos_wrapper_type_form input[type="datetime"]:focus, .hs_cos_wrapper_type_form input[type="datetime-local"]:focus, .hs_cos_wrapper_type_form input[type="date"]:focus, .hs_cos_wrapper_type_form input[type="month"]:focus, .hs_cos_wrapper_type_form input[type="time"]:focus, .hs_cos_wrapper_type_form input[type="week"]:focus, .hs_cos_wrapper_type_form input[type="number"]:focus, .hs_cos_wrapper_type_form input[type="email"]:focus, .hs_cos_wrapper_type_form input[type="url"]:focus, .hs_cos_wrapper_type_form input[type="search"]:focus, .hs_cos_wrapper_type_form input[type="tel"]:focus, .hs_cos_wrapper_type_form input[type="color"]:focus, .hs_cos_wrapper_type_form input[type="file"]:focus, .hs_cos_wrapper_type_form textarea:focus, .hs_cos_wrapper_type_form select:focus {} /* Separate Styles for Multiple Line Inputs */ .hs_cos_wrapper_type_form textarea {} .hs_cos_wrapper_type_form textarea:focus {} /* Separate Styles for Drop Downs */ .hs_cos_wrapper_type_form select {} .hs_cos_wrapper_type_form select:focus {} /* Multiple Selection Inputs */ .hs_cos_wrapper_type_form form.hs-form .hs-form-field ul.inputs-list li input {} .hs_cos_wrapper_type_form input[type="radio"] {} .hs_cos_wrapper_type_form input[type="checkbox"] {} /* Centered Form */ .text-center form.hs-form { text-align: left; } .text-center form.hs-form .actions { text-align: center; } /* Blog Comment Form ========================================================================== */ /* Label */ #comment-form .hs-form-field > label {} #comment-form label {} /* Inputs */ #comment-form input[type="text"] {} #comment-form input[type="text"]:focus {} #comment-form textarea {} #comment-form textarea:focus {} #comment-form input[type="checkbox"] {} /* Error */ body .hs-common-error-message {} /* Blog Subscription Form ========================================================================== */ /* Label */ #hs_form_target_blog_subscription .hs-form-field > label {} #hs_form_target_blog_subscription label {} /* Inputs */ #hs_form_target_blog_subscription input[type="email"] {} #hs_form_target_blog_subscription input[type="email"]:focus {} #hs_form_target_blog_subscription input[type="radio"], #hs_form_target_blog_subscription input[type="checkbox"] { width: auto; margin-right: 10px; } /* Google Search Form ========================================================================== */ /* Label */ .widget-type-google_search label {} /* Input */ .widget-type-google_search input[type="text"] {} .widget-type-google_search input[type="focus"] {} /* Multi Column Form ========================================================================== */ body .hs-form fieldset.form-columns-1 {} body .hs-form fieldset.form-columns-1 .hs-form-field {} body .hs-form fieldset.form-columns-2 {} body .hs-form fieldset.form-columns-2 .hs-form-field {} body .hs-form fieldset.form-columns-3 {} body .hs-form fieldset.form-columns-3 .hs-form-field {} /* Multiple Selection Inputs */ body form.hs-form .hs-form-field ul.inputs-list li input {} body form.hs-form .hs-form-field ul.inputs-list li label {} body .white-text form.hs-form .hs-form-field ul.inputs-list li label {color: #fff;} body input[type="radio"] {} body input[type="checkbox"] {margin-bottom: 10px;} body form.hs-form fieldset { max-width: none; } body form.hs-form fieldset .hs-form-field { padding: 0 10px 0 0; } body form.hs-form fieldset[class*="form-columns"] .input { margin-right: 0; } body form.hs-form fieldset[class*="form-columns"] .hs-input { width: 100%; margin-bottom: 10px;} body form.hs-form fieldset[class*="form-columns"] .hs-input[type="checkbox"] { width: auto; } body form.hs-form fieldset.form-columns-3 .hs-form-field { width: 33.33%; } @media (max-width: 400px) { body form.hs-form fieldset .hs-form-field { padding: 0; } body form.hs-form fieldset.form-columns-3 .hs-form-field, body form.hs-form .form-columns-2 .hs-form-field .hs-input, body form.hs-form .form-columns-3 .hs-form-field .hs-input { width: 100%; } body form.hs-form .form-columns-3 .hs-form-field .hs-input[type="checkbox"] { width: auto; } } .subpage-header > div:nth-child(3) > div.row-fluid { height:400px; background:rgba(256,256,256,.5); } /* ========================================================================== Buttons ========================================================================== */ /* All Global Buttons (Excluding CTAs) ========================================================================== */ body .hs-button.primary, body input[type="submit"], body input[type="button"] { background: #00afe7; display: inline-block; color: #fff; padding: .975rem 1.25rem; font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 700; text-transform: uppercase; border: none; cursor: pointer; transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; } body .hs-button.primary:hover, body input[type="submit"]:hover, body input[type="button"]:hover { background: #1a7de1; } body .hs-button.primary:focus, body input[type="submit"]:focus, body input[type="button"]:focus { outline: none; } /* Form Module Button ========================================================================== */ .hs_cos_wrapper_type_form .hs-button.primary.large { background: #00afe7; color: #fff; padding: .975rem 1.25rem; font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 700; text-transform: uppercase; border: none; transition: -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; -ms-transition: .4s ease-in-out; transition: .4s ease-in-out;; } .hs_cos_wrapper_type_form .hs-button.primary.large:hover { background: #1a7de1; } .hs_cos_wrapper_type_form .hs-button.primary.large:focus { outline: none; } /* Blog Comment Button ========================================================================== */ #add-comment-button.hs-button.primary {} #add-comment-button.hs-button.primary:hover {} #add-comment-button.hs-button.primary:focus {} /* Blog Subscription Button ========================================================================== */ #hs_form_target_blog_subscription .hs-button.primary.large {} #hs_form_target_blog_subscription .hs-button.primary.large:hover {} #hs_form_target_blog_subscription .hs-button.primary.large:focus {} /* Google Search Button ========================================================================== */ .widget-type-google_search .hs-button.primary {} .widget-type-google_search .hs-button.primary:hover {} .widget-type-google_search .hs-button.primary:focus {} /* CTA Buttons ========================================================================== */ /** * Override global CTA styles by wrapping the CTA module in a module group * that has an ID, and use that ID to prefix your CTA selector. Example shown below. * * All overriding properties require !important tags. */ #module-group-ID .cta_button {} #module-group-ID .cta_button:hover {} #module-group-ID .cta_button:focus {} /* Custom Modules ========================================================================== */ /* Full Width Row with Video BG */ .video-bg-row { background-position: center center; background-size: cover; background-repeat: no-repeat; } .play--button { text-align: center; line-height: 1; text-transform: uppercase; } .play--button p { margin-bottom: 5px; } .play__button__icon { font-size: 5.125rem; } @media screen and (max-width: 640px) { #lightcase-case { top: calc(50% - 35%) !important; width: 100% !important; position: fixed !important; } } /* 5 Column Row */ .span-fifth { width: 18.2% !important; margin-left: 2.164102564% !important; float: left !important; } .span-fifth:first-child { margin-left: 0 !important; } @media screen and (max-width: 767px) { .span-fifth { width: 100% !important; float: none !important; } } /* Scroll To Top */ .scrollToTop { width: 40px; height: 40px; padding: 10px; text-align: center; background: #00afe7; border-radius: 100%; font-weight: bold; color: #fff; text-decoration: none; position: fixed; bottom: 40px; right: 40px; line-height: 0.5; display: none; transition: -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; -ms-transition: .3s ease-in-out; transition: .3s ease-in-out; } .scrollToTop:hover{ text-decoration:none; background: #1a7de1; color: #fff; } .scrollToTop:focus{ color: #fff; } /* Featured Row */ .featured-row { margin-top: -1px; } .featured-row .row-fluid .span6 { width: 45.717949%; position: relative; padding-right: 10px; } .featured-row .row-fluid .span6:last-child { margin-left: 5.564103%; padding-right: 0; } .featured-row .row-fluid .span6:last-child:before { content: ''; width: 1px; height: 100%; background: rgba(255,255,255,.2); position: absolute; left: -8.5%; } .featured-row_title-wrap .row-fluid { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .featured-row_title-wrap .row-fluid .span2 { width: 19.529915%; } .featured-row_title-wrap .row-fluid .span10 { width: 77.905983%; } .featured-row_section-header { display: block; text-transform: uppercase; font-weight: 400; font-size: 1rem; } .featured-row_item-name { display: block; font-size: 1.25rem; font-weight: 700; } .featured-row a.cta_button { vertical-align: inherit; } @media (max-width: 980px) { .featured-row_title-wrap .row-fluid { -ms-flex-wrap: wrap; flex-wrap: wrap; } .featured-row_title-wrap .row-fluid .span2, .featured-row_title-wrap .row-fluid .span10 { width: 100%; margin-left: 0; float: none; } .featured-row_title-wrap .row-fluid .span2 img { max-width: 100px !important; } } @media (max-width: 767px) { .featured-row .row-fluid .span6, .featured-row .row-fluid .span6:last-child { width: 100%; margin-left: 0; padding-right: 0; } .featured-row_title-wrap .row-fluid .span2 { width: 14.89361702%; float: left; } .featured-row_title-wrap .row-fluid .span10 { width: 82.97872339599999%; margin-left: 2.127659574%; float: left; } .featured-row_title-wrap .row-fluid .span2 img { max-width: 100% !important; } } @media (max-width: 500px) { .featured-row_title-wrap .row-fluid .span2, .featured-row_title-wrap .row-fluid .span10 { width: 100%; margin-left: 0; float: none; } .featured-row_title-wrap .row-fluid .span2 img { max-width: 100px !important; } } /* ========================================================================== 6. MISCELLANOUS ========================================================================== */ .media-block { display: inline-block; position: relative; margin-bottom: 30px; width: 100%; } .image-frame { background-repeat: no-repeat; background-size: cover; background-position: center; -moz-box-shadow: 0 1px 2px rgba(31, 41, 51, 0.5); -webkit-box-shadow: 0 1px 2px rgba(31, 41, 51, 0.5); box-shadow: 0 1px 2px rgba(31, 41, 51, 0.5); border: solid 10px #fff; } .media-block .top h2:first-child, .media-block .top h3:first-child, .media-block .top h4:first-child, .media-block .top h5:first-child, .media-block .top h6:first-child, .media-block .top p:first-child{ color: #fff; margin: 0; padding: 1.250rem; } .media block h3{ line-height: 2rem; } .media block p{ line-height: 1.25rem; } .media-block .mid { display: table-cell; vertical-align: middle; color: #fff; } .media-block .bot{ display: table-cell; vertical-align: bottom; color: #fff; } .media-block .label { position: absolute; top: -10px; left: -10px; display: inline-block; padding: 0 0.75em; border-radius: 5px 2px 2px 0; text-transform: uppercase; letter-spacing: .1em; font-size: 12px; font-size: 0.75rem; line-height: 2.35em; font-weight: bold; color: #6b4e00; background-color: #ffc938; z-index: 11; -moz-border-radius: 5px 2px 2px 0; -webkit-border-radius: 5px; border-radius: 5px 2px 2px 0; -moz-box-shadow: 0px 2px 0 rgba(31, 41, 51, 0.1); -webkit-box-shadow: 0px 2px 0 rgba(31, 41, 51, 0.1); box-shadow: 0px 2px 0 rgba(31, 41, 51, 0.1); -moz-transition: all 0.1s; -o-transition: all 0.1s; -webkit-transition: all 0.1s; transition: all 0.1s; } .media-block .label:before { content: ''; display: block; position: absolute; width: 5px; height: 4px; left: 0; bottom: -4px; background-color: #ffc938; } .media-block .label:after { content: ''; display: block; position: absolute; width: 5px; height: 6px; bottom: -6px; left: 0; background-color: #9e7300; -moz-border-radius: 5px 0 0 5px; -webkit-border-radius: 5px; border-radius: 5px 0 0 5px; } /* Cassling Team Members */ .media-block.team.span-fifth:nth-child(3) { margin-left: 0 !important; } .team a { display: inline-block; color: #333; max-width: 100%; } .founders { text-align: center; } .image--frame--team { width:100%; position: relative; } .image--frame--team--inner { display: table-cell; vertical-align: middle; } .team--member--readmore { position: absolute; top:calc(50% - 5%); width: 100%; opacity: 0; text-align: center; color: #fff; font-weight: 700; } .team:hover .team--member--readmore{ opacity: 1; } .team--member--name { margin: 1rem 0 0; } p.team--member--title { font-size: 1rem; line-height: 1.25; } .team--member--bio p { margin-bottom: 15px; } .team--member--bio, .team--member--bio p:last-child { margin: 0; font-size: 1.125rem; font-family: 'Lato', sans-serif; } /* staff-entry-inline */ .team--member-inline {} .team--member-inline .image-frame{ width:80px; height: 80px; border: solid 3px #fff; } .team--member-inline .staff-entry-name { font-size: 2em; margin: 0 0 10px; } .image--frame--team--lightbox { background-size: cover; background-repeat: no-repeat; background-position: center; height: 170px; } .team--members { display: flex; display: -webkit-flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .media-block.team.span-fifth:nth-child(7n+1) { margin-left: 0 !important; } @media (max-width: 767px) { .media-block.team.founders.span6 { width: 46.93617020799999%; margin-left: 2.127659574%; float: left; } .media-block.team.span-fifth { width: 31.6% !important; float: left !important; margin-left: 2.12766% !important; } .media-block.team.span-fifth:nth-child(7n+1) { margin-left: 2.12766% !important; } .media-block.team.span-fifth:nth-child(7n-1) { margin-left: 0 !important; } .image--frame--team--lightbox { width: 170px; } } @media (max-width: 640px) { .team--member--inline { background: #fff; padding: 1.250rem; overflow: scroll; max-height: 510px; text-shadow: none; } #lightcase-content h1, #lightcase-content h2, #lightcase-content h3, #lightcase-content h4, #lightcase-content h5, #lightcase-content h6, #lightcase-content p { color: #333 !important; } } @media (max-width: 500px) { .media-block.team.founders.span6 { width: 100%; margin-left: 0; float: none; } .media-block.team.span-fifth { width: 100% !important; float: none !important; margin-left: 0 !important; text-align: center; } } /** * Styles that do not fit into available sections above can go here. * For example, one would place 3rd party plugin overriding styles here. * * This section is NOT for 'Custom' styles. All custom styles must go in the * proper sections above. * * For instance, custom header and footer styles must go in the HEADER and * FOOTER sections. Custom styles for anything in-between the header and footer * (such as, styles that are unique to the HOMEPAGE only), must go in the * CONTENT section. */ /* Safari Fixes */ /* Safari 6.1+ (9.0 is the latest version of Safari at this time) */ @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) { @media { .hero__text h1 { text-shadow: 0 0 10px #FFF, 0 0 15px #FFF, 0 0 2.50rem #FFF, 0 0 25px #FFF, 0 0 30px #FFF; -webkit-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); -moz-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); } .hero__text p { text-shadow: 0 0 10px #FFF, 0 0 15px #FFF, 0 0 2.50rem #FFF, 0 0 25px #FFF, 0 0 30px #FFF; -webkit-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); -moz-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); } .subpage__hero__text h1 { } .subpage__hero__text p { text-shadow: 0 0 10px #FFF, 0 0 15px #FFF, 0 0 2.50rem #FFF, 0 0 25px #FFF, 0 0 30px #FFF; -webkit-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); -moz-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); } }} /* Safari 6.1-7.0 */ @media screen and (-webkit-min-device-pixel-ratio:0) and (min-color-index:0) { .hero__text h1 {(; text-shadow: 0 0 10px #FFF, 0 0 15px #FFF, 0 0 2.50rem #FFF, 0 0 25px #FFF, 0 0 30px #FFF; -webkit-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); -moz-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); );} .hero__text p {(; text-shadow: 0 0 10px #FFF, 0 0 15px #FFF, 0 0 2.50rem #FFF, 0 0 25px #FFF, 0 0 30px #FFF; -webkit-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); -moz-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); );} .subpage__hero__text h1 {(; );} .subpage__hero__text p {(; text-shadow: 0 0 10px #FFF, 0 0 15px #FFF, 0 0 2.50rem #FFF, 0 0 25px #FFF, 0 0 30px #FFF; -webkit-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); -moz-box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); box-shadow: 0 0 45px 2.50rem rgba(255, 255, 255, .5); );} } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE10+ CSS styles go here */ .testimonial--active--tab__marker, .subpage--testimonial--active--tab__marker { bottom: 120px; } .testimonial--nav--item, .subpage--testimonial--nav--item { padding: 20px 15px 0; } .testimonial__quote, .subpage__testimonial__quote { font-size: 30px; } .tabset-container { min-height: 0 !important; } .span6.tab__left__column { padding-bottom: 80px !important; } select { background-image: none !important; padding-right: 8px !important; } .footer svg#siemens__logo, .footer svg#modern__healthcare { max-height: 78px !important; } .span12.custom-post-item.blog .knowledge--center, .span12.custom-post-item.news .knowledge--center { min-height: 345px !important; } } /* ========================================================================== 7. MOBILE MEDIA QUERIES ========================================================================== */ /* Screen sizes smaller than site maxWidth (.page-center) ========================================================================== */ @media (max-width: 1230px) { .tabset--content .tabset--section { margin-left: 1.250rem; } } @media (max-width: 1200px) { } @media (max-width: 1139px) { .row-fluid .span2.logo { width: 17.364641%; } .row-fluid .span10.navigation { width: 79.872928%; } } @media (max-width: 1120px) { .span8.product-details, .span4.product-article { width: 100%; float: none; margin-left: 0; } .products--article { min-height: 150px; } .products-feature-box-content-left .span6.content, .products-feature-box-content-right .span6.content { padding: 40px 4%; } } @media (max-width: 1100px) { .footer__blog__subscribe .input { width: 60%; float: left; } .footer__blog__subscribe .hs_submit { width: 40%; float: left; } } @media (max-width: 1085px) { .tabset--section .tab__left__column p { line-height: 1.5; font-size: 1rem; } } @media (max-width: 1027px) { /* Testimonials */ .testimonial__caption { max-width: 75%; padding: 7% 0 17%; } .testimonial__quote { font-size: 30px; } /* Subpage Testimonials */ .subpage__testimonial__caption { max-width: 75%; padding: 7% 0 17%; } .subpage__testimonial__quote { font-size: 30px; } } @media (max-width: 1020px) { /* Header */ .nav { padding: 15px 0; } .header-container-wrapper .main-menu{ display: none; } #header-right, #header-sidr { min-height: 0; } .header-container-wrapper .header-container .sidr-wrap { display: block; position: relative; width: 100%; top: 10%; } .header-container-wrapper .header-container .sidr-wrap .menu{ display: block; } .row-fluid .span2.logo { width: 20.364641%; float: left; } .row-fluid .span10.navigation { width: 75.872928%; float: left; margin-left: 0; } .header-container .hs_cos_wrapper_type_logo a img { margin-top: 0; } /* Knowledge Center */ .blog__hero__text { max-width: 60%; } } @media (max-width: 1000px) and (min-width: 768px) { .knowledge--feed--wrap > .row-fluid-wrapper > .row-fluid { display: flex; flex-wrap: wrap; } .knowledge--feed--wrap .row-fluid .span3 { flex-basis: 48%; margin: 1%; } } @media (max-width: 959px) { /* Testimonials */ .testimonial__captions { max-width: 75%; padding: 7% 0 17%; } .testimonial__quote { font-size: 24px; } /* Subpage Testimonials */ .subpage__testimonial__caption { max-width: 75%; padding: 7% 0 17%; } .subpage__testimonial__quote { font-size: 24px; } .subpage--testimonial--nav--item:nth-of-type(1).-is--active ~ .subpage--testimonial--active--tab__marker { left: 26.5%; } /* Knowledge Center */ .blog--hero--text--wrap { margin: 220px 0 0; } .blog--header--bg { min-height: 450px; } /* Knowledge Center Post */ .blog--post--hero--text--wrap { margin: 190px 0 80px; } .blog__post__hero__text h1 { font-size: 2.75rem; } } @media (max-width: 900px) { .tabset--section:nth-child(3) .tab__left__column { width: 75%; } .tabset--section:nth-child(3) .tab__right__column { margin-left: 0px; } } @media (max-width: 864px) { /* Top Bar */ #hs_cos_wrapper_google_search .input input.open { width: 150px; } } @media (max-width: 860px) { /* Top Bar */ .top--bar--social { display: none; } /* Header */ .row-fluid .span2.logo { width: 25%; } .row-fluid .span10.navigation { width: 75%; } /* Footer */ .footer__blog__subscribe .input { width: 55%; float: left; } .footer__blog__subscribe .hs_submit { width: 45%; float: left; } /* Locations Listing Page */ .rep-item { width: 31%; margin: 0 1.1666665% 1.250rem; } /* Knowledge Center */ .post-listing .span4.custom-post-item { width: 48.5%; } .blog-listing-wrapper .span4.custom-post-item:nth-child(3n + 1) { margin-left: 2.762430939%; } .blog-listing-wrapper .span4.custom-post-item:nth-child(2n + 1) { margin-left: 0; } .knowledge-center_item { width: 49%; } /* .knowledge-center_item:nth-child(3n) { margin-right: auto; } .knowledge-center_item:nth-child(2n) { margin-right: 0; } */ } /* Landscape tablet and smaller devices ========================================================================== */ @media (max-width: 768px) { .tabset--section a { white-space: normal; } /* Testimonials */ .testimonial--nav--item:nth-of-type(1).-is--active ~ .testimonial--active--tab__marker { left: 7.5%; } .testimonial--nav--item:nth-of-type(2).-is--active ~ .testimonial--active--tab__marker { left: 27.5%; } .testimonial--nav--item:nth-of-type(3).-is--active ~ .testimonial--active--tab__marker { left: 47%; } .testimonial--nav--item:nth-of-type(4).-is--active ~ .testimonial--active--tab__marker { left: 66.5%; } .testimonial--nav--item:nth-of-type(5).-is--active ~ .testimonial--active--tab__marker { left: 87.5%; } } @media (max-width: 767px) { /* Top Bar */ .top__bar__inner.page-center { padding-left: 0; padding-right: 0; } .top--bar--search { display: none; } /* Header */ .row-fluid .span2.logo { width: 30%; } .row-fluid .span10.navigation { width: 70%; } /* Hero */ .header, .subpage-header { min-height: 400px; } .hero-text-wrap, .subpage--text--wrap { margin: 60px 0; } .hero__text, .subpage__hero__text { max-width: 100%; } .hero__text h1, .subpage__hero__text h1 { font-size: 3rem; } /* Homepage Knowledge Feed */ .knowledge--feed--wrap .row-fluid { display: block; } .knowledge__feed__block { display: block !important; } /* Blog & Twitter Feed */ .home-rss h3 { margin-bottom: 24px; } .home-rss .hs-rss-item.hs-with-featured-image { margin-bottom: 24px; } .home-rss .hs-rss-title { font-size: 1rem; } /* New */ .home--blog--feed--img { float: left !important; } .home--blog--feed--title { width: 74.358974359% !important; float: left !important; } .home--blog--feed-header h3 { margin-bottom: 24px; } .home--blog--feed { margin-bottom: 24px; } .home--blog--feed--title { font-size: 1rem; } .twitter-feed h3 { margin-bottom: 24px; margin-top: 40px; } /* Footer */ .footer-container-wrapper { padding: 25px 0 15px } .footer, .footer a { text-align: center; } .footer h5 { margin: 10px 0 5px; } .footer p { margin: 0 0 .75rem; } .footer__blog__subscribe .input { width: 70%; float: left; } .footer__blog__subscribe .hs_submit { width: 30%; float: left; } /* Tabs */ .span12.widget-span.widget-type-cell.padding50t.featured-tabs-wrapper { padding-top: 30px; } .tab-container { height: auto; } .tabset--section .tab__right__column { clear: both; } .tabset--section:nth-child(1) .tab__left__column { padding-top: 0px; max-width: 70%; margin: 0 auto; } .span6.tab__inner__left, .span6.tab__inner__right { height: 390px; width: 45.93617%; margin-right: 0; float: left; } .tabset--section:nth-child(3) .tab__right__column { background-position-y: 40%!important; } .tabset--section:nth-child(3) .tab__left__column { width: auto; } .tabset--section { display: block; } .span6.tab__left__column { padding-bottom: 40px; } .span6.tab__right__column { min-height: 400px; } /* Testimonials */ .testimonial--section { min-height: 500px; } .testimonial--nav { display: none; } .testimonial--nav--mobile--previous, .testimonial--nav--mobile--next { display: inline-block; } .testimonial__logo__mobile { position: absolute; bottom: 0; display: block; width: 100%; text-align: center; background: rgba(0,0,0,.7); padding: 1.250rem 0; } .testimonial__logo__mobile img { max-width: 150px !important; } .testimonial__caption { max-width: 100%; padding: 15% 1.250rem 30%; } .testimonial__quote { font-size: 1.5rem; } .testimonial__quotee { font-size: .875rem; } /* Subpage Testimonials */ .subpage--testimonial--section { min-height: 500px; } .subpage--testimonial--nav { display: none; } .subpage--testimonial--nav--mobile--previous, .subpage--testimonial--nav--mobile--next { display: inline-block; } .subpage__testimonial__logo__mobile { position: absolute; bottom: 0; display: block; width: 100%; text-align: center; background: rgba(0,0,0,.7); padding: 1.250rem 0; } .subpage__testimonial__logo__mobile img { max-width: 150px !important; } .subpage__testimonial__caption { max-width: 100%; padding: 15% 1.250rem 30%; } .subpage__testimonial__quote { font-size: 1.5rem; } .subpage__quotee { font-size: .875rem; } /* Knowledge Center Feed */ .knowledge-feed { margin-bottom: 1.250rem; } .knowledge-feed, .overlay { min-height: 75px; position: relative; } /* Products */ .site--planning { padding: 0 1.250rem 3.750em; } .site--planning .feature-box-content-right .span6.background-image { background-size: cover !important; } .site--planning .feature-box-content-left .span6.content { padding: 0 4% 1rem; } .payment--options { padding: 0 1.250rem 3.750em; } .payment--options .feature-box-content-right .span6.background-image { background-size: cover !important; } .payment--options .feature-box-content-right .span6.content { padding: 1rem 4% 0; } /* Knowledge Center */ .blog--hero--text--wrap { margin: 200px 0 0; } .blog--header--bg { min-height: 400px; } .blog__hero__text { max-width: 100%; } .sorting .sod_select { margin-bottom: 12px; } .post-listing .span4.custom-post-item.padding30b { width: 48.5%; padding-bottom: 1.25rem; float: left; margin-left: 2.762430939%; } .blog-listing-wrapper .span4.custom-post-item:nth-child(2n + 1) { margin-left: 0; } .span12.custom-post-item.blog, .span12.custom-post-item.news { display: block; } .span6.knowledge--center.white-text.hs-featured-image-wrapper { min-height: 300px; } .hs-featured-image-wrapper .hs-featured-image-link img.hs-featured-image { max-height: 300px; } /* Knowledge Center Post */ .blog--post--hero--text--wrap { margin: 175px 0 40px; } .blog__post__hero__text h1 { font-size: 2.25rem; } .social-row { margin-bottom: 1.75rem; } /* Consulting Services Page */ .hs-content-path-consulting-services .row-fluid-wrapper.padding30b .span6:first-child { padding-bottom: 1.875rem; } .ce--quality--services .span6:last-child { margin-top: 30px; } /* Locations Listing Page */ #tip-id-path { margin-top: 50px; } #tip-tx-path { margin-left: 1.250rem; } .post-body-wrapper, .thank-you-wrapper > .row-fluid-wrapper > .row-fluid { display: flex; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; flex-direction: column-reverse; -ms-flex-direction: column-reverse; -webkit-flex-direction: column-reverse; } /* Marketing Services */ .marketing--packages .span6.background-image { min-height: 300px; } .marketing--packages .feature-box-content-right .span6.content, .marketing--packages .feature-box-content-left .span6.content { padding: 20px 4% 0; } } @media (max-width: 650px) { /* Header */ .row-fluid .span2.logo { width: 40%; } .row-fluid .span10.navigation { width: 60%; } /* Locations Listing Page */ .rep-item { width: 45%; margin: 0 2.5% 1.250rem; } } @media (max-width: 600px) { /* Global */ h2 { font-size: 2rem; } h3 { font-size: 1.25rem; } /* Top Bar */ .top__bar__inner { text-align: center; } /* Tabs */ .tabset--section:nth-child(1) .tab__left__column { padding-top: 0px; max-width: 100%; margin: 0 auto; } .span6.tab__inner__left, .span6.tab__inner__right { height: 390px; width: 45.93617%; margin-right: 0; float: left; } /* Knowledge Center */ .post-listing .span4.custom-post-item.padding30b { width: 100%; padding-bottom: 1.25rem; float: none; margin-left: 0; } .blog-listing-wrapper .span4.custom-post-item:nth-child(3n + 1) { margin-left: 0; } .span6.knowledge--center.white-text.hs-featured-image-wrapper { min-height: 200px; } .hs-featured-image-wrapper .hs-featured-image-link img.hs-featured-image { max-height: 200px; } .knowledge-center_listing { display: block; } .knowledge-center_item { width: 100%; } } @media (max-width: 568px) { /* Homepage */ .testimonial--section { min-height: 500px; } .testimonial__caption { max-width: 100%; padding: 10% 1.250rem 30%; } /* Tabs */ .span6.tab__inner__left, .span6.tab__inner__right { height: 410px; width: 45.93617020799999%; } /* Locations Listing Page */ .mobile-map-blocker { z-index: 20; background-color: rgba(0,0,0,0); } path.filter.cls-3:hover, path.filter.cls-3.hover { fill: #195484; } path.filter.cls-6:hover, path.filter.cls-6.hover { fill: #72c267; } path.filter.cls-1:hover, path.filter.cls-1.hover { fill: #00afe8; } path.filter.cls-3.active { fill: #0f6baa; } path.filter.cls-6.active { fill: #a2e899; } path.filter.cls-1.active { fill: #6dd1f2; } path.filter:hover { cursor: default; } .tooltipsy { visibility: hidden; } .state-select__wrapper { padding-top: 30px; } .state-select__wrapper .sod_select .sod_list_wrapper, .sorting .state-select__wrapper .sod_select .sod_option { z-index: 30; } .row-fluid .span12.state-selection__wrapper { display: flex; display: -webkit-flex; display: -ms-flexbox; flex-direction: column; -webkit-flex-direction: column; } } @media (max-width: 480px) { /* Tabs */ .tab--nav--item { padding: 10px 5px 5px; margin: 0; font-size: .9rem; } .tabset--content .tabset--section { margin-left: 1.250rem; margin-right: 1.250rem; } .span6.tab__inner__left, .span6.tab__inner__right { height: auto; display: block; width: 100%; margin-left: 0px; } .span6.tab__inner__right h4:first-child { margin-top: 10px; } .tabset--section:nth-child(1) .tab__left__column { padding-top: 0px; padding-bottom: 40px; text-align: center; } .span6.tab__right__column { display: none; } .tabset--content .tabset--section.first .span6.tab__inner__right { padding-bottom: 60px; } /* Locations Listing Page */ .rep-item { width: 90%; margin: 0 5% 1.250rem; } /* Marketing Services */ .marketing--packages .span6.background-image { min-height: 250px; } .marketing--packages .feature-box-content-right .span6.content, .marketing--packages .feature-box-content-left .span6.content { padding: 0 4% 0; } } /* Landscape phones and smaller devices ========================================================================== */ @media (max-width: 479px) { /* Header */ .row-fluid .span2.logo { width: 50%; } .row-fluid .span10.navigation { width: 50%; } .top__bar__menu__signup { display: none !important; } /* Hero */ .header, .subpage-header { min-height: 300px; } .hero-text-wrap, .subpage--text--wrap { margin: 40px 0; } .hero__text h1, .subpage__hero__text h1 { font-size: 2.5rem; } /* Testimonials */ .testimonial__quote, .subpage__testimonial__quote { font-size: 1.25rem; } /* Knowledge Center Listing */ .blog--header--bg { min-height: 300px; } .blog--hero--text--wrap { margin: 155px 0 40px; } .blog__hero__text h1 { font-size: 2.5rem; } /* Knowledge Center Post */ .blog--post--hero--text--wrap { margin: 162px 0 40px; } .blog__post__hero__text h1 { font-size: 1.875rem; } .social-row { margin-bottom: 1.75rem; } /* Equipment Service */ .why--cassling--service ul { padding: 0; margin: 0 0 1.25rem 1.25rem; } } @media (max-width: 350px) { .footer__blog__subscribe .input, .footer__blog__subscribe .hs_submit { width: 100%; float: none; } } .newMap {} .newMap > div { max-width: 860px; margin: 0 auto; } .newMap path { cursor: pointer; transition: all 0.3s ease; } .newMap path:hover { opacity: 0.8; } .newMap path[style="fill:#d1d3d4;fill-rule:nonzero;"], .newMap path[style="fill:#fff;fill-rule:nonzero;"]{pointer-events:none;} #background-pattern{ background-image: url("data:image/svg+xml,%3Csvg width='12' height='24' viewBox='0 0 12 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%235a6cae' fill-opacity='0.21'%3E%3Cpath d='M2 0h2v12H2V0zm1 20c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM9 8c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zm-1 4h2v12H8V12z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")!important; background-repeat: repeat!important; background-size: unset!important; } #background-pattern ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #000000; } #background-pattern ::-moz-placeholder { /* Firefox 19+ */ color: #000000; } #background-pattern :-ms-input-placeholder { /* IE 10+ */ color: #000000; } #background-pattern :-moz-placeholder { /* Firefox 18- */ color: #000000; } #background-pattern form select{ color: #000000!important; font-family: 'Lato', sans-serif; font-size: 1rem!important; } /**/ .four_box_section .span3 { position: relative; padding-bottom: 20px; } .four_box_section .span3 .hs-cta-wrapper, .four_box_section .theme-button-text { position: absolute; bottom: 0; left: 0; width: 100%; min-height: 25px; } .four_box_section .row-fluid.page-center { display: flex; flex-wrap: wrap; } /* .slick-slide-inner-wrapper { height: 80vh; overflow: hidden; } .hs_cos_gallery_main.slick-fixed-height-slider.hs_cos_gallery_lightbox.slick-initialized.slick-slider { display: flex; align-items: center; } */ .slick-slide-inner-wrapper { height: 80vh; overflow: hidden; } .slick-slide-inner-wrapper img { height: 100%; object-fit: cover; } .hs_cos_gallery_lightbox_container .slick-list, .hs_cos_gallery_lightbox .slick-list { height: 100%; max-height: none; } .slick-prev, .slick-next { transform: translateY(-50%); margin-top: -18px; } .hs_cos_gallery_thumbnails { padding: 0 50px; } @media (max-width: 767px){ .four_box_section .span3 { padding-bottom: 0; } .four_box_section .span3 .hs-cta-wrapper, .four_box_section .theme-button-text { position: relative; } .slick-slide-inner-wrapper { height: 50vh; } } @media (max-width: 500px){ .slick-slide-inner-wrapper { height: 25vh; } }