/*------>>> TABLE OF CONTENTS <<<-------
	- MASTHEAD | Document Header
	- NAVIGATION
	- HERO
	- CART
	- PRODUCT DIAGRAM
	- DETAILS PANEL
	- MAIN
	- INTRO CARD
	- ICON ANCHOR
	- CONTENT BLOCKS
	- CARDS
	- PANELS | Forced Full width content
	- MEDIA BLOCKS
	- CALLOUTS
	- TIMELINE
	- PRODUCT BREAKOUT
	- LOCATIONS MAP
    - THUMBNAIL SLIDER
    - PLOT DIAGRAM
    - PRODUCT COLOR FILTER
	- EMPOWEREN FORMS
	- STYLE GUIDE
	- COLOPHON | Document Footer
	
/*------->>> COLOR PALETTE <<<-------
	#2465be - rgb(36,101,190) | Primary Color [Clayton Blue]
	#284169 - rgb(40,65,105) | Secondary Color [Navy]
	#d5c297 - rgb(213,194,151) | Tertiary Color [Khaki]
	#484848 - rgb(72,72,72) | Accent Color [Dark Gray | Font Color]
	#80cdf4 - rgb(128,205,244) | Accent2 Color [Blue Light]
	#919191 - rgb(145,145,145) | Support Color [Medium Gray]
	#ebebeb - rgb(235,235,235) | Support2 Color [Light Gray]
	
/*------->>> FONT STACKS & TYPOGRAPHY <<<-------
    font-family: 'Open Sans', sans-serif; [Primary Font | 400 600 700]
    font-family: 'Montserrat', sans-serif; [Secondary Font |400 500 700]

/*------->>> DROP SHADOWS <<<-------
    DROP SHADOW
    -webkit-box-shadow: 0px 20px 40px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 20px 40px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 20px 40px 0px rgba(0,0,0,0.25);
    
    DEEP DROP SHADOW
    -webkit-box-shadow: 0px 40px 60px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 40px 60px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 40px 60px 0px rgba(0,0,0,0.25);	
*/


/************************************
/*----------------------------------
/* MASTHEAD
/*----------------------------------
/*************************************/


.masthead {
	display:block;
	width:100%;
	background:#fff;
	position:relative;
	-webkit-box-shadow:5px 10px 20px 0px rgba(0,0,0,0.16);
    -moz-box-shadow:5px 10px 20px 0px rgba(0,0,0,0.16);
    box-shadow:5px 10px 20px 0px rgba(0,0,0,0.16);
	z-index:1000;
}
.masthead-branding-link {
	display:block;
	width:100%;
	max-width:185px;	
}
.masthead-branding-link svg {
	display:block;
	width:100%;
	height:auto;
}
.masthead-branding-link .logo-clayton-corp-svg01,
.masthead-branding-link .logo-clayton-corp-svg02 {
	-webkit-transition: all 350ms linear 50ms !important;
	transition: all 350ms linear 50ms !important;
}
.masthead-branding-link .logo-clayton-corp-svg01 {
	fill:#0047ba;
}
.masthead-branding-link .logo-clayton-corp-svg02 {
	fill:#99999a;
}
.masthead-branding-link:hover .logo-clayton-corp-svg01,
.masthead-branding-link:hover .logo-clayton-corp-svg02 {
	fill:#80cdf4;
}


/************************************
/*----------------------------------
/* NAVIGATION
/*----------------------------------
/*************************************/


.primary-nav {
	position:relative;
	/* Pull fullwidth */
	margin-left:calc(-100% - 1.875rem);
	margin-right:-0.625rem;
}
/* Flexnav Base Styles */
.flexnav,
.flexnav ul {
	list-style:none;
} 
.flexnav {
	width:100%;	
	max-height:0;
	overflow:hidden;
	position:absolute;
	top:100%;	
	margin:0 auto;
	padding:0;
	-webkit-transform-style:preserve-3d;
	transform-style:preserve-3d;
	-webkit-box-shadow:5px 10px 20px 0px rgba(0,0,0,0.16);
    -moz-box-shadow:5px 10px 20px 0px rgba(0,0,0,0.16);
    box-shadow:5px 10px 20px 0px rgba(0,0,0,0.16);
}  
.flexnav.opacity {
	opacity:1;
}
.flexnav.flexnav-show {
	opacity:1;
	padding:0;	
	max-height:2000px;
	-webkit-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-moz-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-ms-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
}
.flexnav.one-page {
	max-width:200px;
	position:fixed;
	top:50px;
	right:5%;
}
.flexnav li {
	overflow:hidden;
	position:relative;
	font-size:100%;
}
.flexnav li:before {
    display:none; /* Reset from base styles */
}
.flexnav li a {
	background:#fff;
	display:block;
	position:relative;
	overflow:hidden;
	padding:0.750rem 1.25rem;
	margin:0;
	font-family:'Montserrat', sans-serif;
	font-size:1rem;
	font-weight:700;
	color:#2465be;
	text-align:left;
	text-transform:uppercase;
	letter-spacing:0.01em;
	line-height:1.2;
	border-top:1px solid #f0f0f0;
	z-index:2;
} 
/*- nested UL -*/
.flexnav li ul {
	margin:0;
	width:100%;
	padding:0.75rem 0;
	background:#f0f0f0;
}
.flexnav li ul li {
	position:relative;
	overflow:hidden;
	font-size:100%;
}
.flexnav li ul.flexnav-show li {
	overflow:visible;
}
.flexnav li ul li a {
	background:transparent;
	font-weight:500;
	padding:0.5rem 1.25rem;
}
.flexnav li ul li a {
	border:0;
}
/*- drop down arrows -*/
.flexnav .touch-button {
	display:inline-block;
	width:50px; /* width of menu button */
	height:44px; /* height of li */
	position:absolute;
	top:0;
	right:0;
	background:transparent;
	z-index:999;
}
.flexnav .touch-button:after {
	display:none;
}
.flexnav .touch-button .touch-button-svg {
	fill:#1d222e; /* base font color */
	width:25px;
	height:25px;
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%, -50%);
	-webkit-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}
.flexnav .touch-button.active .touch-button-svg {
	transform:translate(-50%, -50%) rotate(180deg);
}
.flexnav .touch-button:hover {
	cursor:pointer;
}
.flexnav .touch-button .navicon {
	display:none;
}
/*- menu button -*/
.menu-button {
	display:block;
	margin:0;
	width:30px;
	height:80px;
	position:relative;
    color:transparent;
	cursor:pointer;
	z-index:10000;
    background:transparent;
}
.menu-button.one-page {
	position:fixed;
	top:0;
	right:5%;
	padding-right:45px;
}
.menu-button .touch-button {
	display:block;
    margin:0 auto;
	width:100%;
	height:100%;
	position:absolute;
	right:0;
    left:0;
	top:0;
}
.menu-button .touch-button .navicon {
	display:block;
	height:2px;
	width:100%;
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	left:0;
	right:0;
	margin:0 auto;
	background:#284169;
	-webkit-transition:background 0.2s;
	transition:background 0.2s;
	border-radius:3px;
}
.menu-button .touch-button .navicon:before {
	display:block;
	width:100%;
	height:2px;
	position:absolute;
	top:-8px;
	left:0;
	content:"";
	background-color:#284169;
	-webkit-transition-property:top, -webkit-transform;
	transition-property:top, transform;
	-webkit-transition-duration:.3s, .3s;
	transition-duration:.3s, .3s;
	-webkit-transition-delay:.3s, 0s;
	transition-delay:.3, 0s;
	border-radius:3px;
}
.menu-button .touch-button .navicon:after {
	display:block;
	width:100%;
	height:2px;
	position:absolute;
	left:0;
	bottom:-8px;
	content:"";
	background-color:#284169;
	-webkit-transition-property:bottom, -webkit-transform;
	transition-property:bottom, transform;
	-webkit-transition-duration:.3s, .3s;
	transition-duration:.3s, .3s;
	-webkit-transition-delay:.3s, 0s;
	transition-delay:.3s, 0s;
	border-radius:3px;
}
.menu-button .touch-button.active .navicon {
	background:transparent;
}
.menu-button .touch-button.active .navicon:before,
.menu-button .touch-button.active .navicon:after {
	-webkit-transition-duration:.3s, .3s;
	transition-duration:.3s, .3s;
	-webkit-transition-delay:.3s, 0s;
	transition-delay:0s, 0.3s;
}
.menu-button .touch-button.active .navicon:before {
	top:0;
	-webkit-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	transform:rotate(45deg);
}
.menu-button .touch-button.active .navicon:after {
	bottom:0;
	-webkit-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	transform:rotate(-45deg);
}



