@charset "utf-8";
/* CSS Document */

/*-- modal function  ---*/

.productModal input {
	display: none;
}

#more0:checked~.m0, 
#chevron0:checked~.chevronm0 {
    opacity: 1 !important;
    z-index: 101;
	width: 125%;
}

#more1:checked~.m1, 
#more2:checked~.m2, 
#more3:checked~.m3,
#chevron1:checked~.chevronm1, 
#chevron2:checked~.chevronm2, 
#chevron3:checked~.chevronm3 {
    opacity: 1 !important;
    z-index: 101;
	width: 60%;
}

#more0:checked~.m0 .content0:after, 
#more1:checked~.m1 .content1:after, 
#more2:checked~.m2 .content2:after, 
#more3:checked~.m3 .content3:after,
#chevron0:checked~.chevronm0 .chevroncontent0:after, 
#chevron1:checked~.chevronm1 .chevroncontent1:after, 
#chevron2:checked~.chevronm2 .chevroncontent2:after, 
#chevron3:checked~.chevronm3 .chevroncontent3:after {
	opacity: 0;
	transition: opacity .2s ease-in-out 800ms;
	z-index: 99;
}

#more0:checked~#nav0 .closeBtn, 
#more1:checked~#nav1 .closeBtn, 
#more2:checked~#nav2 .closeBtn, 
#more3:checked~#nav3 .closeBtn,
#chevron0:checked~#nav0 .closeBtn, 
#chevron1:checked~#nav1 .closeBtn, 
#chevron2:checked~#nav2 .closeBtn, 
#chevron3:checked~#nav3 .closeBtn {
    opacity: 1 !important;
	transition: opacity .2s ease-in-out 800ms;
}

#close0:checked~#nav0 .closeBtn, 
#close1:checked~#nav1 .closeBtn, 
#close2:checked~#nav2 .closeBtn, 
#close3:checked~#nav3 .closeBtn {
	opacity: 0 !important;
	transition: opacity .2s ease-in-out 0ms;
}

#close0:checked~.m0, 
#close1:checked~.m1, 
#close2:checked~.m2, 
#close3:checked~.m3,
#close0:checked~.chevronm0, 
#close1:checked~.chevronm1, 
#close2:checked~.chevronm2, 
#close3:checked~.chevronm3 {
	opacity: 0 !important;
    z-index: 1;
	width: 0;
}

#close0:checked~.m0 .content0:after, 
#close1:checked~.m1 .content1:after, 
#close2:checked~.m2 .content2:after, 
#close3:checked~.m3 .content3:after,
#close0:checked~.chevronm0 .chevroncontent0:after, 
#close1:checked~.chevronm1 .chevroncontent1:after, 
#close2:checked~.chevronm2 .chevroncontent2:after, 
#close3:checked~.chevronm3 .chevroncontent3:after {
	opacity: 1;
	transition: opacity .2s ease-in-out 0ms;
	z-index: 101;
}

#more1:checked~.m1 .content1 p a,
#more2:checked~.m2 .content2 p a,
#more3:checked~.m3 .content3 p a,
#chevron1:checked~.chevronm1 .chevroncontent1 p a,
#chevron2:checked~.chevronm2 .chevroncontent2 p a,
#chevron3:checked~.chevronm3 .chevroncontent3 p a {
	z-index: 100;
	opacity: 1;
}

#close1:checked~.m1 .content1 p a,
#close2:checked~.m2 .content2 p a,
#close3:checked~.m3 .content3 p a,
#close1:checked~.chevronm1 .chevroncontent1 p a,
#close2:checked~.chevronm2 .chevroncontent2 p a,
#close3:checked~.chevronm3 .chevroncontent3 p a {
	z-index: 99;
	opacity: 0;
}

/*-- productContainer styles --*/

.productModal {
    position: relative;
    display: flex;
    flex-direction: row;
    height: auto;
}


.productModal .productContainer {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: row;
	column-gap: 40px;
	row-gap: 40px;
    z-index: 2;
	margin: 80px 0;
}

.productModal .productContainer .visual {
    justify-content: center;
    align-items: center;
    display: flex;
}

.productModal .productContainer .visual.video {
	flex: 1 0 64%;
	border-top: 1px solid #e1e2e0;
    transition: all .4s ease-in-out;
    border: 1px;
    box-shadow: 0px 10px 30px 5px #0000001A;
    background: white;
    object-fit: cover;
}

