@import url(https://fonts.googleapis.com/css?family=Fira+Sans:400,300,500|Share:400,700|Alike|Droid+Serif);
/* @import url('http://example.com/example_style.css'); */

 /****************************************
  Theme: StructureStudios.com 2015
  Theme Author: Michael Malaska
  Theme Company: Structure Studios
  This theme was created for the Structure Studios website, specifically to be used with the hubspot framework.
  ****************************************/

 /***********************************************/
 /* CSS @imports must be at the top of the file */
 /* Add them above this section                 */
 /***********************************************/

 /****************************************/
 /* HubSpot Style Boilerplate            */
 /****************************************/

 /* This responsive framework is required for all styles. */
 /* Responsive Grid */

.row-fluid {
    width: 100%;
    *zoom: 1;
}

.row-fluid:before, .row-fluid:after {
    display: table;
    content: "";
}

.row-fluid:after {
    clear: both;
}

.row-fluid [class*="span"] {
    display: block;
    float: left;
    width: 100%;
    min-height: 28px;
    margin-left: 2.127659574%;
    *margin-left: 2.0744680846382977%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.row-fluid [class*="span"]:first-child {
    margin-left: 0;
}

.row-fluid .span12 {
    width: 99.99999998999999%;
    *width: 99.94680850063828%;
}

.row-fluid .span11 {
    width: 91.489361693%;
    *width: 91.4361702036383%;
}

.row-fluid .span10 {
    width: 82.97872339599999%;
    *width: 82.92553190663828%;
}

.row-fluid .span9 {
    width: 74.468085099%;
    *width: 74.4148936096383%;
}

.row-fluid .span8 {
    width: 65.95744680199999%;
    *width: 65.90425531263828%;
}

.row-fluid .span7 {
    width: 57.446808505%;
    *width: 57.3936170156383%;
}

.row-fluid .span6 {
    width: 48.93617020799999%;
    *width: 48.88297871863829%;
}

.row-fluid .span5 {
    width: 40.425531911%;
    *width: 40.3723404216383%;
}

.row-fluid .span4 {
    width: 31.914893614%;
    *width: 31.8617021246383%;
}

.row-fluid .span3 {
    width: 23.404255317%;
    *width: 23.3510638276383%;
}

.row-fluid .span2 {
    width: 14.89361702%;
    *width: 14.8404255306383%;
}

.row-fluid .span1 {
    width: 6.382978723%;
    *width: 6.329787233638298%;
}

.container-fluid {
    *zoom: 1;
}

.container-fluid:before, .container-fluid:after {
    display: table;
    content: "";
}

.container-fluid:after {
    clear: both;
}

@media (max-width: 767px) {
    .row-fluid {
        width: 100%;
    }

    .row-fluid [class*="span"] {
        display: block;
        float: none;
        width: auto;
        margin-left: 0;
    }
}

@media (min-width: 768px) and (max-width: 1139px) {
    .row-fluid {
        width: 100%;
        *zoom: 1;
    }

    .row-fluid:before, .row-fluid:after {
        display: table;
        content: "";
    }

    .row-fluid:after {
        clear: both;
    }

    .row-fluid [class*="span"] {
        display: block;
        float: left;
        width: 100%;
        min-height: 28px;
        margin-left: 2.762430939%;
        *margin-left: 2.709239449638298%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }

    .row-fluid [class*="span"]:first-child {
        margin-left: 0;
    }

    .row-fluid .span12 {
        width: 99.999999993%;
        *width: 99.9468085036383%;
    }

    .row-fluid .span11 {
        width: 91.436464082%;
        *width: 91.38327259263829%;
    }

    .row-fluid .span10 {
        width: 82.87292817100001%;
        *width: 82.8197366816383%;
    }

    .row-fluid .span9 {
        width: 74.30939226%;
        *width: 74.25620077063829%;
    }

    .row-fluid .span8 {
        width: 65.74585634900001%;
        *width: 65.6926648596383%;
    }

    .row-fluid .span7 {
        width: 57.182320438000005%;
        *width: 57.129128948638304%;
    }

    .row-fluid .span6 {
        width: 48.618784527%;
        *width: 48.5655930376383%;
    }

    .row-fluid .span5 {
        width: 40.055248616%;
        *width: 40.0020571266383%;
    }

    .row-fluid .span4 {
        width: 31.491712705%;
        *width: 31.4385212156383%;
    }

    .row-fluid .span3 {
        width: 22.928176794%;
        *width: 22.874985304638297%;
    }

    .row-fluid .span2 {
        width: 14.364640883%;
        *width: 14.311449393638298%;
    }

    .row-fluid .span1 {
        width: 5.801104972%;
        *width: 5.747913482638298%;
    }
}

@media (min-width: 1280px) {
    .row-fluid {
        width: 100%;
        *zoom: 1;
    }

    .row-fluid:before, .row-fluid:after {
        display: table;
        content: "";
    }

    .row-fluid:after {
        clear: both;
    }

    .row-fluid [class*="span"] {
        display: block;
        float: left;
        width: 100%;
        min-height: 28px;
        margin-left: 2.564102564%;
        *margin-left: 2.510911074638298%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }

    .row-fluid [class*="span"]:first-child {
        margin-left: 0;
    }

    .row-fluid .span12 {
        width: 100%;
        *width: 99.94680851063829%;
    }

    .row-fluid .span11 {
        width: 91.45299145300001%;
        *width: 91.3997999636383%;
    }

    .row-fluid .span10 {
        width: 82.905982906%;
        *width: 82.8527914166383%;
    }

    .row-fluid .span9 {
        width: 74.358974359%;
        *width: 74.30578286963829%;
    }

    .row-fluid .span8 {
        width: 65.81196581200001%;
        *width: 65.7587743226383%;
    }

    .row-fluid .span7 {
        width: 57.264957265%;
        *width: 57.2117657756383%;
    }

    .row-fluid .span6 {
        width: 48.717948718%;
        *width: 48.6647572286383%;
    }

    .row-fluid .span5 {
        width: 40.170940171000005%;
        *width: 40.117748681638304%;
    }

    .row-fluid .span4 {
        width: 31.623931624%;
        *width: 31.5707401346383%;
    }

    .row-fluid .span3 {
        width: 23.076923077%;
        *width: 23.0237315876383%;
    }

    .row-fluid .span2 {
        width: 14.529914530000001%;
        *width: 14.4767230406383%;
    }

    .row-fluid .span1 {
        width: 5.982905983%;
        *width: 5.929714493638298%;
    }
}

/* Clearfix */

.clearfix {
    *zoom: 1;
}

.clearfix:before, .clearfix:after {
    display: table;
    content: "";
}

.clearfix:after {
    clear: both;
}

/* Visibilty Classes */

.hide {
    display: none;
}

.show {
    display: block;
}

.invisible {
    visibility: hidden;
}

.hidden {
    display: none;
    visibility: hidden;
}

/* Responsive Visibilty Classes */

.visible-phone {
    display: none !important;
}

.visible-tablet {
    display: none !important;
}

.hidden-desktop {
    display: none !important;
}

@media (max-width: 767px) {
    .visible-phone {
        display: inherit !important;
    }

    .hidden-phone {
        display: none !important;
    }

    .hidden-desktop {
        display: inherit !important;
    }

    .visible-desktop {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 1139px) {
    .visible-tablet {
        display: inherit !important;
    }

    .hidden-tablet {
        display: none !important;
    }

    .hidden-desktop {
        display: inherit !important;
    }

    .visible-desktop {
        display: none !important ;
    }
}

 /* 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;}
 /*!
 * Font Awesome Free 5.9.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 */
.fa,
.fas,
.far,
.fal,
.fab {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1; }

.fa-lg {
  font-size: 1.33333em;
  line-height: 0.75em;
  vertical-align: -.0667em; }

.fa-xs {
  font-size: .75em; }

.fa-sm {
  font-size: .875em; }

.fa-1x {
  font-size: 1em; }

.fa-2x {
  font-size: 2em; }

.fa-3x {
  font-size: 3em; }

.fa-4x {
  font-size: 4em; }

.fa-5x {
  font-size: 5em; }

.fa-6x {
  font-size: 6em; }

.fa-7x {
  font-size: 7em; }

.fa-8x {
  font-size: 8em; }

.fa-9x {
  font-size: 9em; }

.fa-10x {
  font-size: 10em; }

.fa-fw {
  text-align: center;
  width: 1.25em; }

.fa-ul {
  list-style-type: none;
  margin-left: 2.5em;
  padding-left: 0; }
  .fa-ul > li {
    position: relative; }

.fa-li {
  left: -2em;
  position: absolute;
  text-align: center;
  width: 2em;
  line-height: inherit; }

.fa-border {
  border: solid 0.08em #eee;
  border-radius: .1em;
  padding: .2em .25em .15em; }

.fa-pull-left {
  float: left; }

.fa-pull-right {
  float: right; }

.fa.fa-pull-left,
.fas.fa-pull-left,
.far.fa-pull-left,
.fal.fa-pull-left,
.fab.fa-pull-left {
  margin-right: .3em; }

.fa.fa-pull-right,
.fas.fa-pull-right,
.far.fa-pull-right,
.fal.fa-pull-right,
.fab.fa-pull-right {
  margin-left: .3em; }

.fa-spin {
  -webkit-animation: fa-spin 2s infinite linear;
          animation: fa-spin 2s infinite linear; }

.fa-pulse {
  -webkit-animation: fa-spin 1s infinite steps(8);
          animation: fa-spin 1s infinite steps(8); }

@-webkit-keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

.fa-rotate-90 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg); }

.fa-rotate-180 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg); }

.fa-rotate-270 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg); }

.fa-flip-horizontal {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1); }

.fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  -webkit-transform: scale(1, -1);
          transform: scale(1, -1); }

.fa-flip-both, .fa-flip-horizontal.fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  -webkit-transform: scale(-1, -1);
          transform: scale(-1, -1); }

:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical,
:root .fa-flip-both {
  -webkit-filter: none;
          filter: none; }

.fa-stack {
  display: inline-block;
  height: 2em;
  line-height: 2em;
  position: relative;
  vertical-align: middle;
  width: 2.5em; }

.fa-stack-1x,
.fa-stack-2x {
  left: 0;
  position: absolute;
  text-align: center;
  width: 100%; }

.fa-stack-1x {
  line-height: inherit; }

.fa-stack-2x {
  font-size: 2em; }

.fa-inverse {
  color: #fff; }

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */
.fa-500px:before {
  content: "\f26e"; }

.fa-accessible-icon:before {
  content: "\f368"; }

.fa-accusoft:before {
  content: "\f369"; }

.fa-acquisitions-incorporated:before {
  content: "\f6af"; }

.fa-ad:before {
  content: "\f641"; }

.fa-address-book:before {
  content: "\f2b9"; }

.fa-address-card:before {
  content: "\f2bb"; }

.fa-adjust:before {
  content: "\f042"; }

.fa-adn:before {
  content: "\f170"; }

.fa-adobe:before {
  content: "\f778"; }

.fa-adversal:before {
  content: "\f36a"; }

.fa-affiliatetheme:before {
  content: "\f36b"; }

.fa-air-freshener:before {
  content: "\f5d0"; }

.fa-airbnb:before {
  content: "\f834"; }

.fa-algolia:before {
  content: "\f36c"; }

.fa-align-center:before {
  content: "\f037"; }

.fa-align-justify:before {
  content: "\f039"; }

.fa-align-left:before {
  content: "\f036"; }

.fa-align-right:before {
  content: "\f038"; }

.fa-alipay:before {
  content: "\f642"; }

.fa-allergies:before {
  content: "\f461"; }

.fa-amazon:before {
  content: "\f270"; }

.fa-amazon-pay:before {
  content: "\f42c"; }

.fa-ambulance:before {
  content: "\f0f9"; }

.fa-american-sign-language-interpreting:before {
  content: "\f2a3"; }

.fa-amilia:before {
  content: "\f36d"; }

.fa-anchor:before {
  content: "\f13d"; }

.fa-android:before {
  content: "\f17b"; }

.fa-angellist:before {
  content: "\f209"; }

.fa-angle-double-down:before {
  content: "\f103"; }

.fa-angle-double-left:before {
  content: "\f100"; }

.fa-angle-double-right:before {
  content: "\f101"; }

.fa-angle-double-up:before {
  content: "\f102"; }

.fa-angle-down:before {
  content: "\f107"; }

.fa-angle-left:before {
  content: "\f104"; }

.fa-angle-right:before {
  content: "\f105"; }

.fa-angle-up:before {
  content: "\f106"; }

.fa-angry:before {
  content: "\f556"; }

.fa-angrycreative:before {
  content: "\f36e"; }

.fa-angular:before {
  content: "\f420"; }

.fa-ankh:before {
  content: "\f644"; }

.fa-app-store:before {
  content: "\f36f"; }

.fa-app-store-ios:before {
  content: "\f370"; }

.fa-apper:before {
  content: "\f371"; }

.fa-apple:before {
  content: "\f179"; }

.fa-apple-alt:before {
  content: "\f5d1"; }

.fa-apple-pay:before {
  content: "\f415"; }

.fa-archive:before {
  content: "\f187"; }

.fa-archway:before {
  content: "\f557"; }

.fa-arrow-alt-circle-down:before {
  content: "\f358"; }

.fa-arrow-alt-circle-left:before {
  content: "\f359"; }

.fa-arrow-alt-circle-right:before {
  content: "\f35a"; }

.fa-arrow-alt-circle-up:before {
  content: "\f35b"; }

.fa-arrow-circle-down:before {
  content: "\f0ab"; }

.fa-arrow-circle-left:before {
  content: "\f0a8"; }

.fa-arrow-circle-right:before {
  content: "\f0a9"; }

.fa-arrow-circle-up:before {
  content: "\f0aa"; }

.fa-arrow-down:before {
  content: "\f063"; }

.fa-arrow-left:before {
  content: "\f060"; }

.fa-arrow-right:before {
  content: "\f061"; }

.fa-arrow-up:before {
  content: "\f062"; }

.fa-arrows-alt:before {
  content: "\f0b2"; }

.fa-arrows-alt-h:before {
  content: "\f337"; }

.fa-arrows-alt-v:before {
  content: "\f338"; }

.fa-artstation:before {
  content: "\f77a"; }

.fa-assistive-listening-systems:before {
  content: "\f2a2"; }

.fa-asterisk:before {
  content: "\f069"; }

.fa-asymmetrik:before {
  content: "\f372"; }

.fa-at:before {
  content: "\f1fa"; }

.fa-atlas:before {
  content: "\f558"; }

.fa-atlassian:before {
  content: "\f77b"; }

.fa-atom:before {
  content: "\f5d2"; }

.fa-audible:before {
  content: "\f373"; }

.fa-audio-description:before {
  content: "\f29e"; }

.fa-autoprefixer:before {
  content: "\f41c"; }

.fa-avianex:before {
  content: "\f374"; }

.fa-aviato:before {
  content: "\f421"; }

.fa-award:before {
  content: "\f559"; }

.fa-aws:before {
  content: "\f375"; }

.fa-baby:before {
  content: "\f77c"; }

.fa-baby-carriage:before {
  content: "\f77d"; }

.fa-backspace:before {
  content: "\f55a"; }

.fa-backward:before {
  content: "\f04a"; }

.fa-bacon:before {
  content: "\f7e5"; }

.fa-balance-scale:before {
  content: "\f24e"; }

.fa-balance-scale-left:before {
  content: "\f515"; }

.fa-balance-scale-right:before {
  content: "\f516"; }

.fa-ban:before {
  content: "\f05e"; }

.fa-band-aid:before {
  content: "\f462"; }

.fa-bandcamp:before {
  content: "\f2d5"; }

.fa-barcode:before {
  content: "\f02a"; }

.fa-bars:before {
  content: "\f0c9"; }

.fa-baseball-ball:before {
  content: "\f433"; }

.fa-basketball-ball:before {
  content: "\f434"; }

.fa-bath:before {
  content: "\f2cd"; }

.fa-battery-empty:before {
  content: "\f244"; }

.fa-battery-full:before {
  content: "\f240"; }

.fa-battery-half:before {
  content: "\f242"; }

.fa-battery-quarter:before {
  content: "\f243"; }

.fa-battery-three-quarters:before {
  content: "\f241"; }

.fa-battle-net:before {
  content: "\f835"; }

.fa-bed:before {
  content: "\f236"; }

.fa-beer:before {
  content: "\f0fc"; }

.fa-behance:before {
  content: "\f1b4"; }

.fa-behance-square:before {
  content: "\f1b5"; }

.fa-bell:before {
  content: "\f0f3"; }

.fa-bell-slash:before {
  content: "\f1f6"; }

.fa-bezier-curve:before {
  content: "\f55b"; }

.fa-bible:before {
  content: "\f647"; }

.fa-bicycle:before {
  content: "\f206"; }

.fa-biking:before {
  content: "\f84a"; }

.fa-bimobject:before {
  content: "\f378"; }

.fa-binoculars:before {
  content: "\f1e5"; }

.fa-biohazard:before {
  content: "\f780"; }

.fa-birthday-cake:before {
  content: "\f1fd"; }

.fa-bitbucket:before {
  content: "\f171"; }

.fa-bitcoin:before {
  content: "\f379"; }

.fa-bity:before {
  content: "\f37a"; }

.fa-black-tie:before {
  content: "\f27e"; }

.fa-blackberry:before {
  content: "\f37b"; }

.fa-blender:before {
  content: "\f517"; }

.fa-blender-phone:before {
  content: "\f6b6"; }

.fa-blind:before {
  content: "\f29d"; }

.fa-blog:before {
  content: "\f781"; }

.fa-blogger:before {
  content: "\f37c"; }

.fa-blogger-b:before {
  content: "\f37d"; }

.fa-bluetooth:before {
  content: "\f293"; }

.fa-bluetooth-b:before {
  content: "\f294"; }

.fa-bold:before {
  content: "\f032"; }

.fa-bolt:before {
  content: "\f0e7"; }

.fa-bomb:before {
  content: "\f1e2"; }

.fa-bone:before {
  content: "\f5d7"; }

.fa-bong:before {
  content: "\f55c"; }

.fa-book:before {
  content: "\f02d"; }

.fa-book-dead:before {
  content: "\f6b7"; }

.fa-book-medical:before {
  content: "\f7e6"; }

.fa-book-open:before {
  content: "\f518"; }

.fa-book-reader:before {
  content: "\f5da"; }

.fa-bookmark:before {
  content: "\f02e"; }

.fa-bootstrap:before {
  content: "\f836"; }

.fa-border-all:before {
  content: "\f84c"; }

.fa-border-none:before {
  content: "\f850"; }

.fa-border-style:before {
  content: "\f853"; }

.fa-bowling-ball:before {
  content: "\f436"; }

.fa-box:before {
  content: "\f466"; }

.fa-box-open:before {
  content: "\f49e"; }

.fa-boxes:before {
  content: "\f468"; }

.fa-braille:before {
  content: "\f2a1"; }

.fa-brain:before {
  content: "\f5dc"; }

.fa-bread-slice:before {
  content: "\f7ec"; }

.fa-briefcase:before {
  content: "\f0b1"; }

.fa-briefcase-medical:before {
  content: "\f469"; }

.fa-broadcast-tower:before {
  content: "\f519"; }

.fa-broom:before {
  content: "\f51a"; }

.fa-brush:before {
  content: "\f55d"; }

.fa-btc:before {
  content: "\f15a"; }

.fa-buffer:before {
  content: "\f837"; }

.fa-bug:before {
  content: "\f188"; }

.fa-building:before {
  content: "\f1ad"; }

.fa-bullhorn:before {
  content: "\f0a1"; }

.fa-bullseye:before {
  content: "\f140"; }

.fa-burn:before {
  content: "\f46a"; }

.fa-buromobelexperte:before {
  content: "\f37f"; }

.fa-bus:before {
  content: "\f207"; }

.fa-bus-alt:before {
  content: "\f55e"; }

.fa-business-time:before {
  content: "\f64a"; }

.fa-buysellads:before {
  content: "\f20d"; }

.fa-calculator:before {
  content: "\f1ec"; }

.fa-calendar:before {
  content: "\f133"; }

.fa-calendar-alt:before {
  content: "\f073"; }

.fa-calendar-check:before {
  content: "\f274"; }

.fa-calendar-day:before {
  content: "\f783"; }

.fa-calendar-minus:before {
  content: "\f272"; }

.fa-calendar-plus:before {
  content: "\f271"; }

.fa-calendar-times:before {
  content: "\f273"; }

.fa-calendar-week:before {
  content: "\f784"; }

.fa-camera:before {
  content: "\f030"; }

.fa-camera-retro:before {
  content: "\f083"; }

.fa-campground:before {
  content: "\f6bb"; }

.fa-canadian-maple-leaf:before {
  content: "\f785"; }

.fa-candy-cane:before {
  content: "\f786"; }

.fa-cannabis:before {
  content: "\f55f"; }

.fa-capsules:before {
  content: "\f46b"; }

.fa-car:before {
  content: "\f1b9"; }

.fa-car-alt:before {
  content: "\f5de"; }

.fa-car-battery:before {
  content: "\f5df"; }

.fa-car-crash:before {
  content: "\f5e1"; }

.fa-car-side:before {
  content: "\f5e4"; }

.fa-caret-down:before {
  content: "\f0d7"; }

.fa-caret-left:before {
  content: "\f0d9"; }

.fa-caret-right:before {
  content: "\f0da"; }

.fa-caret-square-down:before {
  content: "\f150"; }

.fa-caret-square-left:before {
  content: "\f191"; }

.fa-caret-square-right:before {
  content: "\f152"; }

.fa-caret-square-up:before {
  content: "\f151"; }

.fa-caret-up:before {
  content: "\f0d8"; }

.fa-carrot:before {
  content: "\f787"; }

.fa-cart-arrow-down:before {
  content: "\f218"; }

.fa-cart-plus:before {
  content: "\f217"; }

.fa-cash-register:before {
  content: "\f788"; }

.fa-cat:before {
  content: "\f6be"; }

.fa-cc-amazon-pay:before {
  content: "\f42d"; }

.fa-cc-amex:before {
  content: "\f1f3"; }

.fa-cc-apple-pay:before {
  content: "\f416"; }

.fa-cc-diners-club:before {
  content: "\f24c"; }

.fa-cc-discover:before {
  content: "\f1f2"; }

.fa-cc-jcb:before {
  content: "\f24b"; }

.fa-cc-mastercard:before {
  content: "\f1f1"; }

.fa-cc-paypal:before {
  content: "\f1f4"; }

.fa-cc-stripe:before {
  content: "\f1f5"; }

.fa-cc-visa:before {
  content: "\f1f0"; }

.fa-centercode:before {
  content: "\f380"; }

.fa-centos:before {
  content: "\f789"; }

.fa-certificate:before {
  content: "\f0a3"; }

.fa-chair:before {
  content: "\f6c0"; }

.fa-chalkboard:before {
  content: "\f51b"; }

.fa-chalkboard-teacher:before {
  content: "\f51c"; }

.fa-charging-station:before {
  content: "\f5e7"; }

.fa-chart-area:before {
  content: "\f1fe"; }

.fa-chart-bar:before {
  content: "\f080"; }

.fa-chart-line:before {
  content: "\f201"; }

.fa-chart-pie:before {
  content: "\f200"; }

.fa-check:before {
  content: "\f00c"; }

.fa-check-circle:before {
  content: "\f058"; }

.fa-check-double:before {
  content: "\f560"; }

.fa-check-square:before {
  content: "\f14a"; }

.fa-cheese:before {
  content: "\f7ef"; }

.fa-chess:before {
  content: "\f439"; }

.fa-chess-bishop:before {
  content: "\f43a"; }

.fa-chess-board:before {
  content: "\f43c"; }

.fa-chess-king:before {
  content: "\f43f"; }

.fa-chess-knight:before {
  content: "\f441"; }

.fa-chess-pawn:before {
  content: "\f443"; }

.fa-chess-queen:before {
  content: "\f445"; }

.fa-chess-rook:before {
  content: "\f447"; }

.fa-chevron-circle-down:before {
  content: "\f13a"; }

.fa-chevron-circle-left:before {
  content: "\f137"; }

.fa-chevron-circle-right:before {
  content: "\f138"; }

.fa-chevron-circle-up:before {
  content: "\f139"; }

.fa-chevron-down:before {
  content: "\f078"; }

.fa-chevron-left:before {
  content: "\f053"; }

.fa-chevron-right:before {
  content: "\f054"; }

.fa-chevron-up:before {
  content: "\f077"; }

.fa-child:before {
  content: "\f1ae"; }

.fa-chrome:before {
  content: "\f268"; }

.fa-chromecast:before {
  content: "\f838"; }

.fa-church:before {
  content: "\f51d"; }

.fa-circle:before {
  content: "\f111"; }

.fa-circle-notch:before {
  content: "\f1ce"; }

.fa-city:before {
  content: "\f64f"; }

.fa-clinic-medical:before {
  content: "\f7f2"; }

.fa-clipboard:before {
  content: "\f328"; }

.fa-clipboard-check:before {
  content: "\f46c"; }

.fa-clipboard-list:before {
  content: "\f46d"; }

.fa-clock:before {
  content: "\f017"; }

.fa-clone:before {
  content: "\f24d"; }

.fa-closed-captioning:before {
  content: "\f20a"; }

.fa-cloud:before {
  content: "\f0c2"; }

.fa-cloud-download-alt:before {
  content: "\f381"; }

.fa-cloud-meatball:before {
  content: "\f73b"; }

.fa-cloud-moon:before {
  content: "\f6c3"; }

.fa-cloud-moon-rain:before {
  content: "\f73c"; }

.fa-cloud-rain:before {
  content: "\f73d"; }

.fa-cloud-showers-heavy:before {
  content: "\f740"; }

.fa-cloud-sun:before {
  content: "\f6c4"; }

.fa-cloud-sun-rain:before {
  content: "\f743"; }

.fa-cloud-upload-alt:before {
  content: "\f382"; }

.fa-cloudscale:before {
  content: "\f383"; }

.fa-cloudsmith:before {
  content: "\f384"; }

.fa-cloudversify:before {
  content: "\f385"; }

.fa-cocktail:before {
  content: "\f561"; }

.fa-code:before {
  content: "\f121"; }

.fa-code-branch:before {
  content: "\f126"; }

.fa-codepen:before {
  content: "\f1cb"; }

.fa-codiepie:before {
  content: "\f284"; }

.fa-coffee:before {
  content: "\f0f4"; }

.fa-cog:before {
  content: "\f013"; }

.fa-cogs:before {
  content: "\f085"; }

.fa-coins:before {
  content: "\f51e"; }

.fa-columns:before {
  content: "\f0db"; }

.fa-comment:before {
  content: "\f075"; }

.fa-comment-alt:before {
  content: "\f27a"; }

.fa-comment-dollar:before {
  content: "\f651"; }

.fa-comment-dots:before {
  content: "\f4ad"; }

.fa-comment-medical:before {
  content: "\f7f5"; }

.fa-comment-slash:before {
  content: "\f4b3"; }

.fa-comments:before {
  content: "\f086"; }

.fa-comments-dollar:before {
  content: "\f653"; }

.fa-compact-disc:before {
  content: "\f51f"; }

.fa-compass:before {
  content: "\f14e"; }

.fa-compress:before {
  content: "\f066"; }

.fa-compress-arrows-alt:before {
  content: "\f78c"; }

.fa-concierge-bell:before {
  content: "\f562"; }

.fa-confluence:before {
  content: "\f78d"; }

.fa-connectdevelop:before {
  content: "\f20e"; }

.fa-contao:before {
  content: "\f26d"; }

.fa-cookie:before {
  content: "\f563"; }

.fa-cookie-bite:before {
  content: "\f564"; }

.fa-copy:before {
  content: "\f0c5"; }

.fa-copyright:before {
  content: "\f1f9"; }

.fa-couch:before {
  content: "\f4b8"; }

.fa-cpanel:before {
  content: "\f388"; }

.fa-creative-commons:before {
  content: "\f25e"; }

.fa-creative-commons-by:before {
  content: "\f4e7"; }

.fa-creative-commons-nc:before {
  content: "\f4e8"; }

.fa-creative-commons-nc-eu:before {
  content: "\f4e9"; }

.fa-creative-commons-nc-jp:before {
  content: "\f4ea"; }

.fa-creative-commons-nd:before {
  content: "\f4eb"; }

.fa-creative-commons-pd:before {
  content: "\f4ec"; }

.fa-creative-commons-pd-alt:before {
  content: "\f4ed"; }

.fa-creative-commons-remix:before {
  content: "\f4ee"; }

.fa-creative-commons-sa:before {
  content: "\f4ef"; }

.fa-creative-commons-sampling:before {
  content: "\f4f0"; }

.fa-creative-commons-sampling-plus:before {
  content: "\f4f1"; }

.fa-creative-commons-share:before {
  content: "\f4f2"; }

.fa-creative-commons-zero:before {
  content: "\f4f3"; }

.fa-credit-card:before {
  content: "\f09d"; }

.fa-critical-role:before {
  content: "\f6c9"; }

.fa-crop:before {
  content: "\f125"; }

.fa-crop-alt:before {
  content: "\f565"; }

.fa-cross:before {
  content: "\f654"; }

.fa-crosshairs:before {
  content: "\f05b"; }

.fa-crow:before {
  content: "\f520"; }

.fa-crown:before {
  content: "\f521"; }

.fa-crutch:before {
  content: "\f7f7"; }

.fa-css3:before {
  content: "\f13c"; }

.fa-css3-alt:before {
  content: "\f38b"; }

.fa-cube:before {
  content: "\f1b2"; }

.fa-cubes:before {
  content: "\f1b3"; }

.fa-cut:before {
  content: "\f0c4"; }

.fa-cuttlefish:before {
  content: "\f38c"; }

.fa-d-and-d:before {
  content: "\f38d"; }

.fa-d-and-d-beyond:before {
  content: "\f6ca"; }

.fa-dashcube:before {
  content: "\f210"; }

.fa-database:before {
  content: "\f1c0"; }

.fa-deaf:before {
  content: "\f2a4"; }

.fa-delicious:before {
  content: "\f1a5"; }

.fa-democrat:before {
  content: "\f747"; }

.fa-deploydog:before {
  content: "\f38e"; }

.fa-deskpro:before {
  content: "\f38f"; }

.fa-desktop:before {
  content: "\f108"; }

.fa-dev:before {
  content: "\f6cc"; }

.fa-deviantart:before {
  content: "\f1bd"; }

.fa-dharmachakra:before {
  content: "\f655"; }

.fa-dhl:before {
  content: "\f790"; }

.fa-diagnoses:before {
  content: "\f470"; }

.fa-diaspora:before {
  content: "\f791"; }

.fa-dice:before {
  content: "\f522"; }

.fa-dice-d20:before {
  content: "\f6cf"; }

.fa-dice-d6:before {
  content: "\f6d1"; }

.fa-dice-five:before {
  content: "\f523"; }

.fa-dice-four:before {
  content: "\f524"; }

.fa-dice-one:before {
  content: "\f525"; }

.fa-dice-six:before {
  content: "\f526"; }

.fa-dice-three:before {
  content: "\f527"; }

.fa-dice-two:before {
  content: "\f528"; }

.fa-digg:before {
  content: "\f1a6"; }

.fa-digital-ocean:before {
  content: "\f391"; }

.fa-digital-tachograph:before {
  content: "\f566"; }

.fa-directions:before {
  content: "\f5eb"; }

.fa-discord:before {
  content: "\f392"; }

.fa-discourse:before {
  content: "\f393"; }

.fa-divide:before {
  content: "\f529"; }

.fa-dizzy:before {
  content: "\f567"; }

.fa-dna:before {
  content: "\f471"; }

.fa-dochub:before {
  content: "\f394"; }

.fa-docker:before {
  content: "\f395"; }

.fa-dog:before {
  content: "\f6d3"; }

.fa-dollar-sign:before {
  content: "\f155"; }

.fa-dolly:before {
  content: "\f472"; }

.fa-dolly-flatbed:before {
  content: "\f474"; }

.fa-donate:before {
  content: "\f4b9"; }

.fa-door-closed:before {
  content: "\f52a"; }

.fa-door-open:before {
  content: "\f52b"; }

.fa-dot-circle:before {
  content: "\f192"; }

.fa-dove:before {
  content: "\f4ba"; }

.fa-download:before {
  content: "\f019"; }

.fa-draft2digital:before {
  content: "\f396"; }

.fa-drafting-compass:before {
  content: "\f568"; }

.fa-dragon:before {
  content: "\f6d5"; }

.fa-draw-polygon:before {
  content: "\f5ee"; }

.fa-dribbble:before {
  content: "\f17d"; }

.fa-dribbble-square:before {
  content: "\f397"; }

.fa-dropbox:before {
  content: "\f16b"; }

.fa-drum:before {
  content: "\f569"; }

.fa-drum-steelpan:before {
  content: "\f56a"; }

.fa-drumstick-bite:before {
  content: "\f6d7"; }

.fa-drupal:before {
  content: "\f1a9"; }

.fa-dumbbell:before {
  content: "\f44b"; }

.fa-dumpster:before {
  content: "\f793"; }

.fa-dumpster-fire:before {
  content: "\f794"; }

.fa-dungeon:before {
  content: "\f6d9"; }

.fa-dyalog:before {
  content: "\f399"; }

.fa-earlybirds:before {
  content: "\f39a"; }

.fa-ebay:before {
  content: "\f4f4"; }

.fa-edge:before {
  content: "\f282"; }

.fa-edit:before {
  content: "\f044"; }

.fa-egg:before {
  content: "\f7fb"; }

.fa-eject:before {
  content: "\f052"; }

.fa-elementor:before {
  content: "\f430"; }

.fa-ellipsis-h:before {
  content: "\f141"; }

.fa-ellipsis-v:before {
  content: "\f142"; }

.fa-ello:before {
  content: "\f5f1"; }

.fa-ember:before {
  content: "\f423"; }

.fa-empire:before {
  content: "\f1d1"; }

.fa-envelope:before {
  content: "\f0e0"; }

.fa-envelope-open:before {
  content: "\f2b6"; }

.fa-envelope-open-text:before {
  content: "\f658"; }

.fa-envelope-square:before {
  content: "\f199"; }

.fa-envira:before {
  content: "\f299"; }

.fa-equals:before {
  content: "\f52c"; }

.fa-eraser:before {
  content: "\f12d"; }

.fa-erlang:before {
  content: "\f39d"; }

.fa-ethereum:before {
  content: "\f42e"; }

.fa-ethernet:before {
  content: "\f796"; }

.fa-etsy:before {
  content: "\f2d7"; }

.fa-euro-sign:before {
  content: "\f153"; }

.fa-evernote:before {
  content: "\f839"; }

.fa-exchange-alt:before {
  content: "\f362"; }

.fa-exclamation:before {
  content: "\f12a"; }

.fa-exclamation-circle:before {
  content: "\f06a"; }

.fa-exclamation-triangle:before {
  content: "\f071"; }

.fa-expand:before {
  content: "\f065"; }

.fa-expand-arrows-alt:before {
  content: "\f31e"; }

.fa-expeditedssl:before {
  content: "\f23e"; }

.fa-external-link-alt:before {
  content: "\f35d"; }

.fa-external-link-square-alt:before {
  content: "\f360"; }

.fa-eye:before {
  content: "\f06e"; }

.fa-eye-dropper:before {
  content: "\f1fb"; }

.fa-eye-slash:before {
  content: "\f070"; }

.fa-facebook:before {
  content: "\f09a"; }

.fa-facebook-f:before {
  content: "\f39e"; }

.fa-facebook-messenger:before {
  content: "\f39f"; }

.fa-facebook-square:before {
  content: "\f082"; }

.fa-fan:before {
  content: "\f863"; }

.fa-fantasy-flight-games:before {
  content: "\f6dc"; }

.fa-fast-backward:before {
  content: "\f049"; }

.fa-fast-forward:before {
  content: "\f050"; }

.fa-fax:before {
  content: "\f1ac"; }

.fa-feather:before {
  content: "\f52d"; }

.fa-feather-alt:before {
  content: "\f56b"; }

.fa-fedex:before {
  content: "\f797"; }

.fa-fedora:before {
  content: "\f798"; }

.fa-female:before {
  content: "\f182"; }

.fa-fighter-jet:before {
  content: "\f0fb"; }

.fa-figma:before {
  content: "\f799"; }

.fa-file:before {
  content: "\f15b"; }

.fa-file-alt:before {
  content: "\f15c"; }

.fa-file-archive:before {
  content: "\f1c6"; }

.fa-file-audio:before {
  content: "\f1c7"; }

.fa-file-code:before {
  content: "\f1c9"; }

.fa-file-contract:before {
  content: "\f56c"; }

.fa-file-csv:before {
  content: "\f6dd"; }

.fa-file-download:before {
  content: "\f56d"; }

.fa-file-excel:before {
  content: "\f1c3"; }

.fa-file-export:before {
  content: "\f56e"; }

.fa-file-image:before {
  content: "\f1c5"; }

.fa-file-import:before {
  content: "\f56f"; }

.fa-file-invoice:before {
  content: "\f570"; }

.fa-file-invoice-dollar:before {
  content: "\f571"; }

.fa-file-medical:before {
  content: "\f477"; }

.fa-file-medical-alt:before {
  content: "\f478"; }

.fa-file-pdf:before {
  content: "\f1c1"; }

.fa-file-powerpoint:before {
  content: "\f1c4"; }

.fa-file-prescription:before {
  content: "\f572"; }

.fa-file-signature:before {
  content: "\f573"; }

.fa-file-upload:before {
  content: "\f574"; }

.fa-file-video:before {
  content: "\f1c8"; }

.fa-file-word:before {
  content: "\f1c2"; }

.fa-fill:before {
  content: "\f575"; }

.fa-fill-drip:before {
  content: "\f576"; }

.fa-film:before {
  content: "\f008"; }

.fa-filter:before {
  content: "\f0b0"; }

.fa-fingerprint:before {
  content: "\f577"; }

.fa-fire:before {
  content: "\f06d"; }

.fa-fire-alt:before {
  content: "\f7e4"; }

.fa-fire-extinguisher:before {
  content: "\f134"; }

.fa-firefox:before {
  content: "\f269"; }

.fa-first-aid:before {
  content: "\f479"; }

.fa-first-order:before {
  content: "\f2b0"; }

.fa-first-order-alt:before {
  content: "\f50a"; }

.fa-firstdraft:before {
  content: "\f3a1"; }

.fa-fish:before {
  content: "\f578"; }

.fa-fist-raised:before {
  content: "\f6de"; }

.fa-flag:before {
  content: "\f024"; }

.fa-flag-checkered:before {
  content: "\f11e"; }

.fa-flag-usa:before {
  content: "\f74d"; }

.fa-flask:before {
  content: "\f0c3"; }

.fa-flickr:before {
  content: "\f16e"; }

.fa-flipboard:before {
  content: "\f44d"; }

.fa-flushed:before {
  content: "\f579"; }

.fa-fly:before {
  content: "\f417"; }

.fa-folder:before {
  content: "\f07b"; }

.fa-folder-minus:before {
  content: "\f65d"; }

.fa-folder-open:before {
  content: "\f07c"; }

.fa-folder-plus:before {
  content: "\f65e"; }

.fa-font:before {
  content: "\f031"; }

.fa-font-awesome:before {
  content: "\f2b4"; }

.fa-font-awesome-alt:before {
  content: "\f35c"; }

.fa-font-awesome-flag:before {
  content: "\f425"; }

.fa-font-awesome-logo-full:before {
  content: "\f4e6"; }

.fa-fonticons:before {
  content: "\f280"; }

.fa-fonticons-fi:before {
  content: "\f3a2"; }

.fa-football-ball:before {
  content: "\f44e"; }

.fa-fort-awesome:before {
  content: "\f286"; }

.fa-fort-awesome-alt:before {
  content: "\f3a3"; }

.fa-forumbee:before {
  content: "\f211"; }

.fa-forward:before {
  content: "\f04e"; }

.fa-foursquare:before {
  content: "\f180"; }

.fa-free-code-camp:before {
  content: "\f2c5"; }

.fa-freebsd:before {
  content: "\f3a4"; }

.fa-frog:before {
  content: "\f52e"; }

.fa-frown:before {
  content: "\f119"; }

.fa-frown-open:before {
  content: "\f57a"; }

.fa-fulcrum:before {
  content: "\f50b"; }

.fa-funnel-dollar:before {
  content: "\f662"; }

.fa-futbol:before {
  content: "\f1e3"; }

.fa-galactic-republic:before {
  content: "\f50c"; }

.fa-galactic-senate:before {
  content: "\f50d"; }

.fa-gamepad:before {
  content: "\f11b"; }

.fa-gas-pump:before {
  content: "\f52f"; }

.fa-gavel:before {
  content: "\f0e3"; }

.fa-gem:before {
  content: "\f3a5"; }

.fa-genderless:before {
  content: "\f22d"; }

.fa-get-pocket:before {
  content: "\f265"; }

.fa-gg:before {
  content: "\f260"; }

.fa-gg-circle:before {
  content: "\f261"; }

.fa-ghost:before {
  content: "\f6e2"; }

.fa-gift:before {
  content: "\f06b"; }

.fa-gifts:before {
  content: "\f79c"; }

.fa-git:before {
  content: "\f1d3"; }

.fa-git-alt:before {
  content: "\f841"; }

.fa-git-square:before {
  content: "\f1d2"; }

.fa-github:before {
  content: "\f09b"; }

.fa-github-alt:before {
  content: "\f113"; }

.fa-github-square:before {
  content: "\f092"; }

.fa-gitkraken:before {
  content: "\f3a6"; }

.fa-gitlab:before {
  content: "\f296"; }

.fa-gitter:before {
  content: "\f426"; }

.fa-glass-cheers:before {
  content: "\f79f"; }

.fa-glass-martini:before {
  content: "\f000"; }

.fa-glass-martini-alt:before {
  content: "\f57b"; }

.fa-glass-whiskey:before {
  content: "\f7a0"; }

.fa-glasses:before {
  content: "\f530"; }

.fa-glide:before {
  content: "\f2a5"; }

.fa-glide-g:before {
  content: "\f2a6"; }

.fa-globe:before {
  content: "\f0ac"; }

.fa-globe-africa:before {
  content: "\f57c"; }

.fa-globe-americas:before {
  content: "\f57d"; }

.fa-globe-asia:before {
  content: "\f57e"; }

.fa-globe-europe:before {
  content: "\f7a2"; }

.fa-gofore:before {
  content: "\f3a7"; }

.fa-golf-ball:before {
  content: "\f450"; }

.fa-goodreads:before {
  content: "\f3a8"; }

.fa-goodreads-g:before {
  content: "\f3a9"; }

.fa-google:before {
  content: "\f1a0"; }

.fa-google-drive:before {
  content: "\f3aa"; }

.fa-google-play:before {
  content: "\f3ab"; }

.fa-google-plus:before {
  content: "\f2b3"; }

.fa-google-plus-g:before {
  content: "\f0d5"; }

.fa-google-plus-square:before {
  content: "\f0d4"; }

.fa-google-wallet:before {
  content: "\f1ee"; }

.fa-gopuram:before {
  content: "\f664"; }

.fa-graduation-cap:before {
  content: "\f19d"; }

.fa-gratipay:before {
  content: "\f184"; }

.fa-grav:before {
  content: "\f2d6"; }

.fa-greater-than:before {
  content: "\f531"; }

.fa-greater-than-equal:before {
  content: "\f532"; }

.fa-grimace:before {
  content: "\f57f"; }

.fa-grin:before {
  content: "\f580"; }

.fa-grin-alt:before {
  content: "\f581"; }

.fa-grin-beam:before {
  content: "\f582"; }

.fa-grin-beam-sweat:before {
  content: "\f583"; }

.fa-grin-hearts:before {
  content: "\f584"; }

.fa-grin-squint:before {
  content: "\f585"; }

.fa-grin-squint-tears:before {
  content: "\f586"; }

.fa-grin-stars:before {
  content: "\f587"; }

.fa-grin-tears:before {
  content: "\f588"; }

.fa-grin-tongue:before {
  content: "\f589"; }

.fa-grin-tongue-squint:before {
  content: "\f58a"; }

.fa-grin-tongue-wink:before {
  content: "\f58b"; }

.fa-grin-wink:before {
  content: "\f58c"; }

.fa-grip-horizontal:before {
  content: "\f58d"; }

.fa-grip-lines:before {
  content: "\f7a4"; }

.fa-grip-lines-vertical:before {
  content: "\f7a5"; }

.fa-grip-vertical:before {
  content: "\f58e"; }

.fa-gripfire:before {
  content: "\f3ac"; }

.fa-grunt:before {
  content: "\f3ad"; }

.fa-guitar:before {
  content: "\f7a6"; }

.fa-gulp:before {
  content: "\f3ae"; }

.fa-h-square:before {
  content: "\f0fd"; }

.fa-hacker-news:before {
  content: "\f1d4"; }

.fa-hacker-news-square:before {
  content: "\f3af"; }

.fa-hackerrank:before {
  content: "\f5f7"; }

.fa-hamburger:before {
  content: "\f805"; }

.fa-hammer:before {
  content: "\f6e3"; }

.fa-hamsa:before {
  content: "\f665"; }

.fa-hand-holding:before {
  content: "\f4bd"; }

.fa-hand-holding-heart:before {
  content: "\f4be"; }

.fa-hand-holding-usd:before {
  content: "\f4c0"; }

.fa-hand-lizard:before {
  content: "\f258"; }

.fa-hand-middle-finger:before {
  content: "\f806"; }

.fa-hand-paper:before {
  content: "\f256"; }

.fa-hand-peace:before {
  content: "\f25b"; }

.fa-hand-point-down:before {
  content: "\f0a7"; }

.fa-hand-point-left:before {
  content: "\f0a5"; }

.fa-hand-point-right:before {
  content: "\f0a4"; }

.fa-hand-point-up:before {
  content: "\f0a6"; }

.fa-hand-pointer:before {
  content: "\f25a"; }

.fa-hand-rock:before {
  content: "\f255"; }

.fa-hand-scissors:before {
  content: "\f257"; }

.fa-hand-spock:before {
  content: "\f259"; }

.fa-hands:before {
  content: "\f4c2"; }

.fa-hands-helping:before {
  content: "\f4c4"; }

.fa-handshake:before {
  content: "\f2b5"; }

.fa-hanukiah:before {
  content: "\f6e6"; }

.fa-hard-hat:before {
  content: "\f807"; }

.fa-hashtag:before {
  content: "\f292"; }

.fa-hat-wizard:before {
  content: "\f6e8"; }

.fa-haykal:before {
  content: "\f666"; }

.fa-hdd:before {
  content: "\f0a0"; }

.fa-heading:before {
  content: "\f1dc"; }

.fa-headphones:before {
  content: "\f025"; }

.fa-headphones-alt:before {
  content: "\f58f"; }

.fa-headset:before {
  content: "\f590"; }

.fa-heart:before {
  content: "\f004"; }

.fa-heart-broken:before {
  content: "\f7a9"; }

.fa-heartbeat:before {
  content: "\f21e"; }

.fa-helicopter:before {
  content: "\f533"; }

.fa-highlighter:before {
  content: "\f591"; }

.fa-hiking:before {
  content: "\f6ec"; }

.fa-hippo:before {
  content: "\f6ed"; }

.fa-hips:before {
  content: "\f452"; }

.fa-hire-a-helper:before {
  content: "\f3b0"; }

.fa-history:before {
  content: "\f1da"; }

.fa-hockey-puck:before {
  content: "\f453"; }

.fa-holly-berry:before {
  content: "\f7aa"; }

.fa-home:before {
  content: "\f015"; }

.fa-hooli:before {
  content: "\f427"; }

.fa-hornbill:before {
  content: "\f592"; }

.fa-horse:before {
  content: "\f6f0"; }

.fa-horse-head:before {
  content: "\f7ab"; }

.fa-hospital:before {
  content: "\f0f8"; }

.fa-hospital-alt:before {
  content: "\f47d"; }

.fa-hospital-symbol:before {
  content: "\f47e"; }

.fa-hot-tub:before {
  content: "\f593"; }

.fa-hotdog:before {
  content: "\f80f"; }

.fa-hotel:before {
  content: "\f594"; }

.fa-hotjar:before {
  content: "\f3b1"; }

.fa-hourglass:before {
  content: "\f254"; }

.fa-hourglass-end:before {
  content: "\f253"; }

.fa-hourglass-half:before {
  content: "\f252"; }

.fa-hourglass-start:before {
  content: "\f251"; }

.fa-house-damage:before {
  content: "\f6f1"; }

.fa-houzz:before {
  content: "\f27c"; }

.fa-hryvnia:before {
  content: "\f6f2"; }

.fa-html5:before {
  content: "\f13b"; }

.fa-hubspot:before {
  content: "\f3b2"; }

.fa-i-cursor:before {
  content: "\f246"; }

.fa-ice-cream:before {
  content: "\f810"; }

.fa-icicles:before {
  content: "\f7ad"; }

.fa-icons:before {
  content: "\f86d"; }

.fa-id-badge:before {
  content: "\f2c1"; }

.fa-id-card:before {
  content: "\f2c2"; }

.fa-id-card-alt:before {
  content: "\f47f"; }

.fa-igloo:before {
  content: "\f7ae"; }

.fa-image:before {
  content: "\f03e"; }

.fa-images:before {
  content: "\f302"; }

.fa-imdb:before {
  content: "\f2d8"; }

.fa-inbox:before {
  content: "\f01c"; }

.fa-indent:before {
  content: "\f03c"; }

.fa-industry:before {
  content: "\f275"; }

.fa-infinity:before {
  content: "\f534"; }

.fa-info:before {
  content: "\f129"; }

.fa-info-circle:before {
  content: "\f05a"; }

.fa-instagram:before {
  content: "\f16d"; }

.fa-intercom:before {
  content: "\f7af"; }

.fa-internet-explorer:before {
  content: "\f26b"; }

.fa-invision:before {
  content: "\f7b0"; }

.fa-ioxhost:before {
  content: "\f208"; }

.fa-italic:before {
  content: "\f033"; }

.fa-itch-io:before {
  content: "\f83a"; }

.fa-itunes:before {
  content: "\f3b4"; }

.fa-itunes-note:before {
  content: "\f3b5"; }

.fa-java:before {
  content: "\f4e4"; }

.fa-jedi:before {
  content: "\f669"; }

.fa-jedi-order:before {
  content: "\f50e"; }

.fa-jenkins:before {
  content: "\f3b6"; }

.fa-jira:before {
  content: "\f7b1"; }

.fa-joget:before {
  content: "\f3b7"; }

.fa-joint:before {
  content: "\f595"; }

.fa-joomla:before {
  content: "\f1aa"; }

.fa-journal-whills:before {
  content: "\f66a"; }

.fa-js:before {
  content: "\f3b8"; }

.fa-js-square:before {
  content: "\f3b9"; }

.fa-jsfiddle:before {
  content: "\f1cc"; }

.fa-kaaba:before {
  content: "\f66b"; }

.fa-kaggle:before {
  content: "\f5fa"; }

.fa-key:before {
  content: "\f084"; }

.fa-keybase:before {
  content: "\f4f5"; }

.fa-keyboard:before {
  content: "\f11c"; }

.fa-keycdn:before {
  content: "\f3ba"; }

.fa-khanda:before {
  content: "\f66d"; }

.fa-kickstarter:before {
  content: "\f3bb"; }

.fa-kickstarter-k:before {
  content: "\f3bc"; }

.fa-kiss:before {
  content: "\f596"; }

.fa-kiss-beam:before {
  content: "\f597"; }

.fa-kiss-wink-heart:before {
  content: "\f598"; }

.fa-kiwi-bird:before {
  content: "\f535"; }

.fa-korvue:before {
  content: "\f42f"; }

.fa-landmark:before {
  content: "\f66f"; }

.fa-language:before {
  content: "\f1ab"; }

.fa-laptop:before {
  content: "\f109"; }

.fa-laptop-code:before {
  content: "\f5fc"; }

.fa-laptop-medical:before {
  content: "\f812"; }

.fa-laravel:before {
  content: "\f3bd"; }

.fa-lastfm:before {
  content: "\f202"; }

.fa-lastfm-square:before {
  content: "\f203"; }

.fa-laugh:before {
  content: "\f599"; }

.fa-laugh-beam:before {
  content: "\f59a"; }

.fa-laugh-squint:before {
  content: "\f59b"; }

.fa-laugh-wink:before {
  content: "\f59c"; }

.fa-layer-group:before {
  content: "\f5fd"; }

.fa-leaf:before {
  content: "\f06c"; }

.fa-leanpub:before {
  content: "\f212"; }

.fa-lemon:before {
  content: "\f094"; }

.fa-less:before {
  content: "\f41d"; }

.fa-less-than:before {
  content: "\f536"; }

.fa-less-than-equal:before {
  content: "\f537"; }

.fa-level-down-alt:before {
  content: "\f3be"; }

.fa-level-up-alt:before {
  content: "\f3bf"; }

.fa-life-ring:before {
  content: "\f1cd"; }

.fa-lightbulb:before {
  content: "\f0eb"; }

.fa-line:before {
  content: "\f3c0"; }

.fa-link:before {
  content: "\f0c1"; }

.fa-linkedin:before {
  content: "\f08c"; }

.fa-linkedin-in:before {
  content: "\f0e1"; }

.fa-linode:before {
  content: "\f2b8"; }

.fa-linux:before {
  content: "\f17c"; }

.fa-lira-sign:before {
  content: "\f195"; }

.fa-list:before {
  content: "\f03a"; }

.fa-list-alt:before {
  content: "\f022"; }

.fa-list-ol:before {
  content: "\f0cb"; }

.fa-list-ul:before {
  content: "\f0ca"; }

.fa-location-arrow:before {
  content: "\f124"; }

.fa-lock:before {
  content: "\f023"; }

.fa-lock-open:before {
  content: "\f3c1"; }

.fa-long-arrow-alt-down:before {
  content: "\f309"; }

.fa-long-arrow-alt-left:before {
  content: "\f30a"; }

.fa-long-arrow-alt-right:before {
  content: "\f30b"; }

.fa-long-arrow-alt-up:before {
  content: "\f30c"; }

.fa-low-vision:before {
  content: "\f2a8"; }

.fa-luggage-cart:before {
  content: "\f59d"; }

.fa-lyft:before {
  content: "\f3c3"; }

.fa-magento:before {
  content: "\f3c4"; }

.fa-magic:before {
  content: "\f0d0"; }

.fa-magnet:before {
  content: "\f076"; }

.fa-mail-bulk:before {
  content: "\f674"; }

.fa-mailchimp:before {
  content: "\f59e"; }

.fa-male:before {
  content: "\f183"; }

.fa-mandalorian:before {
  content: "\f50f"; }

.fa-map:before {
  content: "\f279"; }

.fa-map-marked:before {
  content: "\f59f"; }

.fa-map-marked-alt:before {
  content: "\f5a0"; }

.fa-map-marker:before {
  content: "\f041"; }

.fa-map-marker-alt:before {
  content: "\f3c5"; }

.fa-map-pin:before {
  content: "\f276"; }

.fa-map-signs:before {
  content: "\f277"; }

.fa-markdown:before {
  content: "\f60f"; }

.fa-marker:before {
  content: "\f5a1"; }

.fa-mars:before {
  content: "\f222"; }

.fa-mars-double:before {
  content: "\f227"; }

.fa-mars-stroke:before {
  content: "\f229"; }

.fa-mars-stroke-h:before {
  content: "\f22b"; }

.fa-mars-stroke-v:before {
  content: "\f22a"; }

.fa-mask:before {
  content: "\f6fa"; }

.fa-mastodon:before {
  content: "\f4f6"; }

.fa-maxcdn:before {
  content: "\f136"; }

.fa-medal:before {
  content: "\f5a2"; }

.fa-medapps:before {
  content: "\f3c6"; }

.fa-medium:before {
  content: "\f23a"; }

.fa-medium-m:before {
  content: "\f3c7"; }

.fa-medkit:before {
  content: "\f0fa"; }

.fa-medrt:before {
  content: "\f3c8"; }

.fa-meetup:before {
  content: "\f2e0"; }

.fa-megaport:before {
  content: "\f5a3"; }

.fa-meh:before {
  content: "\f11a"; }

.fa-meh-blank:before {
  content: "\f5a4"; }

.fa-meh-rolling-eyes:before {
  content: "\f5a5"; }

.fa-memory:before {
  content: "\f538"; }

.fa-mendeley:before {
  content: "\f7b3"; }

.fa-menorah:before {
  content: "\f676"; }

.fa-mercury:before {
  content: "\f223"; }

.fa-meteor:before {
  content: "\f753"; }

.fa-microchip:before {
  content: "\f2db"; }

.fa-microphone:before {
  content: "\f130"; }

.fa-microphone-alt:before {
  content: "\f3c9"; }

.fa-microphone-alt-slash:before {
  content: "\f539"; }

.fa-microphone-slash:before {
  content: "\f131"; }

.fa-microscope:before {
  content: "\f610"; }

.fa-microsoft:before {
  content: "\f3ca"; }

.fa-minus:before {
  content: "\f068"; }

.fa-minus-circle:before {
  content: "\f056"; }

.fa-minus-square:before {
  content: "\f146"; }

.fa-mitten:before {
  content: "\f7b5"; }

.fa-mix:before {
  content: "\f3cb"; }

.fa-mixcloud:before {
  content: "\f289"; }

.fa-mizuni:before {
  content: "\f3cc"; }

.fa-mobile:before {
  content: "\f10b"; }

.fa-mobile-alt:before {
  content: "\f3cd"; }

.fa-modx:before {
  content: "\f285"; }

.fa-monero:before {
  content: "\f3d0"; }

.fa-money-bill:before {
  content: "\f0d6"; }

.fa-money-bill-alt:before {
  content: "\f3d1"; }

.fa-money-bill-wave:before {
  content: "\f53a"; }

.fa-money-bill-wave-alt:before {
  content: "\f53b"; }

.fa-money-check:before {
  content: "\f53c"; }

.fa-money-check-alt:before {
  content: "\f53d"; }

.fa-monument:before {
  content: "\f5a6"; }

.fa-moon:before {
  content: "\f186"; }

.fa-mortar-pestle:before {
  content: "\f5a7"; }

.fa-mosque:before {
  content: "\f678"; }

.fa-motorcycle:before {
  content: "\f21c"; }

.fa-mountain:before {
  content: "\f6fc"; }

.fa-mouse-pointer:before {
  content: "\f245"; }

.fa-mug-hot:before {
  content: "\f7b6"; }

.fa-music:before {
  content: "\f001"; }

.fa-napster:before {
  content: "\f3d2"; }

.fa-neos:before {
  content: "\f612"; }

.fa-network-wired:before {
  content: "\f6ff"; }

.fa-neuter:before {
  content: "\f22c"; }

.fa-newspaper:before {
  content: "\f1ea"; }

.fa-nimblr:before {
  content: "\f5a8"; }

.fa-node:before {
  content: "\f419"; }

.fa-node-js:before {
  content: "\f3d3"; }

.fa-not-equal:before {
  content: "\f53e"; }

.fa-notes-medical:before {
  content: "\f481"; }

.fa-npm:before {
  content: "\f3d4"; }

.fa-ns8:before {
  content: "\f3d5"; }

.fa-nutritionix:before {
  content: "\f3d6"; }

.fa-object-group:before {
  content: "\f247"; }

.fa-object-ungroup:before {
  content: "\f248"; }

.fa-odnoklassniki:before {
  content: "\f263"; }

.fa-odnoklassniki-square:before {
  content: "\f264"; }

.fa-oil-can:before {
  content: "\f613"; }

.fa-old-republic:before {
  content: "\f510"; }

.fa-om:before {
  content: "\f679"; }

.fa-opencart:before {
  content: "\f23d"; }

.fa-openid:before {
  content: "\f19b"; }

.fa-opera:before {
  content: "\f26a"; }

.fa-optin-monster:before {
  content: "\f23c"; }

.fa-osi:before {
  content: "\f41a"; }

.fa-otter:before {
  content: "\f700"; }

.fa-outdent:before {
  content: "\f03b"; }

.fa-page4:before {
  content: "\f3d7"; }

.fa-pagelines:before {
  content: "\f18c"; }

.fa-pager:before {
  content: "\f815"; }

.fa-paint-brush:before {
  content: "\f1fc"; }

.fa-paint-roller:before {
  content: "\f5aa"; }

.fa-palette:before {
  content: "\f53f"; }

.fa-palfed:before {
  content: "\f3d8"; }

.fa-pallet:before {
  content: "\f482"; }

.fa-paper-plane:before {
  content: "\f1d8"; }

.fa-paperclip:before {
  content: "\f0c6"; }

.fa-parachute-box:before {
  content: "\f4cd"; }

.fa-paragraph:before {
  content: "\f1dd"; }

.fa-parking:before {
  content: "\f540"; }

.fa-passport:before {
  content: "\f5ab"; }

.fa-pastafarianism:before {
  content: "\f67b"; }

.fa-paste:before {
  content: "\f0ea"; }

.fa-patreon:before {
  content: "\f3d9"; }

.fa-pause:before {
  content: "\f04c"; }

.fa-pause-circle:before {
  content: "\f28b"; }

.fa-paw:before {
  content: "\f1b0"; }

.fa-paypal:before {
  content: "\f1ed"; }

.fa-peace:before {
  content: "\f67c"; }

.fa-pen:before {
  content: "\f304"; }

.fa-pen-alt:before {
  content: "\f305"; }

.fa-pen-fancy:before {
  content: "\f5ac"; }

.fa-pen-nib:before {
  content: "\f5ad"; }

.fa-pen-square:before {
  content: "\f14b"; }

.fa-pencil-alt:before {
  content: "\f303"; }

.fa-pencil-ruler:before {
  content: "\f5ae"; }

.fa-penny-arcade:before {
  content: "\f704"; }

.fa-people-carry:before {
  content: "\f4ce"; }

.fa-pepper-hot:before {
  content: "\f816"; }

.fa-percent:before {
  content: "\f295"; }

.fa-percentage:before {
  content: "\f541"; }

.fa-periscope:before {
  content: "\f3da"; }

.fa-person-booth:before {
  content: "\f756"; }

.fa-phabricator:before {
  content: "\f3db"; }

.fa-phoenix-framework:before {
  content: "\f3dc"; }

.fa-phoenix-squadron:before {
  content: "\f511"; }

.fa-phone:before {
  content: "\f095"; }

.fa-phone-alt:before {
  content: "\f879"; }

.fa-phone-slash:before {
  content: "\f3dd"; }

.fa-phone-square:before {
  content: "\f098"; }

.fa-phone-square-alt:before {
  content: "\f87b"; }

.fa-phone-volume:before {
  content: "\f2a0"; }

.fa-photo-video:before {
  content: "\f87c"; }

.fa-php:before {
  content: "\f457"; }

.fa-pied-piper:before {
  content: "\f2ae"; }

.fa-pied-piper-alt:before {
  content: "\f1a8"; }

.fa-pied-piper-hat:before {
  content: "\f4e5"; }

.fa-pied-piper-pp:before {
  content: "\f1a7"; }

.fa-piggy-bank:before {
  content: "\f4d3"; }

.fa-pills:before {
  content: "\f484"; }

.fa-pinterest:before {
  content: "\f0d2"; }

.fa-pinterest-p:before {
  content: "\f231"; }

.fa-pinterest-square:before {
  content: "\f0d3"; }

.fa-pizza-slice:before {
  content: "\f818"; }

.fa-place-of-worship:before {
  content: "\f67f"; }

.fa-plane:before {
  content: "\f072"; }

.fa-plane-arrival:before {
  content: "\f5af"; }

.fa-plane-departure:before {
  content: "\f5b0"; }

.fa-play:before {
  content: "\f04b"; }

.fa-play-circle:before {
  content: "\f144"; }

.fa-playstation:before {
  content: "\f3df"; }

.fa-plug:before {
  content: "\f1e6"; }

.fa-plus:before {
  content: "\f067"; }

.fa-plus-circle:before {
  content: "\f055"; }

.fa-plus-square:before {
  content: "\f0fe"; }

.fa-podcast:before {
  content: "\f2ce"; }

.fa-poll:before {
  content: "\f681"; }

.fa-poll-h:before {
  content: "\f682"; }

.fa-poo:before {
  content: "\f2fe"; }

.fa-poo-storm:before {
  content: "\f75a"; }

.fa-poop:before {
  content: "\f619"; }

.fa-portrait:before {
  content: "\f3e0"; }

.fa-pound-sign:before {
  content: "\f154"; }

.fa-power-off:before {
  content: "\f011"; }

.fa-pray:before {
  content: "\f683"; }

.fa-praying-hands:before {
  content: "\f684"; }

.fa-prescription:before {
  content: "\f5b1"; }

.fa-prescription-bottle:before {
  content: "\f485"; }

.fa-prescription-bottle-alt:before {
  content: "\f486"; }

.fa-print:before {
  content: "\f02f"; }

.fa-procedures:before {
  content: "\f487"; }

.fa-product-hunt:before {
  content: "\f288"; }

.fa-project-diagram:before {
  content: "\f542"; }

.fa-pushed:before {
  content: "\f3e1"; }

.fa-puzzle-piece:before {
  content: "\f12e"; }

.fa-python:before {
  content: "\f3e2"; }

.fa-qq:before {
  content: "\f1d6"; }

.fa-qrcode:before {
  content: "\f029"; }

.fa-question:before {
  content: "\f128"; }

.fa-question-circle:before {
  content: "\f059"; }

.fa-quidditch:before {
  content: "\f458"; }

.fa-quinscape:before {
  content: "\f459"; }

.fa-quora:before {
  content: "\f2c4"; }

.fa-quote-left:before {
  content: "\f10d"; }

.fa-quote-right:before {
  content: "\f10e"; }

.fa-quran:before {
  content: "\f687"; }

.fa-r-project:before {
  content: "\f4f7"; }

.fa-radiation:before {
  content: "\f7b9"; }

.fa-radiation-alt:before {
  content: "\f7ba"; }

.fa-rainbow:before {
  content: "\f75b"; }

.fa-random:before {
  content: "\f074"; }

.fa-raspberry-pi:before {
  content: "\f7bb"; }

.fa-ravelry:before {
  content: "\f2d9"; }

.fa-react:before {
  content: "\f41b"; }

.fa-reacteurope:before {
  content: "\f75d"; }

.fa-readme:before {
  content: "\f4d5"; }

.fa-rebel:before {
  content: "\f1d0"; }

.fa-receipt:before {
  content: "\f543"; }

.fa-recycle:before {
  content: "\f1b8"; }

.fa-red-river:before {
  content: "\f3e3"; }

.fa-reddit:before {
  content: "\f1a1"; }

.fa-reddit-alien:before {
  content: "\f281"; }

.fa-reddit-square:before {
  content: "\f1a2"; }

.fa-redhat:before {
  content: "\f7bc"; }

.fa-redo:before {
  content: "\f01e"; }

.fa-redo-alt:before {
  content: "\f2f9"; }

.fa-registered:before {
  content: "\f25d"; }

.fa-remove-format:before {
  content: "\f87d"; }

.fa-renren:before {
  content: "\f18b"; }

.fa-reply:before {
  content: "\f3e5"; }

.fa-reply-all:before {
  content: "\f122"; }

.fa-replyd:before {
  content: "\f3e6"; }

.fa-republican:before {
  content: "\f75e"; }

.fa-researchgate:before {
  content: "\f4f8"; }

.fa-resolving:before {
  content: "\f3e7"; }

.fa-restroom:before {
  content: "\f7bd"; }

.fa-retweet:before {
  content: "\f079"; }

.fa-rev:before {
  content: "\f5b2"; }

.fa-ribbon:before {
  content: "\f4d6"; }

.fa-ring:before {
  content: "\f70b"; }

.fa-road:before {
  content: "\f018"; }

.fa-robot:before {
  content: "\f544"; }

.fa-rocket:before {
  content: "\f135"; }

.fa-rocketchat:before {
  content: "\f3e8"; }

.fa-rockrms:before {
  content: "\f3e9"; }

.fa-route:before {
  content: "\f4d7"; }

.fa-rss:before {
  content: "\f09e"; }

.fa-rss-square:before {
  content: "\f143"; }

.fa-ruble-sign:before {
  content: "\f158"; }

.fa-ruler:before {
  content: "\f545"; }

.fa-ruler-combined:before {
  content: "\f546"; }

.fa-ruler-horizontal:before {
  content: "\f547"; }

.fa-ruler-vertical:before {
  content: "\f548"; }

.fa-running:before {
  content: "\f70c"; }

.fa-rupee-sign:before {
  content: "\f156"; }

.fa-sad-cry:before {
  content: "\f5b3"; }

.fa-sad-tear:before {
  content: "\f5b4"; }

.fa-safari:before {
  content: "\f267"; }

.fa-salesforce:before {
  content: "\f83b"; }

.fa-sass:before {
  content: "\f41e"; }

.fa-satellite:before {
  content: "\f7bf"; }

.fa-satellite-dish:before {
  content: "\f7c0"; }

.fa-save:before {
  content: "\f0c7"; }

.fa-schlix:before {
  content: "\f3ea"; }

.fa-school:before {
  content: "\f549"; }

.fa-screwdriver:before {
  content: "\f54a"; }

.fa-scribd:before {
  content: "\f28a"; }

.fa-scroll:before {
  content: "\f70e"; }

.fa-sd-card:before {
  content: "\f7c2"; }

.fa-search:before {
  content: "\f002"; }

.fa-search-dollar:before {
  content: "\f688"; }

.fa-search-location:before {
  content: "\f689"; }

.fa-search-minus:before {
  content: "\f010"; }

.fa-search-plus:before {
  content: "\f00e"; }

.fa-searchengin:before {
  content: "\f3eb"; }

.fa-seedling:before {
  content: "\f4d8"; }

.fa-sellcast:before {
  content: "\f2da"; }

.fa-sellsy:before {
  content: "\f213"; }

.fa-server:before {
  content: "\f233"; }

.fa-servicestack:before {
  content: "\f3ec"; }

.fa-shapes:before {
  content: "\f61f"; }

.fa-share:before {
  content: "\f064"; }

.fa-share-alt:before {
  content: "\f1e0"; }

.fa-share-alt-square:before {
  content: "\f1e1"; }

.fa-share-square:before {
  content: "\f14d"; }

.fa-shekel-sign:before {
  content: "\f20b"; }

.fa-shield-alt:before {
  content: "\f3ed"; }

.fa-ship:before {
  content: "\f21a"; }

.fa-shipping-fast:before {
  content: "\f48b"; }

.fa-shirtsinbulk:before {
  content: "\f214"; }

.fa-shoe-prints:before {
  content: "\f54b"; }

.fa-shopping-bag:before {
  content: "\f290"; }

.fa-shopping-basket:before {
  content: "\f291"; }

.fa-shopping-cart:before {
  content: "\f07a"; }

.fa-shopware:before {
  content: "\f5b5"; }

.fa-shower:before {
  content: "\f2cc"; }

.fa-shuttle-van:before {
  content: "\f5b6"; }

.fa-sign:before {
  content: "\f4d9"; }

.fa-sign-in-alt:before {
  content: "\f2f6"; }

.fa-sign-language:before {
  content: "\f2a7"; }

.fa-sign-out-alt:before {
  content: "\f2f5"; }

.fa-signal:before {
  content: "\f012"; }

.fa-signature:before {
  content: "\f5b7"; }

.fa-sim-card:before {
  content: "\f7c4"; }

.fa-simplybuilt:before {
  content: "\f215"; }

.fa-sistrix:before {
  content: "\f3ee"; }

.fa-sitemap:before {
  content: "\f0e8"; }

.fa-sith:before {
  content: "\f512"; }

.fa-skating:before {
  content: "\f7c5"; }

.fa-sketch:before {
  content: "\f7c6"; }

.fa-skiing:before {
  content: "\f7c9"; }

.fa-skiing-nordic:before {
  content: "\f7ca"; }

.fa-skull:before {
  content: "\f54c"; }

.fa-skull-crossbones:before {
  content: "\f714"; }

.fa-skyatlas:before {
  content: "\f216"; }

.fa-skype:before {
  content: "\f17e"; }

.fa-slack:before {
  content: "\f198"; }

.fa-slack-hash:before {
  content: "\f3ef"; }

.fa-slash:before {
  content: "\f715"; }

.fa-sleigh:before {
  content: "\f7cc"; }

.fa-sliders-h:before {
  content: "\f1de"; }

.fa-slideshare:before {
  content: "\f1e7"; }

.fa-smile:before {
  content: "\f118"; }

.fa-smile-beam:before {
  content: "\f5b8"; }

.fa-smile-wink:before {
  content: "\f4da"; }

.fa-smog:before {
  content: "\f75f"; }

.fa-smoking:before {
  content: "\f48d"; }

.fa-smoking-ban:before {
  content: "\f54d"; }

.fa-sms:before {
  content: "\f7cd"; }

.fa-snapchat:before {
  content: "\f2ab"; }

.fa-snapchat-ghost:before {
  content: "\f2ac"; }

.fa-snapchat-square:before {
  content: "\f2ad"; }

.fa-snowboarding:before {
  content: "\f7ce"; }

.fa-snowflake:before {
  content: "\f2dc"; }

.fa-snowman:before {
  content: "\f7d0"; }

.fa-snowplow:before {
  content: "\f7d2"; }

.fa-socks:before {
  content: "\f696"; }

.fa-solar-panel:before {
  content: "\f5ba"; }

.fa-sort:before {
  content: "\f0dc"; }

.fa-sort-alpha-down:before {
  content: "\f15d"; }

.fa-sort-alpha-down-alt:before {
  content: "\f881"; }

.fa-sort-alpha-up:before {
  content: "\f15e"; }

.fa-sort-alpha-up-alt:before {
  content: "\f882"; }

.fa-sort-amount-down:before {
  content: "\f160"; }

.fa-sort-amount-down-alt:before {
  content: "\f884"; }

.fa-sort-amount-up:before {
  content: "\f161"; }

.fa-sort-amount-up-alt:before {
  content: "\f885"; }

.fa-sort-down:before {
  content: "\f0dd"; }

.fa-sort-numeric-down:before {
  content: "\f162"; }

.fa-sort-numeric-down-alt:before {
  content: "\f886"; }

.fa-sort-numeric-up:before {
  content: "\f163"; }

.fa-sort-numeric-up-alt:before {
  content: "\f887"; }

.fa-sort-up:before {
  content: "\f0de"; }

.fa-soundcloud:before {
  content: "\f1be"; }

.fa-sourcetree:before {
  content: "\f7d3"; }

.fa-spa:before {
  content: "\f5bb"; }

.fa-space-shuttle:before {
  content: "\f197"; }

.fa-speakap:before {
  content: "\f3f3"; }

.fa-speaker-deck:before {
  content: "\f83c"; }

.fa-spell-check:before {
  content: "\f891"; }

.fa-spider:before {
  content: "\f717"; }

.fa-spinner:before {
  content: "\f110"; }

.fa-splotch:before {
  content: "\f5bc"; }

.fa-spotify:before {
  content: "\f1bc"; }

.fa-spray-can:before {
  content: "\f5bd"; }

.fa-square:before {
  content: "\f0c8"; }

.fa-square-full:before {
  content: "\f45c"; }

.fa-square-root-alt:before {
  content: "\f698"; }

.fa-squarespace:before {
  content: "\f5be"; }

.fa-stack-exchange:before {
  content: "\f18d"; }

.fa-stack-overflow:before {
  content: "\f16c"; }

.fa-stackpath:before {
  content: "\f842"; }

.fa-stamp:before {
  content: "\f5bf"; }

.fa-star:before {
  content: "\f005"; }

.fa-star-and-crescent:before {
  content: "\f699"; }

.fa-star-half:before {
  content: "\f089"; }

.fa-star-half-alt:before {
  content: "\f5c0"; }

.fa-star-of-david:before {
  content: "\f69a"; }

.fa-star-of-life:before {
  content: "\f621"; }

.fa-staylinked:before {
  content: "\f3f5"; }

.fa-steam:before {
  content: "\f1b6"; }

.fa-steam-square:before {
  content: "\f1b7"; }

.fa-steam-symbol:before {
  content: "\f3f6"; }

.fa-step-backward:before {
  content: "\f048"; }

.fa-step-forward:before {
  content: "\f051"; }

.fa-stethoscope:before {
  content: "\f0f1"; }

.fa-sticker-mule:before {
  content: "\f3f7"; }

.fa-sticky-note:before {
  content: "\f249"; }

.fa-stop:before {
  content: "\f04d"; }

.fa-stop-circle:before {
  content: "\f28d"; }

.fa-stopwatch:before {
  content: "\f2f2"; }

.fa-store:before {
  content: "\f54e"; }

.fa-store-alt:before {
  content: "\f54f"; }

.fa-strava:before {
  content: "\f428"; }

.fa-stream:before {
  content: "\f550"; }

.fa-street-view:before {
  content: "\f21d"; }

.fa-strikethrough:before {
  content: "\f0cc"; }

.fa-stripe:before {
  content: "\f429"; }

.fa-stripe-s:before {
  content: "\f42a"; }

.fa-stroopwafel:before {
  content: "\f551"; }

.fa-studiovinari:before {
  content: "\f3f8"; }

.fa-stumbleupon:before {
  content: "\f1a4"; }

.fa-stumbleupon-circle:before {
  content: "\f1a3"; }

.fa-subscript:before {
  content: "\f12c"; }

.fa-subway:before {
  content: "\f239"; }

.fa-suitcase:before {
  content: "\f0f2"; }

.fa-suitcase-rolling:before {
  content: "\f5c1"; }

.fa-sun:before {
  content: "\f185"; }

.fa-superpowers:before {
  content: "\f2dd"; }

.fa-superscript:before {
  content: "\f12b"; }

.fa-supple:before {
  content: "\f3f9"; }

.fa-surprise:before {
  content: "\f5c2"; }

.fa-suse:before {
  content: "\f7d6"; }

.fa-swatchbook:before {
  content: "\f5c3"; }

.fa-swimmer:before {
  content: "\f5c4"; }

.fa-swimming-pool:before {
  content: "\f5c5"; }

.fa-symfony:before {
  content: "\f83d"; }

.fa-synagogue:before {
  content: "\f69b"; }

.fa-sync:before {
  content: "\f021"; }

.fa-sync-alt:before {
  content: "\f2f1"; }

.fa-syringe:before {
  content: "\f48e"; }

.fa-table:before {
  content: "\f0ce"; }

.fa-table-tennis:before {
  content: "\f45d"; }

.fa-tablet:before {
  content: "\f10a"; }

.fa-tablet-alt:before {
  content: "\f3fa"; }

.fa-tablets:before {
  content: "\f490"; }

.fa-tachometer-alt:before {
  content: "\f3fd"; }

.fa-tag:before {
  content: "\f02b"; }

.fa-tags:before {
  content: "\f02c"; }

.fa-tape:before {
  content: "\f4db"; }

.fa-tasks:before {
  content: "\f0ae"; }

.fa-taxi:before {
  content: "\f1ba"; }

.fa-teamspeak:before {
  content: "\f4f9"; }

.fa-teeth:before {
  content: "\f62e"; }

.fa-teeth-open:before {
  content: "\f62f"; }

.fa-telegram:before {
  content: "\f2c6"; }

.fa-telegram-plane:before {
  content: "\f3fe"; }

.fa-temperature-high:before {
  content: "\f769"; }

.fa-temperature-low:before {
  content: "\f76b"; }

.fa-tencent-weibo:before {
  content: "\f1d5"; }

.fa-tenge:before {
  content: "\f7d7"; }

.fa-terminal:before {
  content: "\f120"; }

.fa-text-height:before {
  content: "\f034"; }

.fa-text-width:before {
  content: "\f035"; }

.fa-th:before {
  content: "\f00a"; }

.fa-th-large:before {
  content: "\f009"; }

.fa-th-list:before {
  content: "\f00b"; }

.fa-the-red-yeti:before {
  content: "\f69d"; }

.fa-theater-masks:before {
  content: "\f630"; }

.fa-themeco:before {
  content: "\f5c6"; }

.fa-themeisle:before {
  content: "\f2b2"; }

.fa-thermometer:before {
  content: "\f491"; }

.fa-thermometer-empty:before {
  content: "\f2cb"; }

.fa-thermometer-full:before {
  content: "\f2c7"; }

.fa-thermometer-half:before {
  content: "\f2c9"; }

.fa-thermometer-quarter:before {
  content: "\f2ca"; }

.fa-thermometer-three-quarters:before {
  content: "\f2c8"; }

.fa-think-peaks:before {
  content: "\f731"; }

.fa-thumbs-down:before {
  content: "\f165"; }

.fa-thumbs-up:before {
  content: "\f164"; }

.fa-thumbtack:before {
  content: "\f08d"; }

.fa-ticket-alt:before {
  content: "\f3ff"; }

.fa-times:before {
  content: "\f00d"; }

.fa-times-circle:before {
  content: "\f057"; }

.fa-tint:before {
  content: "\f043"; }

.fa-tint-slash:before {
  content: "\f5c7"; }

.fa-tired:before {
  content: "\f5c8"; }

.fa-toggle-off:before {
  content: "\f204"; }

.fa-toggle-on:before {
  content: "\f205"; }

.fa-toilet:before {
  content: "\f7d8"; }

.fa-toilet-paper:before {
  content: "\f71e"; }

.fa-toolbox:before {
  content: "\f552"; }

.fa-tools:before {
  content: "\f7d9"; }

.fa-tooth:before {
  content: "\f5c9"; }

.fa-torah:before {
  content: "\f6a0"; }

.fa-torii-gate:before {
  content: "\f6a1"; }

.fa-tractor:before {
  content: "\f722"; }

.fa-trade-federation:before {
  content: "\f513"; }

.fa-trademark:before {
  content: "\f25c"; }

.fa-traffic-light:before {
  content: "\f637"; }

.fa-train:before {
  content: "\f238"; }

.fa-tram:before {
  content: "\f7da"; }

.fa-transgender:before {
  content: "\f224"; }

.fa-transgender-alt:before {
  content: "\f225"; }

.fa-trash:before {
  content: "\f1f8"; }

.fa-trash-alt:before {
  content: "\f2ed"; }

.fa-trash-restore:before {
  content: "\f829"; }

.fa-trash-restore-alt:before {
  content: "\f82a"; }

.fa-tree:before {
  content: "\f1bb"; }

.fa-trello:before {
  content: "\f181"; }

.fa-tripadvisor:before {
  content: "\f262"; }

.fa-trophy:before {
  content: "\f091"; }

.fa-truck:before {
  content: "\f0d1"; }

.fa-truck-loading:before {
  content: "\f4de"; }

.fa-truck-monster:before {
  content: "\f63b"; }

.fa-truck-moving:before {
  content: "\f4df"; }

.fa-truck-pickup:before {
  content: "\f63c"; }

.fa-tshirt:before {
  content: "\f553"; }

.fa-tty:before {
  content: "\f1e4"; }

.fa-tumblr:before {
  content: "\f173"; }

.fa-tumblr-square:before {
  content: "\f174"; }

.fa-tv:before {
  content: "\f26c"; }

.fa-twitch:before {
  content: "\f1e8"; }

.fa-twitter:before {
  content: "\f099"; }

.fa-twitter-square:before {
  content: "\f081"; }

.fa-typo3:before {
  content: "\f42b"; }

.fa-uber:before {
  content: "\f402"; }

.fa-ubuntu:before {
  content: "\f7df"; }

.fa-uikit:before {
  content: "\f403"; }

.fa-umbrella:before {
  content: "\f0e9"; }

.fa-umbrella-beach:before {
  content: "\f5ca"; }

.fa-underline:before {
  content: "\f0cd"; }

.fa-undo:before {
  content: "\f0e2"; }

.fa-undo-alt:before {
  content: "\f2ea"; }

.fa-uniregistry:before {
  content: "\f404"; }

.fa-universal-access:before {
  content: "\f29a"; }

.fa-university:before {
  content: "\f19c"; }

.fa-unlink:before {
  content: "\f127"; }

.fa-unlock:before {
  content: "\f09c"; }

.fa-unlock-alt:before {
  content: "\f13e"; }

.fa-untappd:before {
  content: "\f405"; }

.fa-upload:before {
  content: "\f093"; }

.fa-ups:before {
  content: "\f7e0"; }

.fa-usb:before {
  content: "\f287"; }

.fa-user:before {
  content: "\f007"; }

.fa-user-alt:before {
  content: "\f406"; }

.fa-user-alt-slash:before {
  content: "\f4fa"; }

.fa-user-astronaut:before {
  content: "\f4fb"; }

.fa-user-check:before {
  content: "\f4fc"; }

.fa-user-circle:before {
  content: "\f2bd"; }

.fa-user-clock:before {
  content: "\f4fd"; }

.fa-user-cog:before {
  content: "\f4fe"; }

.fa-user-edit:before {
  content: "\f4ff"; }

.fa-user-friends:before {
  content: "\f500"; }

.fa-user-graduate:before {
  content: "\f501"; }

.fa-user-injured:before {
  content: "\f728"; }

.fa-user-lock:before {
  content: "\f502"; }

.fa-user-md:before {
  content: "\f0f0"; }

.fa-user-minus:before {
  content: "\f503"; }

.fa-user-ninja:before {
  content: "\f504"; }

.fa-user-nurse:before {
  content: "\f82f"; }

.fa-user-plus:before {
  content: "\f234"; }

.fa-user-secret:before {
  content: "\f21b"; }

.fa-user-shield:before {
  content: "\f505"; }

.fa-user-slash:before {
  content: "\f506"; }

.fa-user-tag:before {
  content: "\f507"; }

.fa-user-tie:before {
  content: "\f508"; }

.fa-user-times:before {
  content: "\f235"; }

.fa-users:before {
  content: "\f0c0"; }

.fa-users-cog:before {
  content: "\f509"; }

.fa-usps:before {
  content: "\f7e1"; }

.fa-ussunnah:before {
  content: "\f407"; }

.fa-utensil-spoon:before {
  content: "\f2e5"; }

.fa-utensils:before {
  content: "\f2e7"; }

.fa-vaadin:before {
  content: "\f408"; }

.fa-vector-square:before {
  content: "\f5cb"; }

.fa-venus:before {
  content: "\f221"; }

.fa-venus-double:before {
  content: "\f226"; }

.fa-venus-mars:before {
  content: "\f228"; }

.fa-viacoin:before {
  content: "\f237"; }

.fa-viadeo:before {
  content: "\f2a9"; }

.fa-viadeo-square:before {
  content: "\f2aa"; }

.fa-vial:before {
  content: "\f492"; }

.fa-vials:before {
  content: "\f493"; }

.fa-viber:before {
  content: "\f409"; }

.fa-video:before {
  content: "\f03d"; }

.fa-video-slash:before {
  content: "\f4e2"; }

.fa-vihara:before {
  content: "\f6a7"; }

.fa-vimeo:before {
  content: "\f40a"; }

.fa-vimeo-square:before {
  content: "\f194"; }

.fa-vimeo-v:before {
  content: "\f27d"; }

.fa-vine:before {
  content: "\f1ca"; }

.fa-vk:before {
  content: "\f189"; }

.fa-vnv:before {
  content: "\f40b"; }

.fa-voicemail:before {
  content: "\f897"; }

.fa-volleyball-ball:before {
  content: "\f45f"; }

.fa-volume-down:before {
  content: "\f027"; }

.fa-volume-mute:before {
  content: "\f6a9"; }

.fa-volume-off:before {
  content: "\f026"; }

.fa-volume-up:before {
  content: "\f028"; }

.fa-vote-yea:before {
  content: "\f772"; }

.fa-vr-cardboard:before {
  content: "\f729"; }

.fa-vuejs:before {
  content: "\f41f"; }

.fa-walking:before {
  content: "\f554"; }

.fa-wallet:before {
  content: "\f555"; }

.fa-warehouse:before {
  content: "\f494"; }

.fa-water:before {
  content: "\f773"; }

.fa-wave-square:before {
  content: "\f83e"; }

.fa-waze:before {
  content: "\f83f"; }

.fa-weebly:before {
  content: "\f5cc"; }

.fa-weibo:before {
  content: "\f18a"; }

.fa-weight:before {
  content: "\f496"; }

.fa-weight-hanging:before {
  content: "\f5cd"; }

.fa-weixin:before {
  content: "\f1d7"; }

.fa-whatsapp:before {
  content: "\f232"; }

.fa-whatsapp-square:before {
  content: "\f40c"; }

.fa-wheelchair:before {
  content: "\f193"; }

.fa-whmcs:before {
  content: "\f40d"; }

.fa-wifi:before {
  content: "\f1eb"; }

.fa-wikipedia-w:before {
  content: "\f266"; }

.fa-wind:before {
  content: "\f72e"; }

.fa-window-close:before {
  content: "\f410"; }

.fa-window-maximize:before {
  content: "\f2d0"; }

.fa-window-minimize:before {
  content: "\f2d1"; }

.fa-window-restore:before {
  content: "\f2d2"; }

.fa-windows:before {
  content: "\f17a"; }

.fa-wine-bottle:before {
  content: "\f72f"; }

.fa-wine-glass:before {
  content: "\f4e3"; }

.fa-wine-glass-alt:before {
  content: "\f5ce"; }

.fa-wix:before {
  content: "\f5cf"; }

.fa-wizards-of-the-coast:before {
  content: "\f730"; }

.fa-wolf-pack-battalion:before {
  content: "\f514"; }

.fa-won-sign:before {
  content: "\f159"; }

.fa-wordpress:before {
  content: "\f19a"; }

.fa-wordpress-simple:before {
  content: "\f411"; }

.fa-wpbeginner:before {
  content: "\f297"; }

.fa-wpexplorer:before {
  content: "\f2de"; }

.fa-wpforms:before {
  content: "\f298"; }

.fa-wpressr:before {
  content: "\f3e4"; }

.fa-wrench:before {
  content: "\f0ad"; }

.fa-x-ray:before {
  content: "\f497"; }

.fa-xbox:before {
  content: "\f412"; }

.fa-xing:before {
  content: "\f168"; }

.fa-xing-square:before {
  content: "\f169"; }

.fa-y-combinator:before {
  content: "\f23b"; }

.fa-yahoo:before {
  content: "\f19e"; }

.fa-yammer:before {
  content: "\f840"; }

.fa-yandex:before {
  content: "\f413"; }

.fa-yandex-international:before {
  content: "\f414"; }

.fa-yarn:before {
  content: "\f7e3"; }

.fa-yelp:before {
  content: "\f1e9"; }

.fa-yen-sign:before {
  content: "\f157"; }

.fa-yin-yang:before {
  content: "\f6ad"; }

.fa-yoast:before {
  content: "\f2b1"; }

.fa-youtube:before {
  content: "\f167"; }

.fa-youtube-square:before {
  content: "\f431"; }

.fa-zhihu:before {
  content: "\f63f"; }

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }

.sr-only-focusable:active, .sr-only-focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }
@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: normal;
  font-display: auto;
  src: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-brands-400.eot");
  src: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-brands-400.eot#iefix") format("embedded-opentype"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-brands-400.woff2") format("woff2"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-brands-400.woff") format("woff"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-brands-400.ttf") format("truetype"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-brands-400.svg#fontawesome") format("svg"); }

.fab {
  font-family: 'Font Awesome 5 Brands'; }
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-regular-400.eot");
  src: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-regular-400.eot#iefix") format("embedded-opentype"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-regular-400.woff2") format("woff2"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-regular-400.woff") format("woff"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-regular-400.ttf") format("truetype"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-regular-400.svg#fontawesome") format("svg"); }

.far {
  font-family: 'Font Awesome 5 Free';
  font-weight: 400; }
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-solid-900.eot");
  src: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-solid-900.eot#iefix") format("embedded-opentype"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-solid-900.woff2") format("woff2"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-solid-900.woff") format("woff"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-solid-900.ttf") format("truetype"), url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/fonts_2019/fa-solid-900.svg#fontawesome") format("svg"); }

.fa,
.fas {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900; }

/*****************/
/* HubSpot Style */
/*****************/

.with-testimonial-as-first-box .hs_cos_wrapper_type_rich_text:first-child 
                                { margin-top: 10px; padding: 12px 12px;
                                  text-align: left; line-height: 2; line-height:15px;
                                  background: linear-gradient(to bottom,#fff 0,#f4f4f4 100%);
                                  background: -moz-linear-gradient(top,white 0,#f4f4f4 100%);
                                  background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,white),color-stop(100%,#f4f4f4));
                                  border: 1px solid #d1d1d1; border-radius: 5px; }

.with-testimonial-as-first-box .hs_cos_wrapper_type_rich_text:first-child .person, .company { margin-left: 27px; }

.with-testimonial-as-first-box .hs_cos_wrapper_type_rich_text:first-child .person { color: #3b110e; }

.with-testimonial-as-first-box .hs_cos_wrapper_type_rich_text:first-child .company { color: #777777; }

.with-testimonial-as-first-box .hs_cos_wrapper_widget { margin-bottom: 44px; }

.footer-container .hs-menu-wrapper.no-flyouts .hs-menu-children-wrapper li
                                { padding: 0px; margin: 0px; position: static;
                                  list-style-type: none;
                                  background-color: transparent; }

.footer-container .hs-menu-wrapper.no-flyouts .hs-menu-children-wrapper 
                                { visibility: visible; margin: 0px; padding: 0px; position: static;
                                  background-color: transparent; opacity: 1; }

.footer-container .hs-menu-wrapper.no-flyouts  li a
                                { background-color: transparent; color: #777; font-weight: bold; }

.footer-container .hs-menu-wrapper.no-flyouts .hs-menu-children-wrapper li a 
                                { color: #888; font-weight: 300; }

.footer-container .hs-menu-wrapper.no-flyouts .hs-menu-item.active-branch > a 
                                { border-width: 0px; box-shadow: inset 0 0px transparent; }

.footer-container .hs-menu-wrapper.no-flyouts  .hs-menu-item.active-branch > a:hover 
                                { background-color:transparent; box-shadow: inset 0 0px transparent; }

/**************** SS-Icons Font Family ********************/
@font-face {
  font-family: "ss-icons";
  src:url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/ss-icons.eot?v=1.34");
  src:url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/ss-icons.eot#iefix") format("embedded-opentype"),
    url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/ss-icons.woff?v=1.34") format("woff"),
    url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/ss-icons.ttf?v=1.34") format("truetype"),
    url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_fonts_ss2015/ss-icons.svg#ss-icons?v=1.34") format("svg");
  font-weight: normal;
  font-style: normal;
}

[data-icon]:before {
  font-family: "ss-icons" !important;
  content: attr(data-icon);
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^="icon-"],
[class*=" icon-"]       { position: relative; display: inline-block; }

[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: "ss-icons" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-facebook:before{content:"\46";}
.icon-google:before{content:"\47";}
.icon-linkedin:before{content:"\4c";}
.icon-youtube:before{content:"\59";}
.icon-apple:before{content:"\41";}
.icon-google-plus:before{content:"\67";}
.icon-windows:before{content:"\57";}
.icon-search:before{content:"\73";}
.icon-user:before{content:"\75";}
.icon-ss-icons-arrow:before{content:"\3e";}
.icon-ss-icons-play:before{content:"\70";}
.icon-ss-icons-menu:before{content:"\6d";}
.icon-ss-icons-arrow-left:before{content:"\3c";}
.icon-ss-icons-close:before{content:"\78";}
.icon-ss-icons-calculator:before{content:"\30";}
.icon-ss-icons-arrow-down:before{content:"\76";}
.icon-ss-icons-eye:before{content:"\65";}
.icon-ss-icons-restart:before{content:"\72";}
.icon-ss-icons-structure-studios:before{content:"\53";}
.icon-ss-icons-key:before{content:"\6b";}
.icon-email:before{content:"\45";}
.icon-twitter:before{content:"\74";}
.icon-pinterest:before{content:"\50";}
.icon-ss-icons-check-mark:before{content:"\79";}
.icon-ss-icons-lock:before{content:"\6c";}
.icon-ss-icons-phone:before{content:"\23";}
.icon-ss-icons-vip3d:before{content:"\31";}
.icon-ss-icons-book:before{content:"\62";}
.icon-ss-icons-vizterra:before{content:"\32";}
.icon-ss-icons-poolstudio:before{content:"\33";}

.icon-save:before {content:"\61";}
.icon-back:before { content: "\63"; }
.icon-download-cloud:before { content: "\64"; }
.icon-file:before { content: "\66"; }
.icon-folder:before { content: "\68"; }
.icon-image:before { content: "\69"; }
.icon-information:before { content: "\6a"; }
.icon-refresh:before { content: "\6e"; }
.icon-forward:before { content: "\6f"; }
.icon-video:before { content: "\71"; }

.icon-menu:before { content: "\006D"; }

.ss-icon, .ss-icons             { font-family: 'ss-icons'; font-size: 25px;
                                  transition: all 0.3s ease-in-out; }

.external-link-icon { display: inline-block !important; }

.external-link-icon:before {
  content: "\f35d"; font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size: 60%;
  position: relative; bottom: 3px;
}

/**************** Additional Style ********************/

html                            { overflow-x: hidden; }

body                            { margin: 0;  /* overflow-x: hidden; */
                                  color: #31536e; font-family: 'Fira Sans', sans-serif; font-size: 20px; line-height: 30px; font-weight: 300;
                                  background: #dfe6eb; }
                                  
.container-fluid                { margin: 0 auto; max-width: none; padding: 0px; transition: padding 0.5s ease 0s; }

.row-fluid-wrapper              { border-bottom: 0px; margin-bottom: 0px; padding-bottom: 0px; }


/**************** Header Container Style ********************/
/* .header-container-wrapper       {display: none;} */
.header-container-wrapper       { 
  display: block;
  width: 100%; height: 50px;
                                  position: fixed; top: 0; left: 0; z-index: 2000;
                                  background: #00192d; background: rgba(0,25,45,0.95);
backdrop-filter: blur(5px) contrast(4); -webkit-backdrop-filter: blur(5px) contrast(4); }

.header-container               { display: block; width: 100%; height: 100%; /*postion: relative;*/ z-index: 500; }

.header-container .row-fluid    {  }
.header-container .row-fluid:before,
.header-container .row-fluid:after { content: none; display: none; }

.header-container .row
.header-container .widget-type-logo { 
                                  position: relative; top: 10px; left: 0px;
                                  /* -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); */ }
.header-container > div         { position: inherit; z-index: 200; }
.header-container > div:nth-child(2) { z-index: 100; }

a.homeLogo                      { display: inline-block; box-sizing: border-box; height: 50px; padding: 0; }
a.homeLogo > img                { vertical-align: middle; height: 30px; width: auto; }

/**************** Vip3D Homepage Header Style ********************/

.vip3d_hh                       { display: block; width: 100%; height: auto;
                                  position: relative;
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/vip3d_home_header/vip3d-header-placeholder.jpg') no-repeat center center; background-size: cover;}
.headerContentWrapper           { display: block; width: 100%; height: 100%;
                                  position: absolute; top: 0; left: 0; }
.vip3d_hh .content              { position: relative; z-index: 100; height: 100%; }

.vip3d_hh_title                 { max-height: 100%; width: auto;
                                  position: absolute; top: 0px; left: -11%; }

.vip3d_hh_bg                    { width: 100%; height: auto;
                                  position: relative; z-index: 10; }

.lp_hh_bg                       { width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; }

.lp_hh_bg video                 { height: auto !important; top: -25% !important; }

.vip3d_hh video                 { display: block; width: 100%; height: auto;
                                   }

.vip3d_hh a.CTA                 { position: absolute; right: 0; bottom: 30px; z-index: 200;
                                  height: 70px; line-height: 70px; padding: 0 30px; font-size: 24px; }
.vip3d_hh a.CTA:before          { content: ""; display: block; width: 261px; height: 219px;
                                  position: absolute; top: -120px; left: -185px; 
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/vip3d_home_header/cta_decoration.png) no-repeat center center;}

.vip3d_hh .vipHeaderCTA         { position: absolute; right: 0; bottom: 0; z-index: 200;
                                  height: 310px; width: 510px; text-align: right; line-height: 70px; padding: 0 30px; font-size: 24px;
                                  background-image: -moz-linear-gradient( -90deg, rgba(0,26,46,0) 0%, rgba(0,26,46,0.65) 72%, rgba(0,26,46,0.90196) 100%);
                                  background-image: -webkit-linear-gradient( -90deg, rgba(0,26,46,0) 0%, rgba(0,26,46,0.65) 72%, rgba(0,26,46,0.90196) 100%);
                                  background-image: -ms-linear-gradient( -90deg, rgba(0,26,46,0) 0%, rgba(0,26,46,0.65) 72%, rgba(0,26,46,0.90196) 100%); }

.vip3d_hh .vipHeaderCTA:before          { content: ""; display: block; width: 281px; height: 259px; position: absolute; top: 40px; left: 20px; z-index: 300;
                                          background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2018/vip3d-product-box.png) no-repeat center center; background-size: cover; }
  
                                
.vip3d_hh .vipHeaderCTA .vipHeaderButtons { position: absolute; right: 20px; bottom: 43px; }
.vip3d_hh .vipHeaderCTA .vipHeaderButtons a:first-child { z-index: 200; height: 70px; line-height: 70px; padding: 0 30px; font-size: 24px; }
.vip3d_hh .vipHeaderCTA .vipHeaderButtons a:last-child { z-index: 200; height: 40px; line-height: 40px; padding: 0 51px; font-size: 18px; vertical-align: top; margin-top: 5px; }
.vip3d_hh .vipHeaderCTA .vipHeaderButtons a:last-child:after { content: "p"; font-size: 1em; }

.vip3Doptions                   { margin-top: -60px; }
.vip3Doptions:after             { content: ""; display: table; clear: both; }

.vip3Doptions > h2              { width: 100%; margin: 0 0 30px 0;
                                  border: none; box-shadow: none; }

.vip3Doptions > *               { display: block; width: calc(50% - 10px); height: auto; margin: 0 20px 20px 0; box-sizing: border-box;
                                  position: relative; float: left;
                                  border: solid 1px #EFF3F5; box-shadow: 0 2px 15px rgba(25, 54, 78, 0.3); }
.vip3Doptions > *:nth-child(2n + 1) { margin: 0 0 20px 0; }

.vip3Doptions > * img           { width: 100%; height: auto; }
.vip3Doptions > * span          { display: block; width: 100%; padding: 20px; box-sizing: border-box;
                                  position: absolute; right: 0px; bottom: 0px;
                                  font-family: 'Fira Sans'; font-size: 36px; font-weight: 300; color: #EFF3F5; line-height: 36px; text-shadow: 0px 2px 3px #00192d; text-align: right; }
                                  
                                  
/**************** Homepage Header Video Styles ********************/

.videoHeader                    { display: block; width: 100%; height: 800px; height: 100vh;
                                  position: relative; overflow: hidden;
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/vip3d_home_header/vip3d-header-placeholder.jpg') no-repeat center center; background-size: cover;}

.videoHeader .videoBG           { height: 100%; width: 100%; position: absolute; top: 50%; left: 50%; z-index: 1;
                                  background: none !important; }
.videoHeader .videoBG video     { max-width: none; max-height: none; min-height: 100%; min-width: 100%; height: auto; width: auto; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); }

.videoHeader .headerContentWrapper { z-index: 100;
                                  background: linear-gradient(rgba(0,135,255,0) 70%, rgba(0,135,255,0.33) 80%, rgba(0,83,173,0.66) 90%, rgba(0,52,92,1) 100%);}

.AR .videoHeader .headerContentWrapper
                                { background: linear-gradient(to bottom,rgba(255,255,255,0.9),rgba(239,243,245,0.5)) repeat center; }

.videoHeader .content           { height: auto; position: relative; top: 40%; transform: translateY(-50%); }

.videoHeader .content h1        { padding: 80px 0 0 0; margin: 0;
                                  position: relative; top: 20%;
                                  font-family: 'Share'; font-size: 100px; line-height: 60px; font-weight: 700; text-align: center;
                                  border: none; }
.videoHeader .content h1 em     { font-style: normal; display: none; width: 100%;
                                  position: absolute; top: 0; left: 0;
                                  }
.videoHeader .content h1 em.active { display: block; }
.videoHeader .content h1 span   { display: block; clear: both;
                                  font-family: 'Fira Sans'; font-size: 50px; font-weight: 300; line-height: 60px;
                                  text-shadow: 0px 2px 5px #00192D; }

.videoHeader .content .learnMore { clear: both; margin: 20px auto; display: block; width: auto; font-size: 24px; }
.homeHeader .videoHeader .content .learnMore { max-width: 300px; }

.dynamicLandingPageHeader .content .learnMore { clear: both; margin: 20px auto; font-size: 24px; display: inline-block !important; }

.dynamicLandingPageHeader h1, .dynamicLandingPageHeader.videoHeader h1, .dynamicLandingPageHeader.videoHeader h2,
.dynamicLandingPageHeader h2    { font-size: 48px; line-height: 64px; padding: 0; text-align: inherit; }

.dynamicLandingPageHeader p     { margin-top: 10px; }

a.scrollNext                    { display: block; width: 146px; height: 146px;
                                  position: absolute; bottom: 80px; left: calc(50% - 75px);
                                  color: #EFF3F5; font-family: 'ss-icons'; font-size: 100px; line-height: 146px; text-align: center; text-shadow: none;
                                  border: solid 2px #EFF3F5; border-radius: 50%; }
a.scrollNext:hover              { color: #FFF; border-color: #FFF; }

.top50                          {  }
.fullWidth.top50                { height: 1000px; box-sizing: border-box;
                                  background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/top-50-bg.jpg);
                                  background-repeat: repeat-x; background-position: center center; background-size: auto 100%; }

.top50 p                        { display: block; width: 66%; padding: 30px; box-sizing: border-box; margin: 40px 0;
                                  float: right; 
                                  background: rgba(0,25,45,0.8); }

.tiledBGbox                     { width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/video-section-bg.png') repeat-x center bottom; }

/**************** Body Container Style ********************/
.body-container-wrapper         { padding: 0; }

.body-container                 { width: 100%; }

.content                        { width: 90%; max-width: 1240px; margin: 0 auto; position: relative; }
.row-fluid .content             { width: 90%; }
.content:after                  { content: ""; display: table; clear: both; }

/**************** Typography Styles ********************/
h1, h2, h3, h4, h5, h6          { font-weight: 300; position: relative; z-index: 500; }

h1                              { font-family: 'Share'; font-weight: 700; font-size: 80px; line-height: 80px;
                                  margin: 0 0 80px 0; padding: 0 0 50px 0;
                                  border-bottom: solid 1px rgba(25, 54, 78, 0.2);
                                  color: #0054ae; text-align: center; }
    h1.small, h1 .small         { font-size: 60px; line-height: 70px; }
h2                              { font-family: 'Share'; font-weight: 700; font-size: 80px; line-height: 80px;
                                  margin: 0 0 80px 0; padding: 0 0 50px 0;
                                  border-bottom: solid 1px rgba(25, 54, 78, 0.2);
                                  color: #0054ae; text-align: center;
   }

h3                              { font-family: 'Share'; font-weight: 700; font-size: 60px; line-height: 70px;
                                  margin: 0;
  color: #0054ae;}
h4, h3.form-title {  font-family: 'Share'; font-weight: 700; font-size: 30px; line-height: 40px;
                                  margin: 30px 0 0 0; text-align: left;
                                  color: #0054ae; }
p + h4                          { margin-top: 30px; }

h4:first-child                  { margin-top: 0px; }

h4                              { font-family: 'Share'; font-weight: 400; font-size: 24px; line-height: 30px;
                                  margin: 40px 0 0 0;
                                  color: #0054ae }
    h4 + p                      { margin-top: 10px; }
p                               { font-size: 20px; line-height: 30px;
                                  margin: 36px 0 0 0;
                                  position: relative; z-index: 400; }
p:first-child                   { margin-top: 0; }

p.large                         { font-size: 1.5em; line-height: 1.5em; }

p.subheader                     { font-size: 30px; line-height: 40px; font-weight: 300; margin: 0; }

p.title                         { font-size: 30px; line-height: 40px; font-weight: 300; margin: 36px 0 -20px 0; }

p.quote                         { display: inline-block; padding: 20px;
                                  color: #eff3f5; font-family: 'Share'; font-size: 40px; text-align: left; line-height: 40px; text-shadow: 0px 2px 4px #00192d;
                                  border-radius: 5px; border: solid 1px #eff3f5;
                                  background: #0088ff; background: rgba(0, 136, 255, 0.9); }
p.quote em                      { font-family: 'Fira Sans'; font-size: 20px; }

blockquote                      { box-sizing: border-box; width: 100%;
                                  padding: 30px; margin: 30px 0;
                                  font-family: 'Fira Sans'; color: #eff3f5; text-shadow: 0 2px 5px #153759; font-size: 40px; line-height: 50px; font-weight: 700; text-align: center;
                                  background: #5a93c5; border: solid 3px #eff3f5; border-radius: 10px; box-shadow: 0 2px 15px rgba(25, 54, 78, 0.3); }
blockquote:first-child          { margin-top: 0px; }
blockquote em                   { font-family: 'Share'; font-weight: 400; font-size: 20px; line-height: 30px; }

blockquote.small                { font-size: 30px; line-height; 40px; }
blockquote.small em             { font-size: 20px; line-height: 30px; }


blockquote.noBox                { padding: 0; color: #0054AE; text-shadow: none; text-align: left; font-size: 30px; line-height: 40px; font-weight: 300;
                                  background: none; border: none; border-radius: 0; box-shadow: none; }
blockquote.noBox em             { clear: left; }

.dark blockquote.noBox          { width: 80%; max-width: 500px; margin: 0 auto;
                                  color: #FFF; text-shadow: 0px 1px 3px #000; 
                                  font-size: 40px; line-height: 50px; text-align: center; }

blockquote.noBox.hasImage       { max-width: 700px; padding-left: 30px; }

hr                              { height: 161px; margin: 0; position: relative; width: 100%;
                                  border: none; z-index: 200;
                                  clear: both; }
hr:before                       { content: ''; width: 100%; height: 1px;
                                  position: absolute; left: 0px; top: 80px;
                                  background: rgba(25,54,78,0.2);
                                  }

hr.h80                          { height: 80px; }
hr.h80:before                   { display: none; }
hr.spacer                       { height: 25px; }
    hr.spacer:before            { background: none; }

.dropCap                        { display: block; float: left; font-size: 70px; font-style: normal; height: 60px; line-height: 65px; }

img                             { -ms-interpolation-mode: bicubic; }

ul, ol                          { position: relative; z-index: 1; padding: 0 0 0 20px; }

.large                          { font-size: 1.5em; }

.fira                           { font-family: 'Fira Sans'; font-weight: 300; }

/**************** Typography on Dark Styles ********************/

.dark                           { color: #eff3f5; text-shadow: 0px 2px 3px #00192d; }

h1.dark, .dark h1,
h2.dark, .dark h2,
h3.dark, .dark h3,
h4.dark, .dark h4 { color: #eff3f5; text-shadow: 0px 4px 10px #00192d; }

h1.dark, .dark h1,
h2.dark, .dark h2 { border-color: rgba(0, 84, 174, 0.5) }

p.dark, .dark p                 { color: #eff3f5; text-shadow: 0px 2px 3px #00192d; }


.dark hr:before                 { background: rgba(0, 84, 174, 0.5); }
    .dark hr.spacer:before      { background: none; }


.dark .formWrapper            { color: #444; text-shadow: none !important; }

/**************** Link Style ********************/

a, a:visited                    { color: #0088ff; 
                                  transition: color 0.15s ease-in-out;
                                  text-decoration: none; outline: 0; }

a:hover                         { color: #32baff;
                                  text-decoration: none; }


a:focus                         { outline: 0; }
  
a.learnMore,
a.learnMore:visited,
a.CTA, a.CTA:visited            { display: inline-block; width: auto; height: auto; box-sizing: border-box;
                                  padding: 0 20px;
                                  color: #eff3f5; font-size: 18px; line-height: 48px; text-shadow: 0px 1px 4px #00192d; text-align: center;
                                  border: solid 1px #eff3f5; border-radius: 5px;
                                  background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%;
                                  box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out; }
    .dark a.learnMore,
    .dark a.CTA                 { box-shadow: 0px 1px 4px #000; }
a.learnMore:hover,
a.CTA:hover                     { border-color: #FFF; color: #FFF; background-position: 0 0%; }
a.learnMore:after,
a.CTA:after                     { content: ">"; font-family: 'ss-icons'; font-size: 0.5em; display: inline-block; padding: 0 0 0 8px; vertical-align: top; }

a.learnMore.noBG                { color: #31536e; border: solid 1px #31536e; text-shadow: none;
                                  background: linear-gradient( to bottom, rgba(239,243,245,0.9), rgba(239,243,245, 0.0), rgba(239,243,245,0.0)) repeat;
                                  background-size: 100% 200%; background-position: 0 100%; }
.dark a.learnMore.noBG          { color: #eff3f5; border: solid 1px #eff3f5; text-shadow: 0px 1px 4px #00192d;
                                  background: linear-gradient( to bottom, rgba(239,243,245,0.25), rgba(239,243,245, 0.0), rgba(239,243,245,0.0)) repeat;
                                  background-size: 100% 200%; background-position: 0 100%; }
a.learnMore.noBG:hover          { background-position: 0 0%; }


a.learnMore.green               { background: #0088ff; background: linear-gradient( to bottom, rgba(160,229,44,0.9), rgba(100,160,0, 0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%; }
a.learnMore.green:hover          { background-position: 0 0%; }

a.learnMore small								{ margin: 0; padding: 10px 0 0 0; display: block; width: 100%; line-height: 1 }

/**************** Image Style ********************/

img.shadow, iframe.shadow, video.shadow       { border: solid 1px #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }

.dark img.shadow,
.dark iframe.shadow             { border: solid 1px #153759; box-shadow: 0px 2px 15px rgba(0,0,0,1); }

img.left                        { margin: 0 20px 20px 0; }
img.right                       { margin: 0 0 20px 20px; }



img.fullSize,
img.extend.fullSize             { max-width: none; max-height: none; width: auto; }



.tile                           { position: relative; width: 672px; height: 501px;
                                  background: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Design_Features/tile_base.png") no-repeat center top; }
.tile > img                     { position: absolute; left: 26px; }


.feature-module img:hover       { opacity: 0.7; }

img.extend                      { position: absolute; max-height: 100%; max-width: none; width: auto; top: 0; bottom: 0; }
img.extend.left                 { right: 100%; margin-right: 40px; }
img.extend.right                { left: 100%; margin-left: 40px; }

video.gifv                              { width: 100%; box-sizing: border-box;
                                          border: solid 1px #EFF3F5;
                                          box-shadow: 0px 5px 15px rgba(25,54,78,0.3); }

.youTubeContainer               {
  position: relative; width: 100%; height: 0; padding-bottom: 56%; clear: both;
  background: #000 url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/spinner.gif) no-repeat center center;
  border: solid 1px #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3);
}                       
.youTubeContainer iframe        { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.youTubeContainer .hs-responsive-embed { 
  max-width: 100% !important; max-height: none !important;
  margin:0;
}
.youTubeContainer.shadow        { border: solid 1px #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }
.dark .youTubeContainer.shadow  { border: solid 1px #153759; box-shadow: 0px 2px 15px rgba(0,0,0,1); }

.tip360                         { display: block; width: 100%; height: 100%; opacity: 1; box-sizing: border-box; padding: 20px;
                                  position: absolute; top: 0; left: 0; z-index: 500; pointer-events: none; overflow: hidden;
                                  color: #EFF3F5; font-size: 14px; text-align: center; text-shadow: 0px 1px 5px #000;
                                  background: linear-gradient( to bottom, rgba(0,0,0,0.25) 10%, rgba(0,0,0,0) 33% );
                                  transition: all 0.3s ease-in-out; }
.youTubeContainer:hover .tip360, .tip360.paused { height: 0px; opacity: 0; }





svg:not(.Icon__IconContainer-sc-1ysxs3-0 svg) path                        { fill: #EFF3F5; }

svg.svgMouseAnimate             { width: 30px; height: 45px; margin-left: -15px;
                                  position: absolute; top: 60px; left: 50%;
                                  animation: mouseDrag 3s infinite; animation-play-state: running; }

svg path.svgLeftButton          { animation: mouseClick 3s infinite; animation-play-state: running; }

.paused svg.svgMouseAnimate, .paused svg path.svgLeftButton
                                { animation-play-state: paused; }


@keyframes mouseDrag            {
    0%  {
        left: 50%; top: 60px; transform: rotate(0deg);
    }
    
    10%  {
        left: 50%; top: 60px; transform: rotate(0deg);
    }
    
    40% {
        left: calc(50% + 55px); top: 80px; transform: rotate(10deg);
    }
    
    65% {
        left: calc(50% - 50px); top: 75px; transform: rotate(-10deg);
    }
    80% {
        left: calc(50% - 50px); top: 75px; transform: rotate(-10deg);
    }
    100% {
        left: 50%; top: 60px; transform: rotate(0deg);
    }
    
}

@keyframes mouseClick            {
    0%  {
        fill: #EFF3F5;
    }
    
    3%  {
        fill: #FD0;
    }
    
    66% {
        fill: #FD0;
    }
    68% {
        fill: #EFF3F5;
    }
    100% {
        fill: #EFF3F5;
    }
    
}


/* Fixed Background Scrolling Stuff  */
.fixedBackground {
  position: relative;
/*   padding-top: 240px; */
}

.backgrounds {
  position: sticky;
/*     position: absolute; */
/*     left: 0; */
    top: 0;
    height: 100vh;
    width: 100%;
    overflow: hidden;
}

.backgrounds.fixed {
/*   position: fixed; */
}

.backgrounds img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    z-index: 1;
/*   visibility: hidden; */
  opacity: 0;
  transition: all 300ms ease-in-out;
  object-fit: cover;
  height: 100%;
}

.backgrounds img:first-child {
/*   visibility: visible; */
  opacity: 1;
}

.backgrounds img.active {
/*   z-index: 100; */
/*   visibility: visible; */
  opacity: 1;
}

.fixedBackground .content {
  position: relative;
  margin-top: calc(-100vh + 120px);
}

.fixedBackground #end {
  display: block;
  position: absolute;
  bottom: 0;
}

/**************** List Styles ********************/

ul.tiles                        { display: block; width: 100%;
                                  margin: 0; padding: 0;
                                  list-style-type: none; }
ul.tiles li                     { box-sizing: border-box; display: block; width: calc(50% - 10px); position: relative; 
                                  padding: 0; float: left;
                                  font-size: 30px; color: #0054ae; text-align: center; line-height: 50px;
                                  border: solid 1px #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }
ul.tiles li:nth-child(2n)       { margin: 0 0 40px 20px; }
ul.tiles li span                { display: block; box-sizing: border-box; width: 100%; height: 100%; padding: 20px; position: absolute; top: 0; right: 0;
                                  background: rgba(0,84,174,0.8); color: #eff3f5; text-shadow: 0px 1px 4px #00192d; 
                                  opacity: 1; transition: opacity 0.3s ease-in-out; }
ul.tiles li span:before         { content:'e'; font-family: 'ss-icons'; font-size: 50px; clear: both; display: block; }
ul.tiles li:hover span,
ul.tiles li.active span         { opacity: 0; }

ul.ssCheckList                  { list-style-type: none; text-align: left; font-size: 21px; line-height: 32px; margin: 30px 0; }
ul.ssCheckList li               { padding: 5px 0px 5px 40px; position: relative; }
ul.ssCheckList li::before       { content: ""; background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/comparison/check_mark.png) no-repeat center -9px; display: block; width: 32px; height: 32px; overflow: hidden; position: absolute; left: 0; top: 5px; }


/**************** Content Container Styles ********************/

section                         { position: relative; }

.left                           { float: left; }
.right, .floatRight             { float: right; }
.center                         { text-align: center; margin-left: auto; margin-right: auto; }
.left:after, .right:after       { content: ""; display: table; clear: both; }

.clear                          { clear: both; }
.clear:after                    { content: ''; display: table; clear: both; }

.half                           { display: block; box-sizing: border-box; width: 50%; padding: 0 20px 0 0; float: left; }
    .half:after                 { content: ''; display: table; clear: both; }
    .half + .half               { width: 50%; padding: 0 0 0 20px; }

.whiteBox                       { border: solid 1px #eff3f5; background: #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); padding: 20px; }
.half.whiteBox                  { width: calc(50% - 40px); margin: 10px; padding: 30px; }
.half + .half.whiteBox          { padding: 30px; }
.whiteBox p.title               { margin-top: 0; }

.min300                         { min-height: 300px; }

.oneThird                       { box-sizing: border-box; display: block; width: 34%; position: relative; margin: 0; }
.oneThird.sticky{width:34.5%;}
.twoThirds                      { box-sizing: border-box; display: block; width: 66%; padding: 0 40px 0 0; position: relative; margin: 0; }

.twoThirds.left                 { padding: 0 40px 0 0; }
.twoThirds.right                { padding: 0 0 0 40px; }

.oneThird + .twoThirds,
.twoThirds + .oneThird          { display: inline-block; }

.twoThirds.right,
.oneThird.right                 { float: right; }


ul.oneThird, ul.twoThirds				{ float: left; margin-left: 1.5%; margin-right: 1.5%; width: 30%;  }
ul.twoThirds										{  width: 63%; }



.sticky                         { position: sticky; top: 110px; }
.relative                       { position: relative; }
.absolute                       { position: absolute; }

/*.absolute.right                 { right: 0; }*/

/*.is_stuck                       { position: absolute; }*/

.pageHeader,
.row-fluid [class*="span"].pageHeader { min-height: 500px; padding-top: 100px; margin: 0 0 80px 0; overflow: hidden; }
.pageHeader .bg                 { display: block; width: 100%; height: 100%;
                                  position: absolute; left: 0; right: 0; top: 0; bottom: 0;
                                  background: #00192d; background-position: center center; background-size: cover; }

.pageHeader.features            {  }
.pageHeader.features h1         { box-sizing: border-box; padding-top: 200px;
                                  position: relative; top: auto; bottom: auto; left: auto; }
.pageHeader.features .backdrop h1 { padding-top: 0px; }
.pageHeader.features .backdrop  { padding: 40px; margin: 200px auto 0 auto; max-width: 800px; }
.pageHeader.features p          { max-width: 800px; margin: 0 auto; text-align: center; padding-top: 40px;
                                  font-size: 24px; line-height: 36px; text-shadow: 0 1px 1px #000, 0px 2px 3px #00192d; }

.constructionBackdrop           { width: auto; max-width: 800px; padding: 40px;
                                  position: relative; margin: 0 auto; margin-top: 150px;
                                  background: rgba(223,230,235,0.8); }
.pageHeader.features .constructionBackdrop h1 { display: inherit; padding-top: 0px; color: #153759; text-shadow: none; }
.pageHeader.features .constructionBackdrop p  { display: inherit; color: #153759; text-shadow: none; }

/**************** Home Page Styles ********************/

.homeHeader                     { margin: 0 0 80px 0; }
.homeHeader.dark                { padding: 0; }

.homeHeader .vipHeader          { height: 600px; position: relative; overflow: hidden; padding: 0; }

.vipHeader:after                { content: ''; display: block; width: 100%; height: 100%;
                                  position: absolute; top: 0; left: 0; 
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/header_03.jpg') no-repeat center center; background-size: cover; }
                                  
.vipHeader .slideBox            { padding: 0 20px 0 0; position: relative; top: 0px; transition: top 0.3s ease-in-out;
                                  float: left; }
.vipHeader .slideBox span       { display: block; height: 80px; line-height: 80px; font-weight: 700; clear: both; position: relative;
                                  opacity: 0.1; transition: all 0.3s ease-in-out; }

.vipHeader .content             { overflow: hidden; }
.vipHeader h1                   { position: absolute; right: 0px; top: 250px; min-width: 600px;
                                  font-family: 'Fira Sans'; font-size: 48px; line-height: 80px; font-weight: 300; text-align: right;
                                  border: none; transition: all 0.3s ease-in-out; }
.vipHeader h1 .holdText         { position: relative; top: -13px;
                                  font-family: 'Share'; font-weight: 700; font-size: 80px; }

.vipHeader .learnMore           { box-sizing: border-box; width: 280px; height: 70px;
                                  position: absolute; bottom: 175px; right: 0; z-index: 700;
                                  font-size: 24px; line-height: 70px; text-align: center;
                                  /* background: linear-gradient( to bottom, rgba(0,84,174,0.2), rgba(54,191,255,0.2) ) repeat; */
                                  
                                  box-shadow: 0 5px 15px rgba(0, 25, 45, 0.3) !important; }

.softwareSection                { position: relative; padding: 0 0 0 590px; }
.softwareBoxes                  { position: absolute; left: -75px; top: -150px; z-index: 999; }


.caseStudy                      { box-sizing: border-box; width: 100%; min-height: 380px; padding: 40px;
                                  background: #eff3f5 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/damon_lang.jpg') no-repeat center center; background-size: cover;
                                  border: solid 1px #eff3f5; box-shadow: 0 2px 15px rgba(25, 54, 78, 0.3); }
.caseStudy p                    { font-size: 36px; line-height: 42px; width: 60%; }
.caseStudy p.quoteName          { font-size: 18px; line-height: 18px; margin-top: 10px; }

.supportCTA                     { width: 100%; }
.supportCTA > div               { display: block; width: calc(33.3% - 40px); height: 250px; padding: 110px 20px 20px 20px; box-sizing: border-box;
                                  margin: 20px; float: left; position: relative; cursor: pointer;
                                  background-size: cover; border: solid 1px #eff3f5; box-shadow: 0 2px 15px rgba(25, 54, 78, 0.3); }

.supportCTA > div:nth-child(1)  { background-image: url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/support_cta_support.jpg); }
.supportCTA > div:nth-child(2)  { background-image: url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/support_cta_live-training.jpg); }
.supportCTA > div:nth-child(3)  { background-image: url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/support_cta_blog.jpg); }

.supportCTA > div a.learnMore   { width: calc(100% - 40px); position: absolute; left: 20px; bottom: 20px; }

.quoteBubbles                   { display: block; width: 100%; height: 0;
                                  position: absolute; top: 0; left: 0; z-index: 900;
                                  opacity: 1; transition: opacity 0.3s ease-in-out; }
.quoteBubbles > *               { display: block; width: auto; height: auto; padding: 20px 40px;
                                  position: absolute; bottom: 0px; left: 20px;
                                  color: #EFF3F5; font-family: "Share"; font-size: 28px; font-weight: 700; line-height: 28px; text-align: center;
                                  background: #08F; border-radius: 5px;
                                  box-shadow: 0 2px 15px rgba(25, 54, 78, 0.3); opacity: 0;
                                  transition: all 1s ease-in-out;}
.quoteBubbles > *.active        { opacity: 1; bottom: 20px; }
.quoteBubbles > *:before        { content: ""; display: block; width: 0; height: 0;
                                  position: absolute; bottom: -30px; left: 30px;
                                  border-left: 0px solid transparent; border-right: 40px solid transparent;
	                              border-top: 30px solid #08F; }
.quoteBubbles > * span          { display: block; width: 100%; clear: both;
                                  font-family: 'Fira Sans'; font-size: 12px; font-weight: 300; }
.quoteBubbles > * span:before   { content: "-- "; }

.quoteBubbles.hideMe              { display: block; opacity: 0; }

/**************** CTA Styles ********************/

.ctaGroup                       { height: 500px; border: solid 1px #EFF3F5; box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25); overflow: hidden; }
               

.ctaGroup > div, .ctaGroup .content, .ctaGroup div,
.ctaGroup .row-fluid            { height: 0; }
.ctaGroup > div, .ctaGroup .content, .ctaGroup .row-fluid { display: block; width: 100%; float: left; }

.row-fluid .primaryCTA[class*="span"],
.row-fluid .secondaryCTA[class*="span"] { box-sizing: border-box; padding: 0px; margin: 0; display: block; height: 500px; position: absolute; }

.primaryCTA div,
.secondaryCTA div               { height: 100%; }

.primaryCTA a, .secondaryCTA a  { display: block; height: 100%;
                                  color: #eff3f5; text-shadow: 0px 2px 5px #e38b0e; }
.primaryCTA a                   { width: 100%; height: 100%; }
.secondaryCTA a                 { text-shadow: 0px 2px 5px #0054ae; width: 100%; text-align: center; }



.primaryCTA, .row-fluid .primaryCTA[class*="span"]
                                { display: block; width: calc(100% - 400px); height: 500px; float: left; text-align: center;
                                  background: #ffc600 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/CTA_Images/demo-bg.jpg') no-repeat center right; background-size: cover; }
       

.secondaryCTA, .row-fluid .secondaryCTA[class*="span"]
                                { width: 400px; height: 100%; box-sizing: border-box; padding: 100px 70px;
                                  position: absolute; top: 0; right: 0; text-align: center;
                                  background: #EFF3F5 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/CTA_Images/register-bg.jpg') no-repeat center left; background-size: cover;
                                  border-left: solid 1px #EFF3F5; }

.secondaryCTA h2                { color: #4d4d4d; font-size: 36px; line-height: 40px; text-shadow: none; margin: 0; padding: 0 0 20px 0; }
.secondaryCTA p                 { font-family: 'Fira Sans', sans-serif; color: #000; font-size: 18px; font-weight: 300; line-height: 30px; padding: 25px 0; text-shadow: none; }
.secondaryCTA a span            { display: inline-block; box-sizing: border-box; clear: both; height: 50px; padding: 0 20px; position: relative; top: 0px; margin: 0 auto;
                                  font-family: 'Share'; font-size: 18px; font-weight: 700; line-height: 50px; text-shadow: none;
                                  background: #ff9103; background: rgba(255, 145, 3, 0.9);
                                  border: solid 1px #eff3f5; border-radius: 5px; box-shadow: 0px 3px 10px rgba(0,0,0,0.2);
                                  transition: all 0.3s ease-in-out; }
.secondaryCTA a span:after      { content: ">"; font-family: 'ss-icons'; font-size: 15px; padding-left: 10px; }
.secondaryCTA a:hover span      { top: -5px; box-shadow: 0px 8px 15px rgba(0,0,0,0.2); }

.secondaryCTA a > span:first-child { margin-top: 150px; }



.primaryCTA a h2                { display: block; box-sizing: border-box; width: 100%; padding: 80px 0 30px 0; }
.primaryCTA a p                 { display: block; box-sizing: border-box; clear: both; padding: 80px 0 50px 0; color: #EFF3F5; text-shadow:  0px 2px 5px #e38b0e; font-size: 24px; text-align: center; }
.primaryCTA a span              { display: inline-block; box-sizing: border-box; clear: both; height: 80px; padding: 0 40px; position: relative; top: 0px;
                                  color: #ff9103; font-family: 'Share'; font-size: 40px; font-weight: 700; line-height: 80px; text-shadow: none;
                                  border: none; border-radius: 5px; position: absolute; top: 300px; left: 50%; transform: translateX(-50%); box-shadow: none;
                                  background: #EFF3F5; transition: all 0.3s ease-in-out; }
.primaryCTA a span:after        { content: ">"; font-family: 'ss-icons'; font-size: 25px; padding-left: 10px; }
.primaryCTA a:hover span        { top: 295px; }


a.cta_liveDemo                  { display: block; box-sizing: border-box;
                                  background: none; }

a.cta_liveTraining              { display: block; box-sizing: border-box;
                                  background: none; }


.CTA-header                     { display: block; float: left; margin: 0 40px 0 0; }
.testMode .CTA-header           { display: block; }

.CTA-header a                   { display: block; width: auto; height: 40px; padding: 0 0 0 0;
                                  position: relative; top: 5px;
                                  color: #00192D; font-size: 18px; line-height: 40px; font-weight: 300;
                                  text-shadow: 0px 0px 0px #0054ae;
                                  background: #08F; /*background: linear-gradient( rgba(20,55,90,0.8) 0%, rgba(20,55,90,0.8) 70%, rgba(0,85,175,0.8) 100%) repeat;
                                  background-size: 100% 200%; background-position: 0 0;*/
                                  transition: all 0.3s ease-in-out; }
.CTA-header a:hover             { text-shadow: 0px 0px 5px #0054ae; background: rgba(0,136,255,1); /* background-position: 0 100%; */ }
.CTA-header .ss-icons,
.CTA-header .ss-icon            { color: #EFF3F5; font-size: 26px; height: 50px; margin: 0 5px 0 0;
                                  display: block; position: relative; top: 0; left: -5px; float: left; }

.CTA-header a strong            { font-weight: 300; color: #EFF3F5; }

/**************** TEST MODE ********************/

.testModeOnly                   { display: none !important; }





/* ***************************** VIDEO POPUP ********************************** */

.videoPopup, .videoPopup.dark {
  display: none; width: 100%; height: 100vh; padding: 0;
  position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 10001;
  background: rgba(0,0,0,0.75); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  transition: all 0.5s ease-in-out; opacity: 0;
}

.videoPopup.show {
  display: block; opacity: 1;
}

.videoBox {
  position: absolute; top: 80px; left: 100px;
  display: block; width: calc(100% - 200px); height: calc(100% - 200px);
  opacity: 0;
  transition: all 0.5s ease-in-out;
}

.closeVideoPopup {
  display: block; width: 50px; height: 50px; position: absolute; top: 10px; right: 10px;
  cursor: pointer; font-size: 50px; line-height: 50px; color: #FFF; opacity: 0.5;
}
.closeVideoPopup:hover {
  opacity: 1;  
}

.videoPopup.show .videoBox {
  top: 100px; opacity: 1; 
}

#videoFrame {
  display: block; width: 100%; height: 100%;
  position: absolute; top: 0; left: 0; right: 0; bottom: 0;
}




/**************** Video BG Styles ********************/

.videoBG,
.featuresHeader .videoBG       {  position: absolute; left: 50%; top: 50%; z-index: -100;
                                  transform: translateX(-50%) translateY(-50%);
                                  min-width: 100%; min-height: 100%; width: auto; height: auto; max-width: none;
                                  background-size: cover; }

.featuresHeader #bgVideo       {  position: absolute; left: 0; bottom: 0; z-index: -100;
                                  min-width: 100%; min-height: 1000px; width: auto; height: auto; max-width: none; width: fit-content;
                                  background-size: cover; }

.browserHeight                  { height: 100%; width: 100%; }

.poolStudio .videoBG,
.poolStudio #bgVideo            { /*background: #0059e2 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Header_Images/pool_studio_header_bg.jpg') no-repeat center bottom;*/
                                  background: #0059e2 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/videos/ps_header_bg.jpg') no-repeat center bottom;
                                  background-size: cover; }
.vizTerra .videoBG,
.vizTerra #bgVideo              { background: #444 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Header_Images/vizterra_bg.jpg') no-repeat center bottom;  background-size: cover; }
.vip .videoBG,
.vip #bgVideo                   { background: #153759 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/videos/vip_header_bg.jpg') no-repeat center bottom; background-size: cover; }


/**************** Feature Pages Styles ********************/

.fullWidth                      {  }
.fullWidth:after                { content: " "; display: table; clear: both; }
.featuresHeader                 { height: 1000px; width: 100%; overflow: hidden;
                                  position: relative; }

.featuresHeader div,
.featuresHeader span            { position: absolute; height: 1000px; width: 100%; overflow: hidden; }

.BG                             { position: relative; z-index: 0; }

.featuresHeader h1              { margin: 230px 0 30px 0; border: none; padding: 0; }
.featuresHeader p               { margin: 0; }

.dark                           { background: #00192d; padding: 80px 0 160px 0; }

.featuresHeader.dark            { background: none; padding: 0; }

.topMargin                      { margin-top: 80px; }
.bottomMargin                   { margin-bottom: 80px; }

.presentation                   { background: #00192d; padding: 80px 0 160px 0; margin: 0; overflow: hidden; }

.dpb                            { display: block; }
.featuresHeader .dpb            { height: 160px; width: 800px;
                                  position: absolute; bottom: 240px; left: calc(50% - 400px); margin: 0 auto; }


.dpb a                          { display: block; width: 156px; height: 20px; padding: 116px 0 20px 0;
                                  position: absolute; left: 0px; top: 0px;
                                  border-radius: 78px; border: solid 2px #eff3f5;
                                  background: #0054ae; background: rgba(0,85,175, 0.5);
                                  background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/sprite_large.png'); background-repeat: no-repeat; background-position: 0px 0px;
                                  font-size: 14px; color: #eff3f5; text-align: center; text-decoration: none; }
    .dpb a:hover                { color: #eff3f5; }
    .dpb a:nth-child(2)         { left: calc(50% - 80px); background-position: -160px 0px; }
        .dpb a:nth-child(2):after,
        .dpb a:nth-child(3):after{ content: ''; display: block; height: 2px; width: 162px; position: absolute; top: 79px; left: -163px; background: #eff3f5;  }
    .dpb a:nth-child(3)         { left: auto; right: 0; background-position: -320px 0px; }


h1.featureHeader                { display: block; height: 250px; width: 100%; margin: 0 0 50px 0;
                                  color: rgba(0,136,255, 0.2); font-size: 200px; line-height: 250px; text-align: right;
                                  position: relative; }

.designIcon,
.presentIcon,
.constructIcon                  { width: 100px; height: 100px; text-indent: -2000em;
                                  position: relative; top: -50px; left: calc(50% - 50px); 
                                  border: solid 1px #eff3f5; border-radius: 50px;
                                  background: #dfe6eb; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }
.presentIcon                    { background: #00192d; box-shadow: 0px 15px 15px #000; border-color: #153759; top: 50px; }

.designIcon:before,
.presentIcon:before,
.constructIcon:before           { content: ""; width: 150px; height: 150px;
                                  position: absolute; top: -15px; left: calc(50% - 75px);
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/sprite_large.png'); }

.designIcon:before              { left: -40px; top: -20px; background-position: 0px 0px; }
.presentIcon:before             { left: -29px; top: -13px; background-position: -158px 0px; }
.constructIcon:before           { left: -30px; top: -13px; background-position: -320px 0px; }


/*h1.featureHeader + *        { margin-top: 250px; }*/
#presentSection h1.featureHeader:after { background-position: -158px 0; }
#presentSection h1.featureHeader:before { border-color: #0054ae; }
#buildSection h1.featureHeader:after { background-position: -320px 0; }

.instant3Dimages                { position: relative; left: 40%; top: 10px; }
.instant3Dimages > img          { position: absolute; top: 0px; left: 30px; }
.instant3Dimages > img:nth-child(2) { top: 290px; left: 130px; }


.screen                         { position: relative; clear: all; z-index: 1; }
.screen > .bg                   { max-width: 1309px; width: 100%; height: auto; }
.screenInner                    { width: auto;
                                  position: absolute; top: 2%; left: 1.5%; right: 1.5%;
                                  border: solid rgba(0,0,0,0) 1px; border-top-color: rgba(0,0,0,0.5); border-bottom-color: rgba(255,255,255,0.1); }

.dark .screen:before            { content: ""; display: block; width: 160%; height: 130%;
                                  position: absolute; left: -30%; right: -30% top: -20%; bottom: -10%; z-index: -1;
                                  background: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Present_Features/blue_glow.jpg") no-repeat; background-size: 100% 100%; }

.screen iframe                  { width: 100%; height: 100%; border: none; box-shadow: none; }

.screen .textBubbles            { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.textBubbles > span             { display: block; padding: 15px 25px 15px 60px; margin: 13px -75px 0 0; float: right;
                                  position: relative; top: 0px; right: 0; opacity: 0; cursor: default;
                                  font-family: 'Share'; font-size: 24px; color: #dfe6eb; font-weight: 700; line-height: 34px;
                                  background: #0088ff; border: solid 3px #dfe6eb; border-radius: 5px;
                                  box-shadow: 0px 3px 10px rgba(0,0,0,0.5);
                                  transition: all 0.3s ease-in-out, margin-top 0.3s ease-in-out; }
.textBubbles > span.current     { margin-top: 33px; opacity: 1; cursor: pointer; }
    .textBubbles > span:after   { content: ""; width: 0; height: 0;
                                  position: absolute; top: -33px; right: 50px;
                                  border-left: 0px solid transparent; border-right: 25px solid transparent;
                                  border-bottom: 35px solid #0088ff; }
    .textBubbles > span:before  { content: ""; width: 0; height: 0;
                                  position: absolute; top: -41px; right: 47px;
                                  border-left: 0px solid transparent; border-right: 31px solid transparent;
                                  border-bottom: 41px solid #dfe6eb; }
    .textBubbles > span.middleArrow { margin-right: 0; transform: translateX(50%); }
    .textBubbles > span.middleArrow:after { left: 50%; }
    .textBubbles > span.middleArrow:before { left: calc(50% - 3px); }
    
    .textBubbles > span span    { display: inline-block; width: auto; height: 24px; padding: 0 20px 0 8px;
                                  font-family: "Fira Sans"; font-size: 14px; font-weight: 300; line-height: 24px;
                                  position: relative; left: 5px; bottom: 4px; border: solid 1px #dfe6eb; border-radius: 4px; }
    .textBubbles > span span:after { content: ">"; font-family: "ss-icons"; font-size: 10px; position: absolute; right: 6px; }

.textBubbles b                  { width: 40px; height: 40px; box-sizing: border-box;
                                  display: block; position: absolute; left: 10px; top: 12px;
                                  color: #FFF; font-family: 'ss-icons'; font-size: 25px; line-height: 36px; font-weight: normal; text-align: center; overflow: hidden; text-shadow: 0px 1px 3px #a24100;
                                  background: #ff9103; background: linear-gradient(to bottom, #ffbb03, #ff9103);
                                  border: solid 2px #dfe6eb; border-radius: 50%; }

.restartVideoTour               { box-sizing: border-box; display: block; width: 100px; height: 100px;
                                  position: absolute; left: calc(50% - 53px); top: calc(50% - 53px); z-index: 500;
                                  overflow: hidden; text-indent: -2000em; cursor: pointer;
                                  background: #0088ff url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/repeat_icon.png') no-repeat center center; border: solid 3px #dfe6eb; border-radius: 53px;
                                  box-shadow: 0px 3px 10px rgba(0,0,0,0.5); }

.screen + hr                    { margin-top: -50px; }

.dimensions                     { box-sizing: border-box; display: inline-block; padding: 20px;
                                  color: #eff3f5; position: relative; margin-bottom: 0px; top: 30px; left: 47%; transform: translateX(-50%);
                                  border: solid 1px #eff3f5; border-radius: 5px; box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%; }
.dimensions:after               { content: ""; display: block; width: 0; height: 0;
                                  position: absolute; left: calc(50% - 12.5px); bottom: -50px;
                                  border-style: solid; border-width: 50px 12.5px 0 12.5px; border-color: #eff3f5 transparent transparent transparent; }

.landscapingBg                  { position: relative; }
.landscapingBg img              { position: absolute; top: -50px; left: -120px; z-index: 1; width: auto; height: auto; max-width: none; }
.landscapingBg .content         { position: relative; z-index: 100; height: 800px; }
.landscapingBg p                { position: relative; top: 440px; left: 0px; width: 45%; }


.exclusiveFeature               { width: auto; height: 0px; padding: 0 20px 0 10px; display: none;
                                  position: relative; z-index: 700; left: -25px; margin: 10px 0;
                                  color: #eff3f5; font-family: "Share"; font-size: 18px; font-weight: 400; line-height: 50px;
                                  border-radius: 25px 5px 5px 25px; /*border: solid 3px #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3);*/ 
                                  background: #08F; opacity: 0; transition: opacity 0.3s ease-in-out; }
.exclusiveFeature.right         {  }
.exclusiveFeature.center        { max-width: 500px; margin: 0 auto; }
.backdrop .exclusiveFeature.active {  }
.dark .exclusiveFeature         { text-shadow: none; }
.exclusiveFeature.active        { display: block; height: 50px; opacity: 1; }

/*.exclusiveFeature:after         { content: ''; display: block; width: 0; height: 0;
                                  position: absolute; bottom: -9px; left: calc(50% - 10px);
                                  border-left: 10px solid transparent; border-right: 10px solid transparent;
                                  border-top: 10px solid #08F; }
.exclusiveFeature:before        { content: ''; display: block; width: 0; height: 0;
                                  position: absolute; bottom: -14px; left: calc(50% - 12px);
                                  border-left: 12px solid transparent; border-right: 12px solid transparent;
                                  border-top: 12px solid #eff3f5; }
  */                                
.exclusiveFeature img           { width: 30px; height: 30px; margin: 10px 10px 0 0; float: left; }

body.vizTerra .vipOnly.exclusiveFeature, body.poolStudio .vipOnly.exclusiveFeature { display: block; }

.vipOnlyContent, .vtVipOnlyContent,
.psVipOnlyContent               { opacity: 1; transition: opacity 0.3s ease-in-out; }

.vizTerra .vipOnlyContent, .vizTerra .psVipOnlyContent,
.poolStudio .vipOnlyContent, .poolStudio .vtVipOnlyContent { opacity: 0.8; }


/**************** Vip 3D Only Styles ********************/

.vip3Donly                      { display: block; width: 100%; height: 50px; margin: 40px 0 20px 0;
                                  position: relative; z-index: 1; clear: both;
                                  font-family: 'Fira Sans'; font-size: 30px; font-weight: 300; color: #0087FF; line-height: 50px; text-align: center; text-shadow: none; text-transform: uppercase;
                                  background: #EFF3F5; }
.vip3Donly:after                { content: ""; display: block; width: 0; height: 0;
                                  position: absolute; top: 50px; left: calc(50% - 10px);
                                  border-left: 10px solid transparent; border-right: 10px solid transparent;
                                  border-top: 10px solid #EFF3F5; }
.vip3Donly img,
.backdrop .vip3Donly img        { display: inline-block; height: 30px; width: auto; vertical-align: middle; margin: 0; }

.backdrop .vip3Donly            { padding: 0 20px; left: -20px; }
    .backdrop .vip3Donly:first-child { margin-top: -20px; }
.todControls                    { display: block; width: 240px; height: 240px; margin: 20px auto;
                                  position: relative; z-index: 100; overflow: hidden;
                                  border: solid 5px #eff3f5; border-radius: 50%; }
.todControls:before             { content: ""; display: block; width: 100%; height: 100%;
                                  position: absolute; top: 0px; left: 0px;
                                  background: #000 url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Present_Features/true_shadows/sun-gradient.jpg) no-repeat center center; background-size: cover;
                                  -webkit-transform: rotate(0deg); transform: rotate(0deg); transition: all 0.2s ease-in-out; }
.todControls.dusk:before        { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }
.todControls.night:before       { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); }
.todControls ul.options,
.bgSlider .todControls ul.options
                                { display: block; width: 100%; height: 100%; padding: 48px 0 0 0; box-sizing: border-box; margin: 0;
                                  border: none;
                                  background: none; background: url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Present_Features/true_shadows/clock-bg.png) no-repeat center center; }
.bgSlider .todControls ul.options li
                                { border: none; width: 100%; height: 50px; line-height: 50px;
                                  overflow: hidden; text-indent: -2000em; 
                                  background: transparent url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Present_Features/true_shadows/sun.png) no-repeat center center;
                                  opacity: 0.5; }
.bgSlider .todControls ul.options li.active
                                { opacity: 1; background: transparent url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Present_Features/true_shadows/sun.png) no-repeat center center; }
.bgSlider .todControls ul.options li:nth-child(2),
.bgSlider .todControls ul.options li:nth-child(2).active { background-image: url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Present_Features/true_shadows/susnet.png); }
.bgSlider .todControls ul.options li:nth-child(3),
.bgSlider .todControls ul.options li:nth-child(3).active { background-image: url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Present_Features/true_shadows/moon.png); }

/**************** Press ********************/

.pageHeader.press               { height: 300px; background: #0054ae url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/press_page_header.jpg') no-repeat center center; background-size: cover; }
.press p                        { margin: 0 0 10px 0; padding: 10px 20px 10px 70px; background: #EFF3F5 url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/news_icon_small.png) no-repeat 10px 10px; box-sizing: border-box; }


/**************** AR App ********************/




/**************** FAQ ********************/

.faq
    { position: relative; }
.faq:after  { content: ""; display: table; clear: both; }

.faq h3
    { display: block; width: 33%; padding: 0 40px 0 0; box-sizing: border-box;
      float: left; clear: both;
      font-family: "Fira Sans", sans-serif; font-size: 20px; font-weight: 400; line-height: 30px; text-align: right; }

.faq p
    { display: block; width: 66%; box-sizing: border-box; float: left; }

.faq p, .faq h3
    { padding-top: 30px; margin-top: 30px; border-top: solid 1px rgba(25, 54, 78, 0.2); }
    

/**************** Stellar/Parallax Styles ********************/

.stickyScroll                   { position: relative; }

.parallax                       { position: absolute; }

.parallaxParent                 { position: relative; }
.parallaxParent > *             { position: relative; }


.parallaxBG.parallaxCTA                    { margin: 60px 0; background-repeat: no-repeat; background-size: cover !important; text-align: center; box-sizing: border-box; }
.parallaxContent                { box-sizing: border-box; max-width: 800px; text-align: center; margin: 0 auto; }

/**************** SyncAge Styles ********************/

.pageHeader.syncAge             { min-height: 400px; padding: 0 0 100px 0;
                                  background: #0283d6 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/syncAge/clouds.jpg') no-repeat center center; background-size: cover; background-attachment: fixed;
                                  text-align: center; }

.pageHeader.syncAge h1          { color: #EFF3F5; font-size: 50px; line-height: 60px;
                                  position: relative; top: 0; left: 0; padding: 150px 0 100px 0px;
                                  border: none; }
.pageHeader.syncAge h1 strong   { font-weight: 700; font-family: 'Share'; font-size: 60px; }


.signUpBtns > div           { display: inline-block; width: 240px; padding: 30px; position: relative; bottom: 0px;
                                  background: rgba(236,245,251, 0.75); box-shadow: 0px 5px 10px rgba(68,98,124,0.25);
                                  transition: all 0.2s ease; transform: scale(1); -webkit-transform: scale(1);
    }
        .signUpBtns > div:hover { background: rgba(255,255,255,1); box-shadow: 0px 15px 20px rgba(68,98,124,0.5); bottom: 20px; transform: scale(1.05); -webkit-transform: scale(1.05); }

.premium                        { z-index: 300; margin: 0 20px; }
.ribbon                         { display: block; position: absolute; width: 70px; height: 20px; top: 10px; right: -15px; transform: rotate(45deg); -webkit-transform: rotate(45deg); overflow: visible;
                                  font-size: 10px; line-height: 20px; color: #FFF;
                                  background: #0094fc; }

    .ribbon > div:first-child   { content: ''; width: 0; position: absolute; top: 0px; left: -19px;
                                  border-bottom: 20px solid #0094fc; border-left: 20px solid rgba(0,0,0,0); }
        .ribbon > div:first-child:after{ content: ''; width: 0; position: absolute; top: 19px; left: -19px;
                                  border-top: 15px solid #005999; border-right: 15px solid rgba(0,0,0,0); }
    .ribbon > div:last-child    { content: ''; width: 0; position: absolute; top: 0px; right: -19px;
                                  border-bottom: 20px solid #0094fc; border-right: 20px solid rgba(0,0,0,0); }
        .ribbon > div:last-child:after{ content: ''; width: 0; position: absolute; top: 19px; right: -19px;
                                  border-top: 15px solid #005999; border-left: 15px solid rgba(0,0,0,0); }
.signUpBtns h2                  { font-family: 'Fira Sans', sans-serif; font-size: 40px; font-weight: 300; color: #5a93c5; text-transform: uppercase; text-shadow: none; }


.signUpBtns h3                  { font-size: 80px; color: #08F; text-shadow: none; line-height: 80px; margin: 0; padding: 0; position: relative; text-align: center; }
    .signUpBtns h3 > span       { font-size: 40px; vertical-align: baseline; position: relative; top: -25px; }
    .signUpBtns .premium h3     { color: #12c003; }

.signUpBtns h4                  { font-size: 30px; font-weight: 300; text-shadow: none; margin: 10px 0; line-height: 50px; border-top: solid 1px #94c3d9; border-bottom: solid 1px #94c3d9; }

.signUpBtns > div > a       	{ display: inline-block; width: 220px; height: 40px; position: relative; margin: 10px 0 0 0;
								  font-family: 'Share'; font-size: 18px; line-height: 40px; font-weight: 400; color: #eff3f5; text-align: center; text-decoration: none; text-shadow: 0px -1px 0px #005999;
								  background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(0, 213, 255, 0.9), rgba(0, 157, 255, 0.9), rgba(0, 116, 255, 0.9)) repeat scroll 0 100% / 100% 200%;
                                  border: 1px solid #eff3f5; border-radius: 5px; box-shadow: 0 2px 5px rgba(0, 25, 45, 0.25); box-sizing: border-box;
								  transition: all 0.3s ease; }
	.signUpBtns > div > a:hover { background-position: 0 0; }


.signUpBtns p                   { margin: 10px 0 0 0; text-shadow: none; color: #08F;}
.signUpBtns h3 + p              { margin-top: -10px; }

.signUpBtns > div.premium > a:first-of-type	{ background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(160, 229, 44, 0.9), rgba(100, 160, 0, 0.9)) repeat scroll 0 100% / 100% 200%; }
	.signUpBtns > div.premium > a:first-of-type:hover {  }

.signUpBtns > div > a:last-of-type	{ display: inline-block; width: 220px; height: 40px; position: relative; margin: 10px 0 0 0;
								  font-family: 'Open Sans'; font-size: 18px; line-height: 40px; font-weight: 400; color: #444; text-align: center; text-decoration: none; text-shadow: 0px 1px 0px #FFF;
								  background: url('img/sprite_gradients.png') repeat-x 0px -200px; border: solid 1px #999; border-radius: 5px; box-shadow: inset 0px 0px 0px #FFF;
								  transition: all 0.3s ease; }
	.signUpBtns > div > a:last-of-type:hover { box-shadow: inset 0px 0px 10px #FFF; }


.syncAge .content > p           { padding: 20px; background-color: rgba(0, 85, 175, 0.8); }

.syncageBoxes    			    { position: relative; display: inline-block; width: auto; margin: 40px 0; }
	.syncageBoxes:after         { content: ""; clear: both; display: table; }
    .syncageBoxes p				{ position: relative; display: block; width: calc(50% - 20px); min-height: 48px; padding: 120px 30px 40px 30px; margin: 0 20px 20px 0; float: left; box-sizing: border-box;
								  text-align: center;
								  background-color: rgba(0, 85, 175, 0.5); border-radius: 5px; transition: background-color 0.3s ease; }
	.syncageBoxes p.white       { background-color: rgba(239, 243, 245, 0.6); color: #19364e; text-shadow: none; text-align: left; }	
        .syncageBoxes p:nth-child(2n - 1)    { clear: left; }
        .syncageBoxes p:nth-child(2n)	{ margin-right: 0; }
        .syncageBoxes p:hover	{ background-color: rgba(0, 85, 175, 0.8); }
		.syncageBoxes p.white:hover    { background-color: rgba(239, 243, 245, 0.8); }
        
        .syncageBoxes p:after	{ content: " "; display: block; width: 70px; height: 70px; position: absolute; top: 30px; left: 50%; margin-left: -35px; 
								  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/syncAge/sprites_01.png') no-repeat 0 -60px; transition: top 0.1s cubic-bezier(.6, .5, .6, 4); }
		.syncageBoxes p:hover:after 		{ top: 20px; }
		.syncageBoxes p:nth-child(1):after	{  }
		.syncageBoxes p:nth-child(2):after	{ background-position: -80px -60px; }
		.syncageBoxes p:nth-child(3):after 	{ background-position: -160px -60px; width: 58px; margin-left: -29px; }
		.syncageBoxes p:nth-child(4):after	{ background-position: -230px -60px; width: 85px; margin-left: -42px; }
        .syncageBoxes p:nth-child(5):after  { background-position: 0px -130px; width: 98px; margin-left: -49px; }
        .syncageBoxes p:nth-child(6):after  { background-position: -110px -130px; width: 130px; margin-left: -65px; }
        .syncageBoxes p:nth-child(7):after  { background-position: -80px -200px; width: 114px; margin-left: -57px; }
        .syncageBoxes p:nth-child(8):after  { background-position: -0px -200px; width: 74px; margin-left: -37px; }


/**************** Waypoint Styles ********************/

.slideLeft                      { position: relative; }
.slideLeft > *                  { position: absolute; margin-left: 300px; opacity: 0;
                                  transition: all 0.5s ease-in-out; }
    .slideLeft > *:nth-child(2) { transition-delay: 0.25s; }

.slideLeft.active > *           { margin-left: 0px; opacity: 1; }

/**************** Row Style ********************/
.row-fluid .content:first-child { margin: 0 auto; float: none; }


/**************** Interactive Element Style ********************/
.interactive:before             { content: 'Try it out'; display: block; width: 100%; height: 30px;
                                  color: #FFF; font-size: 15px; line-height: 30px; text-indent: 30px; text-shadow: 0px 1px 3px #a24100;
                                  background: #ff9103; background: linear-gradient(to bottom, #ffbb03, #ff9103); }
.interactive:after              { content: 'e'; display: block; height: 30px; width: 30px; 
                                  position: absolute; top: 0; left: 5px;
                                  font-family: 'ss-icons'; font-size: 18px; text-shadow: none; color: #FFF; text-shadow: 0px 1px 3px #a24100; }
.interactive.youTubeContainer:before { content: 'Watch this video'; position: absolute; top: -30px; left: 0; border: solid 1px #EFF3F5; border-bottom: none; }
.interactive.youTubeContainer:after { top: -30px; }
.screen.interactive             { margin-top: 60px; }
.screen.interactive:before      { position: absolute; top: -40px; border-radius: 15px; border: solid 1px #FFF; }
.screen.interactive:after       { top: -39px; left: 6px; }

.interactive.calcDemo:before    { width: 75%; position: absolute; left: 15%; top: 5%; border-radius: 16px; border: solid 1px #FFF; box-shadow: 0px 1px 10px rgba(0,0,0,0.25); }
.interactive.calcDemo:after     { left: 15%; top: 5%; margin: 2px 0 0 7px; }

.interactiveBG                  { display: block; position: relative; margin: 20px 0; padding: 0 0 20px 0; background: rgba(0,24,44,0.8); }

/**************** Footer Container Style ********************/

.footer-container-wrapper       { padding: 20px 0px; margin-top: 50px; }

.footer-container               { position: relative; max-width: 1240px; width: 90%; margin: 0 auto; padding: 50px 0;
                                  font-size: 14px; color: #5a93c5; line-height: 18px;
                                  border-top: solid 1px #b9d4e2; }

.footer-container h2            { margin-bottom: 0px; color: #f4f4f4;
                                  border-bottom: 3px solid #0088ff; }

.footer-container p             { font-size: 14px; line-height: 18px; margin: 0; }

.footer-container a             { color: #5a93c5; }

.footer-container a:hover       { color: #0054ae; }

.footer-container ul            { padding: 0; list-style-type: none;
                                  position: relative; display: block; width: 140px; margin: 0 20px 0 0;
                                  float: left; }

.officeInfo                     { float: right; width: auto; }

.ssLogo                         { position: absolute; top: 20px; left: 0; line-height: 14px; padding-left: 25px; }
.ssLogo .ss-icon                { position: absolute; top: -2px; left: 0px; font-size: 18px; }

.footer-container hr            { height: 45px; }
.footer-container hr:before     { top: 22px; background: #b9d4e2; }


/**************** Main Nav. Style ********************/

.hs-menu-wrapper                { line-height: auto; display: block; }

.top-nav ul                     { float: right; }

.hs-menu-wrapper.hs-menu-flow-horizontal .active-branch > a, .hs-menu-wrapper.hs-menu-flow-horizontal .active-item > a {
                                  box-shadow: 0 0px #FFF; }

.top-nav .hs-menu-item          {  }

ul.navMenu                      { margin: 0; padding: 0; width: auto;  display: block; float: right; }

ul.navMenu li                   { display: block; height: 50px;
                                  float: left; position: relative;
                                  line-height: 50px; }

ul.navMenu li a                 { display: inline-block; height: 50px; padding: 0px 20px;
                                  color: #dfe6eb; line-height: 50px; text-shadow: 0px 0px 3px rgba(00, 85, 175, 0);
                                  text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
ul.navMenu li:hover a           { color: #fff; background: rgba(0, 84, 174, 0.9); }

ul.navMenu li:hover ul li a     { background: none; }
ul.navMenu li ul li:hover a     { background: none; }

ul.navMenu li a span            { color: #5a93c5; font-size: 10px; }
ul.navMenu li:hover a span      { color: #FFF; }

ul.navMenu li ul li a           { background: none; display: block; height: auto; line-height: 30px; width: 100%; box-sizing: border-box; font-size: 16px; }
ul.navMenu li ul li a:hover     { background: #0088ff; }
ul.navMenu li ul                { display: block; margin: 0; padding: 0; width: auto; max-height: 0; opacity: 0;
                                  position: absolute; top: 50px; left: 0; overflow: hidden;
                                  background: #000; background: rgba(0, 84, 174, 0.9);
                                  transition: all 0.5s ease-in-out; }

ul.navMenu li ul.softwareDrop
    { width: 100%;
      position: fixed; left: 0; right: 0; }

ul.navMenu li:hover ul          { max-height: 3000px; top: 50px; opacity: 1; box-shadow: 0px 10px 10px rgba(0, 25, 45, 0.5); padding: 10px 0; }
ul.navMenu li:hover ul.softwareDrop { padding: 30px 0; }
ul.navMenu li ul li             { float: none; height: 30px; }

ul.navMenu li ul li ul          { background: none; }

ul.navMenu li ul li.vip,
ul.navMenu li ul li.poolStudio,
ul.navMenu li ul li.vizTerra,
ul.navMenu li ul li.YARD        { display:block; Width: 260px; height: auto; padding: 0px; position: relative; border-left: solid 1px #0088ff; }

ul.navMenu li ul li.vizTerra    { margin-bottom: 10px; }

ul.navMenu li ul li.vip a,
ul.navMenu li ul li.poolStudio a,
ul.navMenu li ul li.vizTerra a,
ul.navMenu li ul li.YARD a      { padding-left: 125px; position: relative; }


.softwareDrop .dropWrapper
    { display: flex; width: 100%; justify-content: center; }

.leftColNav
    { border: none; padding-right: 30px; }


ul.navMenu li ul li.vip a, ul.navMenu li ul li.poolStudio a, ul.navMenu li ul li.vizTerra a, ul.navMenu li ul li.YARD a    
    { padding: 0 20px; }
    

    
ul.navMenu li ul li.vip a:first-child,
ul.navMenu li ul li.poolStudio a:first-child,
ul.navMenu li ul li.vizTerra a:first-child,
ul.navMenu li ul li.YARD a:first-child { position: relative; font-weight: 700; padding-top: 10px; }

li.vip img, li.vizTerra img, li.YARD img,
li.poolStudio img               { display: block; position:relative; top: 0; left: 0px; z-index: 999; margin: 0 0 10px 0; }

.testMode li.vip img, .testMode li.vizTerra img, .testMode li.poolStudio img
    { position: relative; left: 0; top: 0; display: block; margin: 0 0 10px 0; }

.testMode { overflow-x: visible; }

/*
ul.navMenu li ul li.vip:before,
ul.navMenu li ul li.poolStudio:before,
ul.navMenu li ul li.vizTerra:before { content: ''; position: absolute; left: 10px; top: 20px; width: 100px; height: 120px; z-index: 100;
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/vip_package_small.png') no-repeat 0px 0px; }
ul.navMenu li ul li.poolStudio:before{ background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/poolstudio_package_small.png'); }
ul.navMenu li ul li.vizTerra:before{ background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/vizterra_package_small.png'); }
*/
.hs-menu-wrapper.hs-menu-flow-horizontal.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 li.hs-item-has-children ul.hs-menu-children-wrapper {
                                 position: relative; left: 20px; }

.hs-menu-wrapper ul li a:hover  { color: #FFF; text-shadow: 0px 0px 3px rgba(00, 85, 175, 100); }

.top-nav ul li a:hover          {  }



.row-fluid .mainNav             { display: block; max-width: 1240px; width: 90%; height: 50px; line-height: 50px; font-size: 18px; margin: 0 auto !important;
                                  float: none; position: relative; z-index: 850; }
.mainNav .row-fluid-wrapper,
.mainNav .row-fluid             { display: inline-block; width: auto; position: relative; }
.mainNav .row-fluid-wrapper     { display: inline-block; width: auto; height: 50px; float: right; }
.phoneNumber                    { color: #dfe6eb; line-height: 50px; padding: 0 0 0 10px; }
.phone a                        { color: #dfe6eb; }
.phone-mobile                   { display: none; }

.mainNav > div:last-child       { float: left; }
.logo                           { position: absolute; left: 0px; }

/* Breadcrumb menu */
.hs-breadcrumb-menu-wrapper     { display: block; float: left; border-bottom: 2px solid gray; }
.hs-breadcrumb-menu             { display: block; list-style-type: none; margin: 0px;  padding: 0px; }
.hs-breadcrumb-menu-item        { float: left; display: list-item; position: relative; padding: 10px 0px 10px 45px;
                                  background-color: #FBFBFB; z-index: 1; }
.hs-breadcrumb-menu-divider     { width: 0px; height: 0px; margin: -10px -25px -10px 20px;
                                  border-style: solid; border-width: 21px 0px 21px 25px; border-color: transparent transparent transparent #FBFBFB;
                                  z-index: inherit; }
.hs-breadcrumb-menu-divider:before { content: none; /* get rid of arrow */ }
.hs-breadcrumb-menu-item.first-crumb { padding-left: 25px; background-color: #E1E1E1; z-index: 6; }
.hs-breadcrumb-menu-item.first-crumb .hs-breadcrumb-menu-divider { border-color: transparent transparent transparent #E1E1E1; z-index: inherit; }
.hs-breadcrumb-menu-item:nth-child(2) { background-color: #E7E7E7; z-index: 5; }
.hs-breadcrumb-menu-item:nth-child(2) .hs-breadcrumb-menu-divider { border-color: transparent transparent transparent #E7E7E7; z-index: inherit; }
.hs-breadcrumb-menu-item:nth-child(3) { background-color: #EDEDED; z-index: 4; }
.hs-breadcrumb-menu-item:nth-child(3) .hs-breadcrumb-menu-divider { border-color: transparent transparent transparent #EDEDED; z-index: inherit; }
.hs-breadcrumb-menu-item:nth-child(4) { background-color: #F3F3F3; z-index: 3; }
.hs-breadcrumb-menu-item:nth-child(4) .hs-breadcrumb-menu-divider { border-color: transparent transparent transparent #F3F3F3; z-index: inherit; }
.hs-breadcrumb-menu-item:nth-child(5) { background-color: #F9F9F9; z-index: 2; }
.hs-breadcrumb-menu-item:nth-child(5) .hs-breadcrumb-menu-divider { border-color: transparent transparent transparent #F9F9F9; z-index: inherit; }
.hs-breadcrumb-menu-item.last-crumb { padding-top: 9px; padding-right: 21px; z-index: 0;
                                  border-top: 1px solid #E1E1E1; border-right: 1px solid #E1E1E1; background-color: #FFFFFF; }
.hs-breadcrumb-menu-item:hover:not(.last-crumb) { background-color: #444444; }
.hs-breadcrumb-menu-item:hover:not(.last-crumb) .hs-breadcrumb-label { color: #F7F8F8; }
.hs-breadcrumb-label,
.hs-breadcrumb-menu-divider     { display: block; float: left; position: relative; }
a.hs-breadcrumb-label           { text-decoration: none; }
.hs-breadcrumb-menu-item:hover .hs-breadcrumb-menu-divider { border-color: transparent transparent transparent #444444; }

.row-fluid [class*="span"]      { min-height: 0px; }

/**************** Google Search & Login Styles ********************/

.fullScreen                     { display: block; width: 100%; height: 100%;
                                  position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 900;
                                  text-align: center; overflow: none;
                                  background: #000; background: rgba(0,84,174,0.95); opacity: 1;
                                  transition: opacity 0.5s ease-in-out; }
.fullScreen.fadeOut             { top: 0px; height: 100%; opacity: 0; }
.fullScreen.hide                { top: -100%; height: 0; opacity: 0; background: rgba(0,0,0,0); /* display: none; */ }

.fullScreen > div               { height: 100%; width: 100%; position: absolute; top: 0; left: 0; }
.fullScreen > div > div         { height: 100%; width: 100%; position: absolute; top: 0; left: 0; }

.googleSearch                   {  }
.fullScreen .widget-type-google_search
                                { width: 100%; height: 100%; position: relative; }
.fullScreen .widget-type-google_search > div
                                { display: inline-block; box-sizing: border-box; max-width: 800px; width: 80%; padding: 10px 20px 20px 20px; float: none;
                                  /*position: absolute; top: 25%; left: 50%;*/ z-index: 100;
                                  position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%);
                                  color: #dfe6eb; 
                                  /*background: rgba(25,55,80,0.9); border-radius: 10px; border: solid 1px #0054ae; box-shadow: 0px 10px 30px #00192d; */
                                  transition: top 0.3s ease-in-out; }
    .fullScreen.hide .widget-type-google_search > div, .fullScreen.fadeOut .widget-type-google_search > div { top: 0%; }
.widget-type-google_search label { display: inline-block; font-size: 24px; padding: 0; line-height: 50px; text-align: left; float: left; }

.fullScreen .hs_cos_wrapper_type_google_search .field input.hs-input
                                { width: 100%; margin: 0; }
.fullScreen .hs_cos_wrapper_type_google_search a.hs-button.primary
                                { margin-top: 10px; float: right; }
.closeBtn                       { display: block; width: 50px; height: 50px;
                                  position: absolute; right: 10px; top: 10px; z-index: 999;
                                  cursor: pointer;
                                  color: #dfe6eb; text-indent: -2000em; overflow: hidden;
                                  background: /*#0054ae*/ url('//info.structurestudios.com/hubfs/00_images_ss2015/sprite_50x50.png') no-repeat -200px 0px; /*background-color: rgba(00,85,175,0.9);*/
                                  border-radius: 4px; /*border: solid 1px #0054ae; box-shadow: 0px 5px 10px #00192d; */ }

.searchBtn, .userBtn, .menuBtn  { display: block; height: 50px; width: 50px; position: absolute; top: 0px; z-index: 850;
                                  cursor: pointer;
                                  font-size: 1px; color: #153759; color: rgba(21,55,89,0); line-height: 50px;
                                  transition: top 0.3s ease-in-out, left 0.3s ease-in-out; }
.searchBtn                      { right: 0px;
                                  background-position: -150px 0px; }
.userBtn                        { right: 40px;
                                  background-position: -250px 0px; }
.menuBtn                        { left: 0px; top: -50px;
                                  background-position: 0px 0px; }
.searchBtn .ss-icon,
.userBtn .ss-icon,
.menuBtn .ss-icon               { display: block; width: 50px; height: 50px;
                                  position: absolute; left: 0px; top: 0px; color: #dfe6eb; text-indent: 0; text-align: center; line-height: 50px; }
    .searchBtn:hover .ss-icon,
    .userBtn:hover .ss-icon,
    .menuBtn:hover .ss-icon     { color: #FFF; }

.top .searchBtn, .top .userBtn  { top: 0px; }

.hasOverlay .searchBtn, .hasOverlay .userBtn, .hasOverlay .menuBtn { top: -50px; }

.site-search {
    position: absolute;
    right: 5px;
    top: 55px;
    width: 300px !important;
    height: 0;
    z-index: 999;
}

.site-search-button {
    position: absolute;
    top: 10px;
    right: 0px;
    width: 40px !important;
    height: 40px;
    color: #fff;
    cursor: pointer;
    z-index: 999;
}

.site-search #searchForm {
    position: fixed;
    right: 5px;
    display: none;
    z-index: 999;
}

.site-search #searchForm button {
    position: absolute;
    right: 0;
    top: 0;
    height: 40px;
    width: 40px;
    margin-top: 0;
    background: #0088ff;
    border: 0;
    border-radius: 0 5px 5px 0;
    z-index: 999;
}

.site-search #searchForm button .ss-icon {
    position: absolute;
    left: 10px;
    top: -5px;
    font-size: 20px;
}

.site-search #searchForm button::after {
    content: '';
}

.site-search #searchForm input {
    padding-right: 45px;
    font-size: 16px;
    outline: 0;
    border: 2px solid #0088ff;
    border-radius: 5px;
    /* background-color: transparent; */
}

.hs-search-field__suggestions {
    border: 2px solid #0088ff;
    border-radius: 0 0 5px 5px;
    background: #fff;
    font-size: 16px;
    box-sizing: border-box;
    padding: 10px;
    display: none;
}

.hs-search-field__suggestions li:first-child() {
    font-size: 12px;
}

.hs-search-field__suggestions li:nth-child(even) {
    background: #EFF3F5;
}

.hs-search-results__description {
    font-size: 16px;
    line-height: 22px;
    margin: 10px 0 0 0;
}

.hs-search-results {
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0 20px;
}

.hs-search-results ul li {
    background-color: #fff;
    box-sizing: border-box;
    padding: 20px;
}

.hs-search-results ul li:not(:first-child) {
    margin-top: 10px;
}

.header_supportHome { padding: 40px; box-sizing: border-box; text-align: center; }

.help-search { width: 60%; margin: 20px auto 0; display: block; position: relative; }
.help-search input { height: 53px; padding: 10px 130px 10px 10px; box-sizing: border-box; display: block; border-radius: 4px; padding: 10px !important; }
.help-search a.learnMore { position: absolute; right: 2px; top: 2px; margin: 0; cursor: pointer; }
/**************** Sub Nav Style ********************/

.subNav .row-fluid [class*="span"] { min-height: 1px; } 

.subNavMenu                     { display: block; width: 100%; height: 80px;
                                  position: fixed; top: 50px; left: 0px; z-index: 800;
                                  background: #dfe6eb; background: rgba(223,230,235,0.9);
                                  transition: background 0.2s ease-in-out, height 0.5s ease-in-out; }
    .top .subNavMenu            { height: 50px;
                                  background: rgba(223,230,235,0.9);
                                  border-bottom: solid 1px #bcc7cf; }

.softwareLogo,
.sectionTitleLink               { display: block; height: 50px; width: 300px;
                                  position: absolute; bottom: 15px; left: 0px; 
                                  /*background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/sprite_logos.png') no-repeat 0px 0px;*/
                                  transition: bottom 0.5s ease-in-out; }

.sectionTitleLink               { height: 30px; font-weight: 300; }

.top .softwareLogo              { bottom: 0px; }
.top .sectionTitleLink          { bottom: 7px; }


.softwareLogo > *              { height: 50px; width: auto;
                                  position: absolute; top: 0px; left: -30px; opacity: 0;
                                  transition: all 0.5s ease-in-out;}
.poolStudio .softwareLogo > .poolStudioLogo  { left: 0px; opacity: 1; }
.vizTerra .softwareLogo > .vizTerraLogo  { left: 0px; opacity: 1; }

.vip .softwareLogo > .vipLogo       { left: 0px; opacity: 1; }
.poolStudio .softwareLogo > .vipLogo,
.vizTerra .softwareLogo > .vipLogo  { left: -30px; opacity: 0; }

.softwareLogoBox                { display: block; position: relative; height: 80px; width: 300px;
                                  transition: height 0.5s ease-in-out; cursor: pointer; }
.top .softwareLogoBox           { height: 50px; }

.softwareOptions                { display: block; box-sizing: border-box; width: 100%; height: 0px; position: absolute; left: 0px; top: 90px;
                                  border: solid #FFF 1px; border-radius: 5px; overflow: hidden;
                                  background: #dfe6eb; background: rgba(223,230,235,0.9); box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  opacity: 0;
                                  transition: bottom 0.5s ease-in-out, height 0.5s ease-in-out, opacity 0.3s ease-in-out; }
.top .softwareOptions           { top: 60px; }
.active .softwareOptions        { opacity: 1; height: 150px; }

.softwareLogoBox:after          { content: ''; display: block; width: 0px; height: 0px; opacity: 0;
                                  position: absolute; bottom: -10px; left: calc(50% - 10px);
                                  border-left: 10px solid transparent; border-right: 10px solid transparent; 
                                  border-bottom: 0px solid #FFF;
                                  transition: all 0.3s ease-in-out;}
.softwareLogoBox.active:after   { border-bottom: 10px solid #FFF; opacity: 1; }

.softwareOptions > *            { width: 100%; height: 50px; display: block; cursor: pointer;
                                  line-height: 40px; padding: 0 0 0 15px; }

.softwareOptions > * > img      { height: 30px; width: auto; }

.softwareLogoBox .more          { display: block; width: 50px; height: 50px; box-sizing: border-box;
                                  position: absolute; right: 0px; bottom: 15px;
                                  font-family: 'ss-icons'; color: #153759; font-size: 25px; line-height: 50px; text-align: center;
                                  border: solid 1px transparent; transition: all 0.3s ease-in-out; }

.top .softwareLogoBox.active .more { color:  #0054ae; }

.top .softwareLogoBox .more     { color: #153759; bottom: 0; }

.subNavCTA                      { display: block; width: 100%; height: 1px; padding: 0; margin: 0;
                                  position: absolute; z-index: 801;
                                  line-height: 1px;
                                  top: 50px; }
.top .subNavCTA                 { border: none; }
       
.subNavMenu > div,
.subNavCTA > div                { display: block; max-width: 1240px; width: 90%; margin: 0 auto !important; height: 100%; position: relative; }

.subNavItems                    { display: block; width: auto; height: 30px; padding: 0;
                                  position: absolute; right: 120px; bottom: 25px;
                                  line-height: 30px; 
                                  transition: bottom 0.5s ease-in-out; }
    .careers .subNavItems       { right: 0; }
    .subNavItems a, .subNavItems a:visited,
    .sectionTitleLink a         { color: #153759; font-size: 18px; text-decoration: none;  padding: 0 40px 0 0; position: relative; }
    
    .sectionTitleLink a         { font-family: 'Share'; font-weight: 700; font-size: 30px; }
    
    .subNavItems a:hover,
    .sectionTitleLink a:hover   { color: #0054ae; }
    
    .top .subNavItems           { bottom: 7px; }
    .top .subNavItems a,
    .top .subNavItems a:visited { color: #153759; }
    .top .subNavItems a:hover   { color: #0054ae; }

.subNavCTA a.cta,
.subNavCTA a.cta:visited        { display: block; width: 120px; height: 30px; box-sizing: border-box;
                                  position: absolute; top: 24px; right: 0px;
                                  color: #eff3f5; font-size: 16px; text-align: center; line-height: 30px; text-decoration: none; text-shadow: 0px 1px 3px #00192d;
                                  border: solid 1px #eff3f5; border-radius: 3px;
                                  background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%;
                                  box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out; }
.subNavCTA a.cta:hover          { border-color: #FFF; color: #FFF; background-position: 0 0%; }
.top .subNavCTA .cta            { top: 10px; }


.bubble                         { display: block; width: 100px; height: 30px; padding: 0;
                                  position: absolute; top: 50px; left: -32px;
                                  font-size: 12px; color: #EFF3F5; white-space: nowrap; text-align: center; line-height: 32px;
                                  background: #08F; border: solid 1px #EFF3F5; border-radius: 5px; box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  transition: top 0.5s ease-in-out; }
.bubble:after                   { content: ""; display: block; width: 0; height: 0;
                                  position: absolute; top: -8px; left: 40px;
                                  border-left: 10px solid transparent;
                                  border-right: 10px solid transparent;
                                  border-bottom: 8px solid #EFF3F5;}
.top .bubble                    { top: 40px; }

.testMode .bubble               { display: block; }


/**************** Button Style ********************/

a.videoButton:link,
a.videoButton:visited,
a.vip3dButton:link,
a.vip3dButton:visited           { display: inline-block; width: auto; height: 48px;
                                  padding: 0 50px 0 20px; margin-top: 30px; position: relative;
                                  color: #eff3f5; font-size: 18px; line-height: 48px; text-shadow: 0px 1px 4px #00192d;
                                  border: solid 1px #eff3f5; border-radius: 5px;
                                  background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%;
                                  box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out; }
.videoButton:after,
.vip3dButton:after              { content: "p"; font-family: "ss-icons"; font-size: 20px; position: absolute; right: 20px; }
a.videoButton:hover,
.vip3dButton:hover             { color: #FFF; background-position: 0 0%; }


/**************** Page Header Styles ********************/
.pageHeader > *                 { width: 90%; max-width: 1240px; margin: 0 auto; }
.pageHeader h1                  { position: absolute; bottom: 70px; margin: 0; padding: 0; }
.pageHeader.dark h1             { border: none; }

.pageHeader h1 strong           { font-family: 'Fira Sans'; font-weight: 300; font-size: 90px; }

.pageHeader.supportHeader       { padding-top: 200px !important; padding-bottom: 100px !important; }

/**************** Support Page Styles ********************/
.section-header {
    background: #EFF3F5;
    box-sizing: border-box;
    padding: 10px;
    display: flex;
    flex: 0 1 auto;
    font-size: 16px;
}

.video-item {
    box-sizing: border-box;
    padding: 10px;
    font-size: 18px;
    display: flex;
    flex: 0 1 auto;
}

.video-item:nth-child(even) {
  background-color: #eff3f5ab;
}

.video-item.accordionButton {
  padding-left: 35px;
  height: 65px;
  line-height: 45px;
  background: #EFF3F5;
  position: relative;
}

.video-item.accordionButton::before {
  right: unset;
  left: 0;
}

.video-section .accordionContent {
  padding: 0;
}

.video-section .accordian:not(:last-child) {
  margin-bottom: 20px;
}

.video-section .accordionContent.active {
  padding: 0;
}

.video-item > a,
.video-item span:first-child {
  width: 50% !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 20px;
}

.video-item > span:not(:last-child) {
  width: 100%;
}

.video-item > a::before {
    content: "p ";
    font-size: 25px;
    font-family: 'ss-icons';
    display: block;
    float: left;
    padding: 0 0px 0 0;
    margin-right: 10px;
}

.video-item > span {
  font-size: 14px;
}

.training-tabs {
  list-style: none;
  display: flex;
  flex: 1 1 auto;
  padding: 0;
}

.training-tabs li {
  position: relative;
  display: inline-block;
  width: 100%;
  text-align: center;
  box-sizing: border-box;
  border-radius: 5px;
  background: #EFF3F5;
  padding: 40px;
  border: 3px solid #EFF3F5;
  transition: all .2s ease-in-out;
  cursor: pointer;
  box-shadow: 0px 1px 4px rgba(0,0,0,0.1);
}

.training-tabs li:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    bottom: 0px;
    left: calc(50% - 20px);
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 0px solid #EFF3F5;
    opacity: 0;
    transition: all 0.3s ease-in-out;
}

.training-tabs li:not(.active) {
  background: transparent;
}

.training-tabs li:hover,
.training-tabs li.active {
  background: #EFF3F5;
  box-shadow: 0px 2px 6px rgba(0,0,0,0.25);
  color: #0054ae;
}

.training-tabs li.active:after {
  border-top: 20px solid #EFF3F5;
  bottom: -20px;
  opacity: 1;
}

.training-tabs li:not(:last-child) {
  margin-right: 20px;
}

.training-tabs li img {
  max-height: 60px;
}

.training-classes-list {
  margin-bottom: 60px;
  margin-top: 40px;
}

.training-classes-list .accordian {
  margin-bottom: 20px;
}

.training-classes-list .accordionButton {
    padding-left: 35px;
    height: 65px;
    line-height: 65px;
    background: #EFF3F5;
    position: relative;
}

.training-classes-list .accordionButton:before {
  right: unset;
  left: 0;
}

.training-classes-list .accordionContent img {
    float: right;
    margin-left: 20px;
    margin-bottom: 10px;
    height: auto;
    max-width: 400px;
}

.training-classes-list .accordionContent p {
  margin-top: 0;
  margin-bottom: 20px;
}

.training-classes-list .accordionContent ul {
  font-size: 16px;
  line-height: 24px;
  margin-top: 0;
  margin-bottom: 20px;
}

#training-video-container {
  position: fixed;
  top: 20%;
  left: 0;
  right: 0;
  max-width: 800px;
  margin: 0 auto;
  background-color: #EFF3F5;
  z-index: 9999;
  border-radius: 10px;
  box-sizing: border-box;
  padding: 20px;
}

#training-video-container iframe {
  height: 430px;
  width: 100%;
  margin-top: 20px;
}

#training-video-background {
  width: 100vw;
  height: 100vh;
  background-color: rgba(0,0,0,.66);
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 999;
}

#training-video-container h4,
#training-video-container p{
    margin: 0;
    width: calc(100% - 50px);
}

#training-video-container #cboxClose {
    top: 20px;
    right: 20px;
}


.training-class-modal {
    position: fixed;
    top: 150px;
    right: 0;
    left: 0;
    max-width: 700px;
    margin: 0 auto;
    box-sizing: border-box;
    background: #fff;
    padding: 20px;
    z-index: 999;
    overflow: auto;
    max-height: calc(100% - 120px);
}

.training-class-modal .event-title {
   line-height: 40px;
}

.training-class-modal .event-icons {
  position: relative;
  top: 10px;
  margin: 0 60px 0 0;
}

.training-class-modal .event-bottom p, .training-class-modal .event-bottom ul {
  margin-top: 0 !important;
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 24px;
}

.training-class-modal .event-bottom .floatRight img {
  max-width: 300px;
  margin-left: 20px;
  margin-top: 10px;
}

.training-class-modal .event-date {
    margin-top: 0 !important;
    border-bottom: 1px solid #e8e8e8;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.training-class-modal .btn {
  position: relative;
}

.training-class-modal-background {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100vh;
  width: 100vw;
  background: rgba(0,0,0,0.4);
  z-index: 900;
}

.close-training-class-modal::after {
  content: '' !important;
  padding: 0 !important;
}

.disabled {
  opacity: .2;
  cursor: not-allowed;
}

/* Global Video Modal  */
.video-modal {
    max-width: 800px;
    display: block;
    position: fixed;
    top: 100px;
    left: 0;
    right: 0;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 90px 20px 20px 20px;
    background: #fff;
    border-radius: 7px;
    z-index: 1100;
}

.video-modal .video-container {
  width: 100%;
}

.video-modal .video-container iframe {
  width: 100%;
  height: 450px;
}

.video-modal #cboxClose {
    top: 20px;
    right: 20px;
}

.video-modal-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.5);
    z-index: 999;
}

/**************** Careers Page Styles ********************/

.careers .pageHeader            { height: 600px; }

.careers .fullWidth             { margin: 80px 0; }

.careers[class*="our-culture"] .pageHeader,
.careers[class*="innovation"] .pageHeader{ height: auto; }
.careers[class*="our-culture"] .pageHeader .bg,
.careers[class*="innovation"] .pageHeader .bg { background-size: 100% auto; background-repeat: no-repeat; background-position: center top; background-attachment: fixed;
                                   transition: all 3s ease-in-out; }
.top.careers[class*="our-culture"] .pageHeader .bg,
.top.careers[class*="innovation"] .pageHeader .bg{ filter: blur(10px); -webkit-filter: blur(10px); }
.careers .pageHeader h1         { width: 100%;
                                  bottom: auto; top: 250px; left: 0;
                                  text-align: center; font-size: 72px; }
.careers .pageHeader h1.offset  { text-indent: -150px; }
.careers .pageHeader h1 strong  { display: inline-block; }
.careers .pageHeader h1.offset strong { text-indent: 100px; }
.careers .pageHeader h1 strong.small { font-size: 60px; }

.careers .pageHeader h1.leftAlign { max-width: 1240px; margin: 0 auto;
                                  text-align: left; position: relative; top: 150px; }
    .careers .pageHeader h1.leftAlign.offset { text-indent: 0px; }


.careersVideo                   { width: 650px; position: absolute; top: -420px; right: 0; }

.coreValues                     {  }
.coreValues.content             { padding-top: 300px; }

.coreValues ol                  { display: inline-block; margin-left:0; margin-top: 40px; padding-left:0;
                                  counter-reset:li; /* Initiate a counter */
                                  text-align: left; }

.coreValues ol > li             { min-height: 30px; padding: 20px 0 20px 60px; position: relative;
                                  list-style: none; font-size: 30px; font-weight: 300; }
.coreValues ol > li:before      { content: counter(li); counter-increment: li;
                                  width: 38px; height: 38px;
                                  position: absolute; top: 10px; left: 0;
                                  font-size: 24px; line-height: 40px; text-align: center; text-indent: 2px;
                                  border: solid 1px #08F; border-radius: 50%; }

.jobList                        { background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Careers/build_career_bg.jpg) no-repeat center center / cover; background-attachment: fixed; }

/**************** Partners Page Styles ********************/

.pageHeader.partners            { text-align: center; 
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/vendor_partners/vendor-partners.jpg') no-repeat fixed center center; background-size: cover; }

.hs-content-path-vip3d-structure-studios-vendor-partners .pageHeader.partners {background-position: 50% -180px;}


.flipper                        { display: inline-block; box-sizing: border-box; width: calc(33% - 41px); padding-bottom: 20%;
                                  position: relative; perspective: 100;
                                  margin: 20px; }
.flipper:nth-child(3n)          {  }

.flipper:hover > * > *:first-child,
.flipper.hover > * > *:first-child  { transform: rotateY(180deg); }

.flipper:hover > * > *:last-child,
.flipper.hover > * > *:last-child   { transform: rotateY(0deg); }

.flipper > *                    { width: 100%; height: 100%; transition: 0.6s; transform-style: preserve-3d;
                                  position: absolute; top: 0; left: 0; 
                                   }

.flipper > * > *                { backface-visibility: hidden; position: absolute; top: 0; left: 0; overflow: hidden; width: 100%; height: 100%;
                                  transition: 0.6s; transform-style: preserve-3d; border: #eff3f5 solid 1px;
                                  box-shadow: 0px 5px 10px #000; }
.flipper > * > *:first-child    { z-index: 2; transform: rotateY(0deg); background: #dfe6eb; text-align: center;  }
.flipper > * > *:first-child img{ max-width: 80%; position: relative; top: 50%; transform: translateY(-50%); }

.flipper > * > *:last-child     { transform: rotateY(180deg); }
.flipper > * > *:last-child img { min-height: 100%; width: auto;  }
.flipper > * > * a              { display: block; margin: 0 auto; height: 30px; padding: 0px 10px;
                                  position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); z-index: 100;
                                  color: #FFF; font-size: 12px; line-height: 30px; text-shadow: 0px 1px 2px #000; text-align: center;
                                  border: solid 1px #eff3f5; border-radius: 3px;
                                  background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%;
                                  box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25); }
.partnersGrid > *               { display: inline-block; box-sizing: border-box; width: calc(25% - 45px); padding-bottom: 15%; margin: 20px;
                                  position: relative; overflow: hidden;
                                  background: #dfe6eb; border: #eff3f5 solid 1px; box-shadow: 0px 5px 10px #000; }
.partnersGrid > * *             { display: block; position: absolute;  }
.partnersGrid > * img           { top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); margin-top: -10px; }
.partnersGrid > * a             { top: auto; bottom: 10px; font-size: 12px; width: 100%; text-align: center; }

.premierPartnerLogoSection .flipper:hover > * > *:last-child, .flipper.hover > * > *:last-child {display: none;transform: initial;}
.premierPartnerLogoSection .flipper:hover > * > *:first-child, .flipper.hover > * > *:first-child {transform: rotateY(0deg);}


/**************** Academic Page Styles ********************/

.pageHeader                     { position: relative; }

.pageHeader.academic            { text-align: center; height: 600px; position: relative; 
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/academic/academic_header.jpg') no-repeat fixed center bottom; background-size: cover; }



.academic p                     { font-family: 'Share'; font-size: 40px; line-height: 50px; position: relative; margin: 0; text-align: left; }
    .academic p + p             { left: 100px; }
ul.schools                      { list-style-type: none; margin: 0; padding: 0; }
ul.schools li                   { display: block; box-sizing: border-box; width: calc(25% - 20px); height: 68px; padding: 10px;
                                  float: left; margin: 10px; position: relative; overflow: hidden;
                                  color: #31536e; text-shadow: none; line-height: 48px; font-size: 12px; text-align: left;
                                  background: #FFF; box-shadow: 0px 3px 10px #000; }
ul.schools li img               { margin: 0 10px 0 0; width: auto; }


/**************** Pricing Page Styles ********************/

.pricingHeader                  { height: 600px;
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/header.jpg') no-repeat center bottom; background-size: cover;
                                  position: absolute; top: 0; left: 0;}
.pageHeader.pricingHeader h1    { position: relative; top: 0px; bottom: auto;
                                  width: 100%; text-align: center; font-size: 70px; line-height: 70px;}
.pricingHeader2019              { background: none; background-color: #01294a; background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2018/pricing-page/pricing-header.png); background-repeat: no-repeat; background-size: cover; background-position: center;}

.content.pricingBox             { position: relative; }
.signupMain            			{ position: relative; z-index: 100; box-sizing: border-box;
                                  margin: 400px 0 80px 0; }
.signupMain:after				{ content: ""; display: table; clear: both; }

a.signupMonth:link,
a.signupMonth:visited	        { display: block; padding: 10px 0 0 10px; }
a.signupMonth span			    {  }

a.signupMonth:hover				{  }

a.signupYear:link,
a.signupYear:visited	        { display: block; padding: 10px 0 0 10px;
				                  text-decoration: none; margin: 0; }
a.signupYear span			    { display: block; clear: left; }
a.signupYear span strong	    {  }
a.signupYear:hover				{  }

.signupMain img                 { width: 100%; height: auto; margin-bottom: 20px; }
.signupMain > div				{ display:block; width: 30%; box-sizing: border-box; padding: 150px 20px 20px 20px;
                                  position: relative; float: left; overflow: hidden;
                                  background: #153759 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/vip3d-bg.jpg') no-repeat top left; background-size: cover;
                                  border: solid 1px #eff3f5; box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25); }
.off                            { position: absolute; top: -100%; }
.signupMain > div:nth-child(1)  { margin-right: 5%; }
.signupMain > div:nth-child(2)  {  }
.signupMain > div:nth-child(3)  { margin-left: 5%; }

.signupMain > div.vizTerra      { background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/vizterra-bg.jpg'); }
.signupMain > div.poolStudio    { background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/pool-studio-bg.jpg'); }

.toggles						{ width: 100%; height: 50px; border-radius: 5px; box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25); }

.toggles > div					{ display: block; height: 50px; width: 40%; box-sizing: border-box; cursor: pointer;
                                  float: left; line-height: 50px;
                                  color: #0054ae; font-size: 16px; text-align: center; text-shadow: none;
								  background: #dfe6eb;
                                  border: solid 1px #eff3f5; border-right: none; border-radius: 5px 0 0 5px;
								  transition: all 0.3s ease; }
.toggles > div:last-child		{ width: 60%; border-left: none; border-right: solid 1px #eff3f5; border-radius: 0 5px 5px 0; }
.toggles > div.selected			{ background: #0088ff; color: #eff3f5; text-shadow: 0px 1px 4px #00192d; }

.toggles > div > div			{ display: block; text-align: center; cursor: auto;
								  opacity: 0; transition: all 0.5s ease; }

.monthly, .yearly               {  }

.signupMain > div h2		    { height: 100px; width: 100%; padding: 0; margin: 20px 0 0 0; position: relative;
                                  color: #eff3f4; font-size: 100px; line-height: 100px; text-align: center; text-shadow: none; }
.signupMain > div h2 span       { display: inline-block; position: relative; bottom: 35px;
                                  font-size: 40px; }
.signupMain > div h2 span em    { display: block; height: 40px; position: absolute; left: 2px; top: 68px;
                                  color: #5a93c5; font-size: 14px; line-height: 12px; }
.signupMain > div p             { color: #5a93c5; font-size: 20px; text-align: center; margin: 0; text-shadow: none; }

.signupMain > div.vizTerra h2 span em,
.signupMain > div.vizTerra p    { color: #b6d994; }
		

a.signup,
a.signup:visited                { display: inline-block; width: 100%; height: 48px;
                                  padding: 0 20px; box-sizing: border-box; margin-top: 20px;
                                  color: #eff3f5; font-size: 18px; line-height: 48px; text-shadow: 0px 1px 4px #00192d; text-align: center;
                                  border: solid 1px #eff3f5; border-radius: 5px;
                                  background: #64a000; background: linear-gradient( to bottom, rgba(160,229,44,0.9), rgba(100,160,0, 0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%;
                                  box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out; }
a.signup:hover                  { border-color: #FFF; color: #FFF; background-position: 0 0%; }
a.signup:after                  { content: ">"; font-family: 'ss-icons'; font-size: 0.5em; display: inline-block; padding: 0 0 0 8px; vertical-align: top; }
a.signup.hide    				{ display: none; }


.warning						{ display: block; width: auto; clear: both; padding: 20px;
								  background: rgba(255, 200, 0, 0.8); border: 1px solid #FF0; border-radius: 10px; box-shadow: inset 0px 0px 10px #FF0;
								  color: #920; text-align: center; }

.hide							{ display: none !important; }
.invis                          { visibility: hidden; }


.pricing                        { display: block; width: 100%; margin: 300px 0 0px 0;
                                  
                                  background: #EFF3F5; box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25); }
.pricing:after                  { content: ""; display: table; clear: both; }

.pricing > div                  { display: block; width: 30%; padding: 190px 20px 20px 20px; box-sizing: border-box;
                                  position: relative; float: left; }

.pricing > div:first-child      { left: 30%; width: 40%;
                                  
                                  background: rgba(255,255,255,0.75); border: solid 1px #dfe6eb; }
.pricing > div:first-child:before{ content: "Premium Package"; width: 100%; height: 50px;
                                  position: absolute; top: -25px; left: 0;
                                  color: #EFF3F5; font-family: "Fira Sans"; font-size: 25px; text-transform: uppercase; text-align: center; line-height: 50px;
                                  background: #0087FF; }

.pricing > div:nth-child(2)     { left: -40%; }

.pricing .off                   { width: 100%; height: 0; padding: 25% 0 0 0;
                                  position: absolute; top: 50px; left: 0;
                                  overflow: hidden; text-indent: -2000em; }
.pricing .vip .off              { display: block; width: 100%; height: 0px; padding: 0 0 21% 0; margin: 30px 0;
                                  text-indent: -2000em; top: 25px;
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/logo-vip3d.png) no-repeat center center; background-size: 90% auto;  }
.pricing .poolStudio .off,
.pricing .vizTerra .off         { display: block; width: 100%; height: 0px; padding: 0 0 21% 0; margin: 20px 0;
                                  text-indent: -2000em;
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/logo-vizterra.png) no-repeat center center; background-size: 80% auto;  }
.pricing .poolStudio .off       { background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/logo-poolstudio.png); }

.pricing .priceBox              { width: 100%; padding: 1px; box-sizing: border-box; overflow: hidden;
                                  position: relative;
                                  background: #dfe6eb /*url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/price-box-bg-vip.jpg)*/ no-repeat center bottom; background-size: cover;
                                  border-radius: 5px; box-shadow: inset 0px 2px 10px rgba(25, 45, 65, 0.2); }
.pricing .priceBox:after        { content: ""; display: block; width: 0px; height: 0px;
                                  position: absolute; bottom: 0; left: 50%; margin: 0 0 0 -10px;
                                  border-left: 10px solid transparent; border-right: 10px solid transparent;
                                  border-bottom: 10px solid #EFF3F5; }
.pricing .vip .priceBox:after   { border-bottom-color: #fbfcfc; }
/*
    .pricing .vizTerra .priceBox { background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/price-box-bg-vt.jpg); }
    .pricing .poolStudio .priceBox { background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/price-box-bg-ps.jpg); }
*/
.pricing .priceBox .toggles     { border-radius: none; box-shadow: none; height: 40px; }

.pricing .priceBox .toggles > div { box-sizing: border-box; color: #30526d; height: 40px; line-height: 40px; position: relative;
                                  background: #EFF3F5; border: solid 1px #EFF3F5; border-radius: 4px; }
.pricing .priceBox .toggles > div:last-child { width: calc(60% - 1px); border-radius: 4px; margin: 0 0 0 1px; }
.pricing .priceBox .toggles > div.selected { color: #0087ff; text-shadow: none; border-color: #0087ff; background: #fbfcfc; }
.pricing .priceBox .toggles > div.selected:after { content: ""; display: block; width: 14px; height: 8px;  width: 0; height: 0;
                                  position: absolute; bottom: 2px; left: 50%; margin: 0 0 0 -5px;
                                  border-left: 5px solid transparent; border-right: 5px solid transparent;
                                  border-bottom: 3px solid #0087FF;
                                  /*background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/toggle-selected-arrow.png);*/ }

.pricing > div h2    	        { height: 100px; width: 100%; padding: 0; margin: 10px 0 0 0; position: relative;
                                  color: #30526d; font-size: 100px; line-height: 100px; text-align: center; /*text-shadow: 0px 1px 4px #000;*/ }
.pricing > div h2 span          { display: inline-block; position: relative; bottom: 35px;
                                  font-size: 40px; }
.pricing > div h2 span em       { display: block; height: 40px; position: absolute; left: 2px; top: 68px;
                                  font-size: 14px; line-height: 12px; }
.pricing > div p                { font-size: 16px; text-align: left; margin: 0; text-shadow: none; text-indent: 5px; color: #30526d; }

.pricing a.signup               { position: relative; margin: 10px 0 0 0; }

.pricing a.signup:before        { content: ""; display: block; width: 0; height: 0;
                                  position: absolute; top: -6px; left: 50%; margin: 0 0 0 -10px;
                                  border-left: 10px solid transparent; border-right: 10px solid transparent;
                                  border-bottom: 10px solid #8ec82d;
                                  transition: border 0.3s ease-in-out; }
.pricing a.signup:hover:before  { border-bottom-color: #a9e741; }

.pricing .product-box           { float: right; margin-top: -70px; position: relative; z-index: 200; }

.pricing h3                     { font-family: 'Fira Sans'; font-weight: 300; font-size: 20px; line-height: 30px; margin: 60px 0 20px 0; text-align: center; clear: both; }

.pricing .vip h3                { font-size: 30px; line-height: 40px; margin-top: 40px; }

.pricing ul                     { list-style-type: none; text-align: center; font-size: 14px; line-height: 16px;  }
.pricing ul li                  { padding: 10px 0; }

.footerCareers                  {  
  display: inline-block; position: relative; left: 0px;
  background: #0088FF; padding: 0 8px 0 6px; height: 22px; line-height: 22px; 
 border-radius: 3px; }
.footerCareers a, .footerCareers a:visited, .footerCareers a:hover { color: #FFF; }

/** ------------------------------- NEW PRICING PAGE STYLES ------------------------------------------------- **/
.pricingHeader2019               { padding-top: 90px !important; }

.pricingHeader2019 h1            { border-bottom: 0 !important; }

.pricing2                        { display: block; width: 100%; padding: 0 0 0 0;
                                   margin: 540px 0 0px 0; position: relative;
                                  background: #EFF3F5; box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25); }
.pricing2:after                  { content: ""; display: table; clear: both; }

.pricing2 > div                  { display: block; width: 30%; padding: 20px 20px 20px 20px; box-sizing: border-box;
                                  position: relative; float: left; }

.pricing2 > div:nth-child(2) {
  border-right: solid 1px #E0E6EB;  
}

.pricing2 .yearlyBubble {     
    position: absolute;
    top: -85px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background-color: #eff3f5;
    box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25);
    padding: 10px 70px;
    width: 80%;
    border-radius: 40px;
    font-weight: 500;
    color: #08F;
    font-size: 18px;
    display: block;
    text-align: center;
    opacity: 1;
    transition: all 0.2s ease-in-out;
}

.pricing2 .monthlyBubble {     
    position: absolute;
    top: -85px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background-color: #eff3f5;
    box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25);
    padding: 10px 70px;
    width: 80%;
    border-radius: 40px;
    font-weight: 500;
    color: #08F;
    font-size: 18px;
    display: block;
    text-align: center;
    opacity: 1;
}

.footnotes .yearlyFoot {     
    position: relative;
    margin: 80px auto;
    background-color: #eff3f5;
    box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25);
    padding: 10px 30px;
    width: 98%;
    border-radius: 40px;
    font-weight: 500;
    color: #08F;
    font-size: 14px;
    display: block;
    text-align: center;
    opacity: 1;
}

.footnotes .monthlyFoot {     
    position: relative;
    margin: 80px auto;
    background-color: #eff3f5;
    box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25);
    padding: 10px 30px;
    width: 80%;
    border-radius: 40px;
    font-weight: 500;
    color: #08F;
    font-size: 15px;
    display: block;
    text-align: center;
    opacity: 1;
}

.yearlyFoot.hidden {
 display: none; 
}

.monthlyFoot.hidden {
 display: none; 
}

.pricing2 .yearlyBubble.hidden {
 display: none!important; 
}

.pricing2 .monthlyBubble.hidden {
 display: none; 
}

/* .pricing2 .yearlyBubble::before {
    content: '';
    background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2018/tail.png) no-repeat;
    position: absolute;
    left: -15px;
    bottom: 0;
    height: 16px;
    width: 37px;
} */

.pricing2 > div.vip {
  position: absolute; top: -20px; right: 0; width: 40%; padding-top: 14px;
  background: #FFF; box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25);
}

.pricing2 .off                   { width: 100%; height: 0; padding: 25% 0 0 0;
                                  position: relative; top: 0px; left: 0;
                                  overflow: hidden; text-indent: -2000em; }

.pricing2 .vip .off              { display: block; width: 100%; height: 0px; padding: 0 0 21% 0; margin: 0 0 40px 0;
                                  text-indent: -2000em; top: 25px;
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/logo-vip3d.png) no-repeat center center; background-size: 90% auto;  }

.pricing2 .poolStudio .off,
.pricing2 .vizTerra .off         { display: block; width: 100%; height: 0px; padding: 0 0 21% 0; margin: 20px 0;
                                  text-indent: -2000em;
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/logo-vizterra.png) no-repeat center center; background-size: 90% auto;  }

.pricing2 .poolStudio .off       { background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/logo-poolstudio.png); }

.pricing2 .priceBox              { width: 100%; padding: 1px; box-sizing: border-box; overflow: hidden;
                                  position: relative;
                                  background: #dfe6eb /*url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015.pricing2/price-box-bg-vip.jpg)*/ no-repeat center bottom; background-size: cover;
                                  border-radius: 5px; box-shadow: inset 0px 2px 10px rgba(25, 45, 65, 0.2); }

.pricing2 .priceBox:after        { content: ""; display: block; width: 0px; height: 0px;
                                  position: absolute; bottom: 0; left: 50%; margin: 0 0 0 -10px;
                                  border-left: 10px solid transparent; border-right: 10px solid transparent;
                                  border-bottom: 10px solid #EFF3F5; }

.pricing2 .vip .priceBox:after   { border-bottom-color: #fbfcfc; }

.priceBox .monthly, .priceBox .yearly {
  opacity: 1; left: 0px;
  transition: all 0.2s ease-in-out;
}

.priceBox .monthly.hidden {
  display: block; opacity: 0; left: -5px; 
}

.priceBox .yearly.hidden {
  display: block; opacity: 0; left: 5px; 
}

.pricing2 .big-number {
  position: absolute;
  top: -450px;
  left: 0;
  right: 0;
  width: 100%;
}

.pricing2 .big-number h2 {
  font-size: 58px;
  color: #fff;
}

/* .pricing2 .big-number h2 strong {
  background: rgb(0,120,224);
  background: -moz-linear-gradient(180deg, rgba(0,120,224,1) 0%, rgba(0,50,94,1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(0,120,224,1) 0%, rgba(0,50,94,1) 100%);
  background: linear-gradient(180deg, rgba(0,120,224,1) 0%, rgba(0,50,94,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0078E0",endColorstr="#00325E",GradientType=1);
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
} */

.pricing2 > div h2 span.st-big-numbers {
    display: block;
    bottom: auto;
    font-size: 120px;
    top: 20px;
    line-height: 1;
}

.pricing2 > div h2 span.st-small-text {
    bottom: auto;
    font-size: 24px;
    font-weight: normal;
    text-transform: uppercase;
    letter-spacing: 2px;
    opacity: .6;
    line-height: 1;
}

.vip.fadeOut .priceBox .yearly h2, .vip.fadeOut .priceBox .yearly p {/*padding-right: 150px !important;width: calc(100% - 150px);*/}

.special-price--image {
    position: absolute;
    top: 10px;
    /*right: -20px;
    width: 55%;*/
    right:10px;
    width:39%;
    max-width: 189px; 
}

.pricing2 .toggles {
    height: 50px;
    width: 300px;
    padding: 0 0 0 0px;
    position: absolute;
    top: -145px;
    left: 0;
    right: 0;
    box-shadow: none;
    background: #eff3f5;
    border-radius: 50px;
    /* border-bottom: solid 1px #E0E6EB; */
    text-align: center;
    margin: 0 auto;
    display: flex;
    justify-content: center;
}

.pricing2 .toggles > div {
  width: auto;
  box-sizing: border-box; /*color: #0063df;*/ color: #31536e;  line-height: 50px; position: relative;
  font-size: 20px; font-weight: 300; text-shadow: none;
  background: none; border: none;
}

.pricing2 .toggles > div:last-child {  }
.pricing2 .toggles > div.selected { color: #0063df; }
.pricing2 .toggles > div.selected:after { left: 42px !important; }

.pricing2 .toggles > div.toggle {
  display: block; width: 80px; height: 30px; margin: 10px; position: relative;
  background: #0173d5; border-radius: 15px;
}

.pricing2 .toggles > div.toggle::after {
  content: '';
  background-color: #fff;
  width: 35px;
  height: 24px;
  position: absolute;
  left: 3px;
  top: 3px;
  border-radius: 100px;
  transition: 0.1s ease-in-out;
}

.pricing2 .priceBox p           { font-size: 14px; font-weight: 400; text-align: center; margin-top: -10px; margin-bottom: 30px; }
.pricing2 .priceBox p span      { font-size: 20px !important; font-weight: 700;}
.pricing2 .priceBox .special-price {
  background: rgb(30,150,255);
  background: -moz-linear-gradient(180deg, rgba(30,150,255,1) 0%, rgba(0,100,187,1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(30,150,255,1) 0%, rgba(0,100,187,1) 100%);
  background: linear-gradient(180deg, rgba(30,150,255,1) 0%, rgba(0,100,187,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1E96FF",endColorstr="#0064BB",GradientType=1);
  color: #fff;
  font-weight: 700;
  font-size: 19px;
  padding: 10px;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  max-width: 200px;
  margin: 0 auto;
  margin-bottom: 20px;
  border: 2px solid #fff;
  box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
  -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
}

.pricing2 > div h2    	        { height: 100px; width: 100%; padding: 0; margin: 30px 0 0 0; position: relative;
                                  color: #30526d; font-size: 100px; line-height: 100px; text-align: center; border: 0; /*text-shadow: 0px 1px 4px #000;*/ }
.pricing2 > div h2 span          { display: inline-block; position: relative; bottom: 35px;
                                  font-size: 40px; }
.pricing2 > div h2 span em       { display: block; height: 40px; position: absolute; left: 2px; top: 68px;
                                  font-size: 14px; line-height: 12px; }

.pricing2 a.signup               { position: relative; margin: 10px 0 0 0; }

.pricing2 a.signup:before        { content: ""; display: block; width: 0; height: 0;
                                  position: absolute; top: -6px; left: 50%; margin: 0 0 0 -10px;
                                  border-left: 10px solid transparent; border-right: 10px solid transparent;
                                  border-bottom: 10px solid #8ec82d;
                                  transition: border 0.3s ease-in-out; }
.pricing2 a.signup:hover:before  { border-bottom-color: #a9e741; }

.pricing2 .product-box           { float: right; margin-top: -70px; position: relative; z-index: 200; width: 65px; }

.pricing2 h3                     { font-family: 'Fira Sans'; font-weight: 300; font-size: 20px; line-height: 30px; margin: 60px 0 20px 0; text-align: center; clear: both; }

.pricing2 .vip h3                { font-size: 30px; line-height: 40px; margin-top: 40px; }

.pricing2 ul                     { list-style-type: none; text-align: left; font-size: 21px; line-height: 18px; margin: 30px 0;  }
.pricing2 ul li                  { padding: 12px 0px 12px 40px; position: relative; }

.pricing2 .coreFeatures          {  text-align: center; font-size: 21px; font-weight:500;margin-top: 38px; }
.pricing2 ul.pricingFeatures li::before { 
  content: ""; 
  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/comparison/check_mark.png') no-repeat center -9px;
  display: block; 
  width: 32px; 
  height: 32px; 
  overflow: hidden; 
  position: absolute; 
  left: 0;
  top: 5px;
} 

.question                       { text-align: center; }
.question h2                    { font-family: 'Fira Sans'; font-weight: 300; font-size: 60px; }


p.whoFor {
  padding: 15px 0 20px 0; margin: 10px 0 0 0;
  font-size: 20px; line-height: 30px; color: #08F; text-align: center;
  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2018/pricing-page/pricing-separator.png) no-repeat center top;
}



/**************** About and Careers Styles ********************/

iframe.shadow                   { border: solid 1px #eff3f5; width: 100%; }

.pageHeader.careers             { text-align: left; height: 600px; position: relative; 
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/about/careers_header.jpg') no-repeat center top; background-size: cover; }

/**************** Thank You Styles ********************/

.pageHeader.dark.thankYou {
  padding-top: 170px;
}

.product-expert {
    border: 1px solid white;
    background-color: #fff;
    display: block;
    width: 100%;
    min-height: 600px;
    position: relative;
    box-sizing: border-box;
    position: relative;
    top: 0px;
    margin-bottom: 40px;
    margin-top: -150px;
}

.product-expert .meetings-iframe-container {
    max-width: 600px;
    height: 604px;
    /* float: right; */
    display: block;
    overflow: hidden;
    margin: 0 auto;
}

.product-expert .product-expert-title {
    margin: 60px auto 0;
    width: 90%;
    color: #0173d7;
    font-weight: 600;
    text-align: center;
    font-size: 30px;
    font-family: 'Share', sans-serif;
    line-height: 36px;
    display: block;
}

.product-expert .product-expert-loader {
    position: absolute;
    top: 250px;
    margin: 0 auto;
    width: 65px;
    right: 0;
    left: 0;
    z-index: 949;
}

.training-resources-cta {
    background-color: #fff;
    background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/CTA_Images/demo-bg.jpg') no-repeat;
    background-size: cover;
    box-sizing: border-box;
    padding: 30px 400px 30px 30px;
    color: #fff;
}

.training-resources-cta h4 {
   color: #fff;
}

a.training-resources {
    position: absolute;
    bottom: 45px;
    right: 30px;
    width: 320px;
    text-align: center;
    background-color: #fff;
    padding: 20px;
    color: #fcbb02;
    box-sizing: border-box;
    border-radius: 5px;
    font-weight: 600;
}

a.training-resources::after {
    content: ">";
    font-family: 'ss-icons';
    font-size: 13px;
    padding-left: 10px;
}

.thankYou h2                    { margin: 100px 0 40px 0; }

.oneThird.whiteBox              { box-sizing: border-box; width: 30%; margin: 0 1.5%; }
.oneThird.whiteBox img          { margin: 0 0 20px 0; width: 100%; }


/**************** Testimonials Styles ********************/

.pageHeader.testimonials        { height: 440px; padding: 0;
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Testimonials/success-stories.jpg') no-repeat center top; background-size: cover; }
.testimonials h1                { bottom: auto; top: 280px; }

.testimonialVideo               { width: 620px; position: absolute; top: -350px; right: 0; } 

.caseStudies                    { position: relative;  }

.caseStudies p                  { display: block; min-height: 190px; width: 50%; padding: 0px 20px; box-sizing: border-box; margin: 50px 0;
                                  /*font-size: 36px; line-height: 40px;*/
                                  position: relative; float: left; }

.success-stories .caseStudies p { margin-bottom: 0; margin-top: 0; }

.caseStudies p.subheader        { min-height: 10px; width: 100%; padding: 0; margin: 0; }
.caseStudies p.subheader        { min-height: 10px width: 100%; }
.caseStudies p img              { width: 150px; height: 150px; margin: 0 20px 0 0;
                                  /*position: absolute; top: 40px; left: -30px;*/
                                  float: left;
                                  border: solid 2px #EFF3F5; border-radius: 50%;
                                  box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }

.caseStudies p em               { font-size: 14px; line-height: 16px; font-style: normal;
                                  display: inline-block; padding: 0 0 20px 0; }

.caseStudies p.featured         { width: 100%; min-height: 220px; padding: 30px 30px 30px 160px;
                                  font-size: 36px; line-height: 40px;
                                  background: #EFF3F5; border: solid 1px #EFF3F5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }
.caseStudies p.featured em      { font-size: 16px; line-height: 18px; }
.caseStudies p.featured img     { position: absolute; left: -20px; }

.caseStudies hr                 { height: 0px; opacity: 0; }

.caseStudiesBubble              { border-radius: 0px; position: relative; }
.caseStudiesBubble::before      { content: ""; display: block; height: 0px; width: 0px;
                                  position: absolute; top: -40px; right: 80px;
                                  background: transparent;
                                  border-left: 40px solid transparent;
                                  border-right: 0px solid transparent;
                                  border-bottom: 40px solid #EFF3F5;}

.caseStudies p.featured.overlapQuote { margin-top: -100px; }

/*
.caseStudies p:nth-child(2n)    { padding: 50px 220px 50px 50px; text-align: right; }
.caseStudies p:nth-child(2n) img{ left: auto; right: -30px; }
*/

.testimonials                   { padding-top: 40px; }

.testimonials p                 { display: block; /*width: calc(50% - 30px);  margin: 0 30px 30px 0;*/ margin: 0; width: 31%; padding: 40px; box-sizing: border-box;
                                  position: relative; float: left; overflow: hidden;
                                  font-size: 18px; line-height: 30px; text-align: left; text-indent: 30px;
                                  background: #EFF3F5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }
.testimonials p:before          { content:"\201C"; font-family: 'Fira Sans'; font-size: 100px; color: #08F;
                                  position: absolute; top: 60px; left: 20px;
                                  text-indent: 0; }

.testimonials p:nth-child(2n)   { margin-right: 0; background: #f3f2e7; }
.testimonials p:nth-child(2n + 1) { clear: left; }

.testimonials p:nth-child(3n)   { margin-right: 0; background: #f0f3e7; }
.testimonials p:nth-child(5n)   { margin-right: 0; background: #f5eeec; }

.testimonials p em              { display: block; box-sizing: border-box; padding-top: 20px;
                                  /*position: absolute; left: 0; right: 40px; bottom: 40px; z-index: 200;*/
                                  font-size: 14px; line-height: 18px; text-align: right; 
                                  /*background: linear-gradient( to top, rgba(239,243, 245,1), rgba(239,243,245, 0)) repeat-x;*/ }

.testimonials > div,
.testimonials > div > span      { width: 100%; display: block; }

blockquote.hasImage img {
  width: 150px;
  height: 150px;
  margin: 0 20px 0 -100px;
  float: left;
  border: solid 2px #EFF3F5;
  border-radius: 50%;
  box-shadow: 0px 2px 15px rgba(25,54,78,0.3);
}

.testimonial-container {
  display: flex;
  background: #EFF3F5;
  border: 0;
  box-shadow: 0px 2px 15px rgba(25,54,78,0.2);
  position: relative;
  margin: 100px 0;
  flex-flow: row nowrap;
  align-items: center;
}

.testimonial-container::before {
  content: "";
  display: block;
  height: 0px;
  width: 0px;
  position: absolute;
  top: -40px;
  right: 80px;
  background: transparent;
  border-left: 40px solid transparent;
  border-right: 0px solid transparent;
  border-bottom: 40px solid #EFF3F5;
}

.testimonial-container > img {
  width: 100%;
  max-width: 300px;
}

.testimonial-content {
  box-sizing: border-box;
  padding: 30px 50px;
}

.testimonial-content img.testimonial-logo {
  width: 250px;
}

.testimonial-content p {
  margin: 20px 0;
  display: block;
  min-height: unset;
  width: auto;
  padding: 0;
  box-sizing: border-box;
  position: relative;
  float: none;
}

.testimonial-content em {
  font-size: 16px;
}

.testimonial-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  clear: both;
}

.successStories p.mini {
  background-color: #EFF3F5;
  width: 100%;
  padding: 100px 40px 40px 40px;
  text-align: center;
  font-size: 18px;
  line-height: 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 2px 15px rgba(25,54,78,0.2);
}

.successStories p.mini:nth-child(odd) {
  margin-right: 20px;
}
.successStories p.mini:first-child{
  margin-top: 50px;
}

.successStories p.mini > img {
    position: absolute;
    top: -75px;
    border: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    box-shadow: none;
}

.successStories p.mini > a {
    height: 40px;
    border-radius: 5px;
    padding: 10px 40px;
    margin-right: 5px;
    cursor: pointer;
    font-family: "Fira Sans";
    font-size: 14px;
    outline: 0;
    position: relative;
    overflow: hidden;
    text-shadow: none;
    background: none;
    color: #0095ff;
    border: 1px solid #0095ff;
    box-shadow: none;
    line-height: 20px;
}

.testimonials .successStories p:nth-child(2n)   { margin-right: 0; background: #EFF3F5; }
.testimonials .successStories p:nth-child(2n + 1) { clear: left; }

.testimonials .successStories p:nth-child(3n)   { margin-right: 0; background: #EFF3F5; }
.testimonials .successStories p:nth-child(5n)   { margin-right: 0; background: #EFF3F5; }
.testimonials .successStories p:before  { color: #99abb8; font-size: 64px; top: 40px; }
.testimonials .successStories p { text-indent: 0; text-align: center; }
.testimonials .successStories p:after          { content:"\201C"; font-family: 'Fira Sans'; font-size: 64px; color: #99abb8; position: absolute; bottom: 95px; right: 20px; text-indent: 0; transform: rotate(180deg) }
.testimonials .successStories p em { text-align: center; padding-top: 30px;  }
/**************** System Requirements Styles ********************/

.techSpecs                      { padding-top: 300px; margin-bottom: 80px;background-size:100%;
                                  background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/tech_specs/system-requirements.jpg'); background-position: top center; background-repeat: no-repeat; }



.systemRequirements             { box-sizing: border-box; padding: 40px; min-height: 320px;
                                  background: #00192d url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/tech_specs/requirements.jpg') no-repeat top right; background-size: cover; border: solid 1px #eff3f5;
                                  box-shadow: 0px 5px 20px rgba(0, 25, 45, 0.25); }
.dark .systemRequirements       { border-color: #08F; box-shadow: 0px 5px 20px #000; }
.systemRequirements h3          { padding-left: 110px; margin: 0; }
.systemRequirements p           { font-size: 16px; line-height: 24px; margin-top: 10px; }
.systemRequirements p span      { display: block; width: 110px; padding-right: 20px; box-sizing: border-box; color: #0088ff; text-align: right; float: left; clear: left; }


.minimumReq h3, .recommendedReq h3 { margin-top: 0; }
.whiteBox.minimumReq            { background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/tech_specs/system-spec-minimum.jpg') no-repeat center center; background-size: cover; }
.whiteBox.recommendedReq        { background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/tech_specs/system-spec-recommended.jpg') no-repeat center center; background-size: cover; }

.systemRequirements a.cta       { display: inline-block; width: auto; min-height: 48px; box-sizing: border-box;
                                  padding: 10px 20px; position: absolute; right: 40px; bottom: 40px; z-index: 800;
                                  color: #eff3f5; font-size: 18px; line-height: 30px; text-shadow: 0px 1px 4px #00192d; text-align: center;
                                  border: solid 1px #eff3f5; border-radius: 5px;
                                  background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%;
                                  box-shadow: 0px 1px 4px #000;
                                  transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out; }
.systemRequirements a.cta:hover { border-color: #FFF; color: #FFF; background-position: 0 0%; }


.systemRequirements a.cta strong{ display: block; border-bottom: solid 1px #EFF3F5; padding: 10px 0; margin: 0 0 4px 0; font-size: 38px; font-family: 'Share'; }
.systemRequirements a.cta span  { font-size: 30px; } 


/**************** Misc Page Styles Styles ********************/

.pageHeader.poolStudio          { height: 700px;  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Ps_and_VT_landing_pages/ps_header.jpg') no-repeat center top; background-size: cover; }
.pageHeader.vizTerra            { height: 700px;  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Ps_and_VT_landing_pages/vt_header.jpg') no-repeat center top; background-size: cover; }

.pageHeader.poolStudio h1,
.pageHeader.vizTerra h1         { position: relative; top: 0; left: 0; text-align: left; font-size: 50px; line-height: 50px; padding-top: 110px; }

.pageHeader.about               { height: 500px;  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/about/header_about.jpg') no-repeat center top; background-size: cover; }

.genericHeader                  { padding-top: 100px;  }


.dark.psQuote                   { padding: 300px 0; background: url('//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Ps_and_VT_landing_pages/bg_full.jpg')center center fixed; background-size: cover; }
.dark.vtQuote                   { padding: 300px 0; background: url('//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Ps_and_VT_landing_pages/bg_full_vt.jpg')center center fixed; background-size: cover; }
.dark.deckQuote                   { padding: 300px 0; background: url('https://www.structurestudios.com/hubfs/00_images_ss2015/landing_pages/deck-design-software/fs-bg.jpg')center center fixed; background-size: cover; }

.deckQuote blockquote,
.psQuote blockquote,
.vtQuote blockquote             { max-width: 800px; width: 90%; margin: 0 auto; background: rgba(0, 135, 255, 0.9); box-shadow: 0px 5px 20px #000; }

.youTubeContainer.coverUp       { display: block; width: 540px; padding-bottom: 300px;
                                  position: absolute; top: -360px; right: 0; }


/**************** Account Page Styles Styles ********************/

.pageHeader.account,
.row-fluid .pageHeader.account[class*="span"]
                                { height: 100px; min-height: 10px; margin: 0;
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/about/header_about.jpg') no-repeat center top; background-size: cover; }

.pageHeader.account h1          { bottom: 200px; display: none; }

#memberData                     { }

.whiteBox.account               { position: relative; top: -150px; z-index: 800; padding: 0;
                                  background: #dfe6eb; }

.whiteBox.account h3,
.loginBox h3                    { margin-top: 0; }
.loginBox h3                    { margin-bottom: 20px; font-size: 50px; line-height: 50px; text-align: center; }

.loginBox,
.loginBox.whiteBox              { max-width: 600px;
                                  position: relative; top: -160px; z-index: 800; margin: 0 auto -160px auto !important;
                                  background: #dfe6eb;
                                  border-radius: 5px; }

.loginBox:after                 { content: ""; display: table; clear: both; }

.loginForm > div                { position: relative; }
.loginBox input                 { height: 50px; padding: 0 20px 0 50px; margin: 0 0 10px 0; position: relative;
                                  font-family: 'Share'; font-size: 24px; line-height: 50px; font-weight: 400; color: #19364e;
                                  border: solid 1px #eff3f5; border-radius: 25px;
                                  background: #dfe6eb; box-shadow: 0 2px 5px rgba(49, 83, 110, 0.3) inset; }
.loginBox label                 { width: 50px; text-align: center; font-size: 5px; color: #dfe6eb;
                                  position: absolute; top: 0; left: 0; z-index: 200; }
.loginBox label > span          { width: 30px; height: 30px; margin: 0; padding: 0;
                                  position: absolute; top: 10px; left: 10px;
                                  font-family: 'ss-icons'; font-size: 30px; color: #0088ff; }

.loginBox input[type="submit"]   { padding: 0 20px; min-width: 300px; float: right;
                                   color: #eff3f5; font-weight: 700; text-shadow: 0px 1px 4px #00192d;
                                   border: solid 1px #eff3f5;
                                   background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                   background-size: 100% 200%; background-position: 0 100%;
                                   box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                   transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out; }
.loginBox input[type="submit"]:hover { border-color: #FFF; color: #FFF; background-position: 0 0%; }
.loginBox a                     { display: inline-block; font-size: 16px; height; 50px; line-height: 50px; float: right; margin: 0 20px 0 0; }

.userGreeting                   { display: block; width: 100%; height: 150px; margin: 0; padding: 10px 10px 10px 160px; box-sizing: border-box;
                                  position: relative; top: 0px; left: 0px; z-index: 790;
                                  border-radius: 0px; font-size: 16px;
                                  background: #eff3f5; }
.userGreeting img               { width: 150px; height: 150px; border-radius: 0px;
                                  position: absolute; left: 0px; top: 0px; }
.memberName                     { font-size: 36px; line-height: 36px; color: #0087FF; margin-top: 10px; float: left; }

.row-fluid .accountNavWrap .span3 { width: 200px; padding: 10px; box-sizing: border-box; }

.accountNav                     { display: block; width: 100%; }
.accountNav > *                 { box-sizing: border-box; display: block; width: 100%; height: 50px; line-height: 50px;
                                  border-bottom: solid 1px #bcc7cf; position: relative; font-size: 12px;
                                  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
                                  transition: all 0.3s ease-in-out; }
.accountNav > a:hover           { padding-left: 30px; }
.accountNav > a.active          { padding-left: 30px; background: #eff3f5; }

.accountNav > a:before          { content: '>'; font-family: 'ss-icons'; display: block; width: 20px; height: 50px; line-height: 50px;
                                  opacity: 0; position: absolute; top: 0; left: -10px;
                                  transition: all 0.3s ease-in-out; }
.accountNav > a:hover:before,
.accountNav > a.active:before   { left: 10px; opacity: 1; }

.accountContentWrap .span9
                                { width: calc(100% - 200px); padding: 20px; box-sizing: border-box; }

#memberData table               { width: 100%; box-sizing: border-box; font-size: 12px; margin-top: 20px; }
#memberData tr:nth-child(odd)   { background: #eff3f5; }
#memberData td:first-child,
#memberData th:first-child      { padding-left: 20px; }
#memberData th                  { text-align: left; background: #19364e; color: #eff3f5; }



#memberData [class^="icon-"]:before,
#memberData [class*=" icon-"]:before { width: 24px; height: 24px;
                                 position: absolute; top: -16px; left: 0px;
                                 font-size: 24px; line-height: 24px; }
#memberData .fa                 { line-height: 30px; }

.syncAgeNav                     { display: inline-block; padding: 5px 0px 5px 5px;
                                  background: #bcc7cf; border-radius: 5px; box-shadow: inset 0px 2px 5px rgba(0, 25, 45, 0.25); }
    .syncAgeNav:after           { content: ""; display: table; clear: both; }
.syncAgeNav a                   { display: block; height: 30px; padding: 5px 10px; margin: 0 5px 0 0;
                                  line-height: 30px;
                                  position: relative; float: left; 
                                  background: #EFF3F5; border-radius: 3px; 
                                  box-shadow: 0px 1px 3px rgba(0, 25, 45, 0.25);
                                  transition: background 0.3s ease-in-out; }
.syncAgeNav a:hover             { background: #FFF; }
.fileViewerTop                  { padding: 1px 5px 0 5px;
                                  color: #DFE6EB; font-size: 14px;
                                  background: #19364e; border-radius: 5px 5px 0 0; }
    .fileViewerTop:after        { content: ''; clear: both; display: table; }

.fileViewerTop > div > div      { display: block; background: #00192d; padding: 0px 10px; margin: 5px 0 0 0;
                                  position: relative; 
                                  border-radius: 4px; }
    .fileViewerTop > div > div:after  { content: ""; display: table; clear: both; }                                 

.fileViewerTop > div            { clear: both; }

.iconHolder                     { display: block; min-height: 30px; min-width: 30px;
                                  position: relative; float: left; z-index: 900; }

.spinner                        { display: block; width: 100%; height: 30px; padding: 64px 0 0 0;
                                  font-size: 12px; line-height: 20px; color: #EFF3F5; text-align: center;
                                  border-radius: 5px; 
                                  background: #00192d url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/spinner.gif) no-repeat center top; }
.spinner:before                 { content: "Loading..."; }
/*#memberData .iconHolder [class^="icon-"]:before,*/
#memberData .iconHolder [class*="icon-"]:before    { top: 4px; font-size: 16px; }
#memberData .iconHolder.medium [class*="icon"]:before    { top: 8px; font-size: 24px; }
.refreshButton                  {  }

#memberData table#FileTable     { margin-top: 0; }

#FileTable td:first-child,
#FileTable th:first-child       { width: 30px; padding-left: 5px; }

.fileActions                    {  }
.fileActions a                  { display: block; width: 30px; height: 30px;
                                  position: relative; float: right; }

#memberData .fileActions a [class^="icon-"]:before,
#memberData .fileActions a [class*=" icon-"]:before { top: 4px; }

.well                           { font-size: 14px; border: 1px solid #eff3f5; padding: 60px 40px 40px 40px; box-shadow: inset 0 5px 15px rgba(0, 24, 44, 0.3);
                                  position: relative; }
.well:after                     { content: ""; clear: both; display: table; }

.well h1, .well h2, .well h3, .well h4, .well h5, .well h6, .well ul, .well p { margin: 10px 0 0 0; font-size: 16px; line-height: 20px; }

.well h1,
.well h2.title                  { display: block; box-sizing: border-box; width: 100%; height: 50px; padding: 0 20px; margin: 0;
                                  position: absolute; top: 0; left: 0;
                                  color: #EFF3F5; font-size: 24px; line-height: 50px; text-shadow: 0px 2px 5px #00182c; text-align: left;
                                  background: #0053ad; }
.well h1 + h6                   { display: block; height: 50px; margin: 0;
                                  position: absolute; top: 0; right: 20px;
                                  color: #EFF3F5; font-size: 12px; line-height: 50px; text-shadow: 0px 2px 5px #00182c; text-transform: uppercase; }

.well h2                        { font-size: 30px; line-height: 36px; }
.well h3, .well h4              { font-size: 24px; line-height: 28px; }

.well .description p, .well .description ul, .well .description ol
                                { font-size: 20px; line-height: 30px; }

.well ul, .well ol              { margin-top: 0; line-height: 20px; }

.well hr, hr.small              { height: 40px; }
.well hr:before, hr.small:before{ top: 20px; }

.well label                     { height: 50px; line-height: 50px; float: left; width: 160px; }
.well label.error               { background: #ff7c7c; color: #FFF; width: 100%; height: 20px; font-size: 16px; line-height: 20px; padding: 0 10px; border-radius: 3px;
                                  position: relative; top: -15px; left: 0; text-align: center; }
.well input                     { background: #cbd4da; border: solid 1px #eff3f5; height: 50px; padding: 0 20px; margin: 0 0 0 20px;
                                  color: #31536e; line-height; 50px; border-radius: 25px; box-sizing; border-box; }
.well label + input             { width: calc(100% - 160px); margin: 0 0 20px 0; box-sizing: border-box; }
.well input[type="button"]      { padding: 0 20px; float: right;
                                  color: #eff3f5; font-weight: 700; text-shadow: 0px 1px 4px #00192d;
                                  border: solid 1px #eff3f5;
                                  background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%;
                                  box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out; }
.well input[type="button"]:hover { border-color: #FFF; color: #FFF; background-position: 0 0%; }


.well .otherInfo                { display: block; width: 100%; box-sizing: border-box; padding: 10px 20px 20px 20px;
                                  color: #EFF3F5;
                                  background: #30526d; box-shadow: 0px 7px 15px rgba(0, 24, 44, 0.25); }
.well .otherInfo:after          { content: ""; display: table; clear: both; }

.well .creditCardForm           {  }

.well .creditCardForm input     { height: 40px; line-height: 40px; font-size: 14px; }

.well label.checkBox            { width: 100%; line-height: 40px; padding-left: 10px; position: relative; }
.well label.checkBox input[type="checkbox"] { position: absolute; left: -30px; width: 50px; }

.creditCardForm select          { margin: 0 20px 0 0; width: calc(100% - 20px); }


.MarketContainer                { text-align: center; }

.AddBox, .Box                   { display: block; box-sizing: border-box; width: 250px; height: 350px;
                                  position: relative; top: 0; margin: 10px; float: left;
                                  color: #EFF3F5; font-size: 14px; text-align: left;
                                  border: solid 1px #EFF3F5; box-shadow: 0px 5px 10px rgba(0, 24, 44, 0.25);
                                  transition: background-position 0.3s ease-in-out, top 0.15s ease-in-out, box-shadow 0.1s ease-in-out; }
.AddBox                         { text-align: center; top: 0px;
                                  background: linear-gradient(130deg, #073460 0%, #0053ad 25%, #0087ff 75%); background-size: 200% 200%;
                                  background-position: 0 0;
                                   }
.Box:hover, .AddBox:hover       { background-position: 0 100%; top: -2px; box-shadow: 0px 7px 15px rgba(0, 24, 44, 0.25); }
.Box                            { overflow: hidden; }

.Box.vip3d:before, .Box.poolstudio:before, .Box.vizterra:before, .Box.syncageSubscription:before
                                { content: ""; display: block; width: 100%; height: 100%; padding: 10px;
                                  position: absolute; top: -10px; left: -10px; z-index: -1;
                                  transition: filter 0.3s ease-in-out; }
.Box.vip3d:before               { background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/card-vip3d.jpg') no-repeat; background-size: cover; }
.Box.poolstudio:before          { background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/card-poolstudio.jpg') no-repeat; background-size: cover; }
.Box.vizterra:before            { background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/card-vizterra.jpg') no-repeat; background-size: cover; }

.Box.vip3D.hasOverlay:before, .Box.poolstudio.hasOverlay:before, .Box.vizterra.hasOverlay:before
                                { filter: blur(5px); -webkit-filter: blur(5px); }

.Box .Header                    { display: block; width: 100%; height: 50px;
                                  position: absolute; top: 0; z-index: 500; cursor: pointer;
                                  overflow: hidden; text-indent: -2000em;
                                  background: #EFF3F5; }

.Box.vip3d .Header, .Box.poolstudio .Header, .Box.vizterra .Header { background-position: 10px 12px; background-repeat: no-repeat; }
.Box.vip3d .Header              { background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/logo-vip3d.png'); }
.Box.poolstudio .Header         { background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/logo-poolstudio.png'); }
.Box.vizterra .Header           { background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/logo-vizterra.png'); }

.Box .Header b                  { display: block; height: 20px; padding: 0 5px 0 10px;
                                  position: absolute; top: 0; right: 0px;
                                  font-size: 10px; font-weight: 300; text-indent: 0; line-height: 20px;
                                  border-radius: 0 0 0 10px; background: #5a92c5;}
.Box .Header div                { display: block; width: 100%; height: 50px;
                                  position: absolute; top: 0px; right: 0; }
.Box .Header div:after          { content: "m"; display: block; width: 30px; height: 30px;
                                  color: #0087FF; font-family: 'ss-icons'; font-size: 20px; text-indent: 0; line-height: 30px; text-align: right;
                                  position: absolute; top: 20px; right: 5px; transition: color 0.1s ease-in-out; }
.Box .Header:hover div:after    { color: #36beff; }

.Box .Header:after              { content: "options"; display: block;
                                  position: absolute; top: 20px; right: 0px; opacity: 0; z-index: -1;
                                  font-family: 'Fira Sans'; font-size: 12px; color: #0087FF; text-indent: 0;
                                  transition: all 0.3s ease-in-out; }
.Box .Header:hover:after        { right: 28px; opacity: 1; }


.Box .Body                      { display: block; height: 100%; width: 100%; z-index: 100; position: absolute; left: 0; top: 0px; }

.Box .data                      { width: 100%; position: absolute; bottom: 30px; left: 0px; z-index: 10;
                                  transition: filter 0.3s ease-in-out; }
.Box.hasOverlay .data           { filter: blur(3px); -webkit-filter: blur(3px); }

.Box .config                    { display: block; width: 100%; height: 30px;
                                  position: absolute; top: 50px; left: 0; overflow: hidden; z-index: 20;
                                  color: #0053ad; font-size: 14px; line-height: 30px;
                                  background: #EFF3F5; background: rgba(239,243,245, 0.7);
                                  transition: height 0.3s ease-in-out; }
.Box .Header:hover + .Body .config { height: 32px; }

.Box .config:after              { content: ''; display: block; width: 0; height: 0;
                                  border-left: 5px solid transparent; border-right: 5px solid transparent;
                                  border-top: 5px solid #EFF3F5;
                                  position: absolute; top: 0; right: 10px;
                                  opacity: 0; transition: opacity 0.3s ease-in-out, top 0.3s ease-in-out; }
.Box.hasOverlay .config:after   { border-top: none; border-bottom: 5px solid #EFF3F5; }
.Box .Header:hover + .Body .config:after { opacity: 1; top: 5px; }

.Box.hasOverlay .config, .Box.hasOverlay .Header:hover + .Body .config
                                { height: 270px; }

.Box .config span               { display: block; height: 30px; width: 100%; padding: 0 5px; box-sizing: border-box;
                                  border-top: solid 1px #FFF; border-top: solid 1px rgba(255,255,255,0.25); border-bottom: solid 1px #dfe6eb; border-bottom: solid 1px rgba(7, 52, 96, 0.2); }
.Box .config span:before { content: "u"; font-family: "ss-icons"; font-size: 20px; color: #0087ff; float: left; margin: -2px 5px 0 0; }
.Box .config span[data-bind*="DisplayName"]:before { content: "u"; }
.Box .config span[data-bind*="Email"]:before { content: "E"; }
.Box .config span[data-bind*="CDKey"]:before { content: "k"; }

.Box .button                    { display: block; width: 240px; height: 30px; padding: 0 5px; box-sizing: border-box;
                                  position: relative; margin: 5px; cursor: pointer;
                                  color: #EFF3F5; font-size: 14px; line-height: 30px;
                                  border: solid 1px #EFF3F5; border-radius: 15px; box-shadow: 0px 2px 5px rgba(0, 24, 44, 0.25);
                                  background: #08F; background: linear-gradient(#0087ff, #0053ad); background-size: 200% 200%;
                                  background-position: 0 100%;
                                  transition: background-position 0.3s ease-in-out, color 0.3s ease-in-out; }
.Box .button:hover              { background-position: 0 0; color: #FFF; }

.Box .button:before             { content: "x"; font-family: "ss-icons"; font-size: 20px; float: left; margin: -1px 5px 0 -1px; }
.Box .button[data-bind*="SendDownloadLink"]:before { content: "d"; }
.Box .button[data-bind*="Reassign"]:before { content: "w"; }
.Box .button[data-bind*="Cancel"]:before { content: "x"; }


.CloudPlanAddButton, .CloudPlanUpgradeButton
                                { display: block; width: 240px; height: 40px; margin: 10px 10px 10px 0;
                                  position: relative; cursor: pointer;
                                  border-radius: 0 20px 20px 0; box-shadow: 0 2px 6px rgba(0,24,44,0.5);
                                  background: #EFF3F5 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/cloud-backup-bg.png') no-repeat left top; }
.CloudPlanAddButton             { background-position: left bottom; }

.CloudPlanUpgradeButton span[data-bind*="CloudPlan"]
                                { display: block; width: 70px; height: 40px;
                                  position: absolute; left: 104px; top: 0px; 
                                  color: #073460; font-family: "Share"; font-weight: 700; text-align: center; line-height: 40px;
                                  background: #e0e5e8; }

.GISButton                      { display: block; width: 240px; height: 40px; margin: 10px 10px 10px 0;
                                  position: relative; 
                                  border-radius: 0 20px 20px 0; box-shadow: 0 2px 6px rgba(0,24,44,0.5);
                                  background: #616161 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/gis-bg.png') no-repeat left top;}
.GISButton span[data-bind*="GISCredit"]
                                { display: block; width: 115px; height: 32px; padding: 0 0 0 38px; box-sizing: border-box;
                                  position: absolute; top: 4px; right: 4px;
                                  color: #ffba03; font-family: "Share"; font-size: 24px; font-weight: 700; line-height: 32px; text-shadow: 0px 1px 3px #000;
                                  background: #313131 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/gis-credit-icon.png') no-repeat 4px 4px;
                                  box-shadow: inset 0px 2px 6px #000; border-radius: 16px; }

.addYardButton, .hasYardButton	{ display: block; width: 170px; height: 40px; margin: 10px 10px 10px 0; box-sizing: border-box;
                                  position: relative; padding: 0 0 0 45px; text-align: left;
                                  border: solid 1px #EFF3F5; border-left: none;
  																font-family: 'Share'; font-weight: 700; font-size: 20px;
                                  border-radius: 0 20px 20px 0; box-shadow: 0 2px 6px rgba(0,24,44,0.5);
                                  background: #DDD;
                                  background-size: 100% 200%; background-position: 0 100%;
																	transition: background 0.3s ease-in-out; }
.hasYardButton									{ width: 140px; }
.yardIcon												{ width: 30px; height: 30px;
  																position: absolute; top: 5px; left: 5px;
  																background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/yard/yard-logo.png) center left no-repeat; background-size: cover;
																	overflow: hidden; }
.hasYardButton .yardIcon				{ width: 112px; }
.VIPUpgradeButton               { display: block; width: 170px; height: 40px; margin: 10px 10px 10px 0; box-sizing: border-box;
                                  position: relative;
                                  
                                  border: solid 1px #EFF3F5; border-left: none;
                                  border-radius: 0 20px 20px 0; box-shadow: 0 2px 6px rgba(0,24,44,0.5);
                                  background: #639f00; background: linear-gradient( #9fe42c, #639f00);
                                  background-size: 100% 200%; background-position: 0 100%;
                                  transition: background 0.3s ease-in-out; }
.vip3d .VIPUpgradeButton        {  }
.VIPUpgradeButton:hover         { background-position: 0 0; }

.VIPUpgradeButton .btn          { display: block; width: 100%; height: 100%; background: none; text-align: left; box-sizing: border-box;
                                  color: #EFF3F5; font-family: 'Share'; font-weight: 700; font-size: 22px; line-height: 40px; text-shadow: 0px 2px 4px #284300; }
.VIPUpgradeButton .btn:hover    { background: none; }
.VIPUpgradeButton .btn:before   { content: "B"; display: block; width: 38px; height: 38px; margin: 0 5px;
                                  float: left; font-family: "ss-icons"; font-size: 28px; font-weight: 400; }

.Box .Footer                    { display: block; width: 100%; height: 30px; padding: 0 10px; box-sizing: border-box;
                                  position: absolute; bottom: 0; left: 0;
                                  line-height: 30px; text-align: right;
                                  color: #0087FF; line-height: 30px; overflow: hidden;
                                  background: #00182c; background: rgba(0, 24, 44, 0.9); }
.Box .Footer span[data-bind*="NextBillDate"] { color: #EFF3F5; }

.AddBox div.bigPlus,
.AddBox div.bigPlus:visited     { display: block; width: 100%; height: 100%;
                                  color: #EFF3F5; font-family: 'Share'; font-size: 160px; line-height: 300px; text-align: center;
                                  text-shadow: 0px 2px 10px #073460; cursor: pointer;
                                  position: absolute; top: 0px; transition: all 200ms cubic-bezier(0.310, -0.345, 0.3, 1.645); }
.AddBox div.bigPlus:hover       { color: #FFF; font-size: 200px; line-height: 280px; }

.AddBox div,
.AddBox div:visited               { color: #EFF3F5; width: 100%; text-shadow: 0px 2px 5px #073460;
                                  position: absolute; bottom: 10px; left: 0; }
.AddBox div:hover, .AddBox:hover a{ color: #FFF; }

.AddBox.GISBox                  { 
                                  
                                  background: #323232 url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/card-gis-credits.jpg') no-repeat center center; background-size: cover; }
.GISBox .GISButton              { width: 100%; height: 50px; margin: 10px 0;
                                  position: relative;
                                  background: none; box-shadow: none; }
.GISBox .GISButton span[data-bind*="GISCredit"]
                                { width: 175px; height: 50px; box-sizing: border-box; padding: 0 0 0 55px; margin: 0 auto;
                                  position: absolute; left: 35px; right: auto;
                                  font-size: 35px; line-height: 53px; text-align: left;
                                  border-radius: 25px; box-shadow:inset 0px 3px 15px #000;
                                  background: #313131 url("//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/gis-credit-icon-large.png") no-repeat scroll 8px 8px; }

.GISBox p                       { font-size: 16px; line-height: 20px; padding: 25px; text-shadow: 0px 2px 5px #000; }
.GISBox p strong                { font-family: 'Share'; font-weight: 700; font-size: 24px; line-height: 30px; }

.btn                            { display: block;
                                  position: absolute; cursor: pointer;
                                  color: #EFF3F5; font-family: 'Share'; font-size: 14px; font-weight: 700; text-align: center;
                                  background: #0087FF; transition: background 0.3s ease-in-out; }
.btn:hover                      { background: #36beff; }
.btn.addCloud                   { right: 2px; top: 2px; height: 36px; line-height: 36px;
                                  border-radius: 18px; padding: 0 10px; }

.btn.changePlan                 { right: 0px; top: 0px; height: 40px; line-height: 40px; padding: 0 10px;
                                  background: none; color: #0087FF; font-family: 'Fira Sans'; font-weight: 300; }
.btn.changePlan:hover           { background: none; color: #36beff; }
                                  
.btn.addCredit                  { right: 6px; top: 6px; height: 28px; width: 28px; line-height: 28px;
                                  line-height: 28px; text-align: center; font-family: 'Share'; font-size: 40px; font-weight: 700;
                                  border-radius: 50%; }
.GISBox .btn.addCredit          { width: 44px; height: 44px; line-height: 41px; font-size: 60px;
                                  position: absolute; top: 7px; right: 41px; left: auto; }
.syncageSubscription            { display: block; }
.Box.syncageSubscription:before { background: rgba(0, 0, 0, 0) url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/card-bg-syncage.jpg") no-repeat scroll 0 0 / cover ; }
.Box.syncageSubscription .Header{ background: #EFF3F5 url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/syncage_logo.png") no-repeat 10px 15px; }
.window.hide                    { top: -50%; opacity: 0; }
.window                         { display: block; width: 90%; max-width: 800px; max-height: 90%; padding: 70px 20px 20px 20px; box-sizing: border-box;
                                  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 999; overflow-y: auto; overflow-x: hidden;
                                  font-size: 16px; color: #073460;
                                  background: #dfe6eb; box-shadow: 0 100px 300px rgba(0,24,44,1); border: solid 1px #EFF3F5;
                                  opacity: 1; transition: opacity 0.3s ease-in-out, top 0.2s ease-in-out;}
.windowBackdrop                 { content: ""; display: block; width: 100%; height: 100%;
                                  position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 800;
                                  background: rgba(0,24,44,0.8); }

.window h2                      { display: block; width: 100%; height: 50px; padding: 0 10px; box-sizing: border-box;
                                  position: absolute; top: 0; left: 0; 
                                  font-size: 20px; line-height: 50px; color: #0087FF;
                                  background: #EFF3F5;}

.window h3                      { font-size: 20px; line-height: 20px; margin: 0; padding-top: 10px; }
.window h4                      { font-size: 20px; line-height: 20px; color: #073460; font-weight: 700; margin: 10px 0; }
.window h4.cdkey:before         { content: "k"; font-family: 'ss-icons'; padding: 0 5px 0 0; font-weight: 400; position: relative; top: 3px; }
.notify,
.window h4.notify               { color: #EFF3F5; text-shadow: 0px 1px 3px #37572d; background: #84bd73; border: solid 1px #EFF3F5; box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  padding: 10px; font-family: "Fira Sans"; font-weight: 400; }
.notify.red,
.window h4.notify.red,
.errorMessage                   { display: block; color: #EFF3F5; text-shadow: 0px 1px 3px #70403a; margin: 10px 0;
                                  padding: 10px; font-family: "Fira Sans"; font-weight: 400;
                                  background: #be756b; border: solid 1px #ff8f80; box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25); }

.notify a, .notify a:visited 		{ color: #EFF3F5; text-decoration: underline; }
.notify a:hover									{ color: #FFF; }

.errorMessage                   {  }

.notify:empty, .window h4.notify:empty, .notify.red:empty, .window h4.notify.red:empty, .errorMessage:empty { display: none; }
.window .label                  { display: inline-block; width: 140px; }

.window hr                      { height: 20px; }
.window hr:before               { top: 10px; }

.window .required.infusion-field-input  { box-sizing: border-box; width: 100%; }

.window input[type="button"]    { display: inline-block; width: auto; height: auto; box-sizing: border-box;
                                  padding: 0 20px; float: right; margin: 10px 0px 0 10px;
                                  color: #eff3f5; font-size: 18px; line-height: 48px; text-shadow: 0px 1px 4px #00192d; text-align: center;
                                  border: solid 1px #eff3f5; border-radius: 5px;
                                  background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%;
                                  box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out; }
.window input[type="button"].cancel{ float: left; margin-left: 0; }
.window input[type="button"]:hover{ border-color: #FFF; color: #FFF; background-position: 0 0%; }

.window .creditCardInfo         { width: 100%; padding: 0 0 10px 0; box-sizing: border-box;
                                  position: relative; margin: 0 0 10px 0;
                                  border-bottom: solid 2px #EFF3F5;}
.window .creditCardInfo:after   { content: ""; display: table; clear: both; }
.window .creditCardInfo h3      { line-height: 20px; padding: 0; }

.window .creditCardInfo input[type="button"] { height: 30px; line-height: 30px; font-size: 14px; padding: 0 10px; position: absolute; top: 0px; right: 0px; z-index: 500; margin: 0; }

.window select                  { display: block; box-sizing: border-box; height: 50px; padding: 0 10px;
                                  border: solid 1px #0087FF; border-radius: 5px; }

.window .priceInfo              { display: block; box-sizing: border-box; width: 100%; height: 50px; margin: 10px 0;
                                  float: right; color: #EFF3F5;
                                  background: #0053ad; border-radius: 5px; }
.window .priceInfo:after        { content: ""; display: table; clear: both; }
.window .priceInfo ul.info      { margin: 0; font-size: 24px; line-height: 50px; padding: 0 10px; text-align: center; }
.window .priceInfo ul.info span[data-bind*=UpgradePrice] { font-family: 'Share'; font-weight: 700; }

.window .agreement              { display: block; width: 100%; font-size: 14px; line-height: 18px; font-weight: 400; clear: both; }
.window #Initial                { display: block; }
.window #Initial + label        { display: block; }

.window ul                      { margin: 10px 0 0 0; font-size: 14px; line-height: 18px; }

.window ul.info                 { display: block; list-style: none; margin: 10px 0 0 0; padding: 0;
                                  float: left;
                                  font-size: 14px; }
.window ul.info li              { display: block; height: 50px; padding-right: 10px; float: left; }
.window ul.info li span         { display: inline-block; font-weight: 400; }

#memberData .window table       { margin-top: 0; }

.customRadio                    { text-align: center; padding: 10px 0 5px 0; border-radius: 10px; background: #acb9c3; border: solid 1px #EFF3F5; box-shadow: inset 0px 4px 8px rgba(0, 25, 45, 0.2); }
.customRadio > div              { display: inline-block; }
.customRadio input[type="radio"]{ display: none; }

.customRadio input[type="radio"] + label { display: inline-block; width: 110px; height: 110px; margin: 3px;
                                  position: relative; top: 0; cursor: pointer; overflow: hidden; text-indent: -2000em;
                                  background-color: #0053ad; background-repeat: no-repeat; background-size: cover;
                                  border: solid 1px #EFF3F5; border-radius: 4px; box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  transition: all 0.3s ease-in-out;
                                }
.customRadio input[type="radio"] + label:hover { top: -5px; opacity: 1; box-shadow: 0px 5px 10px rgba(0, 25, 45, 0.2); }
.customRadio input[type="radio"] + label:after { content: ""; display: block; width: 6px; height: 6px;
                                  position: absolute; right: 2px; top: 2px; 
                                  background: #000; border: solid 1px #000; border-radius: 50px;
                                  transition: background-color 0.3s ease-in-out;}

.customRadio input[type="radio"]:checked + label { top: -4px; opacity: 1; box-shadow: 0px 4px 8px rgba(0, 25, 45, 0.2); }
.customRadio input[type="radio"]:checked + label:after{ opacity: 1; background-color: #5F1; }

label[for*="PoolStudioMonthlySubscription"],
label[for*="PoolStudioYearlySubscription"]{ background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/icon-poolstudio.png); }

label[for*="VizTerraMonthlySubscription"],
label[for*="VizTerraYearlySubscription"]{ background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/icon-vizterra.png); }

label[for*="Vip3DMonthlySubscription"],
label[for*="Vip3DYearlySubscription"]{ background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/icon-vip3d.png); }


label[for*="GISImagesOneTime"]{ background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/icon-gis-one.png); }
label[for*="GISImagesPackof5"]{ background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/icon-gis-5.jpg); }
label[for*="GISImagesPackof10"]{ background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/icon-gis-10.png); }
label[for*="GISImagesPackof20"]{ background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/icon-gis-20.png); }
label[for*="GISImagesPackof40"]{ background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/account/icon-gis-40.png); }

label[for*="Monthly"]:before,
label[for*="Yearly"]:before    { content: "Monthly"; width: 100%; height: 24px; line-height: 24px;
                                  font-family: "Share"; font-size: 14px; font-weight: 700; color: #EFF3F5; text-align: center; text-shadow: 0px 3px 10px #00192d; text-indent: 0;
                                  position: absolute; bottom: 5px; left: 0;}
label[for*="Yearly"]:before     { content: "Yearly"; }

/**************** TABLE FOR COMPARISON CHART ********************/
.row-fluid [class*="span"].pageHeader.comparison                  { height: 600px;
                                          position: relative; margin-bottom: -250px;
                                          background: #0054ae url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/pricing/header.jpg') no-repeat center center; background-size: cover; }

.pageHeader.comparison h1               { bottom: 300px; }

table.comparisonChart    				{ width: 100%; border-collapse: separate;
                                          position: relative; z-index: 200; margin-top: 300px;
                                          border: solid 1px #eff3f5; box-shadow: 0 2px 15px rgba(25, 54, 78, 0.3);
                                          background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/comparison/comparison_chart_bg.png') repeat-y center center; background-size: 100% auto;  }

table.comparisonChart > tbody > tr		{ height: 50px; }
table.comparisonChart > tbody > tr:nth-child(odd) { background: #eff3f5; background: rgba(239, 243, 254, 0.2); }

table.comparisonChart tr > td,
table.comparisonChart tr > th			{ width: 22%; padding: 0 10px; box-sizing: border-box; text-align: center; position: relative; font-size: 14px; line-height: 50px; height: 50px;
										  border-top: 1px solid #eff3f5; }
table.comparisonChart tr > td p         { font-size: 14px; line-height: 20px; padding: 15px 0; }                                          
table.comparisonChart tr:nth-child(1) > td,
table.comparisonChart tr:nth-child(2) > td { border: none; }


table.comparisonChart td[colspan="3"]   { background: #94c3d9; background: rgba(148, 195, 217, 0.2); }
table.comparisonChart tr > td:nth-child(1) { width: 34%; border-left: none; padding-left: 20px; color: #798999; text-align: left; overflow: hidden; }
table.comparisonChart tr > td:nth-child(4) { border-right: none; }
table.comparisonChart tr > td.check		{ overflow: hidden; text-indent: -2000em; background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/comparison/check_mark.png') no-repeat center top; }
table.comparisonChart tr > td.noCheck	{ overflow: hidden; text-indent: -2000em; background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/comparison/check_mark.png') no-repeat center bottom; }

table.comparisonChart > tbody > tr.softwarePackage { height: 100px; background: none; }
table.comparisonChart > tbody > tr.softwarePackage > td { height: 100px; position: relative; }

table.comparisonChart tr.softwarePackage td:nth-child(2):after { content: ''; display: block; width: 85px; height: 114px;
										  position: absolute; top: -20px; left: calc(50% - 42px);
										  background: url('images/box_arts.png') no-repeat left center; }
table.comparisonChart tr.softwarePackage td:nth-child(3):after { content: ''; display: block; width: 144px; height: 114px;
										  position: absolute; top: -20px; left: calc(50% - 72px);
										  background: url('images/box_arts.png') no-repeat center center; }
table.comparisonChart tr.softwarePackage td:nth-child(4):after { content: ''; display: block; width: 85px; height: 114px;
										  position: absolute; top: -20px; left: calc(50% - 42px);
										  background: url('images/box_arts.png') no-repeat right center; }

table.comparisonChart > tbody > tr.headers,
table.comparisonChart > tbody > tr.headers td,
table.comparisonChart > tbody > tr.headers td:nth-child(1) { border-top: 3px solid #eff3f5; color: #0054ae; }

table.comparisonChart > tbody > tr.softwareDescription > td { font-size: 10px; line-height: 14px; height: 90px; }
table.comparisonChart > tbody > tr.softwareDescription > td .price { width: 100%; font-size: 20px; padding: 10px 0; overflow: visible; }


table.comparisonChart tr.headers > th	{ position: relative; text-indent: -4000em; }
table.comparisonChart tr.headers > th:first-child { text-indent: 0; }
table.comparisonChart tr.headers > th:nth-child(2):before { content: ' '; display: block; width: 100px; height: 50px; position: absolute; top: -3px; left: calc(50% - 50px);
										  background: url('images/comparison_chart_logos.png') no-repeat left center; }
table.comparisonChart tr.headers > th:nth-child(3):before { content: ' '; display: block; width: 72px; height: 50px; position: absolute; top: -5px; left: calc(50% - 36px);
										  background: url('images/comparison_chart_logos.png') no-repeat -100px 0px; }
table.comparisonChart tr.headers > th:nth-child(4):before { content: ' '; display: block; width: 112px; height: 50px; position: absolute; top: -2px; left: calc(50% - 56px);
										  background: url('images/comparison_chart_logos.png') no-repeat right center; }


table.comparisonChart tr > th:first-child,
table.comparisonChart tr.softwarePackage > td:first-child,
table.comparisonChart tr.softwareDescription > td:first-child { padding: 0 0 0 20px; text-align: left; border-left: none; font-size: 14px; }
table.comparisonChart tr > th:nth-child(2), table.comparisonChart tr > th:nth-child(3), table.comparisonChart tr > th:nth-child(4) { text-shadow: 0px 1px 5px #123; }

td img                                  { max-width: 100%; }


.compareTableHeader                     { display: block; width: 100%; height: 200px; padding: 10px 0 10px 20px; box-sizing: border-box;
                                          position: relative; top: 0px; left: 0; z-index: 500;
                                          margin: 0 0 40px 0; overflow: hidden;
                                          box-shadow:  0 2px 15px rgba(25, 54, 78, 0.3);
                                          background: #dfe6eb; border: solid 1px #EFF3F5; }

.compareTableHeader_2018                { display: block; width: 100%; height: 200px; box-sizing: border-box;
                                            position: sticky; top: 50px; left: 0; z-index: 500;
                                            margin: 0 0 40px 0; overflow: visible; padding: 0 0 0 20px;
                                            box-shadow:  0 2px 15px rgba(25, 54, 78, 0.3);
                                            background: #dfe6eb; border: solid 1px #EFF3F5;  }

.compareTableHeader_2018 > div.vip3D    { background: #fff; height: 180px; z-index: 999; position: relative; top: -10px; box-shadow: 0 0 10px rgba(0,0,0,0.2); }
.compareTableHeader_2018 .discoverTheDifference { font-size: 16px; background: #0173d5; position: absolute; left: 0; bottom: 0; height: 40px; box-sizing: border-box; padding: 0 10px; color: #fff; width: 100%; text-align: left; line-height: 40px; cursor: pointer; }
.compareTableHeader_2018 .discoverTheDifference:after { content: "p"; font-family: "ss-icons"; font-size: 20px; position: absolute; right: 10px; }

.compareTableHeader.is_stuck            { width: 90% !important; max-width: 1240px;
                                          left: 50%; transform: translateX(-50%);}

.compareTableHeader > div,
.compareTableHeader_2018 > div          { display: block; width: 25%; height: 150px; padding: 10px 20px; box-sizing: border-box !important;
                                          float: left; font-size: 18px; line-height: 24px; text-align: center;
                                          position: relative;
                                          border-left: 1px #EFF3F5 solid; }
.compareTableHeader > div:first-child   { width: 50%; padding-left: 25%; border: none; }
.compareTableHeader_2018 > div:first-child   { width: 50%; padding-left: 25%; border: none; }

.compareTableHeader > div img           { margin: 0 0 30px 0; max-height: 50px; }
.compareTableHeader_2018 > div img      { margin: 20px 0 10px 0; max-height: 50px; max-width: 80%; }
.compareTableHeader > div.vip3D img     { top: 10px; margin-bottom: 20px; }
.compareTableHeader_2018 > div.vip3D img     { top: 10px; margin-bottom: 10px; margin-top: 10px; }


.compareTableHeader > div .price,
.compareTableHeader_2018 > div .price        { width: 100%; height: auto; font-size: 20px; line-height: 30px;
                                           }


.compareTableHeader > div.compareToggle,
.compareTableHeader_2018 > div.compareToggle  { display: block; width: 100%; height: 40px; padding: 0 20px; box-sizing: border-box;
                                          position: absolute; bottom: 0; left: 0; right: 0;
                                          font-size: 16px; line-height: 40px; text-align: right;
                                          background: #EFF3F5; border: none; }
.compareToggle > div                    { display: inline; color: #a0b0bb; cursor: pointer; }
.compareToggle > div.knob               { display: inline-block; width: 60px; height: 28px; margin: 0 10px;
                                          position: relative; top: 6px;
                                          background: #08F; border-radius: 14px; }
.compareToggle > div.knob:after         { content: ""; display: block; width: 24px; height: 24px; border-radius: 50%;
                                          position: absolute; top: 2px; left: 2px;
                                          background: #EFF3F5;
                                          transition: left 0.3s ease-in-out; }

.compareToggle > div.cAll               { color: #08F; }

.compareToggle.active > div.knob:after  { left: 34px; }
.compareToggle.active > div.cAll        { color: #a0b0bb; }
.compareToggle.active > div.cDiff       { color: #08F; }



.comparisonChart                        { display: block; width: 100%; max-height: 99999px; position: relative; margin: 0 0 40px 0;
                                          overflow: hidden; box-sizing: border-box;
                                          box-shadow:  0 2px 15px rgba(25, 54, 78, 0.3);
                                          background: #eff3f5; border: solid 1px #EFF3F5;
                                          transition: all 0.3s ease-in-out; }

.comparisonChart.trainingClasses {
  margin-top: 40px;
}

.comparisonChart.collapse               { max-height: 38px; }

.comparisonChart > div                  { display: flex; width: 100%; max-height: 500px; box-sizing: border-box; padding: 0px 0px 0px 10px; min-height: 40px;
                                          flex-direction: row; align-items: stretch;
                                          position: relative; overflow: hidden; }
.comparisonChart > div:after            { content: ""; display: table; clear: both; }

/* .compareDiff .comparisonChart > div { max-height: 0; padding: 0; } */
.compareDiff .comparisonChart > div.diff  { max-height: 500px; padding: 0px 0px 0px 20px; }
.compareDiff .comparisonChart > div:not(.diff) { display: none; }
.compareDiff .comparisonHeader .comparisonChart > div { display: flex !important; }
.compareDiff .comparisonChart > div.header { display: block !important; max-height: 40px; padding: 0px 0px 0x 20px; line-height: 40px;}

.comparisonChart > div.header           { max-height: 40px; background: #073460; font-family: 'Share', sans-serif; color: #EFF3F5; font-size: 24px; font-weight: 700; text-shadow: 0px 2px 5px #000; cursor: pointer; line-height: 40px;}
.comparisonChart > div.header:before    { content: "v"; display: block; width: 40px; height: 40px;
                                          position: absolute; top: 0; right: 0px;
                                          font-family: "ss-icons"; font-size: 12px; line-height: 40px; text-align: center;
                                          transform: rotate(180deg); }
.comparisonChart.collapse > div.header:before { transform: rotate(0deg); }

.comparisonChart > div:nth-child(2n)    { background: #ecf0f3; }

.comparisonChart > div > div            { display: flex; width: 25%; padding: 5px 0px; box-sizing: border-box; min-height: 30px;
                                          align-items: center; justify-content: center;
                                          position: relative;
                                          float: left; font-size: 14px; line-height: 30px; text-align: center;
                                          border-left: solid 1px #e4eaee; }

.comparisonChart.trainingClasses > div > div {
  font-size: 20px; line-height: 40px;
}

.comparisonChart.trainingClasses .classPrice {
 color: #999; position: relative; 
}
.comparisonChart.trainingClasses .classPrice:after {
 content: ""; display: block; width: 100%; height: 2px; padding: 0 3px;
  position: absolute; top: calc(50% - 1px); left: -3px;
  background: #555;
}

.comparisonChart.trainingClasses .freeLabel {
  padding-left: 5px; color: #55a100;
}

.comparisonChart > div:nth-child(2n) > div {  }

.comparisonChart > div > div:first-child { text-align: left; border: none; justify-content: flex-start; }


.comparisonChart > div:not(.footer) > div:after    	      { content: ""; display: block; width: 32px; height: 32px; overflow: hidden; 
                                                position: absolute; top: calc(50% - 16px); left: calc(50% - 16px); }
/* .comparisonChart >div.footer > div a { display: inline-block;
    width: 220px;
    height: 48px;
    padding: 0 20px;
    box-sizing: border-box;
    margin-top: 20px;
    color: #eff3f5;
    font-size: 18px;
    line-height: 48px;
    text-shadow: 0px 1px 4px #00192d;
    text-align: center;
    border: solid 1px #eff3f5;
    border-radius: 5px;
    background: #64a000;
    background: linear-gradient( to bottom, rgba(160,229,44,0.9), rgba(100,160,0, 0.9) ) repeat;
    background-size: 100% 200%;
    background-position: 0 100%;
    box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
    transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out;
} */
.comparisonChart > div > div.check,
.comparisonChart > div > div.noCheck { text-indent: -2000em; }

.comparisonChart > div > div.check:after    	{ background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2018/check_mark.png') no-repeat center -9px; }
.comparisonChart > div > div.noCheck:after	  { background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2018/check_mark.png') no-repeat center -58px; }

.comparisonChart > div > div:nth-child(3n) { background-color: #f4f7f8; }
.comparisonChart > div:nth-child(2n) > div:nth-child(3n) { background-color: #f0f4f5; }

.comparisonChart > div > div:nth-child(4n) { background-color: #fff; }
.comparisonChart > div:nth-child(2n) > div:nth-child(4n) { background-color: #f9fafb; }

.comparison2019 > div.row-depth-1:first-child { position: sticky; position: -webkit-sticky; top: 50px; z-index: 999; }

/**************** Social Media Styles ********************/

.socialMedia                            {  }

.socialMediaBG                          { background: none; }
.socialBlocks                           { position: absolute; top: -1px; right: 10px; }
.socialBlocks > a                       { display: block; width: 25px; height: 25px; position: relative; cursor: pointer;
                                          float: left; margin: 0;
                                          color: #eff3f5; text-align: center;
                                          background: #F00; transition: background 0.3s ease-in-out; }
.socialBlocks > a:hover,
.socialBlocks > a:visited               { color: #eff3f5; }

.socialBlocks > .facebook-follow        { background: #005cc4; }
.socialBlocks > .twitter-follow         { background: #5bb8ff; }
.socialBlocks > .linkedin-follow        { background: #0081c4; }
.socialBlocks > .gPlus-follow           { background: #dd4b38; }
.socialBlocks > .pinterest-follow       { background: #be1e2c; }

.socialBlocks > .facebook-follow:hover  { background: #0a77f3; }
.socialBlocks > .twitter-follow:hover   { background: #8fcfff; }
.socialBlocks > .linkedin-follow:hover  { background: #289edb; }
.socialBlocks > .gPlus-follow:hover     { background: #f7705e; }
.socialBlocks > .pinterest-follow:hover { background: #f53d4d; }

.socialBlocks .ss-icon                  { font-size: 16px; line-height: 25px; padding: 0; width: 100%; height: 100%; }

.socialBlocks a .shareTxt               { display: none; }

.socialDiscs                            {  }
.socialDiscs > a                        { box-sizing: border-box; display: block; width: 20%; height: 0; padding-bottom: 20%;
                                          position: relative; margin: 0 2.5% 0 2.5%; float: left;
                                          text-align: center;
                                          border-radius: 50%; border: solid 1px #5a93c5;
                                          background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/social_media_blog.png') no-repeat 0px 0px; background-size: cover; 
                                          transition: all 0.3s ease-in-out; }
.socialDiscs > a.twitterLink            { background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/social_media_twitter.png'); }
.socialDiscs > a.facebookLink           { background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/social_media_facebook.png'); }
.socialDiscs > a.linkedInLink           { background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/Home_Page/social_media_linkedin.png'); }

.socialDiscs > a:hover                  { background-position: 0px -20px; }

.socialDiscs > a > span                 { box-sizing: border-box; width: 100%; padding: 0 10%;
                                          position: absolute; bottom: 20px; left: 0;
                                          font-size: 14px; line-height: 16px;
                                          opacity: 0; transition: all 0.3s ease-in-out; }
.socialDiscs > a:hover > span           { opacity: 1; bottom: calc(25%); }


/********** Vip3D Special Offer ***********/
.vip3dSpecialOffer                       { margin-top: -100px; box-sizing: border-box; padding: 0 40px; }
.vip3dSpecialOffer .showVip3DVideo img { opacity: 1; transition: all ease-in-out 200ms; cursor: pointer; }
.vip3dSpecialOffer .showVip3DVideo iframe { position: absolute; left: 0; right: 0; margin: 0 auto; width: 100%; max-width: 670px; border: 1px solid #eff3f5; top: 0; height: 100%; background: #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }

/***********************************************************************************************************************
 Accordian Slider Script
************************************************************************************************************************/
#accordion, .accordion    				{ width: 100%; position: relative; display: block; }
.accordionButton 						{ height: 80px; line-height: 80px; float: none;
                                          font-family: 'Share'; font-size: 22px; font-weight: 400;
										  border-bottom: 1px solid rgba(25,54,78,0.1); cursor: pointer;
                                          transition: color 0.1s ease-in-out; }
.dark .accordionButton                  { border-bottom-color: rgba(0, 84, 174, 0.5); }
.accordionButton.active                 { color: #0054ae; }
.dark .accordionButton.active           { color: #08F; }
.accordionButton:before                 { content: ">"; display: inline-block; font-family: 'ss-icons'; color: #08F; font-size: 14px; padding: 0 10px; transition: all 0.1s ease-in-out; transform: rotate(90deg); position: absolute; right: 0; }
.accordionButton.active:before          { transform: rotate(270deg); }


.accordionContent 						{ width: 100%; height: 100%; max-height: 0px; overflow: hidden; box-sizing: border-box; padding: 0 20px; transition: all 0.3s ease-in-out; border-bottom: none; }
.accordionContent.active                { max-height: 3000px; padding: 20px; }
.dark .accordionContent.active          { border-bottom-color: rgba(0, 84, 174, 0.5); }
.on 									{  }
.over 									{  }
.accordionContent p           { font-size: 16px; }
.tabbed-box #accordion					{  }
.tabbed-box #accordion .accordionContent	{  }

/**************** Misc. Style ********************/

.home-offer-cta                         { text-align: center; margin-top: 40px; }

.cta-top-padding                        { padding: 15px 0px; }

.welcome h2, .slider-headline h2, .clients h2{ border-bottom: 3px solid #0088ff; }



address                                 { color: #f4f4f4; font-size: 16px; text-transform: none; margin-top: 16px; }

.module-margin                          { margin: 20px 0px; }

.video-player                           { padding: 3px; border: 1px solid #DDD; float: right; }

.row-fluid [class*="span"]              { /*width: 100%;*/ }



/**************** Inner Page- Page Name style ********************/
.page-name{
    color: #444;
    border-bottom: 3px solid #0088ff;
}

.page-name h1, .page-name h2, .page-name h3, .page-name h4, .page-name h5, .page-name h6{
    margin-bottom: 0px;
}


/**************** Google Search ********************/
.hs_cos_wrapper_type_google_search label{
    font-size: 1.17em;
    font-weight: 300;
}

.hs_cos_wrapper_type_google_search .field label {
    font-weight: normal;
}

.hs_cos_wrapper_type_google_search .field input.hs-input {
    width: 60%;
    margin-right: 10px;
    margin-bottom: 0px;
}

.hs_cos_wrapper_type_google_search a.hs-button.primary {
       -moz-user-select: none;
    background-color: #0088ff;
    background-image: none;
    border-width: 0px;
    border-radius: 4px 4px 4px 4px;
    box-shadow:none;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-family: sans-serif;
    font-size: 16px;
    font-weight: bold;
    height: auto;
    line-height: 30px;
    padding: 4px 12px;
    text-align: center;
    text-decoration: none;
    text-shadow: none;
    width: auto;
}

/**************** Sidebar Style ********************/
.sidebar{
    margin-top: 21px;
}

.sidebar h3{
    color: #444;
    border-bottom: 3px solid #0088ff;
    margin-bottom: 10px;
}

.sidebar .hs_cos_wrapper_type_post_listing ul{
    list-style: none;
    padding-left: 0px;
}

/**************** Sidebar Style ********************/

.hs-menu-wrapper.hs-menu-flow-vertical > ul {
    margin-top: 20px;
}

.hs-menu-wrapper.hs-menu-flow-vertical.no-flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper {
    position: relative;
    left: 20px;
}

.hs-menu-wrapper.hs-menu-flow-vertical .hs-menu-depth-1 {
    width: 100%;
}

.hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-menu-depth-1 > a {
    background: none repeat scroll 0 0 #444444;
    border-bottom: 3px solid #0088ff;
    color: #FFFFFF;
    width: auto;
}

.hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-menu-depth-1 > a:hover {
    background: none repeat scroll 0 0 #0088ff;
    color: #FFFFFF;
    width: auto;
}



/************* Form styling *****************/

form.hs-form {
    margin-bottom: 20px;
}

.hs-form-field > label {
    font-weight: 400; font-size: 16px;
}

.well input                     {  }

textarea, input, form.hs-form input[type="text"], form.hs-form input[type="email"], form.hs-form input[type="tel"], form.hs-form select, form.hs-form textarea, form.hs-form .email-correction, form.hs-form .email-validation {
    background: #FFF; border: solid 1px #94c3d9; height: 40px; padding: 0 10px;
    color: #5a93c5; line-height: 40px; border-radius: 10px; box-sizing; border-box;
}

textarea                        { height: auto; min-height: 60px; line-height: 16px; padding: 5px 10px; }

form.hs-form .inputs-list {
    list-style-type: none;
}

.hs-form fieldset.form-columns-1 input.hs-input,
.hs-form fieldset.form-columns-1 select.hs-input
    { width: 100%; }

form.hs-form fieldset { max-width: 100%}

input[type="checkbox"], input[type="radio"] { height: auto; margin: 0 10px 0 0; }

.btn-primary, .hs-button.primary {display: inline-block; width: auto; height: 48px; box-sizing: border-box;
                                  padding: 0 20px; margin-top: 20px;
                                  color: #eff3f5; font-size: 18px; line-height: 48px; text-shadow: 0px 1px 4px #00192d; text-align: center;
                                  border: solid 1px #eff3f5; border-radius: 5px;
                                  background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                  background-size: 100% 200%; background-position: 0 100%;
                                  box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                  transition: top 0.5s ease-in-out, background-position 0.3s ease-in-out; }
.btn-primary:hover, .hs-button.primary:hover { border-color: #FFF; color: #FFF; background-position: 0 0%; }
.btn-primary:after, .hs-button.primary:after { content: ">"; font-family: 'ss-icons'; font-size: 0.5em; display: inline-block; padding: 0 0 0 8px; vertical-align: top; }

ul.hs-error-msgs                        { margin: 0 8px 0 0; padding: 0; }
ul.hs-error-msgs li                     { background: #F00; color: #FFF; font-size: 14px; line-height: 16px;
                                          box-sizing: border-box; padding: 5px 10px; border-radius: 5px; margin: 10px 0; }


/***********************************************************************************************************************
 ENVELOPE AND LETTER
************************************************************************************************************************/

.letterBG                               { background: #0054ae url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/academic/letter_bg.jpg') no-repeat center top ;
                                          background-size: 100% auto; }
.envelope    							{ width: 770px; margin: 30px auto 50px auto; position: relative; }

.envelope:before						{ content: " "; display: block; width: 100%; height: 340px; position: absolute; bottom: 0px; left: 0px; z-index: 0;
										  background: #c5cad1; box-shadow: 0px 5px 10px #000; }
.envelope:after							{ content: " "; display: block; width: 100%; height: 340px; position: absolute; bottom: 0px; left: 0px; z-index: 100;
										  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/academic/envelope_top.png') no-repeat center bottom; background-size: 100% 100%; }

.letterWrapper							{ position: relative; overflow: hidden; width: 100%; height: 100%; max-height: 560px; transition: all 1.0s ease-in-out; }
.letterWrapper:before					{ content: " "; width: 0; height: 0; position: absolute; left: 0px; bottom: 340px;
										  border-left: 385px solid transparent; border-right: 385px solid transparent; border-bottom: 215px solid #bec4cc; }


.letter									{ display: block; width: 610px; padding: 50px 50px 100px 50px; margin: 30px auto; position: relative; 
										  margin-bottom: 200px;
										  background: #ededed; box-shadow: 0px 5px 10px #000;
										  transition: all 1.0s ease-in-out; }


.letter p,
.letter ul								{ font-family: 'Alike', serif; font-size: 16px; line-height: 24px; color: #444; text-shadow: none; }

.dark .letter p                         { text-shadow: none; }

.letter ul								{ list-style-image: none; list-style-type: disc; }
.letter ul li							{ margin: 0 0 15px 0; }

.readBtn, .closeButton					{ display: block; width: 120px; height: 120px; position: absolute; bottom: 110px; left: calc(50% - 65px); z-index: 80;
										  color: #eff3f5; font-size: 18px; line-height: 80px; text-shadow: 0px 1px 4px #00192d; text-align: center;
                                          border: solid 1px #eff3f5; border-radius: 60px;
                                          background: #0088ff; background: linear-gradient( to bottom, rgba(0,213,255,0.9), rgba(0,157,255, 0.9), rgba(0,116,255,0.9) ) repeat;
                                          background-size: 100% 200%; background-position: 0 100%;
                                          box-shadow: 0px 2px 5px rgba(0, 25, 45, 0.25);
                                          transition: bottom 0.5s ease-in-out, background-position 0.3s ease-in-out; opacity: 100; }
.envelope:hover .readBtn,
.envelope:hover .closeButtton				{ bottom: 120px; }
.closeButton								{ opacity: 0; }

.readBtn:after                          { content: "v"; font-family: "ss-icons"; font-size: 30px; position: absolute; left: 0; top: 20px; width: 100%; }

.reading .letterWrapper					{ max-height: 3000px; }
.reading .readBtn						{ opacity: 0; }
.reading .closeButto					{ opacity: 100; }

.signature								{ font-family: 'Homemade Apple', serif; font-size: 36px; color: #2d2f33; }

/************************ Pin Slider ********************************/

.pinSlider                      { display: block; width: 100%; height: auto; min-height: 402px; box-sizing: border-box;
                                  position: relative; clear: both; margin: 50px 0 0 0; /*overflow: hidden;*/
                                   }
.pinSlider:after,
.pinSlider .options:after,
.pinSlider .sections:after      { content: ""; display: table; clear: both; }


.pinSlider .options             { display: block; width: 200px; height: auto;
                                  position: absolute; left: 0px; top: 0px; z-index: 200;
                                  border: solid 1px #eff3f5; border-radius: 5px; box-shadow: 0px 2px 15px rgba(25,54,78,0.3);
                                  background: #eff3f5; }
.pinSlider .options > *         { display: block; box-sizing: border-box; width: 100%; height: 50px;
                                  margin: 0; padding: 0 15px; position:relative;
                                  border-bottom: solid 1px #dfe6eb;
                                  font-size: 16px; line-height: 50px; color: #153759;
                                  transition: all 0.3s ease-in-out;}
    .pinSlider .options > *:first-child { border-radius: 5px 5px 0 0; }
    .pinSlider .options > *:last-child { border-bottom: none; border-radius: 0 0 5px 5px; }
    .pinSlider .interactive:before { border-radius: 5px 5px 0 0; } 
.pinSlider .options > *:hover   { cursor: pointer; color: #0054ae; }
.pinSlider .options > *.active  { color: #FFF; background: #5a93c5; }
.pinSlider .options > *:before  { content: ">"; font-family: 'ss-icons'; font-size: 11px; padding: 0 10px 0 0; }
.pinSlider .options > *:after   { content: ""; display: block; width: 0; height: 0;
                                  position: absolute; right: 0px; top: 15px; z-index: -1;
                                  border-top: 10px solid transparent; border-bottom: 10px solid transparent;
                                  border-left: 10px solid #eff3f5; opacity: 0;
                                  transition: all 0.3s ease-in-out; }
.pinSlider .options > *.active:after { opacity: 1; right: -10px; }

.pinSlider .items               { display: block; width: 9000px; height: auto;
                                  position: absolute; top: 0px; left: 220px; z-index: 100;
                                  transition: left 0.75s ease-in-out; }

.pinSlider .items > *           { display: block; float: left; margin: 0 20px 0 0;
                                  border: solid 1px #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3);
                                  opacity: 0.5;
                                  transition: opacity 0.75s ease-in-out;}

/************************ BGSlider ********************************/

.bgSlider                       { width: 100%; height: auto; overflow: hidden;
                                  margin: 80px 0; padding: 80px 0; position: relative;
                                  background-size: cover; background-repeat: no-repeat; background-position: center center; }
    .bgSlider.noMargin          { margin: 0; }
.bgSlider .slideItems           { width: 100%; height: 100%; position: absolute; z-index: 1;n top: 0; left: 0; right: 0; bottom: 0;
                                  background-size: cover; background-repeat: no-repeat; background-position: center center; }
.bgSlider .slideItems img       { zoom: 2; display: block; margin: auto;
                                  height: 0; width: 0; position: absolute; }


.bgSlider .content              { position: relative; z-index: 200; }

.bgSlider .options              { position: relative; }

.bgSlider ul.options            { list-style-type: none; padding: 0; overflow: hidden; position: relative; z-index: 10;
                                  background: #dfe6eb; border: solid 1px #eff3f5; border-radius: 5px;  box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }
.dark .bgSlider ul.options      {  box-shadow: 0px 2px 15px rgba(0,0,0,1); }

.bgSlider ul.options li         { box-sizing: border-box; width: 100%; height: 50px; line-height: 50px; padding: 0 10px; cursor: pointer;
                                  border-bottom: solid 1px #dfe6eb; transition: all 0.3s ease-in-out;
                                  color: #31536e; text-shadow: none; }
.bgSlider ul.options li.active  { color: #FFF; background: #5a93c5; }
.bgSlider ul.options li:before  { content: ">"; font-family: 'ss-icons'; font-size: 11px; padding: 0 10px 0 0; }


.bgSlider ul.options.thumbnails { background: none; border: none; box-shadow: none; border-radius: none; }

.bgSlider ul.options.thumbnails li  { display: block; width: 50%; height: auto; padding: 10px; margin: 0;
                                  float: left;
                                  border: solid 1px transparent; 
                                  color: #36bfff; font-size: 14px; line-height: 16px; text-align: center; }
.bgSlider ul.options.thumbnails li.active  { color: #FFF; background: rgba(0, 136, 255, 0.5); border: solid 1px #0088ff; border-radius: 5px; }

.bgSlider ul.options.thumbnails li img { padding: 0; margin: 0 0 10px 0; width: 100%; height: auto;
                                  border: solid 1px #0088ff; border-radius: 4px; transition: all 0.3s ease-in-out; }                                 
.bgSlider ul.options.thumbnails li.active img { border-color: #FFF; }

.bgSlider ul.options li:before  { content: ""; padding: 0; display: none; }

.backdrop                       { position: relative; z-index: 2; }
.backdrop.half                  { padding: 0; }
.backdrop:before                { content: ''; display: block; width: 100%; height: 100%; padding: 20px;
                                  position: absolute; left: -20px; top: -20px; z-index: 1;
                                  background: rgba(0,25,45,0.75); }
.backdrop img                   { position: relative; z-index: 10; margin: 20px 0; }
.backdrop > *                   { position: relative; z-index: 10; }

.perks .bgSlider                {  }

.perks                          { text-shadow: 0px 3px 8px #00192d; }

.perks h3,
.perks p.subheader              { color: #FFF; text-align: center; transition: all 0.3s ease-in-out; }

.perks .options                 { padding: 40px 0; }
.perks .options > *             { display: block; width: calc(33.3% - 40px); height: 250px; padding: 110px 20px 20px 20px; box-sizing: border-box;
                                  margin: 20px; float: left; position: relative; cursor: pointer;
                                  color: #FFF; font-size: 24px; line-height: 30px; text-align: center;
                                  background: #083461; box-shadow: 0px 5px 10px #000;
                                  opacity: 0.7; transition: all 0.1s ease-in-out;
                                  border: solid 1px transparent; }
.perks .options > *:hover       { opacity: 0.8; }
.perks .options > *.active      { opacity: 0.9; border-color: #08f; }

.perks .options > *:last-child  { padding: 20px; font-size: 16px; line-height: 24px; }

.perks .options > * span        { display: block; width: 50px; height: 50px;
                                  position: absolute; top: 35px; left: calc(50% - 26px);
                                  color: #AAA; font-size: 30px; line-height: 50px; text-shadow: none;
                                  border: solid 1px #aaa; border-radius: 50%; }
.perks .options > *.active span { border-color: #FFF !important; color: #FFF !important; }
.perks .options > * em          { display: inline-block; clear: both; font-size: 18px; color: #DDD; }

.perks .options > * span, .perks .options > * em { color: #08f; border-color: #08f; }

.perks.slide-2                  { text-shadow: 0px 3px 8px #240930; }
.perks.slide-2 .options > *     { background: #522865; box-shadow: 0px 5px 10px #240930; }
.perks.slide-2 .options > *.active { border-color: #b195ea; }
.perks.slide-2 .options > * span, .perks.slide-2 .options > * em { color: #b195ea; border-color: #b195ea; }

.perks.slide-3                  { text-shadow: 0px 3px 8px #2e0b05; }
.perks.slide-3 .options > *     { background: #ad5242; box-shadow: 0px 5px 10px #411912; }
.perks.slide-3 .options > *.active { border-color: #ff6c52; }
.perks.slide-3 .options > * span, .perks.slide-3 .options > * em { color: #ff6c52; border-color: #ff6c52; }

.perks.slide-4                  { text-shadow: 0px 3px 8px #803e00; }
.perks.slide-4 .options > *     { background: #f98700; box-shadow: 0px 5px 10px #803e00; }
.perks.slide-4 .options > *.active { border-color: #ffc600; }
.perks.slide-4 .options > * span, .perks.slide-4 .options > * em { color: #FFC600; border-color: #FFC600; }

.perks.slide-5                  { text-shadow: 0px 3px 8px #32630b; }
.perks.slide-5 .options > *     { background: #95a700; box-shadow: 0px 5px 10px #254406; }
.perks.slide-5 .options > *.active { border-color: #e4ff00; }
.perks.slide-5 .options > * span, .perks.slide-5 .options > * em { color: #e4ff00; border-color: #e4ff00; }

.perks.slide-6                  { text-shadow: 0px 3px 8px #053346; }
.perks.slide-6 .options > *     { background: #0c6e89; box-shadow: 0px 5px 10px #053346; }
.perks.slide-6 .options > *.active { border-color: #25eae8; }
.perks.slide-6 .options > * span, .perks.slide-6 .options > * em { color: #25eae8; border-color: #25eae8; }

.stickyBox                      { height: auto; position: relative; width: 100%; margin: 80px 0; }
.stickyBox:after                { content: ""; clear: both; display: table; }

.stickyChild                    { position: relative; top: 0; overflow: hidden; box-sizing: border-box; background-size: cover; background-position: center center; }
.stickyBox .stickyChild         { margin: 0; }

img.scrollBG                    { float: left; width: 1px; height: 1px; visibility: hidden; }

.stickyFader                    { display: block; width: 100%; height: 100%; box-sizing: border-box;
                                  position: absolute; top: 0; left: 0; right: 0; bottom: 0;
                                  opacity: 0; background-size: cover; background-position: center center; }

/************************ Parallax BG CSS ********************************/
.parallaxBG                     { background-attachment: fixed; background-size: auto 100%; }

.fullWidth.marginFix            { margin: -80px 0; padding: 80px 0; }

/************************ Construction Measurements Demo ********************************/

.calcDemo                       { display: block;
                                  position: absolute; left: -10px; top: -60px; right: -50px; }

.calcDemo .info                 { display: block; width: auto; width: 30px; height: 30px; padding: 10px;
                                  position: absolute; margin: -25px 22px 0 0;
                                  background: #0088ff; cursor: pointer;
                                  border-radius: 25px; box-shadow: 0px 2px 15px rgba(25,54,78,0.3);
                                  transition: all 0.3s ease-in-out; }
.calcDemo .info.active          { text-indent: 0px; height: auto; width: auto; border-radius: 5px; }
.calcDemo .info.transition      { width: auto; height: auto; }
.calcDemo .info:before          { content: ""; display: block; width: 6px; height: 6px;
                                  position: absolute; right: -22px; top: 21px;
                                  background: #FFF; border-radius: 3px; border: solid 1px #0088ff; }
.calcDemo .info:after           { content: ""; display: block; width: 0; height: 0;
                                  position: absolute; right: -11px; top: 15px;
                                  border-top: 10px solid transparent; border-bottom: 10px solid transparent;
                                  border-left: 15px solid #0088ff; /*#eff3f5*/;
                                  transition: all 0.3s ease-in-out; }
.calcDemo .info.right           { margin: -25px 0 0 22px; }
.calcDemo .info.right:after     { right: auto; left: -11px;
                                  border-top: 10px solid transparent; border-bottom: 10px solid transparent;
                                  border-right: 15px solid #0088ff; border-left: none; /*#eff3f5*/; }
.calcDemo .info.right:before    { right: auto; left: -22px; }
.calcDemo .info .ss-icon        { display: block; height: 35px; width: 35px;
                                  position: absolute; top: 8px; left: 7px; opacity: 1;
                                  color: #eff3f5; font-size: 35px; line-height: 35px; text-shadow: 0px 2px 3px #00192d; }
.calcDemo .info.active .ss-icon { top: 0px; opacity: 0; }

.calcDemo .info span            { display:block; height: 0px; width: 0px; overflow: hidden;
                                  position: relative; top: -30px; opacity: 0;
                                  color: #eff3f5; font-size: 16px; line-height: 20px;
                                  transition: top 0.3s ease-in-out, opacity 0.3s ease-in-out; }
.calcDemo .info.active span     { height: auto; width: auto; top: 0px; opacity: 1; }
.calcDemo .info.transition span { height: auto; width: auto; }



/*************************************************************************
    Colorbox Core Style
*************************************************************************/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper                    {max-width:none;}
#cboxOverlay                    {position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent                    {position:relative;}
#cboxLoadedContent              {overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle                      {margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto                      {float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe                     {width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* User Style: Change the following styles to modify the appearance of Colorbox.  They are ordered & tabbed in a way that represents the nesting of the generated HTML. */
#cboxOverlay                    { background:#000; opacity: 0.9; filter: alpha(opacity = 90); }
#colorbox                       { outline:0;}
    #cboxContent                { background:#000; }
        .cboxIframe             {  }
        #cboxError              { padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent      {  }
        #cboxTitle              { position:absolute; top:-20px; left:0; color:#ccc;}
        #cboxCurrent            { position:absolute; top:-20px; right:0px; color:#ccc;}
        #cboxLoadingGraphic     { background:url(images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
        
        #cboxSlideshow          { position:absolute; top:-20px; right:90px; color:#fff;}
        #cboxPrevious           { position:absolute; top:50%; left:5px; margin-top:-32px; background:url(images/controls.png) no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
        #cboxPrevious:hover     { background-position:bottom left;}
        #cboxNext               { position:absolute; top:50%; right:5px; margin-top:-32px; background:url(images/controls.png) no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
        #cboxNext:hover         { background-position:bottom right;}
        #cboxClose              { display:block; width:50px; height:50px; text-indent: -2000em; overflow: hidden;
                                  position:absolute; top:5px; right:5px;
                                  cursor: pointer; transition: all 0.3s ease-in-out;
                                  background: rgba(0,25,45,0.8) no-repeat; border-radius: 4px; }
        #cboxClose:after        { content: "x"; width: 50px; height: 50px; position: absolute; top: 0; left: 0;
                                  font-family: 'ss-icons'; font-size: 25px; line-height: 50px; text-align: center; color: #dfe6eb; text-indent: 0; }
        #cboxClose:hover        { background: rgba(8,52,97,0.9); }
        #cboxClose:hover:after  { color: #FFF; }
        
/*************************************************************************
    CSS for Juxtapose Slider
*************************************************************************/
.juxtaposeContainer             { display: block; position: relative; overflow: hidden;
                                  border: solid 1px #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }

.juxtaposeControl               {  }
.juxtaposeControl:after         { content: ''; display: table; clear: both; }
.juxtaposeControl > *           { height: 50px; width: auto; display: block; padding: 0 10px;
                                  line-height: 50px; float: left;
                                  cursor: pointer; transition: all 0.3s ease-in-out; }
.juxtaposeControl > *.active    { color: #FFF; background: #5a93c5; }

.juxtaposeControl > *:after     { content: ""; display: block; width: 0; height: 0;
                                  position: absolute; left: 50%; bottom: 0; z-index: -1;
                                  border-left: 10px solid transparent; border-right: 10px solid transparent;
                                  border-bottom: 10px solid #eff3f5; opacity: 0;
                                  transition: all 0.3s ease-in-out; }
.juxtaposeControl > *.active:after { opacity: 1; }

.juxtaposeBoxes                 { position: relative; }
.juxtaposeBoxes .juxtapose      { position: absolute; top: 0; left: 0; z-index: 1; border-top: solid 1px #eff3f5; }
.juxtaposeBoxes .juxtapose:first-child { position: relative; z-index: 100; }

div.juxtapose                   { box-sizing: border-box; width: 100%; font-family: Helvetica, Arial, sans-serif; clear: both; }

div.jx-slider                   { width: 100%; height: 100%; position: relative; overflow: hidden; cursor: pointer; }

div.jx-handle                   { position: absolute; height: 100%; width: 40px; cursor: col-resize; z-index: 10; margin-left: -20px; }

.vertical div.jx-handle         { height: 40px; width: 100%; cursor: row-resize; margin-top: -20px; margin-left: 0; }

div.jx-control                  { height: 100%; margin-right: auto; margin-left: auto; width: 3px; background-color: white; }

.vertical div.jx-control        { height: 3px; width: 100%; background-color: white; position: relative; top: 50%; transform: translateY(-50%); }

div.jx-controller               { position: absolute; margin: auto; top: 0; bottom: 0; height: 60px; width: 9px; margin-left: -3px; background-color: white; }

.vertical div.jx-controller     { height: 9px; width: 100px; margin-left: auto; margin-right: auto; top: -3px; position: relative; }

div.jx-arrow                    { position: absolute; margin: auto; top: 0; bottom: 0; width: 0; height: 0; transition: all .2s ease; }

.vertical div.jx-arrow          { position: absolute; margin: 0 auto; left: 0; right: 0; width: 0; height: 0; transition: all .2s ease; }

div.jx-arrow.jx-left            { left: 2px; border-style: solid; border-width: 8px 8px 8px 0; border-color: transparent #FFF transparent transparent; }

div.jx-arrow.jx-right           { right: 2px; border-style: solid; border-width: 8px 0 8px 8px; border-color: transparent transparent transparent #FFF; }

.vertical div.jx-arrow.jx-left  { left: 0px; top: 2px; border-style: solid; border-width: 0px 8px 8px 8px; border-color: transparent transparent #FFF transparent; }

.vertical div.jx-arrow.jx-right { right: 0px; top: initial; bottom: 2px; border-style: solid; border-width: 8px 8px 0 8px; border-color: #FFF transparent transparent transparent; }

div.jx-handle:hover div.jx-arrow.jx-left,
div.jx-handle:active div.jx-arrow.jx-left { left: -1px; }

div.jx-handle:hover div.jx-arrow.jx-right, 
div.jx-handle:active div.jx-arrow.jx-right { right: -1px; }

.vertical div.jx-handle:hover div.jx-arrow.jx-left,
.vertical div.jx-handle:active div.jx-arrow.jx-left { left: 0px; top: 0px; }

.vertical div.jx-handle:hover div.jx-arrow.jx-right, 
.vertical div.jx-handle:active div.jx-arrow.jx-right { right: 0px; bottom: 0px; }


div.jx-image                    { position: absolute; height: 100%; display: inline-block; top: 0; overflow: hidden;
                                  -webkit-backface-visibility: hidden; -webkit-transform: scale(1); }
.vertical div.jx-image          { width: 100%; left: 0; top: initial; }
div.jx-image img                { height: 100%; z-index: 5; position: absolute; max-height: initial; max-width: initial; }
.vertical div.jx-image img      { height: initial; width: 100%; }
div.jx-image.jx-left            { left: 0; background-position: left; }
div.jx-image.jx-left img        { left: 0; }
div.jx-image.jx-right           { right: 0; background-position: right; }
div.jx-image.jx-right img       { right: 0; bottom: 0; }

.veritcal div.jx-image.jx-left  { top: 0; background-position: top; }
.veritcal div.jx-image.jx-left img { top: 0; }
.vertical div.jx-image.jx-right { bottom: 0; background-position: bottom; }
.veritcal div.jx-image.jx-right img { bottom: 0; }

div.jx-image div.jx-label       { font-size: 1em;
                            	padding: .25em .75em; position: relative;
                            	display: inline-block; top: 0; background-color: #000; /* IE 8 */
                            	background-color: rgba(0,0,0,.7); color: white; z-index: 10; white-space: nowrap; line-height: 18px;
                            	vertical-align: middle; }
div.jx-image.jx-left div.jx-label { float: left; left: 0; }
div.jx-image.jx-right div.jx-label { float: right; right: 0; }
.vertical div.jx-image div.jx-label { display: table; position: absolute; }
.vertical div.jx-image.jx-right div.jx-label { left: 0; bottom: 0; top: initial; }
div.jx-credit                   { line-height: 1.1; font-size: 0.75em; }
div.jx-credit em                { font-weight: bold; font-style: normal; }

/* Animation */
div.jx-image.transition         { transition: width .5s ease; }
div.jx-handle.transition        { transition: left .5s ease; }
.vertical div.jx-image.transition { transition: height .5s ease; }
.vertical div.jx-handle.transition { transition: top .5s ease; }


/**************** Software Specific Hide Styles ********************/

.vizTerraOnly,
.poolStudioOnly,
a.poolStudioOnly.videoButton,
a.vizTerraOnly.videoButton      { display: none; }

body.vizTerra .vipOnly,
body.poolStudio .vipOnly        { display: none; }

body.vizTerra .vizTerraOnly,
body.poolStudio .poolStudioOnly { display: block; }

body.vizTerra .vizTerraOnly.videoButton,
body.poolStudio .poolStudioOnly.videoButton { display: inline-block; }

body.vizTerra .vipAndPoolStudio { display: none; }


/**************** Landing Page Styles ********************/
.landingPageHeader              { min-height: 300px; padding: 50px 0; margin: 50px 0;
                                  position: relative; overflow: hidden;
                                  background: #153759; }

.landingPageHeader.bg2018				{ background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/Landing_Page_Images/bg.png); background-repeat: no-repeat; background-position: bottom center; }

.row-fluid .landingPageHeader[class*="span"] { min-height: 400px; }
.landingPageHeader > div:nth-child[2] { height: 600px; }

.landingPageHeader img          { height: 100%; width: auto; position: absolute; top: 0; right: 0; }
.landingPageHeader img.main     { right: 50%; transform: translateX(50%); }
.landingPageHeader .content img { height: auto; width: 100%; max-width: 100%; position: relative;  }
.landingPageHeader .content img.floatingImage { position: absolute; }
.landingPageHeader h1           { width: 90%; max-width: 1240px; margin: 0 auto; color: #eff3f5; text-align: left; border: none; padding: 40px 0 0 0; }
.landingPageHeader h1.center    { text-align: center; }
.landingPageHeader .backdrop h1,
.landingPageHeader .content h1  { width: 100%; text-shadow: 0px 2px 3px #00192d; padding: 0; }

h1.lpSmall                      { font-size: 60px; line-height: 70px; margin: 0; padding: 20px 0; }
h1.lpSmall strong               {  }
h1.lpSmall + p.subheader        { text-align: center; padding-top: 10px; }

.landingPageHeader .content     { position: relative;  }
.landingPageHeader .backdrop    { position: absolute; top: 0; width: 100%; }

.landingPageHeader p            { width: 90%; max-width: 1240px; margin: 0 auto; padding: 40px 0; }
.landingPageHeader .backdrop p,
.landingPageHeader .content p   { width: 100%; margin: 0 auto; padding: 40px 0; color: #EFF3F5; text-shadow: 0px 2px 3px #00192d; padding: 20px 0 0 0; }

.landingPageContent .formBox span.hs_cos_wrapper_type_form.hs_cos_wrapper_widget { padding-left: 20px; display: block; }

.trialBG                        { display: block; width: 100%; height: 100%;
                                  position: absolute; top: 0; left: 0;
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/landing_pages/free-trial-bg.jpg') no-repeat; background-size: cover;}

.formBox                        { padding: 20px; border-radius: 5px; position: relative; right: 0;
                                  background: #eff3f5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }
.formBox:before                 { content: ''; display: block; width: 130px; height: 128px;
                                  position: absolute; top: -95px; left: -40px; 
                                  background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/landing_pages/arrow_down_right.png'); background-size: 100% 100%; }

.formBox h3                     { text-align: center; margin-bottom: 20px; }

.lpForm .formBox								{ background: none; padding: 0; box-shadow: none; }
.lpForm .formBox:before					{ content: ""; display: none; }

.hs-form-field > label          { font-weight: 400; font-size: 14px; }

img.cover                       { min-height: 100%; height: auto; min-width: 100%; width: auto; }

img.vip3DBox                    { width: auto; max-width: none; height: auto; position: relative; margin-top: -250px; }

.priceFeature                   { display: inline-block; 
                                  position: relative; float: right;
                                  text-align: right;
                                  /*background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/vizterra_package_right.png) no-repeat right top;*/ }

.price                          { display: block; position: relative; padding: 20px 20px 80px 0; clear: both;
                                  font-family: 'Share'; font-weight: 700; font-size: 50px; line-height: 10px;
                                  overflow: hidden; width: 0px; height: 0px; padding: 0; }
.price strong                   { font-size: 120px; position: relative; top: 45px; }
.price em                       { font-family: 'Fira Sans'; font-weight: 300; font-size: 20px; line-height: 20px;
                                  width: 80px; position: absolute; right: 0px; top: 72px;}


.priceFeature .buttons          { position: absolute; bottom: 20px; left: 20px; }


.lpMargin                       { margin-top: 50px; }

.vt_greenBarCTA                 { width: 100%; height: 245px;
                                  margin-top: -325px; position: relative;
                                  background: url(//429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/landing_pages/vizterra/vizterra-fade-bg.png) repeat-x; }
.vt_greenBarCTA img             { max-width: 50%; padding-top: 40px; }

.vt_greenBarCTA .learnMore      { position: absolute; top: 170px; left: 25%; }



.vt_greenBarCTA.deck            { margin-top: 0px; position: absolute; width: 100%; bottom: 0; left: 0; right: 0; max-width: 100%; }
.vt_greenBarCTA.deck img        { max-width: 100%; padding-top: 0px; position: absolute; left: -50px; top: -90px;
                                    width: 100%; height: auto; max-width: 100%;}

.vt_greenBarCTA.deck .learnMore { right: 0; left: auto; }


.landingPageHero                { box-sizing: border-box; padding: 75px 85px 45px 85px; position: relative; }
.landingPageHero:before         { content: ''; background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/Landing_Page_Images/header-squares-left-3.png'); position: absolute; left: 0; bottom: 0; height: 100%; width: 100%; background-repeat: no-repeat; background-size: contain; z-index: 0; }
.landingPageHero:after          { content: ''; background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/Landing_Page_Images/header-squares-right-1.png'); background-repeat: no-repeat; background-size: contain; position: absolute; right: 0; top: 0; height: 100%; width: 330px; z-index: 0;}
.landingPageHero .content       { width: 100%; max-width: 1240px; z-index: 100; }
.landingPageHero .content .left,
.landingPageHero .content .right { vertical-align: top; }
.landingPageHero .content .left { width: 100%; }
.landingPageHero .content .right { text-align: center; width: 100%; padding: 20px 100px 0; box-sizing: border-box; display: flex; }
.landingPageHero h1             { text-align: center; border: 0; margin: 0; padding: 0 0 0 40px; font-size: 52px; font-weight: 200; color: #31536e; }
.landingPageHero h1 .trialLandingPageTitleAlt { color: #0064df; font-weight: 800; }

.landingPageHero .productContainer { text-align: center; width: 100%; }
.landingPageHero .productContainer img { height: 50px; width: auto; object-fit: contain; }
.landingPageHero .productContainer p { margin: 0 0 0 0; padding: 3px 0 0 0; font-size: 18px; line-height: 22px; }


.landingPageContent.dark             { background-color: #1c3758; background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/Landing_Page_Images/bg.png?t=1540941424887); background-repeat: no-repeat; background-position: bottom;  padding-bottom: 80px; margin-top: 0 !important; position: relative; }
.landingPageContent.dark:after { content: ''; position: absolute; top: 0; right: 0; width: 50%; height: 100%; z-index: 0; background: -moz-linear-gradient(top, rgba(0,136,255,1) 42%, rgba(0,136,255,0.97) 45%, rgba(28,55,88,0.33) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,136,255,1) 42%,rgba(0,136,255,0.97) 45%,rgba(28,55,88,0.33) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,136,255,1) 42%,rgba(0,136,255,0.97) 45%,rgba(28,55,88,0.33) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0088ff', endColorstr='#541c3758',GradientType=0 ); /* IE6-9 */ opacity: .33; }
.landingPageContent.dark .content.lpForm { z-index: 100; }


.landingPageTestimonials             { padding-top: 80px; }
.landingPageTestimonials h2        { color: #31536e; }
.landingPageTestimonials h2 .alt    { color: #0064df; }
.landingPageTestimonials .landingTestimonials { display: flex; }
.landingPageTestimonials .landingTestimonials .testimonialContainer { flex: 0 1 auto; width: 100%; margin-top: 20px; background-color: #fff; box-sizing: border-box; text-align: center; padding: 40px; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); position: relative;}
.landingPageTestimonials .landingTestimonials .testimonialContainer:first-child { margin-right: 10px; }
.landingPageTestimonials .landingTestimonials .testimonialContainer:last-child { margin-left: 10px; }
.landingPageTestimonials .landingTestimonials .testimonialContainer .testimonialPortrait { border-radius: 100%; width: 75px; height: 75px; border: 2px solid #0064df; background-color: #0064df; }
.landingPageTestimonials .landingTestimonials .testimonialContainer h5 { margin: 0; padding: 0; }
.landingPageTestimonials .landingTestimonials .testimonialContainer h6 { margin: -10px 0 0 0; padding: 0; font-style: italic; }
.landingPageTestimonials .landingTestimonials .testimonialContainer p  { position: relative; box-sizing: border-box; margin: 20px 0 80px 0; padding: 0 20px; }
.landingPageTestimonials .landingTestimonials .testimonialContainer p:before  { font-family: 'Share', sans-serif; content: '"'; font-size: 48px; color: #cacaca; position: absolute; left: 0; top: 0; }
.landingPageTestimonials .landingTestimonials .testimonialContainer p:after  { font-family: 'Share', sans-serif; content: '"'; font-size: 48px; color: #cacaca; position: absolute; right: 0; bottom: -20px; }
.landingPageTestimonials .landingTestimonials .testimonialContainer .learnMore { position: absolute; left: 0; right: 0; width: 300px; margin: 0 auto; bottom: 40px;}

/**************** Timeline Styles ********************/

.timelineBG                     { background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/parallax-bg.jpg); background-position: 50% 0px; background-attachment: fixed; overflow: hidden; position: relative; }
.dark.timelineBG                { padding-top: 0px; }

.timelineBG:after               { content: ""; display: table; clear: both; }
.timelineHeaderBg               { display: none; height: 100%; width: 100%;
                                  position: absolute; top: 0; left: 0; 
                                  background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/header.jpg); background-position: 50% 0px; background-repeat: repeat-x;  background-attachment: fixed; }
.timelineParallaxBG             { height: 100%; width: 100%;
                                  position: absolute; top: 0; left: 0; bottom: 0;
                                  background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/bg-parallax-thing.png); background-position: 50% 0px; background-repeat: repeat;  background-attachment: fixed; }
                                  
.timelineHeader                 { height: auto; width: 100%; padding: 80px 0; margin: 0 0 80px 0;
                                  box-shadow: 0 0 30px #000;
                                  background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/ss_March21/Striplights.jpg); background-size: cover; background-position: 50% 50%; /* background-attachment: fixed; */ }


.today                          { display: block; width: 100px; height: 100px; margin: 0 auto 20px auto;
                                  font-family: 'Share', sans-serif; font-size: 18px; font-weight: 700; text-align: center; line-height: 100px;
                                  background: #0054AE; box-shadow: 0px 3px 20px #000; border-radius: 50%;
                                  border: solid 10px #08F;}

.timeline                       { width: 90%; max-width: 1240px; height: auto;
                                  margin: 0 auto; padding: 100px 0 0 0;
                                  position: relative;}

.timeline:before                { content: ""; width: 50px; height: 100%; margin: 0 auto;
                                  position: absolute; left: calc(50% - 25px); top: 0; z-index: 10;
                                  border-radius: 5px; border-top: solid 10px #0054ae; border-bottom: solid 10px #0054ae; box-shadow: 0px 3px 20px #000;
                                  background: #0054ae url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/timeline_ticks.png) repeat-y center top;
                                }
.timeline:after                 { content: ""; display: table; clear: both; }

.timeline span.timelineYear     { display: block; width: 40px; height: 30px;
                                  position: absolute; left: 100%; margin-left: 84px; bottom: 30px; z-index: 10;
                                  font-family: 'Share'; font-size: 16px; text-align: center;
                                  background: #0054ae;
                                }
.timeline > div:nth-child(2n) span.timelineYear { left: auto; margin-left: 0px; right: 100%; margin-right: 84px; }


/* --- OLD TIMELINE CSS STYLES

.timeline > div                 { display: block; width: calc(50% - 103px); height: auto; min-height: 150px; margin-top: -40px; padding: 20px 20px 20px 0px; box-sizing: border-box;
                                  position: relative; z-index: 20; clear: both;
                                  font-size: 16px; line-height: 24px; text-align: right;
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/border-fade-left.png) no-repeat top right;
                                  background-size: 100% auto;
                                  border-right: solid 1px #0054ae;
                                  opacity: 1; transition: all 0.75s ease-in-out; }
                                  

.timeline > div:after           { content: ""; display: block; width: 100%; height: 1px;
                                  position: absolute; bottom: 0; left: 0;
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/border-fade-left.png) no-repeat top right;
                                  background-size: 100% auto;
                                }
.timeline > div:before          { content: ""; display: block; width: 92px; height: 49px;
                                  position: absolute; top: calc(50% - 24px); right: -92px; z-index: 100;
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/timline-glowing-edge.png) no-repeat top left;
                                }

.timeline > div img             { float: right; margin-left: 20px; }

.timeline > div:nth-child(2n) img{ float: left; margin-right: 20px; margin-left: 0px; }

.timeline > div.floatImage img  { float: left; margin: -40px 20px -40px -40px; position: relative; z-index: 500; }
.timeline > div:nth-child(2n).floatImage img { float: right; margin: -40px -40px -40px 20px; }
.timeline > div:nth-child(2n)   { float: right; clear: right; padding: 20px 0px 20px 20px;
                                  text-align: left;
                                  background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/border-fade.png);
                                  border-left: solid 1px #0054ae; border-right: none;
                                }
.timeline > div:nth-child(2n):after {background-image: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/border-fade.png); }
.timeline > div:nth-child(2n):before { right: auto; left: -92px; background-position: -92px 0; }

.timeline > div.featured div    { box-sizing: border-box; display: block; width: 40%; height: 100%; padding: 20px;
                                  position: absolute; top: 0; right: 0; float: none; z-index: 100;
                                  background: #0053ad; background: rgba( 0, 83, 173, 0.9);}
*/

.timeline > div                 { display: block; width: calc(50% - 103px); height: auto; min-height: 150px; margin-top: -100px; padding: 20px 170px 0px 0px; box-sizing: border-box;
                                  position: relative; z-index: 20; clear: both;
                                  font-size: 14px; line-height: 20px; text-align: right;
                                  opacity: 1; transition: all 0.75s ease-in-out; }
.timeline > div:before          { content: ""; display: block; width: 100px; height: 49px;
                                  position: absolute; top: 50px; right: -92px; z-index: 100;
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/timline-glowing-edge.png) no-repeat -200px 0;
                                }
.timeline > div:after           { content: ""; display: table; clear: both; }

.timeline > div.onScreen        { opacity: 1; }
.timeline > div.offScreen       { opacity: 0; }

.timeline > div:nth-child(2n)   { float: right; clear: right; padding: 20px 0px 0px 270px;
                                  text-align: left;
                                  }
.timeline > div:nth-child(2n):before { width: 200px; right: auto; left: -92px; background-position: -300px 0; }
.timeline > div span            { font-family: 'Share'; font-size: 20px; font-weight: 700; display: block; }

.timeline > div img             { width: 150px; height: 150px;
                                  position: absolute; right: 0px; top: 0px; z-index: 100;
                                  border: solid 5px #0054ae; border-radius: 50%;
                                  box-shadow: 0px 0px 20px #0054ae; }
.timeline > div:nth-child(2n) img { right: auto; left: 100px; }    

.timeline > div.featured        { padding-right: 240px; min-height: 220px; }
.timeline > div:nth-child(2n).featured { padding-right: 0; padding-left: 300px; }
.timeline > div.featured:before { top: 96px; }
.timeline > div.featured img    { width: 220px; height: 220px; right: -20px;
                                  border: solid 10px #0054ae; }
.timeline > div:nth-child(2n).featured img { right: auto; left: 40px; }

.timeline > div:nth-child(4n - 1) { padding-right: 270px; }
.timeline > div:nth-child(4n - 1):before { width: 200px; background-position: -100px; }
.timeline > div:nth-child(4n - 1) img { right: 100px; }

.timeline > div:nth-child(4n - 1).featured { padding-right: 300px; }
.timeline > div:nth-child(4n - 1).featured:before { width: 200px; background-position: -100px; }
.timeline > div:nth-child(4n - 1).featured img { right: 40px; }

.timeline > div:nth-child(4n)   { padding-left: 170px; }
.timeline > div:nth-child(4n):before { width: 100px; background-position: -300px; }
.timeline > div:nth-child(4n) img { left: 0px; }

.timeline > div:nth-child(4n).featured { padding-left: 240px; }
.timeline > div:nth-child(4n).featured:before { width: 100px; background-position: -300px; }
.timeline > div:nth-child(4n).featured img { left: -20px; }


.timeline > div.small           { padding-right: 130px; }
.timeline > div.small:nth-child(2n) { padding-right: 0; padding-left: 230px; }
.timeline > div.small:nth-child(4n - 1) { padding-right: 230px; }
.timeline > div.small:nth-child(4n) { padding-right: 0; padding-left: 130px; }
.timeline > div.small:before    { top: 31px; }
.timeline > div.small img       { width: 100px; height: 100px; }


.timeline > div.beginning       { width: 300px; min-height: auto; padding: 0; box-sizing: border-box; margin: 220px auto -50px auto;  
                                  left: auto; float: none;
                                  text-align: center; }
    .timeline > div.beginning.offScreen { opacity: 1; }                         

                                
.timeline > div.beginning div   { width: 300px; padding: 0px 50px 30px 50px; box-sizing: border-box;
                                  position: relative; word-wrap: break-word;
                                  border-radius: 0 0 150px 150px; }

.timeline > div.beginning:before { display: none; }
.timeline > div.beginning span.timelineYear { left: auto; }
.timeline > div.beginning img   { width: 300px; height: 300px;
                                  position: absolute; z-index: -1; left: -10px; bottom: -10px; top: auto;
                                  border: solid 10px #0054ae; }


.cancelTopMargin                { margin-top: -80px; }


.offsetTop                      { padding-top: 50%; }

/**************** Home Page - What's New Section ********************/

p.tinyMargin { margin-top: 10px; }

.whatsNew
    { margin-top: 50px; }
.whatsNew:after
    { content: ""; display: table; clear: both; }

.whatsNew > div.mainFeature
    { display: block; width: 63%; height: 440px; margin-right: 50px; 
      background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/fall-01.jpg);}    




.whatsNew > div
    { display: block; width: calc(37% - 50px); height: 200px; box-sizing: border-box;
      float: left; position: relative;
      border: solid 1px #EFF3F5; box-shadow: 0 2px 15px rgba(25, 54, 78, 0.3);
      background: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/fall-02.jpg) no-repeat center center; background-size: cover;}

.whatsNew > div:nth-child(3n)
    { margin-top: 40px; background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/fall-03.jpg); }


.whatsNew.winter > div.mainFeature
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/winter-01.jpg); }
.whatsNew.winter > div
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/winter-02.jpg); }
.whatsNew.winter > div:nth-child(3n)
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/winter-03.jpg); }
    
.whatsNew.spring > div.mainFeature
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/spring-01.jpg); }
.whatsNew.spring > div
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/spring-02.jpg); }
.whatsNew.spring > div:nth-child(3n)
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/spring-03.jpg); }
    
.whatsNew.summer > div.mainFeature
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/summer-01.jpg); }
.whatsNew.summer > div
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/summer-02.jpg); }
.whatsNew.summer > div:nth-child(3n)
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/summer-03.jpg); }
    
.whatsNew.fall > div.mainFeature
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/fall-01.jpg); }
.whatsNew.fall > div
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/fall-02.jpg); }
.whatsNew.fall > div:nth-child(3n)
    { background-image: url(https://www.structurestudios.com/hubfs/00_images_ss2015/00_home_whatsnew/fall-03.jpg); }

.whatsNew > div h3
    { display: inline-block; min-height: 50px; padding: 10px 20px; box-sizing: border-box;
      position: absolute; bottom: 50px; left: 0;
      font-family: 'Fira Sans'; font-weight: 300; font-size: 24px; line-height: 30px; color: #EFF3F5; text-shadow: none;
      background: #08F; background: rgba(0,136,255,0.9); box-shadow: none;}

.whatsNew a
    { display: inline-block; height: 40px; padding: 10px; box-sizing: border-box;
      position: absolute; left: 0px; bottom: 0px; z-index: 10;
      font-size: 16px; line-height: 20px; }

.whatsNew > div > a:last-child
    { display: block; width: 100%;
      right: 0; bottom: 0; z-index: 5;
      font-size: 16px; line-height: 20px; text-align: right;
      background: #EFF3F5; background: rgba(239,243,245,0.9);}

.whatsNew > div.mainFeature > a:last-child
    { background: none; width: auto; display: inline-block; }

.whatsNew a.learnMore
    { bottom: auto; left: auto; top: 10px; right: 10px; }


.whatsNew p
    { display: block; width: 100%; min-height: 40px; padding: 10px; margin: 0; box-sizing: border-box;
      position: absolute; left: 0px; bottom: 0px; z-index: 0;
      font-size: 16px; line-height: 20px;
      background: #EFF3F5; background: rgba(239,243,245,0.9); }

/**************** ACCOUNT Styles ********************/
.loadingDiv {
		display: none; width: 100%; height: 100%;
  	position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 8000;
    background: rgba(0,24,44,0.8);
}

.loader,
.loader:before,
.loader:after {
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1.8s infinite ease-in-out;
  animation: load7 1.8s infinite ease-in-out;
}
.loader {
  color: #08F;
  font-size: 10px;
  margin: 0px auto;
  position: relative; top: 40%;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
.loader:before,
.loader:after {
  content: '';
  position: absolute;
  top: 0;
}
.loader:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loader:after {
  left: 3.5em;
}
@-webkit-keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
@keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

.flex-container {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.flex-container .full {
  width: 100%; max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.flex-container .flex-item {
  position: relative;
}


.shadow-container {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  background: rgba(0,0,0,0.3);
  filter: blur(50px);
  z-index: -100;
  border-radius: 100%;
}

/* Vizterra CTA */
.VizTerraCTA {
  background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/cta-background.png');
  background-size: cover;
  background-repeat: no-repeat;
  height: 400px; width: 100% !important;
  border: solid 1px #EFF3F5; box-shadow: 0px 2px 15px rgba(25,54,78,0.3);
}

.VizTerraCTA .left {
  background: rgba(239, 243, 245, 0.8);
  height: 100%;
  width: 50%;
  box-sizing: border-box;
  padding: 40px 30px;
}

.VizTerraCTA h3 {
  margin-top: 20px;
  margin-bottom: 20px;
  padding-left: 20px;
}

.VizTerraCTA .learnMore {
  margin-left: 20px;
}

/**************** YARD Styles ********************/

.videoHeader.YARDHeader {
    height: 750px;
}

.YARDHeader .headerContentWrapper {
     padding: 100px 0; box-sizing: border-box;
}

.videoHeader.YARDHeader .content {
    top: auto; transform: none;
}

.videoHeader.YARDHeader .content .learnMore {
    width: auto; padding: 0 30px;
}

.YARDLogo  
    { text-align: center; padding-bottom: 50px; padding-top: 160px; }

.YARDVideoCTA
    { display: block; position: relative; float: right; }
.YARDVideoCTA span
    { display: block; width: 150px; height: 150px; margin-top: 0px;
      position: absolute; top: calc(50% - 75px); left: calc(50% - 75px);
      font-size: 150px; line-height: 150px; text-align:center; color: #FFF;
      text-shadow: 0px 3px 3px rgba(0,0,0,0.6);
      transition: all 0.3s ease-in-out;
    }
.YARDVideoCTA:hover > span
    { margin-top: -4px; text-shadow: 0px 6px 6px rgba(0,0,0,0.3); }

.showYardTestimonialVideo { position: relative; }
.showYardOverviewVideo { position: relative; }
/* .showYardTestimonialVideo video { position: absolute; left: 0; right: 0; top: 0; width: 100%; }  */

.YARDHeader h2
    { font-size: 40px; line-height: 50px; color: #3c3c3c; }

.YARDFlex
    { display: flex; align-items: center; position: relative; }

.YARDFlex .oneThird { padding-right: 80px; }

.YARDFlex > *
    { flex-grow: 1; flex-basis: 0; padding: 0px; box-sizing: border-box; }
    
.YARDFlex .learnMore
    { float: left; }

.YARDFlex a.videoButton:link, .YARDFlex a.videoButton:visited
    { height: auto; background: none; border: none; box-shadow: none; }
.YARDFlex a.videoButton:link:after, .YARDFlex a.videoButton:visited:after
    { content: ""; }
    
.yard-partners {
    display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-evenly;
    align-items: center;
}
.yard-partners span,
.success-stories > span {
    margin-top: -20px;
    width: 100%; padding-bottom: 40px; font-family: 'Share', sans-serif; font-size: 30px; line-height: 30px;
    text-align: center;
}
.yard-partners a {
    opacity: 0.8;
}
.yard-partners a:hover {
    opacity: 1;
}

.YARDpeek {
    width: 100%; height: 600px; margin: 80px 0;
    background: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/yard/yard-fs-01.jpg'); background-size: cover;
    display: flex; align-items: center; background-attachment: fixed;
}

.YARDpeek blockquote, .YARDpeek blockquote.noBox    { background: rgba(0,0,0,0.5); padding: 30px; border-radius: 30px; text-shadow: 0px 0px 2px #000, 0px 2px 5px #000; }
.YARDpeek blockquote:after, .YARDpeek blockquote.noBox:after {  }


/**************** ROI CTA Styles ********************/

.roiCTAgroup
    { display: block; width: 300px; height: 100px; box-sizing: border-box;
      position: absolute; top: 150px; right: -500px; z-index: 800;
      transition: all 0.3s ease-in-out; }
.top .roiCTAgroup
    { top: 120px; }

.roiCTAproduct, .roiCTAproduct:visited
    { display: block; width: 300px; height: 100px; box-sizing: border-box;
      position: absolute; top: 0px; left: 0px; z-index: 10;
      color: #EFF3F5;
      background: #08F url('https://www.structurestudios.com/hubfs/00_images_ss2015/roi-calculator/cta/cta-bg-01.png') no-repeat center center; background-size: cover;
      border-radius: 10px;
      transition: all 0.3s ease-in-out; }
.roiCTAproduct:hover
    { color: #FFF; }

.roiCTAproduct::after
    { content: ""; display: block; width: 40px; height: 15px;
      position: absolute; bottom: -15px; right: 5%;
      background: rgba(0, 0, 0, 0) url("https://www.structurestudios.com/hubfs/00_images_ss2015/roi-calculator/bubble-tail-blue.png?t=1486495601548") no-repeat scroll center center; }

.roiCTAproduct p
    { padding: 5% 20%; font-size: 14px; line-height: 20px; text-align: center; }
.roiCTAproduct strong
    { display: block; clear: both; padding: 5px 0 0 0; }
.roiCTAproduct strong:after
    { content: ">>"; font-family: 'ss-icons'; font-size: 8px; padding: 0 0 0 5px; }


.closeCTA
    { display: block; width: 30px; height: 30px; position: absolute; top: 0px; right: 0px; z-index: 20; cursor: pointer;
      color: #EFF3F5; font-family: 'ss-icons'; text-shadow: 0px 1px 2px #000; line-height: 30px; text-align:center; }
.closeCTA:hover
    { color: #FFF; }

.roiCTAgroup.active
    { right: 50px; }

.roiCTAblog
    { margin-top: 10px; }
.testMode .roiCTAblog
    { display: block; }


.roiCTApricing
    { display: block; width: 100%; height: 200px; margin: 20px 0 80px 0;
      position: relative; overflow: hidden;
      color: #EFF3F5; font-size: 48px; line-height: 54px; text-align: center;
      background: #08F url('https://www.structurestudios.com/hubfs/00_images_ss2015/CTA_Images/cta-bg-02.png') no-repeat center center; background-size: cover;
      border-radius: 0; box-shadow: 0px 2px 15px rgba(25,54,78,0.3); }
.roiCTApricing:hover
    { color: #FFF; }

.roiCTApricing p
    { font-size: 48px; line-height: 54px; max-width: 600px; margin: 20px auto 0 auto; }
.roiCTApricing p strong
    { font-size: 24px; font-weight: 300; line-height: 24px; display: block; clear: both; margin: 20px auto 0 auto; }
.roiCTApricing p strong:after
    { content: ">>"; font-family: 'ss-icons'; font-size: 15px; padding: 0 0 0 10px; }
    

/**************** Prism JS CSS ********************/

/* http://prismjs.com/download.html?themes=prism-okaidia&languages=markup+css+clike+javascript */
/**
 * okaidia theme for JavaScript, CSS and HTML
 * Loosely based on Monokai textmate theme by http://www.monokai.nl/
 * @author ocodia
 */

code[class*="language-"],
pre[class*="language-"] {
    color: #f8f8f2;
	background: none;
	text-shadow: 0 1px rgba(0, 0, 0, 0.3);
	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
	font-size: 12px; line-height: 14px;
    text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	word-wrap: normal;
	line-height: 1.5;

	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;

	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

/* Code blocks */
pre[class*="language-"] {
	padding: 1em;
	margin: .5em 0;
	overflow: auto;
	border-radius: 0.3em;
}

:not(pre) > code[class*="language-"],
pre[class*="language-"] {
	background: #272822;
}

/* Inline code */
:not(pre) > code[class*="language-"] {
	padding: .1em;
	border-radius: .3em;
	white-space: normal;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
	color: slategray;
}

.token.punctuation {
	color: #f8f8f2;
}

.namespace {
	opacity: .7;
}

.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {
	color: #f92672;
}

.token.boolean,
.token.number {
	color: #ae81ff;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
	color: #a6e22e;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string,
.token.variable {
	color: #f8f8f2;
}

.token.atrule,
.token.attr-value,
.token.function {
	color: #e6db74;
}

.token.keyword {
	color: #66d9ef;
}

.token.regex,
.token.important {
	color: #fd971f;
}

.token.important,
.token.bold {
	font-weight: bold;
}
.token.italic {
	font-style: italic;
}

.token.entity {
	cursor: help;
}




.formCol, .formCol500 { 
    float: left; width: calc(100% - 500px); padding: 0 20px 0 0; box-sizing: border-box;
}

.formCol + .formCol500 {
    padding: 0 0 0 20px;
}

.formCol500 {
    width: 500px;
}

.formWrapper {
    display: block; width: 100%; padding: 20px; box-sizing: border-box;
    background: #EFF3F5;
}

.lds-ripple {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 64px;
}
.lds-ripple div {
  position: absolute;
  border: 4px solid #0088ff;
  opacity: 1;
  border-radius: 50%;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(2) {
  animation-delay: -0.5s;
}
@keyframes lds-ripple {
  0% {
    top: 28px;
    left: 28px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: -1px;
    left: -1px;
    width: 58px;
    height: 58px;
    opacity: 0;
  }
}


/**18-2-2021**/
.free-trial-imgs {	max-width: 60%;	margin: 40px auto 0;	padding: 50px;text-align:center;}

.hs-content-path-pool-and-landscape-design-software-trial .landingPageHero .productContainer img {	opacity: 0.8; max-width: 220px;}
    
/**************** Media Styles ********************/

.mobile,
ul.navMenu li ul li a.mobile { display: none; }
.noMobile                   { display: block; }

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
   .shadow-container { display: none; }
}

@media (max-width: 1450px) {
    
    .mainNav                    { box-sizing: border-box; padding-right: 60px; }
    
    
    
}

@media (max-width: 1400px) { 
    .landingPageHero h1 { padding-left: 0; }
}

@media (max-width: 1350px) {
  .comparisonChart > div > div:first-child {width: 31%;}  
  .comparisonChart > div > div{font-size: 13px;line-height: 22px;}
}

@media (min-width: 1291px) {
.pricing2 .vizTerra img.product-box + .pricingFeatures {	margin-top: 56px;}  
}

@media (max-width: 1300px) {
    .landingPageHero h1 { font-size: 52px; line-height: 60px; }

}
@media all and (min-width: 1200px) {
  .oneThird.sticky {
    width: 35% !important;
}
}
@media (max-width: 1200px) {
  .pricing2 ul { padding: 0 30px !important; }
}
@media all and (max-width: 1199px) {
.oneThird.sticky {
    width: 35% !important;
}
}

@media (max-width: 1080px), only screen and (min-device-width : 768px) and (max-device-width : 1080px) {
   .parallaxBG                 { background-attachment: scroll; background-size: cover; background-position: center center !important; }
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 1080px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 1080px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 1080px),
only screen and (        min-device-pixel-ratio: 2)      and (min-width: 1080px),
only screen and (                min-resolution: 192dpi) and (min-width: 1080px),
only screen and (                min-resolution: 2dppx)  and (min-width: 1080px) { 

   .parallaxBG                 { background-attachment: scroll; background-size: cover; background-position: center center !important; }

}

 @media (max-width: 1080px)  {
   
   .softwareHero { overflow-x: hidden; }
   .no-overflow { overflow: visible; }
   .sticky { position: relative !important; top: 0 !important; }
    
   .content { padding: 0 20px; box-sizing: border-box; }
   .ctaGroup.content {  padding: 0; width: calc(100% - 40px) !important; }
    
    .mobile,
    ul.navMenu li ul li a.mobile{ display: block; }
    .noMobile                   { display: none !important; }
    
    h1, h2, h3, h4, h5, h6      { margin-left: 20px; margin-right: 20px; }
    h1.small, h1 .small         { font-size: 30px; line-height: 40px; }
    .pageHeader h1              { font-size: 36px; position: relative; top: 0; left: 0; bottom: 0; right: 0; }
    .careers .pageHeader h1     { font-size: 36px; }
    .careers .pageHeader h1.offset { text-indent: 0; }
    .pageHeader h1 strong       { font-size: 36px; }
    .careers .pageHeader h1.offset strong{ text-indent: 0; }
    .careers .pageHeader h1 strong.small{ font-size: 30px; }
    
    h1                          { font-size: 40px; line-height: 40px; padding: 0 0 20px 0; margin: 0 0 20px 0; }
    h2                          { font-size: 30px; line-height: 36px; text-align: center; margin: 0 0 20px 0; padding: 0 0 20px 0; }
    h3                          { font-size: 24px; line-height: 30px; text-align: center; }
    p                           { font-size: 18px; line-height: 24px; margin: 20px 20px 0 20px; }
    p.subheader                 { font-size: 28px; line-height: 32px;  text-align: center; }
    p.title                     { font-size: 26px; margin: 20px 20px -20px 20px; }
   
   .subNavMenu { display: none !important; }
   
   .dynamicLandingPageHeader { height: auto !important; }
   
   .dynamicLandingPageHeader p { text-align: center; }
   
   .dynamicLandingPageHeader .YARDLogo { padding-bottom: 0; padding-top: 100px; }
   
   .dynamicLandingPageHeader .headerContentWrapper { position: relative; height: auto; }
   
   .dynamicLandingPageHeader .headerContentWrapper .content { transform: none; top: 0; }
   
   .dynamicLandingPageHeader .headerContentWrapper .flex-container { padding-bottom: 100px; }
   
   .training-class-modal { top: 90px; }
   .training-class-modal .event-icons { top: 0; }
    
    .oneThird p, .twoThirds p,
    p.half, p.half + p,
    .half, .half + .half        { margin-left: 0; margin-right: 0; }
    
    
    
    ul, ol                      { box-sizing: border-box; padding: 0 20px 0 40px; }
    
    .half > *                   { margin-left: 0; margin-right: 0; }
    
    .half.whiteBox              { width: 100%; margin: 10px 0; }
    
    hr                          { height: 41px; }
    hr:before                   { top: 20px; }
    
    .mainNav                    { padding: 0; }
    
    .header-container-wrapper, .body-container-wrapper, .footer-container-wrapper 
                                {  }

    .header-container-wrapper   { position: absolute; top: 0px; /*overflow: hidden;*/ z-index: 9999; }
    
    .body-container-wrapper     { z-index: 1; }
    
    a.homeLogo                  {   }
    a.homeLogo > img            { height: 25px; margin: 0 auto; text-align: center; }
    
    .menuBtn                    { top: 0; }
    
    body.mainMenu .header-container-wrapper { box-sizing: border-box; /*height: auto; height: 100%;*/ top: 0; bottom: 0; position: fixed; }
    
    .mainNav .row-fluid-wrapper { display: block; width: 100%; height: auto; }
    
    .mainNav .row-fluid-wrapper:nth-child(2) { box-sizing: border-box; }
    
    .mainNav > div              { z-index: 100; }
    .mainNav > div:last-child   { position: absolute; padding: 0 50px; margin: 0 auto; width: 170px; z-index: 300; }
    
    .mainNav > .row-fluid-wrapper.row-depth-2.row-number-1 { height: 1px; position: absolute; top: 0; z-index: 9000; }
    .mainNav > .row-fluid-wrapper.row-depth-2.row-number-1 > .row-fluid { height: 1px; position: absolute; top: 0; }    
    .row-fluid .phoneNumber     { display: block; position: absolute; padding: 0; right: 115px; width: 50px !important; height: 50px; top: -30px; z-index: 999; }
    
    .phone                      { display: none; }
    
    .phone-mobile               { position: absolute; top: 0; right: 80px; width: 50px; height: 50px; z-index: 999; }
    
    .phone-mobile a             { display: block; width: 50px; height: 50px;
                                  position: absolute; top: 0px; right: 0px;
                                  color: #EFF3f5; font-weight: 400;
                                  overflow: hidden; text-indent: -2000em; }
    .phone a::after,
    .phone-mobile a::after      { content: "#"; display: block; width: 100%; height: 100%;
                                  position: absolute; left: 0; top: 10px;
                                  font-family: "ss-icons"; font-size: 25px; text-align: center; text-indent: 0; }
    .phone a::hover::after,
    .phone-mobile a::hover::after{ color: #FFF; }
    
    .phone-mobile               { display: block; }
    
   .thankYouCaseStudy { margin-top: 20px !important; }
   
   .productExpoert { margin-top: 0 !important; }
   
    .span12.widget-span.widget-type-raw_html.menu { display: block; }
    body.mainMenu .span12.widget-span.widget-type-raw_html.menu { display: block; }
    
    
    .header-container-wrapper               { position: fixed; }
    .headerNavGroup                         { height: 100%; }
    .mainMenu .row-fluid .mainNav           { height: 100%; }
    .mainNav .row-fluid-wrapper             { height: 100%; }
    
    ul.navMenu                              { display: none; }
    body.mainMenu ul.navMenu                { display: block; position: fixed; z-index: 9999; top: 50px; bottom: 50px; overflow-y: scroll; background: #00192d; background: rgba(0,25,45,0.9); }
    ul.navMenu:after                        { content: ''; display: table; clear: both; }
    
    body.mainMenu .header-container-wrapper { bottom: 0; }
    
    .row-fluid .mainNav,
    .mainNav .row-fluid,
    .hs-menu-wrapper            { width: 100%; }
    
    .row-fluid [class*="span"]  { margin: 0; width: 100%; }
    
    .row-fluid .dark[class*="span"] { margin: 20px 0; }
    
    .row-fluid .pageHeader.dark[class*="span"]{margin-top: 0;}
    
    .header-container .row-fluid [class*="span"] { margin: 0; }
    
    ul.navMenu                  { box-sizing: border-box; width: 100%; height: auto; padding: 0 0 50px 0; margin: 0; border-bottom: solid 1px #0054ae; }
    ul.navMenu li               { width: 100%; min-height: 50px; height: auto; border-bottom: solid 1px #0054ae; line-height: 50%; }
    ul.navMenu li:last-child, ul.navMenu li.vip a:last-child,  ul.navMenu li.vizTerra a:last-child,  ul.navMenu li.poolStudio a:last-child
                                { border: none; }
    ul.navMenu li:after         { content: ''; display: table; clear: both; cursor: pointer;}
    
    
    ul.navMenu li a             { box-sizing: border-box; width: 100%; height: 100%; max-width: 100%; }
    
    ul.navMenu li ul            { background: none; position: relative; clear: both; top: 0; border: none; border-top: solid 1px #0054ae; }
    
    ul.navMenu li.hasDropdown              { max-height: 50px; transition: all 0.3s ease-in-out; overflow: hidden; }
    ul.navMenu li.hasDropdown.active,
    ul.navMenu li.hasDropdown.active ul    { max-height: 3000px; opacity: 1; }
    ul.navMenu li.hasDropdown:after        { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 50px; }
    
    .softwareDrop .dropWrapper  { display: block; }
    
    ul.navMenu li ul li.vip, ul.navMenu li ul li.poolStudio, ul.navMenu li ul li.vizTerra, ul.navMenu li ul li.YARD { width: 100%; }
    ul.navMenu li ul li.vip, ul.navMenu li ul li.poolStudio, ul.navMenu li ul li.vizTerra, ul.navMenu li ul li.YARD { }
    ul.navMenu li ul            { display: block; top: 0; padding: 0; } 
    ul.navMenu li:hover ul      { max-height: 50px; display: block; top: 0; padding: 0; }
    ul.navMenu li.hasDropdown:hover ul {  }
    ul.navMenu li.active:hover ul { max-height: 3000px; display: block; top: 0; }
    ul.navMenu li ul li         { line-height: 50px; height: auto; min-height: 50px; }
    ul.navMenu li ul li a       { padding-left: 30px; line-height: 50px; height: 50px; }
    ul.navMenu li ul li a:before { content: '>'; font-family: "ss-icons"; font-size: 10px; padding-right: 10px; color: #5a93c5; }
    ul.navMenu li ul li a:hover:before { color: #FFF; } 
    ul.navMenu li:hover ul li   {  }
    
    ul.navMenu li ul.softwareDrop, ul.navMenu li:hover ul.softwareDrop { position: relative; padding: 0; }
    .leftColNav                 { padding: 0; }
    ul.navMenu li ul li.vip,
    ul.navMenu li ul li.poolStudio,
    ul.navMenu li ul li.vizTerra,
    ul.navMenu li ul li.YARD    { height: auto; padding-top: 0; padding-bottom: 0; margin: 0; border-left: none; }
    
    ul.navMenu li ul li.vip     { border-top: solid 1px #0054AE; }
    
    ul.navMenu li ul li.vip a:first-child,
    ul.navMenu li ul li.poolStudio a:first-child,
    ul.navMenu li ul li.vizTerra a:first-child,
    ul.navMenu li ul li.YARD a:first-child { padding-left: 30px; padding-top: 0; }
    
    ul.navMenu li ul li.vip a,
    ul.navMenu li ul li.poolStudio a,
    ul.navMenu li ul li.vizTerra a,
    ul.navMenu li ul li.YARD a { border-bottom: solid 1px #0054ae; padding-left: 60px; }
    
    ul.navMenu li ul li.vip:before,
    ul.navMenu li ul li.poolStudio:before,
    ul.navMenu li ul li.vizTerra:before,
    ul.navMenu li ul li.YARD:before { content: none; }
    
    li.vip img, li.vizTerra img,
    li.poolStudio img, li.YARD img   { display: none; }
    
    .mainNav ul,
    .hs-menu-wrapper.hs-menu-flow-horizontal > ul
                                { display: block; width: 100%; border-top: solid 1px #0054ae; }
    
    .hs-menu-wrapper.hs-menu-flow-horizontal > ul li { width: 100%; float: left; border-bottom: solid 1px #0054ae; }
    
    .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a { display: block; height: 100%; width: 100%; max-width: 100%; }
    
    .pageHeader, .row-fluid .pageHeader[class*="span"] { min-height: 200px; margin-bottom: 20px; padding: 70px 0 20px 0; }
   
    body.vip { overflow-x: hidden; }
   
    .vipHeader .row-fluid .content { width: 100%; overflow: hidden; }
    .vipHeader h1               { font-size: 30px; min-width: auto; width: 100%; text-align: center; font-family: 'Share'; font-weight: 700; }
    .vipHeader h1 .hidden       { visibility: visible; }
    .vipHeader .slideBox        { width: 100%; padding: 0; }
    .vipHeader .slideBox span   { line-height: 32px; }
    .vipHeader .slideBox span span { opacity: 1; display: inline; }
    .vipHeader h1 .holdText     { display: none; }
    .vipHeader .learnMore       { bottom: 40px; width: 100%; font-size: 14px; }

    .vip3d_hh .vipHeaderCTA:before        { width: 175px; height: 170px; top: 130px; left: 20px; }
    .vip3d_hh .vipHeaderCTA .vipHeaderButtons { bottom: 0; left: 160px; }
    .vip3d_hh .vipHeaderCTA .vipHeaderButtons .learnMore:first-child { position: relative; top: 25px; }
    
    .softwareSection            { padding: 0; }
    .softwareBoxes              { position: relative; top: 0; left: 0; }
    
    a.learnMore                 { width: 100%; font-size: 14px; overflow: hidden; box-sizing: border-box; padding: 0; }
    
    .vip3d_hh                   { height: 300px; }
    .vip3d_hh video             { display: none; }
    
    img.vip3d_hh_title          { width: auto; max-width: none; height: 100%; left: -60px; margin: 0; top: 25px; }
    
    .vip3d_hh a.CTA             { font-size: 16px; height: 50px; width: 100%; text-align: center; line-height: 50px; }
    .vip3d_hh a.CTA::before     { display: none; }
    .vip3Doptions               { margin-top: 10px; }
    .vip3Doptions > *           { width: 100%; height: auto; margin: 0 auto 10px; float: none; overflow: hidden; }
    .vip3Doptions > *:first-child{ height: auto; }
    .vip3Doptions > *:nth-child(2n + 1)   { margin: 0 auto 10px; }
    
    .vip3Doptions > * img       { margin: 0; }
    .vip3Doptions > * span      { font-size: 24px; line-height: 24px; }
    
    
    .caseStudy                  { padding: 20px 100px 20px 20px; }
    .caseStudy p                { font-size: 16px; line-height: 24px; width: auto; }
    .caseStudy p.quoteName      { font-size: 12px; line-height: 18px; }
    
    .half                       { width: 100%; padding: 0; }
    .half + .half               { width: 100%; padding: 0; }
    .oneThird                   { width: 100%; clear: both; padding: 0; }
   .oneThird.sticky             {width:100% !important;}
    .twoThirds                  { width: 100%; clear: both; padding: 0; }
    .twoThirds + .twoThirds,
    .oneThird + .twoThirds      { padding: 0; }
    
    .twoThirds.right, .twoThirds.left, .oneThird.right, .oneThird.left
                                { margin: 0; padding: 0; }
    
    .left, .right               { float: none; clear: both; margin: 0; }
    
    .absolute                   { position: relative; }
    
    img                         { width: 100%; }
    img, img.right, img.left    { margin: 10px 0; }
   
   .CTA-header img { margin: 0; }
   
   .product-expert { margin-top: -40px; }
/*      .product-expert { border-right: 0; margin-top: 600px; }
     .product-expert .meetings-iframe-container { right: 0px; top: -605px; width: 100%; }
   .product-expert .product-expert-loader { top: -300px; right: 0; left: 0; margin: 0 auto; width: 50px; }
     */
   .training-resources-cta     { padding: 30px !important; }
   .training-resources-cta h4,
   .training-resources-cta p    { text-align: center }
    a.training-resources        { position: relative; bottom: unset; right: unset; left: 20px; margin: 20px auto; display: block; } 
   
    .pinSlider                  { height: auto !important; min-height: 240px; }
    .pinSlider .items           { width: 100%; position: relative; }
    .pinSlider .items:after     { content: ''; display: table; clear: both; }
    .pinSlider .items img       { width: 100%; position: absolute; }
    .pinSlider .options         { width: 100%; min-height: 50px; position: relative; }
    .pinSlider .options > *     { box-sizing: border-box; width: 50%; height: 50px; display: block; float: left; font-size: 12px; overflow: hidden; }
    .pinSlider .options > *::before { font-size: 8px; padding: 0 4px 0 0; }
    .row-fluid .subNav          { display: none; }
    
    .scrollRight                { width: 100% !important; left: 0 !important; }
    
    .calcDemo                   { position: relative; top: 0; left: 0; }
    
    .flipper                    { width: 100%; margin: 0; padding-bottom: 50%; }
    
    ul.schools li               { width: calc(50% - 20px); }
    
    ul.tiles li                 { width: 100%; margin: 10px 0; }
    ul.tiles li:nth-child(2n)   { margin: 10px 0; }
    ul.tiles li img             { margin: 0; }
    
    img.extend                  { position: relative; max-height: none; width: 100%; top: 0; bottom: 0; }
    img.extend.left             { right: 0; margin-right: 0px; }
    img.extend.right            { left: 0; margin-left: 0px; }
    
    .landscapingBg p            { width: 100%; position: relative; top: 0; left: 0; }
    .landscapingBg img          { position: relative; left: 0; top: 0; width: 100%; }
    
    .textBubbles > span         { font-size: 14px; line-height: 24px; max-width: 80%; }
    
    .featuresHeader h1          { margin: 100px 0 0 0px; }
    .featuresHeader             { height: 600px; }
    .featuresHeader div, .featuresHeader span { height: 600px; }

    
    .featuresHeader .dpb        { width: 90%; height: auto; left: 5%; max-width: 500px; }
    .dpb a                      { width: 30%;padding: 30% 0 0 0; height: 0; border-radius: 50%; background-size: auto 100%; }
    .dpb a:nth-child(2)         { left: 50%; transform: translateX(-50%); background-position: 50% 0; }
    .dpb a:nth-child(3)         { background-position: 99% 0; }
    .dpb a:nth-child(2)::after, .dpb a:nth-child(3)::after { width: 15%; left: -15%; top: 50%; }
    
    .dark                       { padding: 20px 0 40px 0; }
    
    p:first-child               { padding-top: 20px; }
    
    p.subheader                 { font-size: 14px; line-height: 20px; }
    
    .pageHeader, .pageHeader.partners
                                { background-attachment: scroll; }
   
    .hs-content-path-vip3d-structure-studios-vendor-partners .pageHeader.partners {	background-position: center;}
    
    .pageHeader.features .backdrop { padding: 0; margin: 0px; }
    .pageHeader.dark            { padding: 40px 0; }
    
    .pageHeader.poolStudio,
    .pageHeader.vizTerra        { height: auto; }
    
    .pageHeader.poolStudio h1,
    .pageHeader.vizTerra h1     { position: relative; font-size: 30px; font-size: 30px; line-height: 36px; padding-top: 80px; }
    
    .youTubeContainer.coverUp   { position: relative; margin: 20px; top: 0; right: 0; width: calc(100% - 40px); padding-bottom: 57%; }
    
    .bgSlider                   { margin: 20px 0; padding: 20px 0 60% 0; }
/*     .bgSlider .slideItems       { padding-bottom: 100px; } */
    .bgSlider ul.options.thumbnails li { width: 25% !important; }
    .bgSlider ul.options li     { font-size: 16px; }
    .bgSlider .slideItems img   { position: relative; height: auto; width: 100%; display: none;  }
    .bgSlider .slideItems img:first-child { display: block; opacity: 0; }
    
    
    .pageHeader.features h1     { padding-top: 100px; }
    .pageHeader.features p      { font-size: 18px; line-height: 24px; text-align: left; padding-top: 20px; }
    
    .constructionBackdrop       { margin: 0px 0 0 0; padding: 20px; }
    
    .pageHeader.academic        { height: 350px; background-attachment: scroll; }
    .academic p                 { font-size: 30px; line-height: 40px; }
    
    section                     { padding-bottom: 20px !important; }
    
    .juxtaposeControl > *       { font-size: 14px; }
    div.jx-image img            { width: auto; margin: 0; }
    
    .landscapingBg .content     { height: auto; }
    
    .pageHeader.pricingHeader h1 { top: 80px; }
    
    .signupMain                 { margin: 200px 0 40px 0; }
    .signupMain > div           { width: 90%; margin: 0 5% 20px 5%; }
    .signupMain > div:nth-child(3) { margin-left: 5%; }
    .exclusiveFeature, .exclusiveFeature.active { position: relative; top: 0; margin-bottom: 20px; }
    
    .systemRequirements         { padding: 20px; background: #00192d; }
    .systemRequirements h3      { padding-left: 0; font-size: 20px; line-height: 24px; }
    .systemRequirements p       { margin: 0; font-size: 14px; }
    .systemRequirements p span  { width: 100%; text-align: left; margin-top: 10px; }
    
    h4                          { margin-top: 20px; }
    
    .partnersGrid > *           { width: 38%; margin: 5%; padding-bottom: 30%; }
    
    .oneThird.whiteBox          { box-sizing: border-box; width: 100%; margin: 0 0 20px 0; padding: 20px; }
    
    .letterBG                   { margin: 20px 0 !important; }
    .letterBG p.subheader       { width: 90%; margin: 0 auto !important; }
    
    .envelope                   { width: 90%; max-width: 770px; margin: 0px auto; }
    .envelope:before, .envelope:after { display: none; }
    .letter                     { width: 100%; max-width: 610px; padding: 0px 0px 40px 0px; margin: 0 auto; box-sizing: border-box; }
    .letter p                   { padding: 20px 0 0 0; }
    .letter img                 { width: 100%; height: auto; margin: 0 !important; float: none !important; }
    .letterWrapper              { max-height: 3000px; }
    .letterWrapper:before       { display: none; }
    
    .readBtn, .closeBtn         { display: none !important; }
    
    .dark.techSpecs             { padding-top: 90px; }
    
    .flipper > * > *            { transition: 0s; }
    .flipper img                { margin: 0; }
    
    .ctaGroup > div, .ctaGroup .content, .ctaGroup div,
    .ctaGroup .row-fluid        { height: auto; width: 90%; }
    .ctaGroup                   { height: auto; margin-top: 20px; }
    .pinSlider .options > *::before { height: auto; }
    
    .row-fluid .primaryCTA[class*="span"], .row-fluid .secondaryCTA[class*="span"]
                                { box-sizing: border-box; padding: 0px; margin: 0; display: block; height: auto; position: relative; }
    .ctaGroup                   { width: 90%; }
    .ctaGroup > div, .ctaGroup .content, .ctaGroup div, .ctaGroup .row-fluid
                                { width: 100%; }
    
    .primaryCTA, .row-fluid .primaryCTA[class*="span"] { width: 100%; padding: 40px 0; }
    .primaryCTA a               { width: 90%; padding: 5%; }
    .primaryCTA a h2            { padding: 0; width: 100%; font-size: 24px; margin: 0; line-height: 20px; }
    .primaryCTA a p             { padding: 0; width: 100%; font-size: 14px; line-height: 16px; box-sizing: border-box; margin: 0 0 10px 0; }
    .primaryCTA a span          { position: relative; top: 0; left: 0; transform: translateX(0); font-size: 24px; overflow: hidden; }
    .primaryCTA a span:after    { font-size: 15px; padding-left: 5px; }
    .primaryCTA a:hover span    { top: -5px; }
    
    .secondaryCTA, .row-fluid .secondaryCTA[class*="span"]
                                { width: 100%; border-left: none; border-top: 1px solid #EFF3F5; }
    .secondaryCTA               {  width: 100%; }
    .secondaryCTA a             { width: 90%; padding: 5%; }
    .secondaryCTA p             { padding: 0 0 20px 0; font-size: 16px; line-height: 20px; }
    .secondaryCTA a h2          { padding: 0 0 10px 0; width: 100%; font-size: 24px;  margin: 0 0 10px 0; line-height: 20px; }
    .secondaryCTA a span        { width: 100%; font-size: 14px; padding: 0 10px; }
    .secondaryCTA a span:after  { font-size: 7px; padding-left: 5px; }
    
    .systemRequirements a.cta   { position: relative; top: 0; left: 0; right: 0; bottom: 0; }
    
    .screen                     { margin: 0; }
    .screen img                 { margin: 0px; }
    
    .footer-container-wrapper   { margin: 0; }
    
    .footer-container ul        { width: 100%; margin: 0 0 20px 0; }
    .officeInfo                 { float: left; width: 100%; }
    
    .row-fluid .landingPageHeader[class*="span"], .row-fluid .landingPageHeader.dark[class*="span"]
                                { margin-top: 0; padding: 70px 0 20px 0; min-height: 200px; }
    .landingPageHeader .content { padding-top: 0px; position: relative; height: auto !important; margin-bottom: 0px !important; }
    .landingPageHeader .backdrop { position: relative; }
    .landingPageHeader img      { display: none; }
    .landingPageHeader .content img { display: block; }
    .landingPageHeader img.cover { display: block; height: 100%; width: auto; min-width: auto; max-width: none; }

    .landingPageContent.dark:after { width: 100%; }

    .landingPageHero h1          { text-align: center !important; margin-top: 0 !important; padding: 0 !important; }

    .landingPageHero .landingPageTitleSpacer { padding: 0 !important; }

    .landingPageHero .right     { display: flex !important; padding: 0 !important; }
    .landingPageHero .productContainer { width: 33%; text-align: center; }

    .landingPageContent         { padding: 40px !important; }
    .landingPageContent iframe { margin-bottom: 30px !important; }

    .landingPageContent .formBox span.hs_cos_wrapper_type_form.hs_cos_wrapper_widget { padding-left: 0 !important }
    .landingPageContent .widget-type-raw_html .hs_cos_wrapper_type_raw_html > div { padding-right: 0 !important; }
   
    .VizTerraCTA .left          { padding: 20px 10px; text-align: center; }
    .VizTerraCTA h3             { text-align: center; }
    .VizTerraCTA .learnMore     { margin: 0 auto; width: 80%; display: block; }
    
    #accordion, .accordion      { box-sizing: border-box; padding: 0 20px; }
    .accordionButton            { height: auto; }
    
    .fullScreen                 { z-index: 3000; }
    
    
    .careers .pageHeader        { height: auto; }
    
    .coreValues ol > li         { font-size: 20px; padding: 10px 0 10px 50px; }
    .coreValues ol > li::before { font-size: 18px; line-height: 31px; height: 30px; width: 30px; }
    
    .supportCTA > div           { width: 100%; margin: 10px auto; }
    
    .userGreeting               { height: auto; min-height: 150px; font-size: 16px; line-height: 16px; }
    .userGreeting img           { margin: 0; }
    
    .memberName                 { font-size: 16px; line-height: 16px; }
    
    .accountNav                 { max-height: 50px; overflow: hidden; transition: max-height 0.3s ease-in-out; }
    .accountNav.show            { max-height: 2000px; }
    
    .accountNav > h3            { margin: 0; line-height: 50px; font-size: 20px; padding: 0 20px; cursor: pointer; background: #08F; color: #EFF3F5; }
        .accountNav > h3:before { content:"m"; font-family: "ss-icons"; font-size: 24px; display: inline-block; margin: 0 10px 0 0; }
        .accountNav > h3:after  { content: " Options"; }
    
    img.fullSize                { width: auto; }
    
    .well                       { padding: 30px 0 0 0; }
    
    .well h1, .well h2, .well h3, .well h4, .well h5, .well h6, .well ul, .well p { padding: 0 10px; font-size: 12px; line-height: 16px; }
    
    .well h1,
    .well h2.title              { margin: 0; height: 30px; line-height: 30px; font-size: 14px; }
    
    .well h2                    { font-size: 20px; line-height: 24px; text-align: left; }
    
    .well h1 + h6               { position: relative; right: 0; color: #000; text-shadow: none; }
    
    .well h3, .well h4          { font-size: 16px; line-height: 18px; }
    
    
    
    .well ul, .well ol          { padding: 0 10px 0 30px; font-size: 12px; line-height: 16px;}
    
    .well label                 { width: 100%; padding: 3px 10px; box-sizing: border-box; height: 20px; line-height: 20px !important; }
    .well input                 { width: 100%; box-sizing: border-box; margin: 3px 0 10px 0; font-size: 12px; }
    .well label + input         { width: calc(100% - 20px); margin: 10px; }
    .well label.checkBox        { height: 30px; padding: 10px; line-height: 30px; }
    .well label.checkBox input[type="checkbox"] { height: auto; }
    
    #memberData table           { display: block; }
    #memberData thead           { position: absolute; top: -9999px; left: -9999px; }
    #memberData tbody           { width: 100%; display: block; }
    #memberData tr              { width: 100%; display: block; }
    #memberData td              { /* Behave  like a "row" */ border: none; border-bottom: 1px solid #eee;  position: relative; display: block; padding: 0 10px; }
    #memberData td:first-child, #memberData th:first-child { padding-left: 10px; }
    #memberData td:before       { margin: 0 10px 0 0; font-weight: 700; }
    #memberData p[data-bind*="DisplayName"]:before { content: "Designer:"; margin: 0 10px 0 0; font-weight: 700; }
    #memberData td[data-bind*="CDKey"]:before { content: "CD-Key:"; }
    #memberData td[data-bind*="ProductsName"]:before { content: "Product:"; }
    #memberData td[data-bind*="NextBillDate"]:before { content: "Next Bill Date:"; }
    #memberData td[data-bind*="DateCreated"]:before { content: "Date Created:"; }
    #memberData td[data-bind*="Description"]:before { content: "Description:"; }
    #memberData td[data-bind*="InvoiceTotal"]:before { content: "Invoice Total:"; }
    #memberData td[data-bind*="AmtPaid"]:before { content: "Amount Paid:"; }
    #memberData td[data-bind*="TotalCredit"]:before { content: "Total Credit(s):"; }
    
   .support-page hr            { height: 61px; margin-top: 30px; }
   .support-page h3            { line-height: 48px; }
   .help-search                { width: 100%; }
   
    .formBox:before             { display: none; }
    
    .caseStudy                  { padding: 10px; min-height: 100px; background-position: center left; }
    
    
    .row-fluid .accountNavWrap .span3 { width: 100%; }
    .accountContentWrap .span9  { padding: 10px; }
    .whiteBox.account           { top: 0; }
    
    
    
    .perks .options > *         { width: calc(100% - 20px); margin: 10px; }
    .perks.bgSlider .slideItems { display: none; }
    
    
    .syncageBoxes p             { width: 90%; margin: 10px 5%; }
    .syncageBoxes p:first-child { padding-top: 120px; }
    .signUpBtns > div           { width: 90%; margin: 0 auto 20px auto; box-sizing: border-box; }
        .signUpBtns > div:hover { transform: scale(1); bottom: 0; }
    .premium                    { margin: 0 auto 20px auto; }
    
    p.title                     { margin: 20px 0; }
    
   .vip3dSpecialOffer          { margin-top: -70px; padding: 0; }
   
   .vip3dSpecialOffer h2        { font-size: 48px; line-height: 48px; margin-top: 20px !important; }
   .vip3dSpecialOffer .subheader  { font-size: 20px; margin-bottom: 40px; }
   .vip3dSpecialOffer .ssCheckList { margin: 0 !important; padding: 0 !important; }
   .vip3dSpecialOffer p:last-child { margin-top: 40px; }
   .vip3dSpecialOffer .showVip3DVideo iframe { max-width: unset !important; }
    
    
    .careers .pageHeader h1,
    .careers .pageHeader h1.leftAlign{ top: 0; }
    
    .careersVideo,
    .testimonialVideo           { margin: 20px auto; position: relative; width: 100%; top: auto; right: auto; }
    
    .pageHeader.testimonials,
    .pageHeader.about { height: auto; }
    
    .careers .pageHeader h1,
    .careers .pageHeader h1.offset { position: relative; }
    
    .coreValues.content { padding-top: 0; }
    
        
    .testimonials h1            { top: 0; }
    .testimonials p             { width: 90%; margin-left: 5%; }
    .testimonials > div > span  { padding-bottom: 50px; }
   
    .caseStudies p              { width: 100%; margin: 20px 0; }
    .caseStudies p img          { width: 20%; height: auto; }
   
   .successStories p            { margin: 50px 0; }
   .successStories p.mini > img { width: 150px; }
    
    .caseStudies p.featured     { font-size: 20px; line-height: 30px; padding-left: 30%; padding-right: 5%; }
    .caseStudies p.featured em  { font-size: 13px; }
    .caseStudies p.featured img { left: 5%; width: 20%; height: auto; }
   
    .testimonial-container { flex-flow: column; }
   .testimonial-container > img { max-width: unset; width: 100%; position: relative; top: -10px; }
   .testimonial-content { padding: 10px 50px 40px; }
   .testimonial-container::before { display: none; }
    /*
    .caseStudies p:nth-child(2n) { padding-left: 5%; padding-right: 30%; }
    .caseStudies p:nth-child(2n) img { left: auto; right: 5%; }
    */

    .header_supportHome > div   { margin-bottom: 20px; }
    
    .priceFeature               { margin-top: 30px; text-align: center; }
    .priceFeature .buttons      { position: relative; bottom: 0; left: 0; }
    
    .timelineBG                 { padding-top: 100px; }
    
    .timeline                   { width: 100%; padding: 0; }
    .timeline > div.offScreen   { opacity: 1; }
    .timeline:before            { left: 10px; top: 20px; height: calc(100% - 150px); width: 15px; border: solid 5px #0054AE; }
    
    .timeline > div,
    .timeline > div:nth-child(2n), .timeline > div:nth-child(4n), .timeline > div:nth-child(4n - 1),
    .timeline > div.featured, .timeline > div.featured:nth-child(2n), .timeline > div.featured:nth-child(4n), .timeline > div.featured:nth-child(4n-1),
    .timeline > div.small, .timeline > div.small:nth-child(2n), .timeline > div.small:nth-child(4n), .timeline > div.small:nth-child(4n-1)
                                { opacity: 1; width: calc(100% - 55px); min-height: 60px; padding: 20px 20px 20px 0px; margin: 0px 0 40px 55px; box-sizing: border-box;
                                  float: left; text-align: left; }
                                  
    .timeline > div:before,
    .timeline > div:nth-child(2n):before, .timeline > div:nth-child(4n):before, .timeline > div:nth-child(4n-1):before,
    .timeline > div.featured:before, .timeline > div.featured:nth-child(2n):before, .timeline > div.featured:nth-child(4n-1)::before, .timeline > div.featured:nth-child(4n)::before,
    .timeline > div.small:before, .timeline > div.small:nth-child(2n):before, .timeline > div.small:nth-child(4n):before, .timeline > div.small:nth-child(4n-1):before
                                { width: 34px; left: -34px; right: auto; top: 30px;
                                  background: url(https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/history/timline-glowing-edge.png) no-repeat -300px 0; }
    
    .timeline > div span.timelineYear,
    .timeline > div:nth-child(2n) span.timelineYear
                                { margin: 0; right: auto; left: -45px; top: auto; bottom: 0; width: 25px; font-size: 10px; }
    
    .timeline > div img,
    .timeline > div:nth-child(2n) img, .timeline > div:nth-child(4n) img, .timeline > div:nth-child(4n - 1) img,
    .timeline > div.featured img, .timeline > div.featured:nth-child(2n) img, .timeline > div.featured:nth-child(4n) img, .timeline > div.featured:nth-child(4n-1) img
                                { width: 100px; height: 100px; position: relative; float: left; top: 0px; left: 0px; right: auto; margin: -20px 10px 0 0;
                                  border: 5px solid #0054ae; }
    
    .timeline > div.beginning div { border-radius: 0; padding: 0; width: auto; }
    
    .today                      { margin: 0; width: 50px; height: 50px; border: solid 1px #08F; line-height: 50px; font-size: 14px; margin-left: 10px; }
    
    .vt_greenBarCTA             { margin-top: -21px; text-align: center; }
    .vt_greenBarCTA img         { max-width: 100%; width: auto; height: 100px; padding-top: 20px; }
    .vt_greenBarCTA .learnMore  { position: relative; top: 0; left: 0; width: auto; clear: both; display: inline-block; padding: 0 10px;  }
    .vt_greenBarCTA span        { clear: both; display: inline-block; }
    
    .vt_greenBarCTA.deck img    { position: relative; left: 0; top: 0; }
    
    .CTA-header                 { position: fixed; top: 0; bottom: auto; left: calc(50% - 100px); width: 215px; }
    
   .pinSlider .items            { height: 340px; }
    
    .window h2                  { margin: 0; }
    .window .creditCardInfo input[type="button"] { position: relative; }
    .window ul.info li          { height: auto; }
    .window .priceInfo ul.info  { font-size: 16px; }
    .window input[type="button"]{ width: 100%; }
    
    .pricing                    { margin: 320px 0 0 0; }
    .pricing > div              { display: block; width: 90%; padding: 30% 10px 10px 10px; margin: 0 5% 10px 5%; box-sizing: border-box;
                                  position: relative; float: left; clear: both; }
    .pricing > div:first-child  { left: 00%; width: 90%; }
    .pricing > div:nth-child(2) { left: 0; }
    .pricing .product-box       { width: auto; }
   .pricing2 .toggles           { top: -70px; }
    .pricing .off,
    .pricing .vip .off,
    .pricing .poolStudio .off, .pricing .vizTerra .off { margin: 0; padding: 0 0 30% 0; top: 0; }
    .pricing .vip .off          { top: 20px; }
    
    .pricing .vizTerra          { border-bottom: 1px solid #dfe6eb; }
    
    .question h2                { font-size: 30px; }
    
    
    .videoHeader .content h1    { font-size: 30px; line-height: 40px; padding-top: 40px; }
    .videoHeader .content h1 span { font-size: 24px; line-height: 30px; }
    
    .videoHeader .content .learnMore { top: calc(20% - -80px); }
    
    a.scrollNext                { width: 50px; height: 50px; line-height: 50px; font-size: 30px; left: calc(50% - 25px); }
    .videoHeader .videoBG       { display: none; }
    
    .top50 p                    { width: 100%; }
    
    
    
    .pageHeader.comparison      { position: relative; height: 200px; }
    .pageHeader.comparison h1   { bottom: auto; }
    .compareTableHeader         { padding: 0; margin-bottom: 20px; height: 155px; }
    .compareTableHeader_2018    { padding: 0; margin-bottom: 20px; height: 140px; }
    .compareTableHeader_2018 > div.vip3D { height: 160px; padding-top: 20px; }
    .compareTableHeader > div, 
    .compareTableHeader > div:first-child { width: 33%; padding: 5px; font-size: 12px; line-height: 16px; height: 110px; }
    .compareTableHeader_2018 > div, 
    .compareTableHeader_2018 > div:first-child { width: 33%; padding: 5px; font-size: 12px; line-height: 16px; height: 110px; }
    .compareTableHeader > div.compareToggle { font-size: 12px; text-align: center; }
    .compareTableHeader_2018 > div.compareToggle { font-size: 12px; text-align: right; }
    .compareTableHeader > div img, .compareTableHeader > div.vip3D img { margin: 10px 0; }
    .compareTableHeader_2018 > div img { margin: 15px 0 10px 0; max-width: 60%; }
    .compareToggle > div.knob   { width: 32px; height: 16px; border-radius: 8px; }
    .compareToggle > div.knob:after { width: 14px; height: 14px; left: 1px; top: 1px; }
    .compareToggle.active > div.knob::after { left: 17px; }
    .comparisonChart > div      { padding: 0; }
    .comparisonChart.collapse   { max-height: 32px; }
    .comparisonChart > div.header { font-size: 20px; padding: 0 0 0 5px; }
    .comparisonChart > div.header:before { height: 32px; line-height: 32px; }
    .comparisonChart > div > div{ padding: 2px 5px; width: 33.333333%; font-size: 12px; line-height: 16px; }
   .comparisonChart.trainingClasses.flex > div > div { width: 50%; }
    .comparisonChart > div > div:first-child { width: 100%; text-align: center; font-weight: 700; }
    .comparisonChart > div > div:nth-child(2) { border: none; }
    
    .comparisonChart > div > div.check, .comparisonChart > div > div.noCheck { height: 40px;  }
    
    .supportHeader h2 { text-align: center !important; font-size: 40px !important; line-height: 40px !important; }
    .supportHeader p  { text-align: center !important; width: 100% !important; }
    .systemRequirements .learnMore { margin-left: 0 !important; } 
   
   .video-section .accordian .accordionButton .video-description { display: none; }
   .video-item > a, .video-item.accordionButton span:first-child { width: 100% !important; }
   .video-item > a { white-space: normal; padding-right: 0 !important; }
   
   .training-tabs li { padding: 10px; }
   
    .faq
        { position: relative; }
        
    .faq h3
        { width: 100%; padding: 0; box-sizing: border-box;
          float: left; clear: both; padding-top: 20px; margin-top: 20px; margin-left: 0;
          font-family: "Fira Sans", sans-serif; font-size: 20px; font-weight: 400; line-height: 30px; text-align: left; }
    
    .faq p
        { display: block; width: 100%; box-sizing: border-box; float: left; padding-top: 0; margin-top: 20px; border-top: none; margin-left: 0; }
    
    .offsetTop { padding-top: 0; }
    
    .roiCTApricing
        { height: 100px; margin: 20px 0; box-sizing: border-box; background-size: auto 100%; background-position: top right; text-align: left; }
    .roiCTApricing p
        { font-size: 12px; line-height: 16px; padding: 20px 5%; margin: 0; }
    .roiCTApricing p strong
        { font-size: 18px; margin: 10px auto 0 auto; }
    .roiCTApricing p strong:after
        { font-size: 10px; }
    
    .tip360 { display: none; }
    
    .whatsNew { margin-top: 20px; }
    .whatsNew > div:nth-child(3n) { margin-top: 0; }
    .whatsNew > div.mainFeature, .whatsNew > div
        { width: 100%; height:300px; margin: 0 0 10px 0; float: none; }
    .whatsNew > div h3
        { font-size: 20px; margin: 0; }
    .whatsNew p
        { padding: 10px 100px 10px 10px; }
    .whatsNew a.learnMore
        { width: auto; padding: 0px 10px; line-height: 40px; }
        
    .mobileMarginFix-t { margin-top: 0px !important; }
    
    .videoHeader.YARDHeader {
        height: auto; min-height: 900px;
    }
    .videoHeader.YARDHeader .headerContentWrapper { position: relative; height: auto; }
    
    .YARDFlex { display: block; }
    .YARDFlex .oneThird { padding-right: 0px; }
    .flex-container .flex-item { text-align: center; } 
    .yard-partners {
        justify-content: center;
        align-items: center;
    }
    .yard-partners span {
        margin-top: 20px;
    }
    
    .YARDpeek { min-height: 350px; height: auto; }
    
    blockquote.noBox, .dark blockquote.noBox  { font-size: 24px; line-height: 30px; }
    blockquote.noBox em, .dark blockquote.noBox em { font-size: 14px; line-height: 18px; }
 
   .mainMenu .site-search { display: none; }
   
   .free-trial-imgs {	max-width: 300px;	padding: 30px;}
   
}

@media (max-width: 1000px) {
  .pageHeader.pricingHeader h1 {
    top: -10px !important;
  }
  
  .pricing2 > div {
    width: 100% !important;
  }
  .pricing2 > div.poolStudio {
    border-top: 1px solid rgba(25,54,78,0.2);
  }
  .pricing2 > div.vip {
    position: relative !important;
    width: 100% !important;
    top: 0 !important;
  }
  .yearlyBubble { 
    top: 0 !important;
    left: 0 !important;
    border-radius: 0 !important;
    position: relative !important;
    text-align: center !important;
    padding: 10px 60px !important;
  }
  .monthlyBubble { 
    top: 0 !important;
    left: 0 !important;
    border-radius: 0 !important;
    position: relative !important;
    text-align: center !important;
    padding: 10px 60px !important;
  }
  
  .pricing2 { margin-top: 340px !important; }
  .pricing2 .big-number { top: -260px !important; }
  
  .pricing2 > div h2 span.st-big-numbers {
    font-size: 70px;
  }
  
  .pricing2 > div h2 span.st-small-text {
    top: 20px;
    font-size: 18px;
  }
  
  .special-price--image {	position: relative;	display: block;	width: 100%;	margin: 10px auto;	max-width: 200px;	top: 0;	right: 0;}
  .vip.fadeOut .priceBox .yearly h2, .vip.fadeOut .priceBox .yearly p {/*	padding-right: 0 !important;	width: 100%;*/}
  
}

@media (max-width: 950px) {
    .landingPageHero .productContainer img { width: auto; height: 30px; }
    .landingPageHero .productContainer p { font-size: 14px; line-height: 16px; }
}

@media (max-width: 860px) {
    .testimonial-grid { grid-template-columns: 1fr; }
    .vip3d_hh .vipHeaderCTA { background: none; width: 450px; }
}

@media (max-width: 850px) {
    .landingPageHero:before { background-position: left bottom; }
}

@media (max-width: 800px) {
    .vip3d_hh .vipHeaderCTA:before { display: none; }
    .vip3d_hh .vipHeaderCTA .vipHeaderButtons { left: 10px; right: 20px; }
    .vip3d_hh .vipHeaderCTA { width: 300px; }

    .compareTableHeader_2018 .vip3D > a { font-size: 12px; }
    .compareTableHeader_2018 > div { border: 0; }

    .landingPageContent         { padding: 20px !important; }
    .landingPageHero { padding: 100px 40px 40px 40px !important; } 
    .landingTestimonials { display: block !important; }
    .landingTestimonials .testimonialContainer { flex: none; margin-right: 0 !important; margin-left: 0 !important; }
    .landingPageHero h1 { font-size: 42px !important; line-height: 46px !important; padding-bottom: 20px !important; }

    .landingPageHero .right { display: block !important; }
    .landingPageHero .productContainer { width: 100%; }
  
/*     .VizTerraCTA h3             { font-size: 18px; line-height: 24px; } */
    .VizTerraCTA { height: auto; }
    .VizTerraCTA .left { width: 100%; height: 100%; }
    .VizTerraCTA .right { display: none; }
  
  .accordionButton { line-height: 30px; padding: 20px 0; }
  .accordionContent p { padding: 0; }
  .video-item.accordionButton { line-height: 25px; padding-right: 20px; }
  .training-classes-list .accordionButton { padding: 0 20px 0 40px !important; font-size: 16px;   white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .training-classes-list .accordionButton a { margin: 0 !important; }
}

@media (max-width: 768px) {
  .comparisonHeader .comparisonChart > div > div:first-child {
     display: none;
  }
  
  .comparisonChart > div > div:first-child {
    justify-content: center !important;
    text-align: center !important;
    flex: 1 100%;
    background-color: #fff;
    border-top: 1px solid #e4eaee;
  }
  
  .comparisonChart > div {
    flex-flow: row wrap;
    padding: 0;
  }
  
  .comparisonHeader .comparisonChart > div {
    padding: 0;
  }
  
  .comparisonHeader .compareToggle {
    text-align: center;
  }
  
  .comparisonHeader img {
    margin: -5px 0 !important;
  }
  
  .compareDiff .comparisonChart > div.diff {
    padding: 0 !important;
  }
  
   .training-class-modal .floatRight { float: none; }
   .training-class-modal .floatRight img { max-width: 100% !important; width: 100%; margin: 0 0 10px 0 !important; padding: 0; text-align: center; } 
 
  
}


@media (max-width:767px){
.pricing2 > div h2 span.st-big-numbers {	font-size: 60px;} 
.free-trial-imgs {max-width: 300px;	padding: 10px;	margin: 0 auto 10px}
.landingPageHeader .free-trial-imgs img {	max-height: 25px;	width: auto;	height: auto;	margin: 6px auto !important;	display: block;}
.landingPage.formBox ul.hs-error-msgs li {	background: #F00;	color: #FFF;	font-size: 11px;	line-height: 13px;	box-sizing: border-box;	padding: 3px 10px;	border-radius: 5px;	margin: 5px 0;}
.landingPage.formBox h3 {margin: 10px 0;}
.landingPage.formBox .hs-form-field > label {font-size: 11px;	line-height: 14px;	display: block;	margin: 1px 0;}
.landingPage.formBox textarea, .landingPage.formBox input, .landingPage.formBox form.hs-form input[type="text"], .landingPage.formBox form.hs-form input[type="email"], .landingPage.formBox form.hs-form input[type="tel"], .landingPage.formBox form.hs-form select, .landingPage.formBox form.hs-form textarea, .landingPage.formBox form.hs-form .email-correction, .landingPage.formBox form.hs-form .email-validation {	height: 26px;line-height: 26px;font-size: 12px;}
.landingPage.formBox .form-columns-2 .hs-form-field {	width: 50% !important;	float: left !important;}
  .landingPage.formBox .form-columns-2 .hs-form-field .hs-input{width:100% !important;}
}

@media (max-width: 600px) {
  .CTA-header { display: none; }
  .vip3dSpecialOffer h2 { font-size: 36px; line-height: 36px; }
  .training-class-modal .event-title {
     line-height: 30px;
  }
  
}

@media (max-width: 550px) {
    .compareTableHeader_2018 > div.vip3D { height: 90px; padding-top: 10px; }
    .compareTableHeader_2018 > div.pool-studio { position: relative; top: 5px; }
    .compareTableHeader_2018 > div > span { display: none; }
    .compareTableHeader_2018 > div > img { max-width: 80%; }
    .compareTableHeader_2018 > div.compareToggle { display: none; }
    .compareTableHeader_2018 { height: 60px; }
    .compareTableHeader_2018 .vip3D > a { line-height: 14px; padding-top: 6px; padding-right: 40px; }
    .compareTableHeader_2018 .vip3D > a:after { top: 14px; }
}

@media (max-width: 525px) {
    .landingPageHero h1 { font-size: 32px !important; line-height: 36px !important; }
}

 @media (max-width: 480px) {
    .landingPageContent form input { width: 100% !important; }
   .hs-menu-wrapper.hs-menu-flow-horizontal > ul {
        margin-top: 20px;
    }
}

/* @media (max-width: 450px) {
    .landingPageHero h1 { font-size: 26px !important; line-height: 32px !important; }
} */

/**************** Client Logo Styles ****************
@media (max-width: 1080px)  {
    .span12.clients > .cell-wrapper         { position: relative; }
    .span12.clients .span2                  { height: 100px; float: left; width: 14%; }
}

@media (max-width: 480px) {
    .span12.clients .span2 {
        width: 100px;
    }
}*/




/* Support Site */

/**************** Software Select Header, etc ********************/
.software_home								{ width: 100%; height: 300px; position: relative; margin: 0 0 40px 0; z-index: 1000;
    border: solid 1px #EFF3F5; border-radius: 5px;
    box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25);
    background: url('images/software_home_bg.jpg') no-repeat center center; background-size: cover; }
.software_home p							{ display: block; width: 310px; height: auto;
    position: absolute; top: 20px; left: 0;
    text-align: center; color: #EFF3F5; font-family: 'Share'; font-size: 30px; font-weight: 700; text-shadow: 0px 1px 4px #000; }
.packages									{ width: 310px; position: absolute; left: 0px; top: 0px; height: 100%; z-index: 100;
    background: #00192d; background: rgba(0,25,45,0.8); border-radius: 5px 0 0 5px; }
.packages > a								{ width: 100px; height: 120px; cursor: pointer;
    position: absolute; bottom: 82px; left: 20px; overflow: hidden; z-index: 100;
    text-indent: -2000em;
    background: url('images/poolstudio_package_small.png') no-repeat left top;
    opacity: 1; transition: all 0.3s ease-in-out; }
.packages > a.vizTerraToggle				{ left: 100px; background: url('images/vizterra_package_small.png'); z-index: 110; }
.packages > a.vipToggle						{ left: 180px; background: url('images/vip_package_small.png'); }

.packages > a.selected						{ opacity: 1; bottom: 100px; z-index: 200; }

.softwareDropdown							{ width: 290px; height: 55px; cursor: pointer;
    position: absolute; left: 10px; bottom: 10px; z-index: 200;
    background: #EFF3F5; border-radius: 5px; }
.softwareDropdown:after						{ display: block; width: 30px; height: 30px;
    content: 'v'; font-family: 'ss-icons'; font-size: 20px; line-height: 30px;
    position: absolute; top: 13px; right: 5px; }
.softwareDropdown > div						{ position: absolute; top: 10px; left: 10px; }

.softwareDropdown > div.options				{ top: 55px; left: 0; width: 100%; height: 0px; box-sizing: border-box; overflow: hidden;
    background: #EFF3F5; border-radius: 5px; box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25);
    opacity: 0; transition: all 0.3s ease-in-out; }
.softwareDropdown > div.options.active		{ top: 55px; height: 185px; opacity: 1; }


div.options > a								{ padding: 10px; }

.isPS .softwareDropdown .poolStudioLogo		{ opacity: 1; }
.isVT .softwareDropdown .vizTerraLogo		{ opacity: 1; }
.isVip .softwareDropdown .vipLogo			{ opacity: 1; }


select										{ background: #FFF; border: solid 1px #94c3d9; height: 40px; padding: 0 10px;
    color: #5a93c5; line-height: 40px; border-radius: 10px; box-sizing: border-box; }

#software_toggle select						{ height: 30px; font-size: 11px; line-height: 30px; width: calc(100% - 20px); margin-left: 10px; padding: 0 4px; border-radius: 3px; }

.versionToggle								{ position: absolute; top: 0; right: 0; z-index: 1000; font-size: 14px; cursor: pointer; }
.versionToggle:hover						{ color: #08F; }

/**************** Footer ********************/

#pageFooter									{ width: 90%; max-width: 1240px; margin: 50px auto 100px auto; padding: 20px 0;
    border-top: solid 1px #b9d4e2; clear: both; position: relative; }
#pageFooter, #pageFooter p					{ font-size: 14px; line-height: 18px; color: #5A93C5; font-weight: 300; }

#pageFooter p								{ margin: 0; }

#pageFooter ul								{ display: block; width: 140px; margin: 0 20px 0 0; padding: 0;
    position: relative; float: left; 
    list-style-type: none; }
#pageFooter a								{ color: #5A93C5; font-weight: 300; }
#pageFooter a:hover							{ color: #0054ae; }

.officeInfo									{ float: right; width: auto; }

footer hr									{ height: 45px; }
footer hr::before 							{ content: ""; height: 1px; width: 100%;
    position: absolute; top: 22px; left: 0;
    background: #b9d4e2 none repeat scroll 0 0;  }

a.backToTop									{ display: block; width: auto; height: 50px; padding: 0 20px;
    position: fixed;left: 50px; bottom: -60px; z-index: 2000;
    color: #EFF3F5; font-size: 16px; line-height: 50px;
    background: #08F; border-radius: 5px;
    box-shadow: 0px 5px 15px rgba(0, 25, 45, 0.25);
    opacity: 0; transition: all 0.3s ease-in-out; }
body.scrollToTop a.backToTop				{ bottom: 10px; opacity: 1; }


#pageFooter a.adminLogin					{ position: absolute; right: 0; bottom: 0; width: auto; height: 20px; padding: 0 20px;
    color: #EFF3F5; font-size: 10px; line-height: 20px;
    background: #5A93C5; border-radius: 5px; }

/**************** Header Support Home ********************/
.header_supportHome							{ width: 100%; min-height: 350px; background: #0054ae; box-sizing: border-box;
    border: solid 1px #EFF3F5; box-shadow: 0 5px 20px rgba(0, 25, 45, 0.25); }

.header_supportHome > div					{ width: 50%; height: 100%; float: left; display: block;
    position: relative; overflow: hidden;
    color: #EFF3F5; text-align: center; }

.header_supportHome .main-text				{ display: block; width: 100%; height: 100%; padding: 30px; box-sizing: border-box;
    position: absolute; top: 0; left: 0; z-index: 10;
    font-size: 14px; line-height: 18px; text-align: center; }
.header_supportHome .main-text strong		{ display: block; width: 100%; padding: 0 0 20px 0;
    font-family: 'Share'; font-size: 40px; line-height: 40px; text-shadow: 0px 2px 4px rgba(21, 55, 89, 0.8); }

.header_supportHome a.image					{ display: block; width: 104%; height: 104%; margin: 0;
    position: absolute; top: -2%; left: -2%; z-index: 0;
    text-indent: -2000em; overflow: hidden;
    background: url("images/header_bg_03.jpg") no-repeat center center; background-size: cover; background-position: left top;
    opacity: 1; transition: all 0.5s ease-in-out; }
.header_supportHome a.image.training		{ background-image: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/Support/header_bg_02.jpg"); background-position: center top; }
.header_supportHome a.image.help			{ background-image: url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/Support/header_bg_01.jpg"); background-position: right top; }

.header_supportHome > div:hover a.image		{  }

.header_supportHome a						{ margin: 10px 5px 0 5px; }  

.header_supportHome .left {
    text-align: left;
    box-sizing: border-box;
    padding-left: 40px;
    vertical-align: middle;
    padding-top: 40px;
}

.header_supportHome h2 {
    color: #fff;
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
    text-align: left;
}

.header-supportHome p {
    margin-top: 0;
}




/**************** Softare Download and New PC Boxes ********************/

.softwareDownload,
.newPC										{ display: block; height: 260px; width: calc(50% - 10px); float: left; padding: 20px; box-sizing: border-box; margin: 0 10px 0 0;
    color: #EFF3F5;
    border: solid 1px #EFF3F5; box-shadow: 0 5px 20px rgba(0, 25, 45, 0.25);
    background: #0054ae url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/Support/software_download_bg.jpg') no-repeat center center; }

.newPC										{ margin: 0 0 0 10px; background-image: url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/Support/new_pc_bg.jpg'); }

.softwareDownload h3,
.newPC h3									{ color: #EFF3F5; text-shadow: 0px 2px 4px rgba(21, 55, 89, 0.8); }

.softwareDownload img,
.newPC img									{ display: none; }

/**************** Calendar CTA ********************/

.calendarCTA								{ width: 100%; min-height: 350px; padding: 30px; box-sizing: border-box;
    position: relative;
    color: #EFF3F5;
    border: solid 1px #EFF3F5; box-shadow: 0 5px 20px rgba(0, 25, 45, 0.25);
    background: #0054ae url("https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/Support/header_calendar.jpg") no-repeat right center; background-size: cover; }

.calendarCTA .left							{ width: 60%; padding: 0 30px 0 0; box-sizing: border-box;
    float: left; }
.calendarCTA .right							{ position: absolute; right: 0; width: 40%; top: 0; margin: 0; background-color: rgba(255,255,255,0.9); box-sizing: border-box; padding: 50px; height: 100%;  color: #153759;}
    
.calendarCTA h1								{ color: #EFF3F5; font-size: 40px; line-height: 48px; text-align: left;
    border: none; }

.calendarCTA a:not(.learnMore)							{ color: #0088ff; }

.calendarCTA a.btn_green					{ margin: 20px 0 0 0; }

/**************** System Requirements ********************/
.systemRequirements             			{ box-sizing: border-box; padding: 40px; min-height: 320px;
    background: #00192d url('https://429741.fs1.hubspotusercontent-na1.net/hubfs/429741/00_images_ss2015/tech_specs/requirements.jpg') no-repeat top right; background-size: cover; border: solid 1px #eff3f5;
    box-shadow: 0px 5px 20px rgba(0, 25, 45, 0.25); }
.dark .systemRequirements     				{ border-color: #08F; box-shadow: 0px 5px 20px #000; }
.systemRequirements h3        			  	{ padding-left: 110px; margin: 0; }
.systemRequirements p           			{ font-size: 16px; line-height: 24px; margin-top: 10px; }
.systemRequirements p span      			{ display: block; width: 110px; padding-right: 20px; box-sizing: border-box; color: #0088ff; text-align: right; float: left; clear: left; }


/**************** Forum Styles ********************/

nav#nav-single								{ display: none; }


/**************** Mobile Styles ********************/
@media (max-width: 1080px) {

body									{ font-size: 16px; }

#wpadminbar								{ top: auto; bottom: 0; position: fixed; }

body.admin-bar header#branding 			{ margin-top: 0px; }
body.admin-bar .subHeaderWrapper		{ margin-top: 0px; }

.headerContainer						{ width: 100%; padding: 0; box-sizing: border-box; } 	
.headerContainer .logo					{ left: 10px; }

.subHeaderWrapper						{ z-index: 4000; }
.top .subHeaderWrapper					{ position: absolute; top: 30px; }

.subHeader								{ width: 100%; position: relative; padding: 0 110px 0 60px; box-sizing: border-box; }

a.helpLogo								{ display: block; position: relative; width: 100%; height: 50px; box-sizing: border-box;  }
.helpLogo .logo							{ left: 0; }
.subHeader .helpLogo span				{ height: 20px; position: absolute; bottom: 0; left: 60px;
    font-size: 10px; line-height: 20px; }

.menuButton								{ display: block; width: 50px; height: 50px; padding: 0;
    position: absolute; top: 0; left: 0px; z-index: 999;
    font-family: 'ss-icons'; font-size: 30px; line-height: 50px;
    background: #08F; color: #EFF3F5; text-align: center;
    transition: all 0.3s ease-in-out; cursor: pointer; }

.menuButton:hover						{ color: #FFF; background: #36bfff; }

.siteSearch								{ position: absolute; top: 0; right: 50px; }
#searchform								{ right: -50px; }
#searchform input#s, #searchform input#s:focus { width: 250px; }


.user									{ position: absolute; top: 0; right: 0; }

.breadcrumb								{ display: none;}

#container								{ width: 100%; padding: 50px 0 0 0; box-sizing: border-box;
    position: relative; left: 0; z-index: 1;
    transition: left 0.3s ease-in-out; }

.mainMenu #container					{ left: 120%; }

#pageFooter								{ position: relative; left: 0; z-index: 1;
    transition: left 0.3s ease-in-out; }
.mainMenu #pageFooter					{ left: 120%; }



nav#access								{ position: relative; width: 100%; box-sizing: border-box; padding-top: 40px;
     top: 0px; left: 0; z-index: 3000;
     border: none; box-shadow: none;
     transition: left 0.3s ease-in-out; }
.mainMenu nav#access					{ left: 0; height: calc(100% - 100px); overflow: scroll; }
.top nav#access							{  }

#access h3								{ border-radius: 0; }

.sideNavHeader							{ display: block; cursor: pointer; }
.sideNavHeader:after					{ content: "+"; font-weight: 400; font-size: 40px; 
     position: absolute; right: 20px; }

.pageNavExpand .sideNavHeader:after		{ content: '-'; }



#pageNav								{ max-height: 0px; overflow: hidden; transition: all 0.3s ease-in-out; }
.pageNavExpand #pageNav					{ max-height: 4000px; }

#software_toggle						{ display: none; }

.header_supportHome						{ height: auto; }
.header_supportHome > div				{ width: 100%; height: 500px; }			

.softwareDownload, .newPC				{ width: 100%; margin: 0 0 20px 0; }

.header_supportHome a,
.featureWide a							{ font-size: 14px;  }

#primary								{ padding: 20px; }


header.entry-header						{ padding: 20px; margin: 0 0 20px 0; }
header.entry-header h1					{ font-size: 30px; line-height: 30px; }

h1, h2, h3, h4							{ clear: both; }
h2										{ font-size: 24px; line-height: 24px; padding: 0 0 5px 0; }
h3										{ font-size: 20px; line-height: 20px; }
p										{ font-size: 16px; line-height: 20px; margin: 20px 0 0 0; }

hr										{ height: 21px; }
hr:before								{ top: 11px; }

#pageFooter ul        					{ width: 100%; margin: 0 0 20px 0; }
.officeInfo                 			{ float: left; width: 100%; }

ul.navMenu								{ width: 100%; background: none; left: -120%; transition: all 0.3s ease-in-out; top: 641px; position: absolute; }
.subHeader ul.navMenu					{ top: 50px; position: absolute; }
.mainMenu ul.navMenu					{ left: 0; }
ul.navMenu li,
.subHeader ul.navMenu li				{ width: 100%; border-bottom: solid 1px #c1c9cf; height: auto; background: none; }
ul.navMenu li a							{ width: 100%; background: none; padding: 0;
     color: #31536e; font-size: 18px; height: 50px; line-height: 50px; text-indent: 20px; }
ul.navMenu li ul,
.subHeader ul.navMenu li ul				{ max-height: 3000px; width: 100%; opacity: 1; position: relative; top: 0; background: none; }

ul.navMenu li ul li,
.subHeader ul.navMenu li ul li			{ border-bottom: none; border-top: solid 1px #c1c9cf; height: 50px; }
ul.navMenu li ul li a,
.subHeader ul.navMenu li ul li a		{ text-indent: 40px; height: 50px; line-height: 50px; }

ul.navMenu li:hover a,
ul.navMenu li ul li a:hover,
.subHeader ul.navMenu li:hover ul li a:hover { color: #08F; background: #EFF3F5; }

ul.navMenu li:hover ul					{ padding: 0; box-shadow: none; background: none; }
ul.navMenu li:last-child ul li			{ text-align: left; }

.systemRequirements         			{ padding: 20px; background: #00192d; }
.systemRequirements h3      			{ padding-left: 0; font-size: 20px; line-height: 24px; }
.systemRequirements p       			{ margin: 0; font-size: 14px; }
.systemRequirements p span  			{ width: 100%; text-align: left; margin-top: 10px; }

.pageHeader.training					{ height: auto; }
.pageHeader.training:after				{ content: ""; display: table; clear: both; }
.pageHeader.training > div				{ width: 100%; }

.pageHeader								{ height: auto; background-size: auto 100%; background-position: left top; }
.pageHeader h2							{ font-size: 24px; line-height: 24px; }
.pageHeader p							{ }

.tabbed-box ul.tabs						{ height: 50px !important; }
.tabbed-box .tabs li					{ height: 50px !important; width: 50% !important; }
.tabbed-box .tabs li a					{ height: 50px !important; width: 100% !important; background-size: auto 60%; margin: 0 0 10px 0; }
.tabbed-box .tabs li a.active::after	{ opacity: 0 !important; border-top: 0 solid #eff3f5; }

.versionToggle							{ top: -30px; }

  .pageHeader, .row-fluid .pageHeader[class*="span"] { padding: 70px 0 450px 0; }
  .pageHeader.pricingHeader h1 { top: -40px; }
  .pricing2 .big-number { top: -240px; }
  .pricing2 .big-number h2 { font-size: 28px; line-height: 28px; }
  .pricing2 { margin: 540px 0 0px 0; }
}


/* For  Marketing Updates */

/* .header-container-wrapper { display: none;} */
/* .showNavigation .header-container-wrapper { display: block;}

.marketingCampaign .header-container > div:nth-child(1) { display: none;}
.marketingCampaign .subNavMenu { top: 0;}
.marketingCampaign .header-container-wrapper{height:0;} */