/************************************
/*----------------------------------
/* HERO
/*----------------------------------
/*************************************/


.hero {
    background-color:#000;
	display:block;
	padding:0;
	position:relative;
	width:100%;
	height:450px;
	overflow:hidden;
    /* Remove whitespace */
    line-height:0;
}  
.hero:not(.hero-index) img {
	display: block;
	position: absolute;
	top:0;
	left: 50%;
	-webkit-transform: translate3d(-50%,0,0);
	transform: translate3d(-50%,0,0);
	width: auto;
	height:100%;
	max-width: none;
	margin: 0 auto;
}
.hero-messaging {
	position:absolute;
	left:0;
	right:0;
	top:50%;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
	z-index:465;
}
.hero-message-title {
	color:#fff;
	text-transform:uppercase;
	letter-spacing:0.01em;
}
.hero-message-title small:not([class*="color"]) {
	color:#d5c297;
}
.hero-messaging-title small {
	font-size:1.063rem;
	font-weight:400;
	margin-top:0.5rem;
	letter-spacing:initial;
}
.has-video {
	height:calc(100vh - 90px);
}
.has-video iframe {
	width:100vw;
	min-width:281.525vh; /* Given a 1920:683 aspect ratio, 1920/683*100 = 281.1127 checked vimeo, grabbed their calcs */
	height:35.5208vw; /* Given a 1920:683 aspect ratio, 683/1920*100 = 35.5279 checked vimeo, grabbed their calcs*/ 
	min-height:calc(100vh - 90px);
	position:absolute;
	top:0;
	left:50%;
	transform:translateX(-50%);
}
/* Widescreen, same dimensions as interior images (almost) */
.has-video--widescreen {
}
.has-video--widescreen iframe {
	min-width:376.309vh; /* Given a 1920:510 aspect ratio, 1920/510*100 = 376.309 */
	height:26.5739vw; /* Given a 1920:510 aspect ratio, 510/1920*100 = 26.5739 */
}
/*---> Hero Index <---*/
.hero-index .hero-message-title {
	text-shadow: 0px 3px 6px rgba(0,0,0,0.25);
}
.hero-index .hero-messaging-svg {
	margin-top:-0.75rem;
}
.hero-index .hero-messaging-svg svg {
	width:100%;
	height:auto;
	max-width:675px;
}
/*---> With Video Popup <---*/
.hero-video-btn {
	display:block;
	width:auto;
	cursor:pointer;
	margin:0 auto;
}
.hero-video-btn svg {
	display:block;
	width:103px;
	height:102px;
}
.hero-video-btn svg .icon-play-btn-svg-01,
.hero-video-btn svg .icon-play-btn-svg-02 {
	transition:all 200ms ease-in-out;
	-webkit-transition:all 200ms ease-in-out;
}
.hero-video-btn svg .icon-play-btn-svg-01 {
	fill:#fff;
}
.hero-video-btn svg .icon-play-btn-svg-02 {
	fill:#2465be;
}
.hero-video-btn:hover svg .icon-play-btn-svg-02 {
	fill:#284169;
}
.hero-video-title {
	margin:0;
	font-size:1.25rem;
	font-weight:700;
	color:#fff;
	text-transform:uppercase;
	text-align:center;
	letter-spacing:0.05em;
}
/*---> Breadcrumbs <--*/
.hero-bread-crumbs {
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
}
nav.breadcrumb {
    padding:1rem 0;
}
nav.breadcrumb ol {
    font-size:0; /* Fix whitespace for li */
}
nav.breadcrumb ol li {
	padding:0;
	margin:0;
}
nav.breadcrumb ol li::before {
	display:none;
}
nav.breadcrumb ol li:not(:last-child)::after {
	content: "\00A0\003E\00A0";
}
nav.breadcrumb ol li,
nav.breadcrumb ol li a {
    font-size:1rem;
	font-weight:400;
}
nav.breadcrumb ol li,
/* Inherit hover color from baseStyles.css */
nav.breadcrumb ol li a:not(:hover):not(:active):not(:focus):not(:focus-visible) {
	color:#fff;
}
nav.breadcrumb ol li:last-of-type a {
    font-weight:600;
}

/***********************

Rebuild of Hero Index with non-compliant text slider for fading text 

***********************/
.hero-index .hero-messaging-png {
    width:100%;
	height:auto;
	max-width:375px;
}
@media all and (min-width:640px) {
    .hero-index .hero-messaging-png {
        max-width:640px;
    }
}
@media all and (min-width:1024px) {
    .hero-index .hero-messaging-png {
        max-width:836px;
    }
}
/* Tagline Slider*/
.tagline-slider {
}
.tagline-slider .slick-list {
    overflow:visible;
}
.tagline-slide {
    padding-bottom:700px;
    margin-bottom:-700px;
}
.tagline-slide__text {
    font-family: "Montserrat", sans-serif;
    font-weight:700;
    font-size:24px;
    color:#fff;
    letter-spacing:0.01em;
    line-height:1.1;
    text-transform:uppercase;
    text-shadow: rgba(0,0,0,0.30) 0px 3px 6px;
    margin-top:0.5rem;
    margin-bottom:0;
}
@media all and (min-width:640px) {
    .tagline-slide__text {
        font-size:38px;
    }
}
@media all and (min-width:1024px) {
    .tagline-slide__text {
        font-size:50px;
    }
}
@-webkit-keyframes scale-in-bottom {
    0% {
        -webkit-transform: scale(0);
                transform: scale(0);
        -webkit-transform-origin: 50% 100%;
                transform-origin: 50% 100%;
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(1);
                transform: scale(1);
        -webkit-transform-origin: 50% 100%;
                transform-origin: 50% 100%;
        opacity: 1;
    }
}
@keyframes scale-in-bottom {
    0% {
        -webkit-transform: scale(0);
                transform: scale(0);
        -webkit-transform-origin: 50% 100%;
                transform-origin: 50% 100%;
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(1);
                transform: scale(1);
        -webkit-transform-origin: 50% 100%;
                transform-origin: 50% 100%;
        opacity: 1;
    }
}  
.tagline-slide.slick-current {
	-webkit-animation:scale-in-bottom 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: scale-in-bottom 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}


/************************************
/*----------------------------------
/* CART - samples shopping cart
/*----------------------------------
/*************************************/


