@charset "UTF-8";
/* Web Solutions 4.0 Compatible */

/* text */
h1 {font-size: 1.5em;}

h2, .content * h1 {font-size:1.625em;}
h3, .content * h2 {font-size:1.25em;}
h4, th {font-size:1.125em;}


/* Header ------------------------------ */
body>header {
  background-color: var(--cloud-white);
}

#brand {
  display: block;
  margin-inline: auto;
  text-align: center;
  padding: .75em 0;
  width: 12em;
}

#brand img {
  height: auto;
  width: 100%;
}

/* NAV ------------------------------ */
body>header:before{content: "";opacity: 0; z-index: 3;background-color: #fff;display: block;position: fixed;left:100vw;top:0;width:100vw;height:100vh;-webkit-transition:left 0ms ease 200ms, opacity 200ms ease;transition:left 0ms ease 200ms, opacity 200ms ease}
body.slideNav>header:before{left:0;opacity: .75;-webkit-transition:left 0ms ease 0ms, opacity 200ms ease;transition:left 0ms ease 0ms, opacity 200ms ease}
#navContainer{position: fixed;left: 100%;top:0;bottom:0;width: 75%;background-color:var(--storm-grey); overflow: auto; -webkit-transition: left 200ms ease;transition: left 200ms ease; z-index: 2147483640;}
.slideNav #navContainer{left: 25%;}
#navContainer nav{display: flex;flex-direction: column-reverse;}
#navContainer ul{display: block; width: 100%;margin: 0;padding-left: 0}
#navContainer li{display:block; border-top:1px solid rgba(255,255,255,0.125); width: 100%; position: relative}
#navContainer li li {border: 0;}
#navContainer a, #navContainer .menu{color:#fff;line-height:2em;padding: .25em 1rem;display:block;width: 100%}
#navContainer a>span {color: #CCC;}
#navContainer ul.account-links {margin: 0 0 .5rem}
#navContainer ul.account-links img {position: relative; top: .125rem}
#navContainer li.on a{background-color:none; color: #fff}
#navContainer li.open{background-color: rgba(255,255,255,0.125)}

#navContainer li>span{color: var(--indigo); background-color:rgba(255,255,255,0.5); border-radius: 50%; display: block; position: absolute; right: .35em; top: .25em; line-height: 1.5em; width:1.5em; height: 1.5em;}
#navContainer li>span:after{content: ""; -webkit-transform: translate(50%, -50%) rotate(90deg); transform: translate(50%, -50%) rotate(90deg); position: absolute; right: 50%; top: 50%; -webkit-transition-duration: .25s; transition-duration: .25s; width: 0.81rem; height: 3px; display: block; background: var(--storm-grey);}
#navContainer li.open>span:after{-webkit-transform: translate(50%, -50%) rotate(0deg);transform: translate(50%, -50%) rotate(0deg);}
#navContainer li>span:before{content: ""; position: absolute; right: 50%; top: 50%; -webkit-transform: translate(50%, -50%); transform: translate(50%, -50%); display: block; width: 0.81rem; height: 3px; background: var(--storm-grey); border-radius: 3px;}
#navContainer li.open>span{background:#fff;}
#navContainer li.open>span:before{opacity: 0}

#navContainer li.on>a, #navContainer li.open.on>a {background-color: rgba(255,255,255,.25);}
#navContainer ul ul {font-size:.8em; display: none}
#navContainer ul ul a {padding: 0.5rem 2rem 0.5rem 2rem; line-height: 1.35em;}
#navContainer ul .megamenu {display: none; overflow: auto; width: 100%}
#navContainer ul li.open ul {display: block; font-size: .9em; padding-bottom: 1em;}
#navContainer ul li.open ul ul {display:none; padding-bottom:0;}
#navContainer ul li.open ul ul li a {padding-left:4em;}

#ancillary #google_translate_element .goog-te-gadget-simple a {background-image: url(/images/icons/translate-ko.svg);}
#ancillary #google_translate_element .goog-te-gadget-simple a::before {color: #fff !important;}

#ancillary form {height:2.9375rem; width:100%; border-top:1px solid rgba(255,255,255,0.125); padding: 0 1em; position:relative; display: flex;flex-direction: row;flex-wrap: nowrap;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;-webkit-align-content: center;-ms-flex-line-pack: center;align-content: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
#ancillary form label {line-height:2.1875rem; color:#fff; margin-right:5px}
#ancillary form .search {top:auto; border-color:transparent; width:100%; height:2.1875rem; padding: 0 2.1875rem 0 0.5em}
#ancillary form .search:focus {background:#fff; border-color:#FF4818}
#ancillary form input[type="submit"] {border:0; position:absolute; right:1rem; height: 2.1875rem; padding:0; width:2.1875rem}

#ancillary #google_translate_element {
    display: block;
    width: 100%;
    border-top:1px solid rgba(255,255,255,0.125);
}

#mobilenav{background-color: var(--aqua-accessible);width: 100%;text-align: center;display: flex;}
#mobilenav a, #mobilenav span {color: var(--storm-grey); font-weight:700; line-height: 2.5em;-ms-flex-order: 0;-webkit-box-ordinal-group: 1;order: 0;-ms-flex: 1 1 auto;-webkit-box-flex: 1;flex: 1 1 auto;-webkit-align-self: auto;-ms-flex-item-align: auto;align-self: auto;}
#mobilenav *+* {border-left: 1px solid rgba(255,255,255,0.25)}
#mobilenav span.menu:after {background:url(/images/icons/misc/bars.svg) no-repeat 0 2px / 1em 1em; content: ''; display: inline-block; height: 1em; margin-left: .25em; width: 1em; filter: brightness(0); opacity: 0.7;}

