/*
	DEVELOPER NOTE
	Anywhere you see magenta, that's a fallback color to alert the person loading in content that they forgot to assign a valid crop type to a card.
	It will be overwritten when a valid crop data attribute has been applied to the card element.
*/

:root{
	--corn-accent: #aab400;
	--corn-accent-dark: #7f9333;
	--soy-accent: #7f9333;
	--wheat-accent: #ffb400;
	--wheat-accent-dark: #eb8200;
}

#explore{
	border-top: 10px solid var(--corn-accent);
	padding: 50px 0;
	border-bottom: 10px solid var(--corn-accent);
}
#explore h3 {
    margin-bottom: 45px;
    font-size: 36px;
    text-align: center;
    color: #FFF;
}
.bg-green-gradient{
	background: transparent linear-gradient(180deg, #415200 0%, #404A1A 100%) 0% 0% no-repeat padding-box;
}

/*************************************
Filter bar
*************************************/

.filter-instructions{
	color: white;
	font-weight: bold;
	font-size: 24px;
	line-height: 30px;
}
.dropdown-wrapper label{
	color: white;
	font-weight: bold;
	font-size: 18px;
	line-height: 24px;
	text-transform: uppercase;
	display: block;
	border-bottom: 1px solid var(--corn-accent);
	margin-bottom: 5px;
	margin-top: 15px;
}
.dropdown-wrapper select{
	width: 100%;
	border-radius: 5px;
	font-size: 16px;
	padding: 7px 12px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image:
		linear-gradient(55deg, transparent 50%, black 50%),
		linear-gradient(125deg, black 50%, transparent 50%);
		/* linear-gradient(to right, #ccc, #ccc); */ /* Vertical divider */
	background-position:
		calc(100% - 20px) calc(1em + 0px),
		calc(100% - 14px) calc(1em + 0px);
		/* calc(100% - 2.5em) 0.5em; */ /* Vertical divider */
	background-size:
		6px 8px,
		6px 8px,
		1px 1.5em;
	background-repeat: no-repeat;
}
.dropdown-wrapper select:hover{
	cursor: pointer;
}
.dropdown-wrapper select:focus-visible, button:focus-visible{
	outline-color: var(--corn-accent);
}
button#filter-reset{
	border-radius: 100px;
	border: none;
	text-transform: uppercase;
	color: white;
	font-size: 18px;
	font-weight: bold;
	/* background: transparent; */
	background-color: rgba(255,255,255,0.075);
	margin-left: 15px;
	padding-right: 20px;
}
button#filter-reset:not([disabled]):hover {
	background-color: rgba(255,255,255,0.1);
}
button#filter-reset i{
	padding: 10px;
	transition: transform 0.5s;
}
button#filter-reset:not([disabled]):hover i {
	/* background-color: rgba(255,255,255,0.1); */
	/* border-radius: 100px; */
	transform: rotate(-22.5deg);
	transition: transform 0.5s;
}
button#filter-reset:disabled{
	opacity: 0.5;
	cursor: not-allowed;
	/* background: transparent; */
}
.filter-divider{
	border-color: var(--corn-accent);
}
.filter-instructions::selection, .dropdown-wrapper label::selection{
	background-color: #A9B500;
	color: black;
}
button#filter-reset::selection, .dropdown-wrapper select::selection{
	background-color: transparent;
}

/*************************************
Cards - Initial small size
*************************************/