.cart-button-link {
    display:block;
	padding:0.875rem 0;  
    font-family:'Montserrat', sans-serif;
    font-size:0;
    font-weight:700;
    text-transform:uppercase;
    color:#2465be; 
}
.cart-button-link svg {
	width:23px;
	height:20px;
	transition: all 200ms ease-in-out;
	-webkit-transition: all 200ms ease-in-out;
}
.cart-button-link svg {
	fill:#2465be;
}
#cart-popup-div {
    z-index:10000; 
    color:#6e6e6e; 
    position: fixed; 
    /* or absolute */ 
	left:50%;
	top:50%;
	-webkit-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);
    width:312px; 
    height:193px; 
    background:#FFF; 
    border:0px solid #989898; 
    text-align:center; 
    vertical-align: middle; 
    line-height: 22px; 
    border-radius: 0px; 
    font-weight:normal; 
    box-shadow: 0 0 10px #999;
    padding-top:10px;
}
.cart-popup-content {
    position:absolute;
    left:0;
    right:0;
    top:50%;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
.cart-image-popup {
    text-align: center;
    display:block;
}
.cart-image-popup-icon {
}
.cart-popup-title {
    display:block;
    text-align:center;
    font-size:1.063rem;
    font-weight:600;
    color:#284169;
    margin:0.313rem 0;
}
.cart-popup-text {
    display:block;
    text-align:center;
    font-size:1.063rem;
    color:#6e6e6e;
    margin:0.313rem 0;
}
.cart-popup-hr {
    background-color:#6E6E6E; 
    width:80%;
    border: none;
    height: 1px;
    margin:0.313rem auto;
}
.cart-popup-link {
    display:block;
    text-align:center;
    font-size:1.063rem;
    color:#2465be;
    font-weight:bold;
    text-transform:uppercase;
    margin-top:0.5rem;
}


/************************************
/*----------------------------------
/* PRODUCT DIAGRAM
/*----------------------------------
/*************************************/


.product-diagram {
	position:relative;
	display:block;
	width:100%;
	padding:2rem 0;
}
.product-diagram:not(.has-hints) {
	background:#000 url(../images/bg-products-diagram-mobile.jpg) center center no-repeat;
	background-size:cover;
}
.product-diagram-img {
	display:block;
	width:100%;
	max-width:600px;
	margin:0 auto;
}
.product-diagram-img.for-desktop {
	display:none;
}
.product-diagram-list {
	display:none;
	position:absolute;
	top:0;
	left:0;
	bottom:1rem;
	right:0;
	list-style: none;
	margin:0 auto;
	padding:0;
	max-width:1230px;
}
.product-diagram-list-item {
	font-family:"Montserrat", sans-serif;
	/*font-size:2rem;*/
	font-size:1.063rem;
	font-weight:700;
	color:#fff;
	/*letter-spacing:0.08em;*/
	position:absolute;
	bottom:0.5rem;
}
.product-diagram-list-item.is-current {
	text-transform:uppercase;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
	letter-spacing:0.01em;
}
.product-diagram-list-item.item-one {
	left:26%;
	-webkit-transform:translateX(-26%);
	transform:translateX(-26%);	
}
.product-diagram-list-item.item-two {
	left:66%;
	-webkit-transform:translateX(-66%);
	transform:translateX(-66%);		
}
.product-diagram-list-item.is-current.item-two {
	left:67%;
	-webkit-transform:translateX(-67%);
	transform:translateX(-67%);		
}
.product-diagram-list-item.item-three {
	left:79%;
	-webkit-transform:translateX(-79%);
	transform:translateX(-79%);
}
.product-diagram-list-item.is-current.item-three {
	left:83%;
	-webkit-transform:translateX(-83%);
	transform:translateX(-83%);
}
.product-diagram-list-item.item-four {
	left:92%;
	-webkit-transform:translateX(-92%);
	transform:translateX(-92%);		
}
.product-diagram-list-item.is-current.item-four {
	left:95%;
	-webkit-transform:translateX(-95%);
	transform:translateX(-95%);		
}
.product-diagram-list-item.item-five {
	left:49%;
	-webkit-transform:translateX(-49%);
	transform:translateX(-49%);	
}
.product-diagram-list-item.is-current.item-five {
	left:49%;
	-webkit-transform:translateX(-49%);
	transform:translateX(-49%);	
}
.product-diagram-list-item:before {
	display:block;
	content:"";
	width:19px;
	height:19px;
	background:#fff;
	border-radius:100%;
	position:absolute;
	left:0;
	right:0;
	/*bottom:292%;*/
	bottom:525%;
	margin:0 auto;
	transition:all 200ms ease-in-out;
    -webkit-transition:all 200ms ease-in-out;
	pointer-events:none;
}
/*
.product-diagram-list-item.item-one:before {
	bottom:252%;
}*/
.product-diagram-list-item.is-current:before {
	width:27px;
	height:27px;
	outline:1px solid #fff;
	outline-offset:5px;
}
.product-diagram-list-item:after {
	display:block;
	content:"";
	width:1px;
	/*height:225%;*/
	height:410%;
	background:#fff;
	position:absolute;
	left:0;
	right:0;
	/*bottom:80%;*/
	bottom:120%;
	margin:0 auto;
	transition:all 200ms ease-in-out;
    -webkit-transition:all 200ms ease-in-out;
	pointer-events:none;
}/*
.product-diagram-list-item.item-one:after {
	height:175%;
}*/
.product-diagram-list-item-link {
	font-family:"Open Sans", sans-serif;
	font-size:1.063rem;
	font-weight:400;
	color:#fff;
	letter-spacing:initial;
	cursor:pointer;
}
.product-diagram-list-item:not(.is-current):hover .product-diagram-list-item-link,
.product-diagram-list-item-link:hover {
	color:#d5c297 !important;
}
.product-diagram-list-item:not(.is-current):hover:before,
.product-diagram-list-item:not(.is-current):hover:after {
	background:#d5c297;
}
.product-diagram-list-item:not(.is-current):hover:before {
	width:27px;
	height:27px;
	outline:1px solid #d5c297;
	outline-offset:5px;
	border-radius:100%;
}
.has-hints {
}
.hint {
	display:block;
	margin:0 auto;
	opacity:0;
	width:250px;
	background:#D5C297;
	padding:1rem;
	position:absolute;
	top:calc(100% + 0.313rem);
	left:50%;
	-webkit-transform:translateX(-50%);
	transform:translateX(-50%);
	color:#284169;
	letter-spacing:initial;
	transition:all 200ms ease-in-out;
    -webkit-transition:all 200ms ease-in-out;
}
.hint:before {
    display: block;
    width: 0;
    height: 0;
    content: '';
	border-left:5px solid transparent;
	border-right:5px solid transparent;
	border-bottom:10px solid #d5c297;
    position: absolute;
    bottom: 100%;
    left: 50%;
    -ms-transform: translateX(-50%);
        transform: translateX(-50%);
}
.hint.is-active {
	opacity:1;
}
.hint-text {
	margin:0;
	font-weight:700;
}
.hint .checklist-alt {
	margin:0;
}


/************************************
/*----------------------------------
/* DETAILS PANEL
/*----------------------------------
/*************************************/


.details-panel {
	position:relative;
	background:#fff;
	padding:0 2rem;
	-webkit-box-shadow:0px 10px 10px 0px rgba(0,0,0,0.08);
    -moz-box-shadow:0px 10px 10px 0px rgba(0,0,0,0.08);
    box-shadow:0px 10px 10px 0px rgba(0,0,0,0.08);
}
.detail-item {
	padding:1.25rem 0;
}
.details-panel .columns:not(:last-of-type) .detail-item {
	border-bottom:1px solid #d5c297;
}
.detail-item-content {
	text-align:center;
}
.detail-circle-icon {
	display:block;
	position:relative;
	width:50px;
	height:50px;
	border:2px solid #2465BE;
	border-radius:100%;
	margin:0 auto;
}
.detail-icon {
	position:absolute;
	left:50%;
	top:50%;
	-webkit-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);
}
.detail-item-title {
	/*max-width:155px;*/
	margin:0.5rem auto 0;
	font-size:1rem;
	text-transform: uppercase;
	font-weight: 700;
}


/************************************
/*----------------------------------
/* MAIN
/*----------------------------------
/*************************************/


.main {
}
.main-index {
}
.main-interior {
}
.main-interior[class*="background"] {
	padding-bottom:0.063rem;
	margin-bottom:-0.063rem;
}
.primary-content {
}
.main-interior .primary-content {
	padding:3rem 0 0 0;
	position:relative;
}
.main-interior .primary-content:before {
	margin:0 auto;
	display:block;
	width:100px;
	height:14px;
	background:#D5C297;
	content:"";
	position:absolute;
	top:0;
	left:0;
	right:0;
}
.page-title {
	letter-spacing:0.01em;
}
.page-title small {
	letter-spacing:initial;
}
.page-title + .row {
	margin-top:-1rem; /* remove extra spacing from margining */
}
.page-title-index {
}