/* cart popover*/
#ancillary li .cart-popover {pointer-events:none; opacity:0; z-index: 10; overflow: auto; position: fixed; width: calc(100% - 2em); max-height: calc(100% - 2em); top:50%; left: 50%; transform: translate(-50%, -50%); background: #fff; border-radius: 5px; transition: ease all 200ms;}
#ancillary li .cart-popover.on {pointer-events:all; opacity:1}
#ancillary li .cart-popover .products {padding: 1em}
#ancillary li .cart-popover .product {background: #fff; width:100%; border-radius: 5px; display: block; overflow: auto; position: relative; text-transform: none; line-height: 1.25em; padding: 1em 0}
#ancillary li .cart-popover .product .product-name {color: var(--indigo)}
#ancillary li .cart-popover .product .product-image {float: left; margin:0; width: 4.5rem; padding:0; transition: ease all 200ms}
#ancillary li .cart-popover .product .product-image img {max-width:100%; height: auto; top:auto; left:auto; transform:none}
#ancillary li .cart-popover .product .product-details {float: right; width: calc(100% - 6rem);}
#ancillary li .cart-popover .product .product-details > *:not(.product-name) {font-size: 0.875em; line-height:1.25em; color: #666}
#ancillary li .cart-popover .product .product-details > .product-name {font-size: 1em; line-height: 1em;  margin-bottom: 0.25em; font-weight: 800; text-transform: uppercase;}
#ancillary li .cart-popover .products p {text-align: center; font-weight: 300; color: var(--indigo)}
#ancillary li .cart-popover .cart-bottom {background: #ebf5fb; overflow:auto; border-radius: 0 0 5px 5px; text-align: center; padding: 1.5em 1em}
#ancillary li .cart-popover .cart-bottom .cart-total {margin: 0 auto 0.5rem; font-size: 1.125em; font-weight:400; color:var(--indigo);}
#ancillary li .cart-popover .cart-bottom .alerts {font-size: 0.75em; font-weight: 400; color: #e40000; line-height: 1.25em; margin-bottom: 1rem}
#ancillary li .cart-popover .cart-bottom .alerts .alert+.alert {margin-top: 0.5em}
#ancillary li .cart-popover .cart-bottom .alerts .alert.shipping {color: green;}
#ancillary li .cart-popover .cart-bottom .alerts .alert.no-items {font-size: 0.875rem; color: #467d9d;}
#ancillary li .cart-popover .cart-bottom .checkout {margin: 0 auto; overflow: auto}
#ancillary li .cart-popover .cart-bottom .checkout .button {color: var(--indigo);text-transform: none;margin:0;padding: .625em 1em;font-size: 1rem;}
#ancillary li .cart-popover .cart-bottom .continue-shopping {margin-top: 0.5em; clear: both}
#ancillary li .cart-popover .cart-bottom .continue-shopping button {background: none; border: 0; color:#FF4818}
#ancillary li .cart-popover-mask {opacity: 0; content: ""; pointer-events:none; transition: ease all 200ms; background: rgba(0,0,0,0.8); z-index: 9; display: block; width: 100vw; height: 100vh; position: fixed; top:0; left:0;}
#ancillary li .cart-popover.on + .cart-popover-mask {opacity: 1; pointer-events: all}

.hamburger{height: 2em;width: 2em;display: block;position: fixed;right: 3px;top:3px;z-index:2;opacity: 0;background: #fff; border: 2px solid var(--aqua-accessible);}
.hamburger:before {filter: brightness(0); background: url(/images/icons/misc/bars.svg) no-repeat 0 0 / 1.5em 1.5em; content: ''; top: 50%; right: 50%; -webkit-transform: translate(50%, -50%);transform: translate(50%, -50%); position: absolute; height: 1.5em; width: 1.5em;}
.hamburger.on{opacity: 1}

.videoContainer {width: 100%;height:0;line-height:0;position: relative;padding-top:56.25%; /* 16:9 */}
.videoContainer.ratio-4-3 {padding-top:75%; /* 4:3 full-frame */}
.videoContainer iframe {position:absolute;left:0;top:0;right:0;bottom:0;width:100%;height:100%;border:0}
.videos h3 {font-size: 1.25em;}

/* MAIN ------------------------------ */
.pageHeader {margin: 0 0 .5rem;padding-bottom: 20%;}
main>.wrap, body>footer{padding-left: 5%;padding-right: 5%;}

main.store-page,
main.certification-page,
main.webinars-page .breadcrumb {
  padding-top: 1.5em;
}

main.webinars-page #sidenav {
  content-visibility: hidden;
  display: none;
}