.grid-item-initial{
	background-color: white;
	border-top: 20px solid magenta;
	border-radius: 0 0 25px 25px;
	box-shadow: 0px 8px 8px #00000029;
	text-align: center;
	margin-bottom: 30px;
	display: block;	padding: 20px 20px 80px 20px;
	cursor: pointer;
}
.grid-item-initial:hover{
	box-shadow: 0px 16px 16px #00000055;
}
/* .grid-item-initial:hover::after{
	right: 40px;
	transition: all 0.5s;
} */
.grid-item-initial:hover p{
	transform: scale(1.05);
	transition: all 0.5s;
}
.grid-item-initial p{
	font-size: 26px;
	line-height: 40px;
	font-weight: bold;
	color: black;
	min-height: 225px;
	transition: all 0.5s;
}
.grid-item-initial p span{
	font-size: 57px;
	line-height: 86px;
	display: block;
	transition: all 0.5s;
}
.grid-item-initial p::selection, .grid-item-initial sup::selection, .grid-item-initial p span::selection, .grid-item-initial br::selection{
	background-color: #405100;
	color: white;
}
.grid-item-initial::before{
	/* width: calc(50% - 35px); */
	width: 100%;
	height: 45px;
	background-color: magenta;
	display: block;
	position: absolute;
	left: 35px;
	bottom: 60px;
	content: " ";
}
.grid-item-initial::after{
	width: calc(50% - 45px);
	height: 20px;
	color: magenta;
	display: block;
	position: absolute;
	right: 45px;
	bottom: 70px;
	content: "See More";
	text-align: right;
	font-weight: bold;
	text-transform: uppercase;
	transition: all 0.5s;
	background-repeat: no-repeat;
	background-position-x: right;
	background-position-y: 5px;
	padding-right: 15px;
}

/*************************************
Cards - Expanded large size
*************************************/

.grid-item-expanded{
	display: none;
}

.is-expanded .grid-item-expanded{
	background-color: white;
	border-top: 20px solid magenta;
	border-radius: 0 0 25px 25px;
	box-shadow: 0px 8px 8px #00000029;
	text-align: center;
	margin-bottom: 30px;
	padding: 20px 80px 35px 80px;
}

.grid-item.is-expanded .grid-item-initial{
	display: none;
}
.is-expanded{
	width: 100%;
}
.grid-item.is-expanded .grid-item-expanded{
	display: block;
	position: relative;
	z-index: 1;
}

.grid-item-expanded .expanded-header .logo-container, .grid-item-expanded .expanded-header .copy-container{
	width: calc(50% - 120px);
	display: inline-block;
	height: 150px;
}
.grid-item-expanded .expanded-header .logo-container {
	border-right: 2px solid magenta;
	text-align: right;
}
.grid-item-expanded .expanded-header .expanded-header-logo{
	height: 100%;
	display: inline-block;
	margin-right: 35px;
}
.grid-item-expanded .expanded-header .copy-container {
	text-align: initial;
	top: -20px;
	position: relative;
}