.primary-content img.float-right {
	margin-left:0.625rem;
}
.primary-content img.float-left {
	margin-right:0.625rem;;
}
.primary-content img.float-right,
.primary-content img.float-left {
	margin-top:0.625rem;
} 
.primary-content img.float-right,
.primary-content img.float-left,
.primary-content img.position-center {
	margin-bottom:0.625rem;
}
.primary-content img.position-center {
	display:block;
}
/* Off set Image Index */
.img-offset-01 {
    display:block;
    width:100%;
    max-width:none;
}
@media all and (min-width:1024px) {
    .img-offset-01 {
        width:140%;
        margin-left:-5%;
    }
}


/************************************
/*----------------------------------
/* INTRO CARD
/*----------------------------------
/*************************************/


.intro-card {
	position:relative;
	/*background-image: linear-gradient(90deg,#2465BE 0%, #2465BE 50%,#fff 50%,#fff 50%);*/
	-webkit-box-shadow: 0px 10px 30px 0px rgba(0,0,0,0.30);
	-moz-box-shadow: 0px 10px 30px 0px rgba(0,0,0,0.30);
	box-shadow: 0px 10px 30px 0px rgba(0,0,0,0.30);
}
.intro-card .row {
	margin-left:auto;
	margin-right:auto;
}
.intro-card .columns {
	position:relative;
}
.intro-card .columns:first-of-type {
	background:#2465be;
}
.intro-card-title {
	color:#fff;
	letter-spacing:0;
	padding:1rem;
}
.intro-card-title small {
	color:#D5C297 !important;
}
.intro-card-text {
	padding:1rem;
}


/************************************
/*----------------------------------
/* ICON ANCHOR
/*----------------------------------
/*************************************/


.icon-anchor {
	position:relative;
	text-align:center;
	padding-bottom:27px;
	height:100%;
}
.icon-anchor-link {
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
}
.icon-anchor-svg {
	fill:#284169;
}
.icon-anchor-text {
	text-transform:uppercase;
	color:#284169;
	margin:0 auto;
	position:absolute;
	bottom:0;
	left:0;
	right:0;
}
.icon-anchor-svg,
.icon-anchor-text {
	pointer-events:none;
}
.icon-anchor:hover .icon-anchor-svg {
	fill:#2465BE;
}
.icon-anchor:hover .icon-anchor-text {
	color:#2465BE;
}
.anchor-number {
	padding:1rem;
	background:#D5C297;
	position:absolute;
	top:0;
	left:0;
	font-family:"Montserrat", sans-serif;
	font-size:3.125rem;
	font-weight:700;
	color:#fff;
	text-align:center;
}

/************************************
/*----------------------------------
/* CONTENT BLOCKS
/*----------------------------------
/*************************************/


.content-block {
	position:relative;
	height:100%;
	-webkit-box-shadow: 4px 4px 15px 0px rgba(0,0,0,0.50);
	-moz-box-shadow: 4px 4px 15px 0px rgba(0,0,0,0.50);
	box-shadow: 4px 4px 15px 0px rgba(0,0,0,0.50);	
}
/*- If our content-block does not have a padding class, then give it a default padding -*/
.content-block:not([class*="pad-x"]):not([class*="pad-top"]):not([class*="pad-bottom"]) {
	padding-top:0.5rem;
	padding-bottom:0.5rem;
}
.content-block:not([class*="pad-y"]):not([class*="pad-right"]):not([class*="pad-left"]) {
	padding-left:2.188rem;
	padding-right:2.188rem;
}
/*- If our content block does not have a background color class, then give it a light blue [Accent Color] background -*/
.content-block:not([class*="background"]) {
	background:#ebebeb;
}
.content-block--flat {
	box-shadow:none;
}

/************************************
/*----------------------------------
/* CARDS
/*----------------------------------
/*************************************/


.cards {
	position:relative;
}
.card {
	position:relative;
	height:100%;
	padding-bottom:62px;
	background:#fff;
	-webkit-box-shadow: 0px 20px 40px 0px rgba(0,0,0,0.10);
    -moz-box-shadow: 0px 20px 40px 0px rgba(0,0,0,0.10);
	box-shadow: 0px 20px 40px 0px rgba(0,0,0,0.10);	
	z-index:100;
}
.card-media {
    background-color:#000;
	position:relative;
	overflow:hidden;
	z-index:150;
}
.card-img {
	display:block;
	width:100%;
}
.card-img.for-hover {
	position:absolute;
	top:0;
	left:0;
	right:0;
	opacity:0;
	-webkit-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-moz-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-ms-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
}
.card-header {
	padding:0.063rem;
	z-index:150;
}
.card-body {
	padding:0.063rem 2.375rem;
	z-index:150;
}
.card-title {
	color:#2465be;
}
.card-title small {
	text-transform:none;
	font-weight:500;
}
.card-text:first-of-type {
	margin-top:0;
}
.card-footer {
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	z-index:150;
}
.card-footer-btn {
	width:100%;
	padding:1.313rem 0;
}
.card-footer-btn:hover {
	top:0;
}
.card-footer-btn.background-white {
	color:#2465be;
}
.card-footer-btn.background-white .btn-icon {
	fill: #2465be;
}
.card-footer-btn.background-white:hover {
	background:#fff;
	color:#284169;
}
.card-footer-btn.background-white:hover .btn-icon {
	fill: #284169;
}
.card-icon {
	position:absolute;
	top:0;
	right:0;
	padding:0.625rem 0.625rem 0 0;
	-webkit-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-moz-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-ms-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
}
.card-icon-img {
	display:block;
}
.card-icon-text {
	margin:0;
	padding:0.5rem 1rem;
	position:absolute;
	top:calc(100% + 0.875rem);
	right:0.625rem;
	background:#1C1C1C;
	font-size:1rem;
	font-style:italic;
	color:#D5C297;
	-webkit-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
	-moz-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
	box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
	-webkit-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-moz-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-ms-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
}
.card-icon-text::before {
	position: absolute;
	content: '';
	display: block;
	width: 0;
	height: 0;	
	top: -0.438rem;
	right:1.188rem;	
	border: inset 0.5rem;
	border-color: transparent transparent #1c1c1c;
	border-bottom-style: solid;
	border-top-width: 0;
}
.card-options {
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	-webkit-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-moz-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-ms-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
}
.card-options-text {
	margin:0;
	padding:0 0 0.375rem 0.625rem;
	font-family:"Montserrat", sans-serif;
	font-size:1.125rem;
	font-weight:500;
	color:#fff;
	text-transform:uppercase;
}
.card-options-color {
	display:block;
	width:100%;
	height:17px;
	position:relative;
}
.stock-color-1 {
	background:#ff0000;
}
.stock-color-2 {
	background:#00b050;
}
.stock-color-3 {
	background:#0000cc;	
}
.stock-color-4 {
	background:#00b0f0;	
}
.stock-color-5 {
	background:#538dd5;	
}
.stock-color-6 {
	background:#e26b0a;	
}
.stock-color-7 {
	background:#ffc000;	
}
.stock-color-8 {
	background:#ffff00;	
}
.stock-color-black {
	background:#000;	
}
.stock-color-white {
	background:#fff;	
}
.is-transparent {
}
.is-clear {
	background:rgba(0,0,0,0.20);
}
.is-transparent:after,
.is-clear:after {
	display:block;
	margin:0 auto;
	content:"tinted";
	position:absolute;
	left:0;
	right:0;
	top:50%;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
	font-size:0.938rem;
	font-weight:600;
	color:#fff;
	text-transform:uppercase;
	text-align:center;
	line-height:1;
}
.is-clear:after {
	content:"clear";
}
/*---> Download Cards <---*/
.card.with-download {
	padding-bottom:124px;
}


/************************************
/*----------------------------------
/* PANELS [Forced Full Width Content]
/*----------------------------------
/*************************************/


.panel {
	width:100vw;
	max-width:100vw;
	position:relative;
	left:50%;
	right:50%;
	margin-left:-50vw !important;
	margin-right:-50vw !important;
	z-index:100;
	overflow:hidden;
}