.productModal .productContainer .visual.video .video-container {
    margin: 0px;
}

.productModal .productContainer .title {
    flex: 1 0 30%;
	display: flex;
    flex-direction: column;
    justify-content: center;
	row-gap: 30px;
}

.productModal .productContainer .title h2 {
    margin: 0 !important;
}


.productModal .productContainer .visual.video .video-container .postcontent-video-watch-time-wrapper {
	display: none;
}
.productModal .productContainer .visual img, .productModal .productContainer .visual object {
	width: 100%;
	max-width: 600px;
}
/*-- navigation styles --*/

.productContainer .title .navigation {
    display: inline-flex;
    column-gap: 20px;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}

.productModal .navigation label.moreBtn {
    border-radius: 20px!important;
    cursor: pointer;
    display: inline-flex;
    font-family: Open Sans;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .8px;
    line-height: 26px;
    margin: 0;
    max-height: 40px!important;
    min-height: 40px!important;
    min-width: 0;
    padding: 7px 30px;
    text-align: left;
    text-transform: uppercase;
    transition: all .15s ease-in-out;
    border: 1px solid var(--brandGreen)!important;
    color: var(--brand-grey)!important;
	position: relative;
    z-index: 2;
}

.productModal .navigation label.moreBtn:after {
    content: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTQuNSAyIDUgNS01IDUiIHN0cm9rZT0iIzM3M0EzNiIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjwvc3ZnPg==);
    margin-left: 0;
    opacity: 0;
    transition: all .4s ease;
    width: 0;
}

.productModal .navigation label.moreBtn:hover:after {
    margin-left: 12px;
    opacity: 1;
    width: 12px;
}

.productModal .navigation label.chevronBtn {
	text-transform: uppercase;
    width: auto;
    min-width: auto;
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: .0125rem;
    line-height: 18px !important;
    text-decoration: none !important;
    position: relative;
    transition: 400ms ease-in ease-out !important;
    background: none !important;
    border: 0;
    margin: 0 !important;
    padding: 0;
    color: var(--brand-grey)!important;
	cursor: pointer;
}

.productModal .navigation label.chevronBtn:hover {
	color: var(--brandGreen)!important;
}

.productModal .navigation label.chevronBtn:after {
    content: "\203A";
    display: inline;
    color: #89C925;
    font-size: 22px;
    line-height: 13px;
    margin-left: 8px;
    position: absolute;
    top: 0;
    transition: 400ms;
}

.productModal .navigation label.chevronBtn:hover:after {
	margin-left: 0.9375rem;
}

.productModal .navigation label.closeBtn {
	opacity: 0;
	position: absolute;
    top: 20px;
    right: 20px;
    height: 32px !important;
    max-height: 32px !important;
    min-height: 32px !important;
    background: transparent;
    border: 0.8px solid var(--text-grey-3);
    border-radius: 50%;
    width: 32px;
	transition: all .2s ease-in-out, opacity .2s ease-in-out 800ms;
    cursor: pointer;
    z-index: 102;
}

.productModal .navigation label.closeBtn hr:nth-of-type(1), 
.productModal .navigation label.closeBtn hr:nth-of-type(2) {
	background: var(--text-grey-3) !important;
    border: 0 !important;
    height: 1px !important;
    width: 18px;
    inset: 0;
    margin: 0 !important;
    position: absolute !important;
    top: 50%;
    left: 20%;
    transform: rotate(45deg);
    transition: all .2s ease-in-out;
}

.productModal .navigation label.closeBtn hr:nth-of-type(2) {
    transform: rotate(-45deg);
}

.productModal .navigation label.closeBtn:hover {
	background: #4E5859;
    border: 0.8px solid #4E5859;
}

.productModal .navigation label.closeBtn:hover hr {
	background: white;
}

/*-- modalContainer styles --*/

.productModal .modalContainer {
    display: flex;
	opacity: 0;
    z-index: 1;
    position: absolute;
    border-top: 1px solid #e1e2e0;
    background: var(--brand-grey);
    transition: all 800ms ease-in-out;
	transition-delay: .2s;
    border: 1px;
    box-shadow: 0px 10px 30px 5px #0000001A;
    padding: 80px 20px 50px 50px !important;
    top: 0;
    right: 0;
	height: 100%;
    width: 0%;
}