.flexible-callouts.hover-text ul li a .front h3 {display: none}
.flexible-callouts.hover-text ul li a .back {opacity: 1; top:0; left:0; width:100%; height: 100%; background:rgba(0, 25, 39, 0.8)}
.flexible-callouts.hover-text ul li a .back h3 {color:#fff}
.flexible-callouts.hover-text ul li a .back p {color:#ccc}
.twoCol, .threeCol, .resCol{}
#content .twoCol.flex > .login-to-account {
  border-right: 0;
  margin-bottom: 2em;
  border-bottom: 1px solid #ccc;
}
.formTable {width:100%; display: block}
.formTable tbody, #crmWebToEntityForm tbody{display: block}
.formTable tr {display: block}
.formTable td {display: block; width:100%; padding: 0}
.formTable input[type="text"], .formTable input[type="password"], .formTable input[type="tel"], .formTable input[type="number"], .formTable input[type="email"], .formTable input[type="url"], .formTable textarea{margin-bottom:1em}
.formTable table td + td {padding-left: 0 !important;}

/* Contact Form - table removed ----- */
.form-flex :where(.half, .third) {
	width: 100%;
}
.form-flex .quarter {
	width: calc(50% - .5em);
}

#crmWebToEntityForm {width: 100% !important;}
#crmWebToEntityForm table {width:100% !important; display: block}
#crmWebToEntityForm tbody{display: block}
#crmWebToEntityForm tr {display: block}
#crmWebToEntityForm td {display: block; font-size: 1rem !important; padding: 0; width:100% !important;}
#crmWebToEntityForm input[type="text"], #crmWebToEntityForm input[type="password"], #crmWebToEntityForm input[type="tel"], #crmWebToEntityForm input[type="number"], #crmWebToEntityForm input[type="email"], #crmWebToEntityForm input[type="url"], #crmWebToEntityForm textarea, #crmWebToEntityForm select {margin-bottom:1em; width: 100% !important;}

.photoright {margin:0 0 .75em 1em;}
.photoleft {margin:0 1em .75em 0;}

blockquote {margin: 2em 0; padding: 0 5%; text-align: center; width: 100%;}

.results li {float: left;}

.single-location {padding-top:1em}
.single-location .action-items {margin-bottom: 1.5rem;    display: flex;   flex-direction: row;   flex-wrap: nowrap; -webkit-justify-content: flex-start;  justify-content: flex-start;   align-content: stretch;}
.single-location .action-items .button {display: block; padding-left:0; padding-right:0; font-size: 0.75rem; margin-bottom: 0.25rem; text-align: center; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto;}
.single-location .tabbed-nav .tab-button { display: block; width:100%; padding-left:0; padding-right:0; font-size: 0.875rem; margin-bottom: 0.25rem; text-align: center;}


.styled-table th {display: none}
.styled-table td {display: block; width: 100%; text-align: right; padding: 0 1rem}
.styled-table td:before {content: attr(data-attribute); color: #666; font-size: 0.75em; float: left; font-style: italic; display: inline-block; font-style: italic}
.styled-table tr > td:first-child {padding-top: 1rem}
.styled-table tr > td:last-child {padding-bottom: 1rem}
.styled-table.borders tr:not(:last-child) > td:last-child {border-bottom: 1px dashed #ccc}

.gallery.flex {margin: 2em auto;   display: flex;    flex-direction: row;  flex-wrap: wrap;  -webkit-box-pack: start; justify-content: flex-start;  align-content: stretch;}
.gallery.flex > a {display: block; width:33%; padding: 5px}
.gallery.flex > a img {max-width: 100%; height: auto}

.landing #hero {padding: 2em 1em 7em}
.landing .careers #hero {padding: 3em 1em;}
.landing .champion #hero img {max-width: 15.63em; height: auto;}
.landing .delta #hero img {max-width: 12.06em}
.landing #hero h1{margin-bottom: 1em;}
.landing .delta #hero .button{width: 100%;margin-top: 1rem;margin-bottom: 0;}
.landing .champion #hero .line {margin: 2em auto}
.landing #boxes .text {padding: 2em 1em}
.landing #boxes .bottom {position: relative; border-bottom: 2px solid #fff;   display: flex;    flex-direction: row;  flex-wrap: nowrap;  -webkit-box-pack: start; justify-content: flex-start;  align-content: stretch;}
.landing #boxes .bottom .image {padding-bottom: 30%; -ms-flex: 1 1 auto; -webkit-box-flex: 1; flex: 1 1 auto;}
.landing #boxes .bottom .image+.image {border-left: 2px solid #fff}
.landing #boxes .bottom .image-3 {width: 25%}
.landing #boxes .bottom .image-4 {width: 25%}
.landing #boxes .bottom .image-5 {width: 25%}
.landing #boxes .bottom .image-6 {width: 25%}
.landing #initiatives {text-align: center; padding: 3em 1em 10em}
.landing #recycle-with-us .wrap h2,
.landing #boxes .text h2 {font-size: 2.06rem}
.landing #logos {padding: 2em 1em}
.landing #logos li+li {margin-top: 2em}
.landing #recycle-with-us {padding: 7em 1em 3em}
.landing #recycle-with-us .text {text-align: center; margin-bottom: 2em}
.landing #products {padding: 2em 1em; background: #DFEDF7}
.landing #products li+li {margin-top: 2em}
.landing #products ul li a {padding: 2em}
.landing #callouts a {border-bottom: 1px solid #DFEDF7}
.landing #callouts a span {width: 75%; font-size: 1.125em; font-weight:700; padding: 0; border-color: #FF4818; line-height: 3.38rem; text-align: center; color:#fff; background:none}

body.fullWidth #content.productPage {padding-top: 2em;}

.productPage .bottom #product-logos {text-align: center; float: none; margin: 2em auto;}
.productPage .bottom #product-logos img {margin: 0; }

.productPage .left {margin-bottom: 1em;}
.productPage .right .button {margin: 0 0 1em; width: 100%; justify-content: center;}

.content .logo-links li {background: none; text-align: center; margin: 0 0 1em; border: 1px solid #ccc; padding: 1em 2em; overflow: auto;}

.landing .careers #hero .line {margin: 1em auto}
.landing .careers #hero h1 {font-weight: 900; text-transform: uppercase; font-size: 2em; color: var(--indigo); text-align: center; line-height: 1em; margin: 0 auto}
.landing .careers #hero p {font-weight: 600; max-width: 30.500em; font-size: 1.125em;color: #062234;text-align: center;line-height: 1.409em; margin: 0 auto 2em}
.landing .careers #hero .anchor-links a {font-size: 1.125em; min-width: 10.333em}
.landing .careers .wrap.thin {max-width:56.25em}
.landing .careers .wrap.wide {max-width:80.31em}
.landing .submit-resume .wrap {text-align: center}
.landing .submit-resume .button {font-size: 1.125em; margin: 1em 0 0; white-space: nowrap}
.landing .submit-resume .button:hover {background: #005c91}
.landing .submit-resume p {font-size: 1.125em; line-height: 1.35em; margin: 0; width: 100%; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto;}
.landing .submit-resume p strong {font-size: 1.125em; display: block}
.landing .careers .images {padding-bottom: 37.5%; border-top:2px solid #fff; position: relative; border-bottom: 2px solid #fff}
.landing .careers .images:before,
.landing .careers .images:after {content: ""; height: 100%; display: block; position: absolute; top:0; width:50%;}
.landing .careers .images:before {border-right: 1px solid #fff; background: url(/images/landing/careers-image-left.jpg) no-repeat center / cover}
.landing .careers .images:after {border-left: 1px solid #fff; right:0;background: url(/images/landing/careers-image-right.jpg) no-repeat center / cover}
.landing #why-infiltrator {padding: 3em 1em 7.63em}
.landing #why-infiltrator h2 {font-weight: 700; font-size: 2em; color: var(--indigo); text-align: center; margin: 0}
.landing #why-infiltrator h2:after {content: ""; display: block; width: 250px; background: rgba(0,67,105,.3); height: 4px; margin: 1.75rem auto;}
.landing #why-infiltrator p {font-size: 1.13em; max-width: 44.444em; margin: 0 auto; color: #4A4A4A; text-align: center; line-height: 1.556em;}
.landing .bottom {padding: 0 1em 7.5em}
.landing .icon-cards .wrap {overflow: auto; padding: 1.88em 0}
.landing .icon-cards .wrap .cardContainer {text-align: center; height: 16.63em; margin:0.5em auto;  width: 100%; position: relative;  -webkit-perspective: 800px; perspective: 800px;}
.landing .icon-cards .wrap .cardContainer .card {position: relative; }
.landing .icon-cards .wrap .cardContainer .card {display: block; width: 100%; height: 100%; position: absolute; top: 0; -webkit-perspective: 1400px; perspective: 1400px;}
.landing .icon-cards .wrap .cardContainer .card .front {display: none;}
.landing .icon-cards .wrap .cardContainer .card .back {position: absolute; z-index: 1; width: 100%; max-width: 100%; height: 100%; padding: 1em;   display: flex;   flex-direction: row; -webkit-flex-wrap: wrap;  flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}
.landing .icon-cards .wrap .cardContainer .card .back {background: #062234; border: 1px solid #062234; }
.landing .icon-cards .wrap .cardContainer .card p {font-size: 1em; color: #FFFFFF; text-align: center; line-height: 1.19em}
.landing .icon-cards .wrap .cardContainer span,
.landing .icon-cards .wrap .cardContainer h2 {font-size: 1.38em; display: block; width:100%; font-weight:800; text-align: center; line-height: 1em; color: #062234;}
.landing .icon-cards .wrap .cardContainer span:before {content: ""; width: 100%; margin-bottom: 1.25em; height: 4.56rem; display: block;}
.landing .icon-cards .wrap .cardContainer.Growth span:before {background: url(/images/landing/icon-card-Growth.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Committed span:before {background: url(/images/landing/icon-card-Committed.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Innovative span:before {background: url(/images/landing/icon-card-Innovative.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Admired span:before {background: url(/images/landing/icon-card-Admired.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Supportive span:before {background: url(/images/landing/icon-card-Supportive.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Sustainable span:before {background: url(/images/landing/icon-card-Sustainable.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Dependable span:before {background: url(/images/landing/icon-card-Dependable.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Connected span:before {background: url(/images/landing/icon-card-Connected.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Values span:before {background: url(/images/landing/icon-card-Values.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Development span:before {background: url(/images/landing/icon-card-Development.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer h2 {color: #fff; margin-bottom: 0.5em}
.landing .icon-cards .wrap .cardContainer h2:before {content: ""; display: block; width: 100%; height: 3.75rem; margin:-1em 0 0.5em}
.landing .icon-cards .wrap .cardContainer.Growth h2:before {background: url(/images/landing/icon-card-hover-Growth.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Committed h2:before {background: url(/images/landing/icon-card-hover-Committed.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Innovative h2:before {background: url(/images/landing/icon-card-hover-Innovative.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Admired h2:before {background: url(/images/landing/icon-card-hover-Admired.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Supportive h2:before {background: url(/images/landing/icon-card-hover-Supportive.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Sustainable h2:before {background: url(/images/landing/icon-card-hover-Sustainable.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Dependable h2:before {background: url(/images/landing/icon-card-hover-Dependable.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Connected h2:before {background: url(/images/landing/icon-card-hover-Connected.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Values h2:before {background: url(/images/landing/icon-card-hover-Values.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer.Development h2:before {background: url(/images/landing/icon-card-hover-Development.svg) no-repeat center}
.landing .icon-cards .wrap .cardContainer p {color: #4A4A4A; margin: 0}
.landing .bottom #testimonials .slick-arrow {display: none !important}
.landing .bottom #testimonials .button {margin: 0}

.asset-library-login {padding: 2.5rem 1rem 3rem}
.content ul.assets .asset {margin-bottom: 2em}
.content ul.assets.grid .asset .image {width:147px; height: 147px; padding:0}

.terms-of-use-overflow ol {padding-left: 0}



/* FOOTER ------------------------------ */
body>footer .wrap{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-content: stretch;
  align-items: stretch;
}

.fatFooter div {float: left; margin-bottom: 2em; text-align: center; width: 100%;}
.fatFooter form div {margin-bottom: 0;}
.fatFooter .mc-field-group input {width:100%;}
.fatFooter .social {text-align: center;}
.fatFooter .g-recaptcha {
    display: flex;
    justify-content: center;
    margin-bottom: 0.5em;
}

#web-solutions-exposure {
  order: 1;
}

#email_signup input[type="email"]{width: 100%;}

/* HOME ------------------------------ */
.home main section h2, .flexible-callouts.hover-text h2 {font-size: 1.6em;}

/* Flexible Callouts */
.flexible-callouts.hover-text {padding: 3em 5%;}
.flexible-callouts.hover-text ul li {width: 48%; margin: 1em 0 0}

/* Application Callouts */
.application-callouts {padding: 3em 0;}
main .application-callouts h2 {display: block; margin-bottom: 2em; padding: 1em;}
.home main .application-callouts {
  padding:0 1em;
}
.application-callouts ul {display: block; padding: 0 15%;}
.application-callouts ul li {margin: 0; width: 100%;}
.application-callouts ul li a.button {white-space: nowrap;}

/* Split Ribbon */
.split {display: block; padding: 2em 0;}
.split > * {padding: 3em 5%; width: 100%}

/* Split List */
.split-list {padding: 2em 5% 1em;}
.split-list > .wrap {display: block}
.split-list > .wrap > * {width: 100%}
.split-list > .wrap > section {margin-bottom: 2em;
    border: 2px solid var(--aqua);
  padding: 2em 1em;}



.mobileTable thead {
    display: none;
}

.mobileTable tbody tr {
    background: #fff;
    border-bottom: 1px solid var(--cloud-white);
    display: block;
    padding: 1em;
}

.mobileTable td {
    display: block;
}
.mobileTable td + td {
    padding-top: 0.5em;
}

.mobileTable td:not(:empty):before {
    content: attr(data-attribute);
    display: block;
    font-weight: 700;
    color: var(--storm-grey);
}


/* PRODUCTS --------------------------------- */
#productArea .productSeries .categoryImage {padding-bottom:50%;}
.productSeries li .wrap div {float: left; margin-bottom: 1em; text-align: center; width: 100%;}

.seriesList {padding: 0 5%;}
.seriesList li {float: left; width: 100%;}
.seriesList .information {padding-bottom: 2em;}

#categoryContent .hide-overflow {
  position: relative;
}
#categoryContent .hide-overflow:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 4rem;
  background-image: linear-gradient(to bottom, rgba(208, 229, 243, 0), rgba(208, 229, 243, 1));
}
#categoryContent .hide-overflow.expand:before {
  opacity: 0;
}

/* Translate */
#ancillary .gtranslate_wrapper {
    border-top: 1px solid rgba(255,255,255,0.125);
    padding: .5rem 1rem;
}
#ancillary .gtranslate_wrapper,
#ancillary .gtranslate_wrapper * {
    font-size: 1rem;
}

#ancillary .gtranslate_wrapper .gt_switcher {
    width: 100%;
}

#ancillary .gtranslate_wrapper .gt_selected {
    border: 0;
}

#ancillary .gtranslate_wrapper .gt_selected a {
    background: #fff;
    border: 0;
}

#ancillary .gtranslate_wrapper .gt_option {
    border: 0;
    border-top: 1px solid var(--storm-grey);
}

#ancillary .gtranslate_wrapper .gt_option a {
    align-items: center;
    background: none;
    display: flex;
    gap: 0.35em;
    height: 2.1875rem;
    padding: 0 .8em;
    width: 100%;
}

#ancillary ul.account-links > li > a > img {
  width: 1.0625rem;
  float: none;
  margin-right: .125rem;
  filter: brightness(0) invert(1)
}

#ancillary ul.account-links > li > a {
  padding: .25rem 1rem;
}

/* NEW LANDING PAGES --------------------------------- */

p.intro {font-size: 1.125rem;}

.productPage h1, #ot-intro h1, #state-tests h1, #resource-map h1 { font-size: 2rem; }

.productPage.productPage .left, .productPage.productPage .right { width: 100%; }
.productPage .right .top { margin: 1rem 0 2.5rem; }
.generalInfo { padding: 0 0 2.5rem; }

.content ol {margin-left: 0; padding-left: 2em}

#relatedProducts.productPage { padding: 3.5rem 5%; }
#relatedProducts.productPage .seriesList { padding: 0; }
#relatedProducts.productPage .information { padding: 1em 1.5rem 2em; }
#relatedProducts.productPage .seriesList li { float: none; margin: 0 auto 2rem; max-width: 100%; width: 25rem; }
.productPage .left .galleryMain {position:relative; width:100%; height: 12.5rem; margin:0 auto}
.productPage .left .galleryMain img {position: absolute; top: 50%; left:50%; transform: translate(-50%, -50%); max-height: 100%; max-width: 100%; height: auto; width: auto;}
.productPage .right .top > form {display: block}
.productPage .right .top .row {text-align: center; font-size: 1.125rem; margin-bottom: 1em; font-weight:600}
.productPage .right .top .row input[type="text"],
.productPage .right .top .row select {width:auto; margin:0 auto; font-size: 1rem; display: block;}
.productPage .right .top .row #product-quantity {max-width: 6em; text-align: center}
.productPage .right .top-right,
.productPage .right .top-left {float: none; width: 100%; padding: 0 1em 1em; border:0}

.state-select, #ot-training .flex-row .column:last-of-type { text-align: center; }
#ot-training .flex-row { flex-direction: column; }
#ot-training #state-training .flex-row .column:first-of-type { padding: 0}
#ot-training .flex-row .column:last-of-type img {margin: 3rem auto 0; max-width: 100%;}

#ot-outline ol { padding: 0 0 0 1rem; }
#state-tests h2 { font-size: 1.5rem; }
#state-tests .icon {top: 1.5rem;}

#ot-instructions .icon img { max-width: 1.5rem; }
#ot-instructions ul { left: -.75rem; position: relative; }
#ot-training #state-training select { width: 13rem; }
#ot-training #state-training button { top: 0; }

#map-wrap { display: none; }
#resource-map #location-select { flex-direction: column;}
#resource-map #location-select .selects {margin: 1rem auto 0;}
#resource-map #location-select select { font-size: 1.0625rem; }
#resource-map #location-select .select-toggle { margin: 0 .375rem 0 0; width: 13rem; }

#specifications { padding: 1.25rem 0 1.5rem; }
#faqs { padding: 2rem 1em; }

#resource-map .location .tabbed-nav button,
#resource-map .location .action-items .button {display: block; margin: 0 0 .25rem; text-align: center; width: 100%;}

.back-to-top div {display: none}



ul.categories.ws-flex {
  --ws-column-count: 2;
}

/* WEBINARS */

#upcoming-webinars .wrap, #past-webinars .wrap, #state-accredited-webinars .wrap {padding-left: 3vw; padding-right: 3vw;}
#upcoming-webinars h2, #past-webinars h2 {text-align: center;}
#upcoming-webinars {padding-top: 3.6875rem;}
#upcoming-webinars ul li {width: 100%;}
#upcoming-webinars ul li + li {margin-top: 3.5rem;}

#past-webinars ul li, #state-accredited-webinars ul li {width: calc(50% - .5rem); margin-left: 1rem;}
#past-webinars ul li:nth-of-type(odd), #state-accredited-webinars ul li:nth-of-type(odd) {margin-left: 0;}
#past-webinars ul li:nth-of-type(n+3), #state-accredited-webinars ul li:nth-of-type(n+3) {margin-top: 2rem;}

#past-webinars .button.blue {right: 3vw;}

.state-webinars .blue-webinars-list li {width: calc(50% - 15px); margin-left: 1.875rem;}
.state-webinars .blue-webinars-list li:nth-of-type(odd) {margin-left: 0;}
.state-webinars .blue-webinars-list li:nth-of-type(n+3) {margin-top: 2rem;}

.speaker-biography img {margin-left: 2rem; margin-bottom: 2rem;}


.account-dashboard #wastewater-treatment-plant-designs .anchored {margin-bottom:1em}


/*  Homepage Upcoming Webinars ------------------------------ */
#upcoming-webinars.home .view-all.button {margin-bottom: 1rem;}

.landing #callouts-delta .residential, .landing #callouts-delta .commercial {width: 90%;margin:5% 5%}
/*  Solution Tool ------------------------------ */
#solution-tool .pageHeader {padding:2em 1em}
#solution-tool .pageHeader .steps {font-size: 0.875em; padding:0 2em}
#solution-tool .pageHeader .steps::before {top:0.875rem; left: 2.65rem; right: 2.65rem}
#solution-tool .pageHeader .steps .step::before {margin:0 auto 0.3125rem; width: 2rem; height:2rem}
#solution-tool #select-plant-type {padding:2em 1em}
#solution-tool #select-plant-type h2 {font-size:1.5em}
#solution-tool #select-plant-type li {margin-top: 2em}
#solution-tool #plant-specs { padding: 2em 1em 4em; }
#solution-tool #plant-specs h2 {font-size:1.5em}
#solution-tool #plant-specs .submit {text-align: center;}
#solution-tool #plant-specs .large-button {padding:.75em 1.5em}
#solution-tool #plant-specs .wrap .specs-table .group .row.multiple-inputs .inputs {  display: flex;   flex-direction: row;   flex-wrap: nowrap;   justify-content: space-between; -webkit-align-content: flex-start; -ms-flex-line-pack: start; align-content: flex-start;   align-items: flex-start;}
#solution-tool #plant-specs .wrap .specs-table .group .row.multiple-inputs .inputs label:not(.radio) input {max-width:5.563rem}
#solution-tool #plant-specs .wrap .specs-table .group .row.multiple-inputs .inputs .radio input {margin-right:0; margin-left:0}
#solution-tool.step-2 #we-have-a-solution {padding: 2.875rem 1em  11.25rem}
#solution-tool.step-2 #we-have-a-solution .wrap h2 {font-size: 1.5rem; margin-bottom:1em; color: var(--indigo); text-align: center; line-height:1em;}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .solution {border-radius:5px; padding:1em; background:#fff; margin-bottom:2em}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .solution img {width:100%; max-width:9.375rem; margin:0 auto; height:auto; display: block}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .solution .title {display:block; font-weight:700; font-size: 1.25rem; color: var(--indigo); text-align: center; line-height: 1.25em;}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .solution .brief {display: block; font-size: 0.8125rem; color: #0D202D; text-align: center;}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options > * + * {border-top:1px dashed #CECECE; margin-top:2em; padding-top:2em}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options h3 {position: relative; font-size: 1.25rem; color: #062234;}
  #solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options h3:before {content:""; padding-left:1.5em; margin-right:0.5em}
  #solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options .sign-in h3:before {background:url(/images/solution-tool/sign-in.svg) no-repeat center}
  #solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options .create-an-account h3:before {background:url(/images/solution-tool/create-account.svg) no-repeat center}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options .create-an-account h3 {margin-bottom: 0;}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options p {color: #0D202D;line-height:1.37em;}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options td [type="submit"] {margin-top: 1rem}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options .newsletter {display: block; margin: 1em 0 0.5em}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options textarea {min-height:6.9375rem}
#solution-tool.step-2 #we-have-a-solution .wrap .flex .download-options [type="submit"] {padding:0.75em 1.5em}
#solution-tool.step-3 #your-solution {padding: 1em 1em 3.4375rem; color:#0D202D}
#solution-tool.step-3 #your-solution .solution-tabs .tabs {  display: flex;   flex-direction: row;   flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}
#solution-tool.step-3 #your-solution .solution-tabs .tabs button {width:50%; text-align: center; padding:.625em 1.5em}
#solution-tool.step-3 #your-solution .solution-tabs .tabs button + button {margin-left:5px}
#solution-tool.step-3 #your-solution .wrap {padding:1.125rem 1em;max-width:62.875rem; background:#fff; border-radius: 5px;}
#solution-tool.step-3 #your-solution .wrap .top {margin-bottom: 2.5rem;}
#solution-tool.step-3 #your-solution .wrap .top .solution-image img {display: block; max-width:9.375rem; width:100%; margin:0 auto}
#solution-tool.step-3 #your-solution .wrap .top .solution-content .tag {display: block; margin-bottom:0.5rem; font-weight: 700; font-size: 1.0625rem; color: var(--indigo);}
#solution-tool.step-3 #your-solution .wrap .top .solution-content h2 {font-size: 1.75rem; margin-bottom:0.75rem; color: #062234; line-height:1em}
#solution-tool.step-3 #your-solution .wrap .top .solution-content .detail {display: block; font-weight:600;font-size: 1.25rem;color: #062234;line-height: 1.25rem;}
#solution-tool.step-3 #your-solution .custom-solution.wrap .top .solution-content .detail.model {color:red}
#solution-tool.step-3 #your-solution .wrap .top .solution-content .detail + .detail {margin-top:0.625rem}
#solution-tool.step-3 #your-solution .wrap .top .solution-content .detail + p {margin-top: 1.25rem;}
#solution-tool.step-3 #your-solution .wrap .top .solution-content p {font-size: 1rem;color: #0D202D;line-height: 1.3125rem;}
#solution-tool.step-3 #your-solution .wrap .overage {margin-bottom:2.5rem; border-radius:5px; padding: 1.5rem 1.5rem 1.5rem 3rem; position:relative; background:rgba(255, 155, 0, 0.06); border-radius: 5px}
  #solution-tool.step-3 #your-solution .custom-solution.wrap .overage {background: rgba(255,0,0,0.03); color:#D52C00}
  #solution-tool.step-3 #your-solution .custom-solution.wrap .overage p { color:#d20000}
#solution-tool.step-3 #your-solution .wrap .overage p {margin-bottom:0; font-size: 1rem; color: #D52C00; line-height: 1.3125rem;}
#solution-tool.step-3 #your-solution .wrap .overage .icon:before {content:""; width:1.125rem; height: 1rem; display: inline-block; margin-right:0.5em; background: url(/images/solution-tool/alert-triangle-orange.svg) no-repeat center; position: absolute; top: 1.5625rem; left: 1.3125rem;}
  #solution-tool.step-3 #your-solution .custom-solution.wrap .overage .icon:before {background: url(/images/solution-tool/alert-triangle.svg) no-repeat center; position: absolute; top: 1.5625rem; left: 1.3125rem;}
#solution-tool.step-3 #your-solution .wrap .form-answers {margin-bottom:2.5rem;}
#solution-tool.step-3 #your-solution .wrap .form-answers .half {width:100%}
#solution-tool.step-3 #your-solution .wrap .form-answers .half table {width:100%}
#solution-tool.step-3 #your-solution .wrap .form-answers .half table td {padding:0.5em 1em; width:50%; font-size:0.875rem; line-height:1em}
  #solution-tool.step-3 #your-solution .wrap .form-answers .half table .alert td:first-child {border-radius: 5px 0 0 5px; }
  #solution-tool.step-3 #your-solution .wrap .form-answers .half table .alert td:last-child {border-radius: 0 5px 5px 0; }
#solution-tool.step-3 #your-solution .wrap .form-answers .half table .alert td {background:rgba(255, 155, 0, 0.06);}
  #solution-tool.step-3 #your-solution .custom-solution.wrap .form-answers .half table .alert td {background: rgba(255,0,0,0.03);}
#solution-tool.step-3 #your-solution .wrap .form-answers .half table .alert td.icon {font-weight:700; color:#FF4818}
  #solution-tool.step-3 #your-solution .custom-solution.wrap .form-answers .half table .alert td.icon {color:red}
#solution-tool.step-3 #your-solution .wrap .form-answers .half table .alert td.icon:before {content:""; width:1.125rem; height: 1rem; display: inline-block; margin-right:0.5em; background: url(/images/solution-tool/alert-triangle-orange.svg) no-repeat center;}
  #solution-tool.step-3 #your-solution .custom-solution.wrap .form-answers .half table .alert td.icon:before {background: url(/images/solution-tool/alert-triangle.svg) no-repeat center;}
#solution-tool.step-3 #your-solution .wrap .budget-message {margin-bottom: 2.5rem; padding: 1em 0; border-top:1px dashed #CECECE; border-bottom:1px dashed #CECECE}
#solution-tool.step-3 #your-solution .wrap .budget-message p {margin:0 auto; max-width:44.125rem; font-weight: 600; font-size: 1rem; color: #062234; line-height:1.25rem; text-align: center;}
#solution-tool.step-3 #your-solution .wrap .budget-message .estimates {margin:0 auto; max-width:44.125rem; font-weight: 600; font-size: 1rem; color: #062234; line-height:1.25rem; text-align: center;}
#solution-tool.step-3 #your-solution .wrap .downloads {text-align: center;}
#solution-tool.step-3 #your-solution .wrap .downloads h2{font-size: 1.75rem; margin-bottom:1em; color: #062234;text-align: center;}
#solution-tool.step-3 #your-solution .wrap .downloads .download-buttons {margin-bottom:1rem}
#solution-tool.step-3 #your-solution .wrap .downloads .download-buttons .button {font-size:1.125rem; margin-right:0}
#solution-tool.step-3 #your-solution .wrap .downloads .download-buttons .button:before {content:""; margin-right:0.5em; padding-left: 1em; background: url(/images/solution-tool/download.svg) no-repeat center}
#solution-tool.step-3 #your-solution .wrap .downloads .download-buttons .button.blue {background:none; color:var(--indigo); border:0}
#solution-tool.step-3 #your-solution .wrap .downloads .download-buttons .button.blue:before {background: url(/images/solution-tool/download-orange.svg) no-repeat center}
#solution-tool.step-3 #your-solution .wrap .downloads .download-buttons .button.blue:hover {color:#FF4818}
#solution-tool.step-3 #your-solution .wrap .downloads .disclaimer {max-width:40rem; margin:0 auto; font-size: 0.8125rem; color: #0D202D; line-height: 1.0625rem;}
#solution-tool.step-3 .contact-a-rep {text-align:center; padding: 0 0 3em;}
#solution-tool.step-3 .contact-a-rep button {font-size:1.125rem}
#solution-tool.step-3 #popover h2 a {display: block}
#solution-tool.step-3 #popover table td {width:100%; display: block; padding:0 0 0.5em}
#solution-tool.step-3 .start-over {text-align: center;background: #f0f5f7;padding: 3rem 1rem;}
#solution-tool.step-3 .start-over .button {margin:0}

#treatment-popover .container .popover-wrap {padding: 1em}
#treatment-popover .popover-content {max-height: 75vh; overflow:auto}
#treatment-popover .popover-content .plant-header {margin-bottom:1rem; display: block}
#treatment-popover .popover-content .plant-header .plant-image {width: 8.125rem; margin:0 auto}
#treatment-popover .popover-content .plant-header .plant-image img {width: 100%; display: block; height:auto;}
#treatment-popover .popover-content .plant-header h2 {text-align:center; font-size:1.5rem; margin-bottom:0}
#treatment-popover .popover-content .plant-header .brief {text-align:center; font-size: 1.125rem; line-height: 1.25em;}




/* HOMEPAGE CALLOUTS RIBBON ------------------------------ */

.home-callouts ul.ws-flex {
  --ws-column-count: 2;
}





/* MEDIA QUERIES --------------------------------- */

@media screen and (max-width: 650px) {
  #other-countries .threeCol { -webkit-columns: 1; columns: 1; }
  #other-countries li { text-align: center;}
  #other-countries li>a { width: 100%; }

  .product-anchor-links {flex-direction: column;}
  .product-anchor-links a {width: auto; margin-left: 0;}
  .product-anchor-links a + a {margin-top: 1rem;}
}

@media screen and (max-width:575px) {
  .flexible-callouts.hover-text ul li {width: 100%; margin: 1em 0 0}
  .hero-intro h1 {font-size: 8vw;}

  #ot-intro .buttons a.button {display: table; margin: 0 auto .5rem; width: 100%; }
  #ot-instructions .flowchart {-webkit-align-items: center;-ms-flex-align: center;align-items: center;     flex-direction: column; }
  #ot-instructions .flowchart .step { width: 100%; }
  #ot-instructions .arrow { margin: 2rem 0 0; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }

  #past-webinars .button.blue {position: relative; top: auto; right: auto; margin: 0 auto; display: table; margin-top: 3rem;}
  #past-webinars ul li {width: 100%; margin-left: 0;}
  #past-webinars ul li:nth-of-type(n+2) {margin-top: 2rem;}

  .speaker-biography .speaker-name {float: none;}
  .speaker-biography img {margin: 1rem 0; float: none; clear: both; display: block;}
  .credit-box-top {font-size: 1rem;}
}



/* 500px */
@media (max-width: 31.25em) {
  .home-callouts ul.ws-flex {
    --ws-column-count: 1;
  }

  ul.categories.ws-flex {
    --ws-column-count: 1;
  }
}


@media screen and (max-width: 450px) {
  #resource-map .location.selected-location { padding: 1.75rem 1.75rem 2.5rem 1.75rem; }
  #resource-map .location { padding: 1.75rem 0; }
  #resource-map #location-select .button {display: block; margin: 0 0 .5rem; width: 100%;}

  #state-accredited-webinars ul li {width: 100%; margin-left: 0;}
  #state-accredited-webinars ul li:nth-of-type(n+2) {margin-top: 2rem;}

  .state-webinars .blue-webinars-list li {width: 100%; margin-left: 0;}
  .state-webinars .blue-webinars-list li:nth-of-type(n+2) {margin-top: 2rem;}

}

@media screen and (max-width: 420px) {

  .content .photoright, .content .photoleft {max-width: 100%; width: 100%;}

  .productPage h1, #ot-intro h1, #state-tests h1, #resource-map h1 { font-size: 1.75rem; }
  #state-tests h2 { font-size: 1.25rem; }
  #state-tests section {padding: 2rem 0 2rem 3.125rem;}

  .productPage .right .top { flex-direction:column;}
  .productPage .right .top-left, .productPage .right .top-right { border: 0; padding: 0 0 1.5rem; width: 100%; }
}



/* ------------ STYLE-M.CSS ------------ */