/*- If our panel does not have a background color class, then give it a gray background -*/
.panel:not([class*="background"]) {
	background-color:#ebebeb;
}
.panel > .row:not(.expanded) {
	width:100%;
	max-width:1170px !important;
	max-width:73.125rem !important;
	margin-left:auto;
	margin-right:auto;	
}
.panel > .row:not(.expanded).columns {
	margin-left:auto !important;
	margin-right:auto !important;	
	padding-right:0.625rem !important;
	padding-left:0.625rem !important;
}
.panel:not([class*="background"]):has(.panel-bg-img):has(.color-white) {
    background-color:#000;
}
.panel-bg-img {
	display: block;
	position: absolute;
	left:-50vw;
	right:-50vw;
	top:50%;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
	width: auto;
	min-height: 100%;
	min-width: 100%;
	max-width: none;
	margin: 0 auto !important;
	z-index:-1;
}
.panel-bg-img.is-top-aligned {
	top:0;
	-webkit-transform:translateY(0);
	transform:translateY(0);
}
.catalog-panel {
	padding-bottom:55px;
}
.catalog-panel::before {
    width:100%;
    height:55px;
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    background-color:#fff;
    z-index:-1;
}
.catalog-panel-bg-img {
	top:calc(50% - 55px);	
}
.catalog-panel-messaging {
	padding:5rem 0;
}
.has-sample-img {
	margin:0 0 -55px 0;
}
.catalog-panel-media {
}



/************************************
/*----------------------------------
/* MEDIA BLOCKS
/*----------------------------------
/*************************************/


.media-block {
}
.media-block-media {
	position: relative;
	display:block;
}
.media-block-img {
	display:block;
	width:100%;
}
.media-block-content {
	display:block;
	width:100%;
	position:relative;
	padding:2rem;
}


/************************************
/*----------------------------------
/* CALLOUTS
/*----------------------------------
/*************************************/


.callout {
    background-color:#000;
	position:relative;
}
.callout-media {
}
.callout-link {
	display:block;
	position:relative;
}
.callout-img {
	display:block;
    width:100%;
}
.callout-header {
	margin:0;
	width:100%;
	position:absolute;
	left:50%;
	top:50%;
	-webkit-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);
	text-align:center;
	opacity: 1;
	-webkit-transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
	-o-transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
	transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
	pointer-events:none;
}
.callout-name,
.callout-title,
.callout-text {
	color:#fff;
	margin:0.625rem 0; /* Half of normal margining */
}
.callout-name,
.callout-title { /* Reset headers to h2 stylng so can use whatever header is appropriate */
	font-size:1.813rem;
	font-weight:500;
	text-transform:none;
	color:#fff;
}
.callout-title {
	color:#fff;
}
.callout-body {
	padding:1rem 10%;
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
	height: 100%;
	width: 100%;
	background:rgba(36,101,190,0.50);
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	text-align:center;
	opacity: 0;
	-webkit-transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
	-o-transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
	transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
	pointer-events:none;
}



/************************************
/*----------------------------------
/* TIMELINE
/*----------------------------------
/*************************************/

.timeline {
	position:relative;
	text-align:center;
}
.timeline::before {
	display:none;
	background-color:#2465be;
	content:'';
	width:1px;
	height:calc(100% - 21rem);
	position:absolute;
	top:9.25rem;
	left:50%;
}
.plot-point {
	position:relative;
	margin-right:-0.625rem;
	margin-left:-0.625rem;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-flow:row wrap;
	flex-flow:row wrap;
	-ms-flex-align:center;
	align-items:center;
	isolation:isolate;
}
.plot-point:not(:last-of-type) {
	margin-bottom:3rem;
}
.plot-point::before,
.plot-point::after {
	display:none;
	background-color:#2465be;
	content:'';
	position:absolute;
	z-index:-1;
}
.plot-point::before {
	width:33.33333%;
	height:1px;
	top:50%;
	right:50%;
	left:auto;
}
.plot-point.is-reversed::before {
	right:auto;
	left:50%;
}
.plot-point::after {
	width:30px;
	height:30px;
	top:calc(50% - 15px);
	right:calc(50% - 15px);
	border-radius:100%;
}
.plot-point-media {
}
.plot-point-img {
}
.plot-point-media,
.plot-point-content {
	padding-right:0.625rem;
	padding-left:0.625rem;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}


/************************************
/*----------------------------------
/* PRODUCT BREAKOUT
/*----------------------------------
/*************************************/