.grid-item-expanded sup{
	cursor: pointer;
}
.grid-item-expanded .expanded-header p{
	font-size: 21px;
	line-height: 26px;
	font-weight: bold;
	color: black;
	text-align: center;
}
.grid-item-expanded .expanded-header p span{
	font-size: 49px;
	line-height: 74px;
	display: block;
}
.grid-item-expanded p{
	color: black;
	font-size: 16px;
	line-height: 24px;
}
.grid-item-expanded p a{
	font-weight: bold;
	color: magenta;
}
.grid-item-expanded p::selection, .grid-item-expanded p span::selection, .grid-item-expanded sup::selection, .grid-item-expanded br::selection, .grid-item-expanded i::selection, .grid-item-expanded a::selection, .grid-item-expanded figcaption::selection{
	background-color: #405100;
	color: white;
}
.grid-item-expanded button.expanded-close::selection, .grid-item-expanded .expanded-header::selection, .grid-item-expanded .expanded-comparison-photos::selection, .grid-item-expanded figure img::selection{
	background-color: transparent;
}
.grid-item-expanded .expanded-comparison-photos{
	width: fit-content;
	margin: 0 auto;
}
.grid-item-expanded .expanded-comparison-photos figure{
	display: inline-block;
	min-height: 350px;
}
.grid-item-expanded .expanded-comparison-photos figure img{
	aspect-ratio: 37 / 31;
	width: 370px;
	object-fit: cover;
}
.grid-item-expanded .expanded-comparison-photos figure figcaption{
	background-color: magenta;
	font-size: 13px;
	line-height: 20px;
	padding: 10px;
	max-width: 370px;
	margin: 0 auto;
}
.grid-item-expanded .expanded-comparison-photos .comparison-syngenta figcaption{
	font-weight: bold;
}
.grid-item-expanded .expanded-comparison-photos figure:first-of-type {
	margin-right: 15px;
}
.grid-item-expanded .expanded-comparison-photos p{
	font-size: 12px;
	font-style: italic;
	line-height: 16px;
	text-align: initial;
	font-weight: 300;
}
.grid-item-expanded .expanded-comparison-photos--stacked figure img {
	aspect-ratio: 85 / 31;
}
.grid-item-expanded .expanded-comparison-photos--stacked .comparison-syngenta figcaption {
	font-weight: unset;
}
.grid-item-expanded .expanded-comparison-photos--stacked .caption-syngenta {
	font-weight: 600!important;
}
.grid-item-expanded .expanded-cta {
	font-size: 16px;
	font-weight: 700;
	background-color: magenta;
	padding: 10px;
	border: 2px solid magenta;
	text-decoration: none;
	min-width: 160px;
	display: inline-block;
	margin-top: 10px;
	transition: all 0.25s;
	color: black;
}
.grid-item-expanded .expanded-cta:hover{
	background-color: transparent;
	color: magenta;
	transition: all 0.25s
}