.productModal .modalContainer .modalContent {
	transition: .4s ease-in-out;
	transition-delay: 800ms;
	display: flex;
    flex-direction: column;
    justify-content: flex-start;
	row-gap: 20px;
	overflow: hidden;
	position: relative;
	overflow-y: auto;
    padding-right: 30px;
}

.productModal .modalContainer .modalContent >* {
    margin: 0 !important;
}

.productModal .modalContainer .modalContent p,
.productModal .modalContainer .modalContent h3 {
	margin: 0;
	color: white !important;
}

.productModal .modalContainer .modalContent h3 {
	margin-top: 10px;
}

.productModal .modalContainer .modalContent p a {
	z-index: 99;
	opacity: 0;
    color: white !important;
    position: relative;
	transition: opacity 400ms ease-in-out 800ms, z-index 125ms, background 125ms;
}

.productModal .modalContainer .modalContent p a:hover {
    color: var(--brand-grey) !important;
}

.productModal .modalContainer .modalContent p a.more-link:hover {
	color: #ffffff !important;
}

.productModal .modalContainer .modalContent:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--brand-grey);
	opacity: 1;
	transition: 400ms ease-in-out;
	transition-delay: 800ms;
	z-index: 99;
}


/*-- left oriented block --*/

.productModal .productContainer.a-left {
    flex-direction: row-reverse;
}

.productModal .a-left .modalContainer {
    left: 0;
}

.productModal .a-left .navigation label.closeBtn {
    left: 56%;
}

/*-- featured product styles --*/

.featuredProd {
	min-height: 85vh;
    height: 100%;
}

.featuredProd .productContainer {
    min-height: 70vh;
	height: auto;
	margin: auto;
}

#teams.featuredProd {
	min-height: 50vh;
    height: 100%;
	padding: 50px 0px !important;
}

#teams.featuredProd .productContainer {
    min-height: 50vh;
}

.featuredProd .productContainer .visual.video {
    flex: 1 0 45%;
}

.featuredProd .productContainer .visual.video .video-container {
    aspect-ratio: unset;
    height: 100%;
}

.featuredProd .productContainer .title {
	position: relative;
}

.featuredProd .productContainer .title >*, 
.featuredProd .productContainer .title a:not(.g-full) {
    color: white !important;
    margin: 0 !important;
}

.featuredProd .productContainer .title a:hover:not(.g-full) {
    color: var(--brand-grey) !important;
}

#postcontent .featuredProd .productContainer .title p.multibtns, #postcontent .featuredProd .productContainer .title div.multibtns {
    margin: 0 !important;
}

.featuredProd .navigation label.moreBtn {
    border: 0 !important;
    background-color: var(--brandGreen)!important;
}

.featuredProd .navigation label.chevronBtn {
	color: white !important;
}

.featuredProd .navigation label.chevronBtn:hover {
	color: var(--brandGreen)!important;
}

.featuredProd .navigation label.closeBtn {
    top: 12.5%;
}

.featuredProd .modalContainer {
    background: var(--white);
    height: 80%;
    top: initial;
}

.featuredProd .modalContainer .modalContent h3,
.featuredProd .modalContainer .modalContent p {
    color: var(--brand-grey) !important;
}

.featuredProd .modalContainer .modalContent:after {
    background: var(--white);
}

@media only screen and (max-width: 1024px) {
	
	/*-- adjustments for mobile devices --*/
	
	.productModal .productContainer, .productModal .productContainer.a-left {
		flex-direction: column;
	}
	
	.productModal .a-left .navigation label.closeBtn {
		right: 20px;
		left: auto;
	}
	
	.productModal .productContainer .visual.video {
		flex: 1 0 auto;
	}
	
	#more1:checked~.m1, #more2:checked~.m2, #more3:checked~.m3 {
		opacity: 1 !important;
		z-index: 101;
		width: 100%;
	}
	
	.productModal .modalContainer {
		padding: 80px 2% 8% 8% !important;
		left: 0;
	}
	
	.productModal .modalContainer .modalContent {
		overflow-y: auto;
		justify-content: flex-start;
	}
	
	/*-- featured product styles --*/
	
	#more0:checked~.m0 {
		width: 100%;
	}
	
	.featuredProd .productContainer {
		min-height: 70vh;
		height: auto;
		margin: 50px 0px;
	}
	
	.featuredProd .productContainer .title {
		position: unset;
		flex: unset;
	}
	
	.featuredProd .modalContainer {
		top: 11%;
	}
}