.product-breakout {
	padding-bottom:3rem;
}
.product-breakout::before {
	display:none;
	content:'';
	background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 694.61 58.06'%3E%3Cg%3E%3Cpath fill='%2380cdf4' opacity='0.27' d='m662.57,58.06c-16.81,0-28.1-9.93-28.1-24.72,0-19.63,14.5-33.34,35.27-33.34,10.97,0,19.14,3.48,24.28,10.33l.59.78-12.48,9.84-.62-.77c-3.14-3.9-6.87-5.56-12.47-5.56-10.27,0-17.17,7.12-17.17,17.71,0,6.94,4.78,11.09,12.78,11.09,2.14.03,4.27-.33,6.29-1.05l3.13-15.5h15.51l-4.86,24.29-.31.23c-5.73,4.3-13.49,6.67-21.85,6.67Zm7.17-56.06c-19.59,0-33.27,12.89-33.27,31.34,0,13.8,10.25,22.72,26.1,22.72,7.78,0,14.99-2.14,20.35-6.04l4.23-21.14h-11.43l-3.03,14.98-.51.2c-2.41.94-4.96,1.4-7.54,1.38-9.11,0-14.77-5.02-14.77-13.09,0-11.61,7.88-19.71,19.17-19.71,5.81,0,9.98,1.72,13.38,5.55l9.39-7.41c-4.78-5.82-12.2-8.77-22.08-8.77Zm-73.38,56.06c-16.62,0-27.8-9.93-27.8-24.72,0-19.32,14.57-33.34,34.65-33.34,16.63,0,27.8,9.93,27.8,24.72,0,19.32-14.57,33.34-34.65,33.34Zm6.85-56.06c-19.22,0-32.65,12.89-32.65,31.34,0,13.8,10.13,22.72,25.8,22.72h0c19.22,0,32.65-12.89,32.65-31.34,0-13.8-10.13-22.72-25.8-22.72Zm-276.97,56.06c-8.32,0-15.38-2.36-20.42-6.83-5.02-4.45-7.68-10.64-7.68-17.89,0-19.63,14.31-33.34,34.8-33.34,10.46,0,18.75,3.88,22.73,10.66l.44.75-12.57,10.02-.59-.95c-2.41-3.88-6.12-5.84-11.01-5.84-9.66,0-16.4,7.28-16.4,17.71,0,6.84,4.66,11.09,12.17,11.09h.06c4.81,0,9.3-2.14,12.33-5.87l.69-.85,10.45,10.27-.59.71c-5.89,7.08-13.64,10.37-24.41,10.37Zm6.7-56.06c-19.31,0-32.8,12.89-32.8,31.34,0,6.67,2.42,12.33,7,16.39,4.67,4.14,11.27,6.32,19.1,6.32h0c9.76,0,16.87-2.85,22.27-8.95l-7.58-7.45c-3.38,3.69-8.12,5.78-13.16,5.78h-.07c-8.6,0-14.16-5.14-14.16-13.09,0-11.42,7.74-19.71,18.4-19.71,5.23,0,9.29,1.97,12.08,5.85l9.46-7.54c-3.78-5.69-11.21-8.94-20.55-8.94Zm-89.78,56.06c-8.84,0-17.67-2.28-23.05-5.94l-.74-.5,6.93-13.15.92.58c5.21,3.33,11.23,5.11,17.41,5.16,5.07,0,8.23-1.45,8.23-3.77,0-2.1-3.85-3.13-8.3-4.34-7.55-2.04-17.88-4.83-17.88-15.84,0-12.3,10.55-20.25,26.87-20.25,7.88,0,14.95,1.69,19.93,4.77l.77.48-6.43,13.12-.94-.57c-4.29-2.63-9.21-3.96-14.25-3.93-5.21,0-8.71,1.7-8.71,4.24-.02,2.19,3.9,3.21,8.45,4.4,7.48,1.96,17.73,4.64,17.73,15.39,0,12.25-10.58,20.17-26.95,20.17Zm-21.17-7.11c5.12,3.17,13.12,5.11,21.17,5.11,15.16,0,24.95-7.13,24.95-18.17,0-9.2-8.63-11.46-16.24-13.45-5.35-1.4-9.98-2.61-9.94-6.35,0-2.87,2.8-6.23,10.7-6.23,5.02-.06,9.98,1.21,14.36,3.67l4.66-9.52c-4.61-2.59-10.99-4.01-18.1-4.01-15.11,0-24.87,7.16-24.87,18.25,0,9.48,8.71,11.83,16.4,13.91,5.25,1.42,9.78,2.64,9.78,6.27s-3.83,5.77-10.24,5.77c-6.2-.05-12.25-1.74-17.56-4.9l-5.08,9.65Zm340.15,6.03h-43l11.18-55.9h17.28l-8.32,41.81h25.72l-2.87,14.09Zm-40.56-2h38.93l2.06-10.09h-25.71l8.32-41.81h-13.21l-10.38,51.9Zm-5.11,2h-17.25l-2.16-10.47h-21.56l-6.24,10.47h-18.49L486.62,1.08h16.35l13.5,55.9Zm-15.62-2h13.08l-12.53-51.9h-13.68l-33.29,51.9h13.7l6.24-10.47h24.33l2.16,10.47Zm-61.29,2h-17.29l8.39-41.81h-16.56l2.87-14.09h50.32l-2.88,14.09h-16.47l-8.39,41.81Zm-14.84-2h13.21l8.39-41.81h16.48l2.06-10.09h-46.24l-2.06,10.09h16.55l-8.39,41.81Zm-13.81,2h-17.25l-2.16-10.47h-21.56l-6.24,10.47h-18.49L381.06,1.08h16.35l13.5,55.9Zm-15.62-2h13.08l-12.53-51.9h-13.68l-33.29,51.9h13.7l6.24-10.47h24.33l2.16,10.47Zm-194.27,2h-17.29l8.39-41.81h-16.56l2.87-14.09h50.32l-2.87,14.09h-16.48l-8.39,41.81Zm-14.84-2h13.21l8.39-41.81h16.48l2.06-10.09h-46.24l-2.06,10.09h16.55l-8.39,41.81Zm-18.14,2h-18.24l-8.01-14.32h-6.29l-2.85,14.32h-17.29L126.53,1.08h23.84c14.22,0,22.71,6.79,22.71,18.17l-.02,1c-.35,9.38-5.56,16.61-14.47,20.09l9.43,16.64Zm-17.07-2h13.64l-8.91-15.72,1.14-.39c9.06-3.12,14.26-10.27,14.26-19.61v-.4c-.2-10.03-7.72-15.77-20.71-15.77h-22.2l-10.38,51.9h13.21l2.85-14.32h9.11l8.01,14.32Zm-38.28,2h-17.25l-2.15-10.47h-21.56l-6.24,10.47h-18.5L82.83,1.08h16.35l13.5,55.9Zm-15.62-2h13.08L97.6,3.08h-13.68l-33.29,51.9h13.7l6.24-10.47h24.33l2.15,10.47Zm-79.77,2H0L11.18,1.08h23.61c14.53,0,22.87,6.68,22.87,18.32,0,14.27-10.85,23.48-27.64,23.48h-9.96l-2.77,14.09Zm-14.85-2h13.2l2.77-14.09h11.6c15.58,0,25.64-8.43,25.64-21.48,0-10.37-7.61-16.32-20.87-16.32H12.82L2.44,54.98Zm595.22-9.55c-8.33,0-13.71-5.11-13.71-13.01,0-11.47,7.54-19.79,17.94-19.79,8.33,0,13.7,5.11,13.7,13.01,0,11.47-7.55,19.79-17.94,19.79h0Zm4.24-30.8c-9.39,0-15.94,7.31-15.94,17.79,0,6.9,4.38,11.01,11.71,11.01,9.38,0,15.94-7.31,15.94-17.79,0-6.9-4.38-11.01-11.7-11.01Zm-105.11,20.64h-16.92l12.52-21.22,4.39,21.22Zm-13.41-2h10.96l-2.84-13.74-8.11,13.74Zm-92.16,2h-16.91l12.52-21.22,4.39,21.22Zm-13.41-2h10.96l-2.84-13.74-8.11,13.74Zm-284.81,2h-16.92l12.52-21.22,4.39,21.22Zm-13.41-2h10.96l-2.85-13.74-8.11,13.74Zm-48.88-2.39h-10.3l3.56-17.79h8.83c8.24,0,9.47,4.78,9.47,7.62,0,6.46-4.21,10.16-11.55,10.16Zm-7.87-2h7.87c4.36,0,9.55-1.42,9.55-8.16,0-1.39,0-5.62-7.47-5.62h-7.19l-2.76,13.79Zm123.22,2h-10.31l3.64-17.79h8.82c5.68,0,8.98,2.34,9.42,6.62h.05v1c0,6.46-4.23,10.16-11.62,10.16Zm-7.86-2h7.86c6.1,0,9.51-2.8,9.62-7.9v-.26c0-3.73-2.51-5.62-7.47-5.62h-7.19l-2.82,13.79Z'/%3E%3C/g%3E%3C/svg%3E") left center no-repeat;
	background-size:contain;
	width:694px;
	height:58px;
	position:absolute;
	bottom:0.5rem;
	left:56%;
}
.breakout-diagram,
.breakout-item-diagram {
	display:none;
	width:252px;
	height:auto;
	position:absolute;
	bottom:0;
	left:48%;
	-webkit-transform:translateX(-48%);
	transform:translateX(-48%);
	opacity:0;
	-webkit-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-moz-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	-ms-transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	transition:all .5s cubic-bezier(0.77, 0, 0.175, 1);
	pointer-events:none;
}
.breakout-diagram-img,
.breakout-item-diagram-img {
	display:block;
	width:100%;
}
.breakout-item {
	margin-right:-0.625rem;
	margin-left:-0.625rem;
	margin-bottom:1rem;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-flow:row wrap;
	flex-flow:row wrap;
}
.breakout-item-media {
	margin-top:0.5rem;
	padding-right: 0.625rem;
	padding-left:0.625rem;
	-ms-flex:0 0 auto;
	flex:0 0 auto;
}
.breakout-item-content {
	padding-right:0.625rem;
	padding-left:0.625rem;
	-ms-flex:1 1 0px;
	flex:1 1 0px;
}
.breakout-item-title {
	margin-top:0.5rem;
	margin-bottom:0.5rem;
}
.breakout-item-text {
	margin-top:0.5rem;
	margin-bottom:0.5rem;
}
.breakout-item-link {
	font-family: 'Montserrat', sans-serif;
	font-weight:700;
	text-transform:uppercase;
}
.breakout-item-link.color-white:hover {
	color:#284169;
}


/************************************
/*----------------------------------
/* LOCATIONS MAP
/*----------------------------------
/*************************************/