.grid-item-expanded .expanded-close{
	width: 35px;
	height: 35px;
	border: none;
	background-color: #415200;
	position: absolute;
	right: 10px;
	top: 10px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 384 512"><style>svg{fill:%23ffffff}</style><path d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/></svg>');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 14px;
}
.grid-item-expanded .expanded-close:hover{
	background-color: var(--corn-accent);
}
[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos figure img {
	aspect-ratio: auto;
	width: auto;
	height: 380px;
}
[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos figure:first-of-type {
	margin: 0;
}
[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos figure figcaption br {
	display: none;
}



/*************************************
Crop specific visuals - Initial small size
*************************************/

.grid-item[data-crop="corn"] .grid-item-initial{
	border-color: var(--corn-accent);
	background: url('https://assets.syngentaebiz.com/images/media/bybd-bg-corn-left.svg'), url('https://assets.syngentaebiz.com/images/media/bybd-bg-corn-right.svg'), white;
	background-repeat: no-repeat, no-repeat;
	background-position: bottom left, bottom right;
	background-size: contain;
}
.grid-item[data-crop="corn"] .grid-item-initial::after{
	color: var(--corn-accent);
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="0.9em" viewBox="0 0 320 512"><style>svg{fill:%23aab400}</style><path d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/></svg>');
}

.grid-item[data-crop="soybeans"]  .grid-item-initial{
	border-color: var(--soy-accent);
	background: url('https://assets.syngentaebiz.com/images/media/bybd-bg-soybeans-left.svg'), url('https://assets.syngentaebiz.com/images/media/bybd-bg-soybeans-right.svg'), white;
	background-repeat: no-repeat, no-repeat;
	background-position: bottom left, bottom right;
	background-size: contain;
}
.grid-item[data-crop="soybeans"] .grid-item-initial::after{
	color: var(--soy-accent);
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="0.9em" viewBox="0 0 320 512"><style>svg{fill:%237f9333}</style><path d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/></svg>');
}

.grid-item[data-crop="wheat"]  .grid-item-initial{
	border-color: var(--wheat-accent);
	background: url('https://assets.syngentaebiz.com/images/media/bybd-bg-wheat-left.svg'), url('https://assets.syngentaebiz.com/images/media/bybd-bg-wheat-right.svg'), white;
	background-repeat: no-repeat, no-repeat;
	background-position: bottom left, bottom right;
	background-size: contain;
}
.grid-item[data-crop="wheat"] .grid-item-initial::after{
	color: var(--wheat-accent);
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="0.9em" viewBox="0 0 320 512"><style>svg{fill:%23ffb400}</style><path d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/></svg>');
}

/*************************************
Crop specific visuals - Expanded large size
*************************************/

.grid-item[data-crop="corn"].is-expanded .grid-item-expanded{
	border-color: var(--corn-accent);
}
.grid-item[data-crop="soybeans"].is-expanded .grid-item-expanded{
	border-color: var(--soy-accent);
}
.grid-item[data-crop="wheat"].is-expanded .grid-item-expanded{
	border-color: var(--wheat-accent);
}

.grid-item[data-crop="corn"] .grid-item-expanded .expanded-header .logo-container{
	border-color: var(--corn-accent);
}
.grid-item[data-crop="corn"] .grid-item-expanded p a{
	color: var(--corn-accent-dark);
}
.grid-item[data-crop="corn"] .grid-item-expanded .expanded-comparison-photos figure figcaption{
	background-color: var(--corn-accent);
	color: white;
}
.grid-item[data-crop="corn"] .grid-item-expanded .expanded-cta{
	background-color: var(--corn-accent);
	border-color: var(--corn-accent);
}
.grid-item[data-crop="corn"] .grid-item-expanded .expanded-cta:hover{
	background-color: transparent;
	color: var(--corn-accent-dark);
}

.grid-item[data-crop="soybeans"] .grid-item-expanded .expanded-header .logo-container{
	border-color: var(--soy-accent);
}
.grid-item[data-crop="soybeans"] .grid-item-expanded p a{
	color: var(--soy-accent);
}
.grid-item[data-crop="soybeans"] .grid-item-expanded .expanded-comparison-photos figure figcaption{
	background-color: var(--soy-accent);
	color: white;
}
.grid-item[data-crop="soybeans"] .grid-item-expanded .expanded-cta{
	background-color: var(--soy-accent);
	border-color: var(--soy-accent);
	color: white;
}
.grid-item[data-crop="soybeans"] .grid-item-expanded .expanded-cta:hover{
	background-color: transparent;
	color: var(--soy-accent);
}

.grid-item[data-crop="wheat"] .grid-item-expanded .expanded-header .logo-container{
	border-color: var(--wheat-accent);
}
.grid-item[data-crop="wheat"] .grid-item-expanded p a{
	color: var(--wheat-accent-dark);
}
.grid-item[data-crop="wheat"] .grid-item-expanded .expanded-comparison-photos figure figcaption{
	background-color: var(--wheat-accent);
	color: black;
}
.grid-item[data-crop="wheat"] .grid-item-expanded .expanded-cta{
	background-color: var(--wheat-accent);
	border-color: var(--wheat-accent);
}
.grid-item[data-crop="wheat"] .grid-item-expanded .expanded-cta:hover{
	background-color: transparent;
	color: var(--wheat-accent-dark);
}

/*************************************
Brand Logo Configs - Initial small size
*************************************/

.grid-item[data-product-name="acuron"] .grid-item-initial::before{
	background: url('https://assets.syngenta-us.com/images/prod_logos/Acuronlogo.svg') no-repeat;
	background-size: 165px;
}
.grid-item[data-product-name="trivapro"] .grid-item-initial::before{
	background: url('https://www.syngenta-us.com/productpagetest/img/logos/logo-trivapro.svg') no-repeat;
	background-size: 190px;
}
.grid-item[data-product-name="miravis-neo"] .grid-item-initial::before{
	background: url('https://assets.syngenta-us.com/images/prod_logos/miravisneologo.svg') no-repeat;
	background-size: 220px;
}
.grid-item[data-product-name="miravis-ace"] .grid-item-initial::before{
	background: url('https://assets.syngentaebiz.com/images/prod_logos/miravisacelogo.svg') no-repeat;
	background-size: 220px;
}
.grid-item[data-product-name="miravis-top"] .grid-item-initial::before{
	background: url('https://assets.syngenta-us.com/images/prod_logos/miravistoplogo.svg') no-repeat;
	background-size: 220px;
}
.grid-item[data-product-name="acuron-gt"] .grid-item-initial::before{
	background: url('https://assets.syngenta-us.com/images/prod_logos/acuron-gt-logo.svg') no-repeat;
	background-size: 190px;
}
.grid-item[data-product-name="storen"] .grid-item-initial::before {
	background: url('https://assets.syngentaebiz.com/images/prod_logos/Storen_RGB.svg') no-repeat;
	background-size: 145px;
	background-position-y: 5px;
}
.grid-item[data-product-name="saltro"] .grid-item-initial::before{
	background: url('https://assets.syngentaebiz.com/images/prod_logos/Saltro.svg') no-repeat;
	background-size: 150px;
	background-position-y: 3px;
}
.grid-item[data-product-name="tendovo"] .grid-item-initial::before{
	background: url('https://assets.syngentaebiz.com/images/prod_logos/Tendovo_R_RGB.svg') no-repeat;
	background-size: 160px;
	background-position-y: 10px;
}
.grid-item[data-product-name="cruisermaxx-apx"] .grid-item-initial::before{
	background: url('https://assets.syngentaebiz.com/images/prod_logos/CruiserMaxxAPX_RGB.svg') no-repeat;
	background-size: 285px;
	background-position-y: 5px;
}
.grid-item[data-product-name="opello"] .grid-item-initial::before {
	background: url('https://assets.syngentaebiz.com/images/media/logo-opello-plinazolin-technology.svg') no-repeat;
	background-size: 128px;
	background-position-y: 0px;
}
.grid-item[data-product-name="victrato"] .grid-item-initial::before {
	background: url('https://assets.syngentaebiz.com/images/media/logo-victrato.svg') no-repeat;
	background-size: 168px;
	background-position-y: -5px;
}

/*************************************
Brand Logo Configs - Expanded large size
*************************************/

.grid-item[data-product-name="acuron"] .expanded-header-logo{
	background: url('https://assets.syngenta-us.com/images/prod_logos/Acuronlogo.svg') no-repeat;
	background-size: calc(165px * 1.5);
	width: calc(165px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="trivapro"] .expanded-header-logo{
	background: url('https://www.syngenta-us.com/productpagetest/img/logos/logo-trivapro.svg') no-repeat;
	background-size: calc(190px * 1.5);
	width: calc(190px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="miravis-neo"] .expanded-header-logo{
	background: url('https://assets.syngenta-us.com/images/prod_logos/miravisneologo.svg') no-repeat;
	background-size: calc(220px * 1.5);
	width: calc(220px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="miravis-ace"] .expanded-header-logo{
	background: url('https://assets.syngentaebiz.com/images/prod_logos/miravisacelogo.svg') no-repeat;
	background-size: calc(220px * 1.5);
	width: calc(220px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="miravis-top"] .expanded-header-logo{
	background: url('https://assets.syngenta-us.com/images/prod_logos/miravistoplogo.svg') no-repeat;
	background-size: calc(220px * 1.5);
	width: calc(220px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="acuron-gt"] .expanded-header-logo{
	background: url('https://assets.syngenta-us.com/images/prod_logos/acuron-gt-logo.svg') no-repeat;
	background-size: calc(190px * 1.5);
	width: calc(190px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="storen"] .expanded-header-logo {
	background: url('https://assets.syngentaebiz.com/images/prod_logos/Storen_RGB.svg') no-repeat;
	background-size: calc(145px * 1.5);
	width: calc(145px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="saltro"] .expanded-header-logo{
	background: url('https://assets.syngentaebiz.com/images/prod_logos/Saltro.svg') no-repeat;
	background-size: calc(150px * 1.5);
	width: calc(150px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="tendovo"] .expanded-header-logo{
	background: url('https://assets.syngentaebiz.com/images/prod_logos/Tendovo_R_RGB.svg') no-repeat;
	background-size: calc(160px * 1.5);
	width: calc(160px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="cruisermaxx-apx"] .expanded-header-logo{
	background: url('https://assets.syngentaebiz.com/images/prod_logos/CruiserMaxxAPX_RGB.svg') no-repeat;
	background-size: calc(285px * 1.2);
	width: calc(285px * 1.2);
	background-position-y: center;
}
.grid-item[data-product-name="opello"] .expanded-header-logo {
	background: url('https://assets.syngentaebiz.com/images/media/logo-opello-plinazolin-technology.svg') no-repeat;
	background-size: calc(160px * 1.5);
	width: calc(160px * 1.5);
	background-position-y: center;
}
.grid-item[data-product-name="victrato"] .expanded-header-logo {
	background: url('https://assets.syngentaebiz.com/images/media/logo-victrato.svg') no-repeat;
	background-size: calc(168px * 1.5);
	width: calc(168px * 1.5);
	background-position-y: center;
}



/*
RESPONSIVE GARBAGE
*/
@media only screen and (max-width: 1199.98px) { 
	/* orange */
	.logo-container{
		display: block;
		margin: 0 auto;
	}
	.grid-item-expanded .expanded-header .logo-container, .grid-item-expanded .expanded-header .copy-container{
		width: 100%;
		max-width: 450px;
	}
	.grid-item-expanded .expanded-header .logo-container{
		border-right: none;
		border-bottom: 2px solid magenta;
	}
	.grid-item-expanded .expanded-header .expanded-header-logo{
		width: 100%!important;
		background-position-x: center!important;
	}
	.grid-item-expanded .expanded-header .copy-container{
		top: initial;
		margin-bottom: 35px;
	}
	.is-expanded .grid-item-expanded{
		padding: 0 20px 20px 20px;
	}
	.grid-item-expanded .expanded-header .expanded-header-logo{
		margin: 50px 0 20px 0!important;
		height: 60px!important;
		background-position-y: 5px;
	}
	
}
@media only screen and (max-width: 991.98px) { 
	/* green */
	.grid-item-initial p{
		min-height: unset;
	}

	[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos {
		display: grid;
		grid-template-columns: repeat(4, minmax(min-content, 1fr));
		row-gap: 20px;
	}
	[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos figure img {
		aspect-ratio: 9 / 16;
		object-position: 100% 85%;
	}
	[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos p {
		grid-column: 1/-1;
	}
}

@media only screen and (max-width:950px) { 
	/* custom */
	.grid-item-expanded .expanded-comparison-photos figure:first-of-type {
		margin-right: 0px;
		margin-bottom: 15px;
	}
	.grid-item-expanded .expanded-comparison-photos figure{
		display: block;
		min-height: 280px;
	}
	.grid-item-expanded .expanded-comparison-photos p{
		text-align: center;
	}
}

@media only screen and (max-width: 767.98px) { 
	/* blue */
	.grid-item-expanded .expanded-comparison-photos figure img{
		aspect-ratio: 26 / 18;
	}
	.grid-item-expanded .expanded-comparison-photos--stacked figure img {
		aspect-ratio: 60 / 18;
	}
/*************************************
	Brand Logo Configs - Expanded large size
	*************************************/
	.grid-item[data-product-name="acuron"] .expanded-header-logo{
		background-size: calc(165px * 1.2);
	}
	.grid-item[data-product-name="trivapro"] .expanded-header-logo{
		background-size: calc(190px * 1.2);
	}
	.grid-item[data-product-name="miravis-neo"] .expanded-header-logo{
		background-size: calc(220px * 1.2);
	}
	.grid-item[data-product-name="miravis-ace"] .expanded-header-logo{
		background-size: calc(220px * 1.2);
	}
	.grid-item[data-product-name="miravis-top"] .expanded-header-logo{
		background-size: calc(220px * 1.2);
	}
	.grid-item[data-product-name="acuron-gt"] .expanded-header-logo{
		background-size: calc(190px * 1.2);
	}
	.grid-item[data-product-name="storen"] .expanded-header-logo{
		background-size: calc(145px * 1.2);
	}
	.grid-item[data-product-name="saltro"] .expanded-header-logo{
		background-size: calc(150px * 1.2);
	}
	.grid-item[data-product-name="tendovo"] .expanded-header-logo{
		background-size: calc(160px * 1.2);
	}
	.grid-item[data-product-name="cruisermaxx-apx"] .expanded-header-logo{
		background-size: calc(285px * 1.0);
	}

	.grid-item[data-product-name="opello"] .grid-item-initial::before {
		background-size: 105px;
		background-position-y: 7px;
	}
	.grid-item[data-product-name="victrato"] .grid-item-initial::before {
		background-size: 130px;
		background-position-y: 6px;
	}
}

@media only screen and (max-width: 575.98px) { 
	/* red */
	#explore{
		padding: 20px 0 30px 0;
	}
	p.filter-instructions{
		margin: 0px;
	}
	.dropdown-wrapper label{
		margin-bottom: 10px;
		margin-top: 20px;
	}
	.footer-divider{
		margin: 20px 0;
	}
	.grid-item-initial::before{
		bottom: 35px;
	}
	.grid-item-initial::after{
		right: 35px;
		bottom: 45px;
	}
	.grid-item-initial p span{
		font-size: 35px;
		line-height: 53px;
	}
	.grid-item-initial p{
		font-size: 20px;
		line-height: 28px;
	}
	.grid-item-initial{
		padding: 0 20px 60px 20px;
		margin-bottom: 16px;
	}
	/*************************************
	Brand Logo Configs - Initial small size
	*************************************/
	.grid-item[data-product-name="acuron"] .grid-item-initial::before{
		background-size: 110px;
		background-position-y: 12px;
	}
	.grid-item[data-product-name="trivapro"] .grid-item-initial::before{
		background-size: 115px;
		background-position-y: 13px;
	}
	.grid-item[data-product-name="miravis-neo"] .grid-item-initial::before{
		background-size: 150px;
		background-position-y: 12px;
	}
	.grid-item[data-product-name="miravis-ace"] .grid-item-initial::before{
		background-size: 150px;
		background-position-y: 12px;
	}
	.grid-item[data-product-name="miravis-top"] .grid-item-initial::before{
		background-size: 150px;
		background-position-y: 12px;
	}
	.grid-item[data-product-name="acuron-gt"] .grid-item-initial::before{
		background-size: 125px;
		background-position-y: 12px;
	}
	.grid-item[data-product-name="storen"] .grid-item-initial::before{
		background-size: 100px;
		background-position-y: 13px;
	}
	.grid-item[data-product-name="saltro"] .grid-item-initial::before{
		background-size: 100px;
		background-position-y: 12px;
	}
	.grid-item[data-product-name="tendovo"] .grid-item-initial::before{
		background-size: 115px;
		background-position-y: 17px;
	}
	.grid-item[data-product-name="cruisermaxx-apx"] .grid-item-initial::before{
		background-size: 185px;
		background-position-y: 14px;
	}
	/*************************************
	Brand Logo Configs - Expanded large size
	*************************************/
	.grid-item-expanded .expanded-header .expanded-header-logo{
		margin: 50px 0 20px 0!important;
		height: 60px!important;
		background-position-y: 5px;
	}

	[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos {
		grid-template-columns: repeat(2, minmax(50px, min-content));
		row-gap: 0px;
	}
	[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos figure {
		min-height: auto;
	}
	[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos figure img {
		object-position: center;
		height: 185px;
	}
	[data-product-name="opello"] .grid-item-expanded .expanded-comparison-photos figure figcaption br {
		display: block;
	}
}