.locations-map {
	position:relative;

}
.map-bg-img {
	display:block;
	width:100%;
}
.map-modals {

}
.map-modal {

}
.map-modal:not(.is-active) {
	display:none;
}
.js-map-modal { /* JS Hook, no styling */
}
.map-modal-title {
	margin-top:0.5rem;
	margin-bottom:0.5rem;
}
.map-modal-title small {
	font-size:0.875rem;
	text-transform:none;
}
.map-modal-text {
	margin:0;
	font-size:0.938rem;
}
.map-modal-link {
	color:inherit;
	display:block;
}
.map-modal-link:hover {
	color:#2465be;
}
.map-points {
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
}
.map-point {
	position:absolute;
	cursor:pointer;
}
.js-map-point { /* JS Hook, no styling */
}
.map-point-icon {
	display:block;
	width:auto;
	transition:all 0.2s ease-out;
}
.map-point:hover .map-point-icon {
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}
.map-point[data-point="01"] { /* Fenton MO */
	top:33%;
	left:19%;
}
.map-point[data-point="02"] { /* Mexico */
	top:45%;
	left:16.1%;
}
.map-point[data-point="03"] { /* Ireland */
	top:29%;
	left:45.2%;
}
.map-point[data-point="04"] { /* Europe */
	top:33%;
	left:48%;
}
.map-point[data-point="05"] { /* China */
	top:46%;
	left:78%;
}
.map-point[data-point="06"] { /* Korea */
	top:39%;
	left:82.5%;
}


/************************************
/*----------------------------------
/* THUMBNAIL SLIDER
/*----------------------------------
/*************************************/

.thumbnail-slider {
}
.thumbnail-slide {
}
.thumbnail-slider-nav {
	padding:0;
	margin:0 auto 1.25rem;
    width:70%;
    max-width:390px;
}
.thumbnail-nav-slide {
	padding:0 0.625rem;
}
.thumbnail-nav-slide img {
	opacity:0.50;
	transition:all 200ms ease-in-out;
    -webkit-transition:all 200ms ease-in-out;
}
.thumbnail-nav-slide.slick-current img {
}
.thumbnail-nav-slide:hover {
	cursor:pointer;
}
.thumbnail-nav-slide:hover img,
.thumbnail-nav-slide.slick-current img {
	opacity:1;
}
.thumbnail-slider-nav .slick-next,
.thumbnail-slider-nav .slick-prev {
    left:initial;
    top:50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.thumbnail-slider-nav .slick-next:not(:hover),
.thumbnail-slider-nav .slick-prev:not(:hover) {
    background-color:transparent;
}
.thumbnail-slider-nav .slick-next {
    right:-44px;
}
.thumbnail-slider-nav .slick-prev {
    left:-44px;
}


/************************************
/*----------------------------------
/* PLOT DIAGRAM
/* (Dispensing Systems Guns, tried to make general & versatile )
/*----------------------------------
/*************************************/


.plot-diagram {
    position:relative;
}
.plot-diagram__media {
}
.plot-diagram__img {
    display:block;
    width:100%;
}
.plot-diagram__img--for-desktop {
    display:none;
}
.plot-diagram__content {
}
.plot-diagram__item {
    position:relative;
    isolation:isolate;
    z-index:1;
}
.plot-diagram__item:hover {
    z-index:4;
}
.plot-diagram__point {
    position:relative;
    width:44px;
    height:44px;
    background-color:#80cdf4;
    border-radius:100%;
    font-family:'Montserrat', sans-serif;
    font-size:1.063rem;
    font-weight:700;
    color:#284169;
    line-height:1;
    transition:all 200ms ease-in-out;
    -webkit-transition:all 200ms ease-in-out;
    cursor:pointer;
    display:none;
    /* Center Align Items */
    -ms-flex-pack:center;
    justify-content:center;
    /* Middle Align Items */
    -ms-flex-align:center;
    align-items:center;
    z-index:2;
}
.plot-diagram__modal {
    margin-bottom:0.625rem;
    position:relative;
    -webkit-transition: all 0.4s cubic-bezier(0, 1, 0.08, 1);
    -o-transition: all 0.4s cubic-bezier(0, 1, 0.08, 1);
    transition: all 0.4s cubic-bezier(0, 1, 0.08, 1);
    z-index:1; 
}
.plot-diagram__modal-header {
    position:relative;
    display:block;
    padding:1.25rem 1rem;
    padding-right:75px; /* width of ::before + 10px */
    background-color:#fafafa;
    border:3px solid #ededed;
}
.plot-diagram__modal-header::before {
    background-color:#ededed;
    content:"";
    width:65px;
    height:100%;
    position:absolute;
    top:0;
    right:0;
    bottom:0;
}
.plot-diagram__modal-header::after {
    content:'+';
    position:absolute;
    right:1.313rem;
    top:50%;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    font-weight:600;
    font-size:1.875rem;
    color:#284169;
    transition:all 200ms ease-in-out;
    -webkit-transition:all 200ms ease-in-out;
}
.plot-diagram__modal-title {
    font-family:'Montserrat', sans-serif;
    font-size:1.25rem;
    font-weight:600;
    color:#284169;
    text-transform:none;
    margin-top:0;
    margin-bottom:0;
}
.plot-diagram__modal-content {
    padding:1.563rem 0;
    display:none;
    -webkit-transition:all 0.4s cubic-bezier(0, 1, 0.08, 1);
    -o-transition:all 0.4s cubic-bezier(0, 1, 0.08, 1);
    transition:all 0.4s cubic-bezier(0, 1, 0.08, 1); 
}
.plot-diagram__modal-content.is-active {
    display:block;
}
.plot-diagram__modal-text {
    margin-top:0;
    margin-bottom:0;
}
.plot-diagram__modal-text + .plot-diagram__modal-text {
    margin-top:1.25rem;
}
@media all and (min-width:1025px) {
    .plot-diagram__content {
        position:absolute;
        top:0;
        left:0;
        bottom:0;
        right:0;
    }
    .plot-diagram__item {
        width:290px;
        position:absolute;
    }
    .plot-diagram__point {
        margin-left:auto;
        margin-right:auto;
        /* Flex It! */
        display:-ms-flexbox;
        display:flex;
    }
    .plot-diagram__modal {
        background-color:#fff;
        margin:0 auto;
        padding:1.563rem;
        position:absolute;
        top:35px;
        left:0;
        right:0;
        visibility:hidden;
        opacity:0;
        -webkit-box-shadow:5px 10px 15px 0px rgba(0,0,0,0.20);
        -moz-box-shadow:5px 10px 15px 0px rgba(0,0,0,0.20);
        box-shadow:5px 10px 15px 0px rgba(0,0,0,0.20);
    }
    .plot-diagram__modal.is-active {
        visibility:visible;
        opacity:1;
    }
    .plot-diagram__modal-header {
        padding:0;
        margin-bottom:0.313rem;
        background-color:transparent;
        border:0;
    }
    .plot-diagram__modal-header::before,
    .plot-diagram__modal-header::after {
        display:none;
    }
    .plot-diagram__modal-title {
        /*font-size:1.875rem;*/
    }
    .plot-diagram__modal-content {
        display:block;
        padding:0;
    }
}
@media all and (min-width:1025px) {
    .plot-diagram__img--for-desktop {
        display:block;
    }
    .plot-diagram__img--for-mobile {
        display:none;
    }
}
/*---> 2 component Specific <---*/
.plot-diagram__media--2component {
    position:relative;
    width:calc(100% + 0.625rem);
    margin-left:-0.625rem; /* Pull left over column padding */
}
.plot-diagram__media--2component::after {
    content:'';
    width:45%;
    max-width:411px;
    height:100%;
    position:absolute;
    bottom:5%;
    right:0;
    background:url(../images/bg-clayton-corp-branding-mark-411x423.png) bottom right no-repeat;
    background-size:100% auto;
}
@media all and (min-width:1025px) {
    .plot-diagram__media--2component,
    .plot-diagram__content--2component {
        width:116.66667%;
        max-width:1139px;
        margin-left:-16.66667%;
    }
    .plot-diagram__media--2component::after {
        bottom:-15%;
        right:-18%;
    }
    .plot-diagram__item--2component-01 {
        right:52%;
        bottom:73%;
    }
    .plot-diagram__item--2component-02 {
        right:34%;
        bottom:89%;
    }
    .plot-diagram__item--2component-03 {
        right:26.5%;
        bottom:37%;
    }
    .plot-diagram__item--2component-04 {
        right:22.5%;
        bottom:82%;
    }
    .plot-diagram__item--2component-05 {
        right:3.5%;
        bottom:75%;
    }
}


/************************************
/*----------------------------------
/* PRODUCT COLOR FILTER (Just colors now, plan to make a filter) similar to this:
/* https://www.swisstrax.com/ribtrax-pro-flooring-tile.html
/*----------------------------------
/*************************************/


.filter-control {
    margin-bottom:1.5rem;
    list-style:none;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
    gap:0.625rem;
    max-width:370px;
}
.filter-control__item {
    flex:0 0 calc(14.28% - 0.54rem);
	border-radius:7px;
	-webkit-box-shadow: 0px 5px 8px 0px rgba(0,0,0,0);
	-moz-box-shadow: 0px 5px 8px 0px rgba(0,0,0,0);
	box-shadow: 0px 5px 8px 0px rgba(0,0,0,0);
	-webkit-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
	cursor:pointer;
	overflow:hidden;
    color:#000;
}
.filter-control__item:hover {
	-webkit-box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.4);
	-moz-box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.4);
	box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.4);
}
.filter-control__swatch {
    display:block;
    width:100%;
    padding-bottom:100%;
}
.filter-control__swatch--red,
.filter-control__swatch--blue,
.filter-control__swatch--black {
    color:#fff; /* Accessibility */
}
.filter-control__swatch--orange,
.filter-control__swatch--yellow,
.filter-control__swatch--green,
.filter-control__swatch--gray {
    color:#000; /* Accessibility */
}
.filter-control__swatch--red {
    background-color:#d12229;
}
.filter-control__swatch--orange {
    background-color:#d17d31;
}
.filter-control__swatch--yellow {
    background-color:#ffc628;
}
.filter-control__swatch--green {
    background-color:#5fbb46;
}
.filter-control__swatch--blue {
    background-color:#282e71;
}
.filter-control__swatch--gray {
    background-color:#909090;
}
.filter-control__swatch--black {
    background-color:#000000;
}


/************************************
/*----------------------------------
/* EMPOWEREN FORMS
/*----------------------------------
/*************************************/


.cmForm {
}
.formElements h2 {
	color:#2465be;
	margin:1rem 0;
}
.formElements .formRow {
	clear:both;
	margin-left:auto;
	margin-right:auto;
}
.formElements .formRow > ul {
	width:100%;
	padding:0;
	margin:0;
	display:block;
	margin:0;
}
.formElements .formRow > ul > li.required > label::after,
.formElements .formRow > ul > li.required legend::after {
	content: "*";
	font-family:'Montserrat', sans-serif;	
	font-weight:500;
	font-size:1rem;
	color:#484848;
}
.formElements fieldset legend  {
	/*font-weight:700 !important;
    color:#284169;*/
}
form ul li {
	display:block;
	width:100%;
	position:relative;
	margin:0 0 0.875rem 0 !important;
	padding:0 !important;
	text-indent:0;
}
span label {
	font-family:inherit;
	font-weight:inherit !important;
	font-size:inherit;
	color:inherit;
}
form ul li {
	display:block;
	width:100%;
	position:relative;
	margin:0 0 0.875rem 0 !important;
	padding:0 !important;
	text-indent:0;
}
.currentForm input[type="submit"] {
    margin-top:1rem !important;
}

li[id^="date_picker"] {
	position:relative;
}
.ui-datepicker-trigger,
.formElements li[id^="date_picker"] .smaller {
	display:none;
}

#form-4418 { /*- Cart Form -*/
	padding:3rem;
	margin-bottom:3rem;
	background:#fff;
    -webkit-box-shadow: 0px 20px 40px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 20px 40px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 20px 40px 0px rgba(0,0,0,0.25);
}
#checkbox-57051 fieldset span {
	width:33%;
	max-width:75px;
	float:left;
}
/* Contact Form */
#textarea-68501 textarea {
    height: 2.688rem !important;
}


/************************************
/*----------------------------------
/* STYLE GUIDE
/*----------------------------------
/*************************************/


.style-guide {
}
.style-guide-anchor {
	padding:0.063rem 0;
	width:100vw;
	max-width:100vw;
    position:relative;
    left:50%;
    right:50%;
	margin:2rem -50vw !important;
	z-index:600;
	background-color:#ebebeb;
}
.style-guide-anchor > .row {
	max-width:1170px !important;
	max-width:73.125rem !important;
	margin-left:auto !important;
	margin-right:auto !important;
}
.anchor {
	margin:0;
	display:block;
	width:35px;
	height:35px;
	position:absolute;
	right:0.625rem;
	top:50%;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
	border-radius:100%;
	line-height:35px;
	background:#2465be;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
	transition: all 0.3s linear;
	z-index:1;
}
.anchor svg {
    margin-top:0.438rem;
	fill:#fff;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
	transition: all 0.3s linear;
}
.anchor:hover {
	background:#284169;
}
.example {
	margin:1.5rem 0;
	padding:1.875rem 0.938rem;
	position:relative;
	border:1px solid #284169;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
}
.colors {
}
.colors .box {
	margin:1.5rem 0;
	background:#fff;
	border:1px solid #284169;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
}
.colors .box div {
	width:100%;
	padding:0.313rem 0;
}
.colors .box div h6 {
	font-size:1.25rem;
	font-weight:400;
}
.styled-developers-hint {
	background:#e8f5e1;
	border:1px solid #ADDB94;
	padding:0.313rem 1rem;
	margin:1.25rem 0;
}
.styled-developers-hint h6 {
	font-weight:700;
	margin-bottom:0;
}
.styled-developers-hint p {
	font-size:0.875rem;
	line-height:1.6;
}
.styled-developers-hint h6 + p {
	margin-top:0.5rem;
}


/************************************
/*----------------------------------
/* COLOPHON
/*----------------------------------
/*************************************/


.colophon {
	background:#284169;
	padding-top:3.25rem;
	padding-bottom:1.25rem;
}
.colophon-text {
	margin-top:0;
	margin-bottom:2rem;
	color:#fff;
    text-align:center;
}
.colophon-link {
	color:#fff;
}
.colophon-branding-link {
	display:block;
	width:100%;
	max-width:265px;
    margin-left:auto;
    margin-right:auto;
}
.colophon-branding-link svg {
	display:block;
	width:100%;
	height:auto;
	fill:#fff;
	-webkit-transition: all 350ms linear 50ms !important;
	transition: all 350ms linear 50ms !important;
}
.colophon-branding-link:hover svg {
	fill:#80cdf4;
}
.social-list {
    margin-left:0;
	margin-top:0;
	margin-bottom:2rem;
	display:flex;
    flex-flow:row wrap;
	list-style:none;
    justify-content:center;
}
.social-list__item {
	line-height:1;
}
.social-list__item:not(:last-of-type) {
	margin-right:0.625rem;
}
.social-list__item::before {
    display:none;
}
.social-link {
	display:inline-block;
    width:45px;
	height:45px;
	border-radius:7px;
	background-color:#80cdf4;
	position:relative;	
}
.social-link:is(:hover, :active) {
	background-color:#fff;
}
.social-link:active {
    -webkit-box-shadow: 0 0 0 2px #284169, 0 0 0 4px #fff;
    -moz-box-shadow: 0 0 0 2px #284169, 0 0 0 4px var(--color-primary-dark);
    box-shadow: 0 0 0 2px #284169, 0 0 0 4px #fff;
}
.social-link:is(:focus, :focus-visible) {
    border:0;
    outline:0;
}
.social-link:is(:focus-visible) {
    -webkit-box-shadow: 0 0 0 2px #284169, 0 0 0 4px #80cdf4;
    -moz-box-shadow: 0 0 0 2px #284169, 0 0 0 4px #80cdf4;
    box-shadow: 0 0 0 2px #284169, 0 0 0 4px #80cdf4;
}
.social-link__icon {
    position:absolute;
    inset:0;
    margin:auto;
	fill:#284169;
	transition:all 200ms ease-in-out;
    -webkit-transition:all 200ms ease-in-out;
}