/* PowerSite 2.93 - Client: MARR - Screen Layout, Consumer Overrides CSS */
/* Last Updated: 2025.07.09 ET */

@import url('marr_layout.css');

main > header {
	background-image: url('../images/marr_bkgd_recycle-leaves_blue.png');
	background-repeat: repeat;
	background-position: center center;
	color: white;
}

body.index > main > header {
	min-height: 310px;
}

body.itype-100.home > main > header,
body.itype-109 > main > header {
	background-image: url('../images/marr_bkgd_recycle-leaves_green.png');
}

body.itype-902 > main > header {
	background-image: url('../images/marr_bkgd_recycle-leaves_purple.png');
}

body.itype-112 > main > header {
	background-image: url('../images/marr_bkgd_recycle-leaves_dark-green.png');
}

body.itype-400 > main > header {
	background-image: url('../images/marr_bkgd_recycle-leaves_orange.png');
}

body.itype-110 > main > header {
	background-image: url('../images/marr_bkgd_recycle-leaves_light-orange.png');
}

main > header h1,
main > header p.headline {
	font-size: 3.5rem; /* 49px ÷ 14px */
}

main > header h1 + p {
	color: white;
}

main > section.afterbreak {
	background-color: rgb(237,239,248);
}

section.afterbreak + section.afterbreak {
	background: white;
}

main > section.afternav {
	background-color: rgb(204,231,245);
}

section.withnav > nav {
	margin-top: 4rem;
}

section.search p {
	font-weight: bold;
	margin: 1.5em auto;
}

section.search input[type="text"] {
	border: none;
	border-radius: 9999px;
}

section.search input[type="submit"] {
	border: none;
	background-color: rgb(96,113,159);
	color: white !important;
}

div.productphoto {
	position: relative;
}

div.productphoto img {
	position: relative;
}

div.productphoto::before {
	content: '';
	position: absolute;
	top: -7rem;
	left: -7rem;
	width: calc(100% + 14rem);
	height: calc(100% + 14rem);
	background: url('/images/marr_bkgd_lrgapp-banner-glow.png') no-repeat center center / 100% 100%;
	/* border: 1px dashed white; */
	mix-blend-mode: overlay;
}

header.slideshow {
	position: relative;
	height: 460px;
	background: grey !important;
	padding: 0 !important;
	margin-bottom: 4rem;
}

section.banner {
	background: url('../images/marr_bkgd_recycle-leaves_green.png') repeat center center /  315px 180px;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding-left: calc(50vw - 29.3rem);
	padding-right: calc(50vw - 29.3rem);
}

section.banner > div.slidecaption {
	/* max-width: 420px; */
	text-align: left;
}

section.banner p.headline {
	position: relative;
	color: white;
	font-style: italic;
	font-weight: 900;
	font-size: 3rem; /* 42px ÷ 14px */
	line-height: 1.1;
	text-align: left;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	text-shadow: 0 0.1em 0.1em rgba(0,0,0,0.1);
	margin-top: 0;
	margin-bottom: 0.5rem;
}

section.banner p.cta {
	position: relative;
	max-width: 16em;
	color: white;
	font-weight: bold;
	font-style: italic;
	font-size: 1.7rem; /* 24px ÷ 14px */
	line-height: 1.1;
	text-align: left;
	letter-spacing: 0.03em;
	text-shadow: 0 0.2em 0.2em rgba(0,0,0,0.1);
	margin-top: 0;
	margin-bottom: 2rem;
}

section.banner div.productphoto {
	margin-left: 4rem;
}

section.banner div.productphoto img {
	max-width: 42vw;
}

section.banner.green { background-image: url('/images/marr_bkgd_recycle-leaves_green.png'); }
section.banner.dkgreen { background-image: url('/images/marr_bkgd_recycle-leaves_dark-green.png'); }
section.banner.blue { background-image: url('/images/marr_bkgd_recycle-leaves_blue.png'); }
section.banner.purple { background-image: url('/images/marr_bkgd_recycle-leaves_purple.png'); }
section.banner.orange { background-image: url('/images/marr_bkgd_recycle-leaves_orange.png'); }
section.banner.ltorange { background-image: url('/images/marr_bkgd_recycle-leaves_light-orange.png'); }

#banner-6 div.productphoto {
	margin-left: 1rem;
	margin-right: -4rem;
}

header.slideshow > section.banner {
	box-sizing: border-box;
	position: absolute !important;
	top: 0;
	width: 100%;
}

header.slideshow > input.slidetoggle {
	display: none;
}

header.slideshow > ul.slidecontrols {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%, 0);
	list-style: none;
	padding: 0;
	margin: 0;
}

header.slideshow > ul.slidecontrols > li {
	display: inline-block;
	padding: 0;
	margin: 4px;
}

header.slideshow > ul.slidecontrols label {
	box-sizing: border-box;
	display: block;
	width: 1rem;
	height: 1rem;
	background-color: rgb(42,60,104);
	border-radius: 16px;
}

header.slideshow > ul.slidecontrols label.active {
	background-color: white;
}

header.slideshow > ul.slidecontrols label > span {
	display: none;
}

#banner-1,
#banner-2,
#banner-3,
#banner-4,
#banner-5,
#banner-6 {
	visibility: visible;
	opacity: 1;
	transition: opacity 0.6s, visibility 0.6s;
}

#rb-sc-1:checked ~ ul.slidecontrols label[for="rb-sc-1"] { background-color: white; }
#rb-sc-2:checked ~ ul.slidecontrols label[for="rb-sc-2"] { background-color: white; }
#rb-sc-3:checked ~ ul.slidecontrols label[for="rb-sc-3"] { background-color: white; }
#rb-sc-4:checked ~ ul.slidecontrols label[for="rb-sc-4"] { background-color: white; }
#rb-sc-5:checked ~ ul.slidecontrols label[for="rb-sc-5"] { background-color: white; }
#rb-sc-6:checked ~ ul.slidecontrols label[for="rb-sc-6"] { background-color: white; }

#rb-sc-2:checked ~ #banner-1,
#rb-sc-3:checked ~ #banner-1,
#rb-sc-4:checked ~ #banner-1,
#rb-sc-5:checked ~ #banner-1,
#rb-sc-6:checked ~ #banner-1 {
	opacity: 0; visibility: hidden;
}

#rb-sc-3:checked ~ #banner-2,
#rb-sc-4:checked ~ #banner-2,
#rb-sc-5:checked ~ #banner-2,
#rb-sc-6:checked ~ #banner-2 {
	opacity: 0; visibility: hidden;
}

#rb-sc-4:checked ~ #banner-3,
#rb-sc-5:checked ~ #banner-3,
#rb-sc-6:checked ~ #banner-3 {
	opacity: 0; visibility: hidden;
}

#rb-sc-5:checked ~ #banner-4,
#rb-sc-6:checked ~ #banner-4 {
	opacity: 0; visibility: hidden;
}

#rb-sc-6:checked ~ #banner-5 {
	opacity: 0; visibility: hidden;
}

#sitefooter {
	background-color: rgb(27,48,93);
	background-image: none;
}

#footerlogo {
	width: 130px;
	height: auto;
	margin-top: 1rem;
}

#footernav {
	float: right;
}

#copyright {
	padding-top: 0;
	border-top: none;
}

@media (min-width: 1024px) {

	section.search {
		padding-top: 9rem;
		padding-bottom: 8rem;
	}

	section.search h2 {
		font-size: 2.43rem;
	}
	
	section.search p {
		font-size: 1.2rem;
	}

}

@media (max-width: 960px) {

	section.banner {
		padding-left: 5rem;
		padding-right: 5rem;
	}

}

@media (max-width: 800px) {

	main > header h1,
	main > header p.headline {
		font-size: 6.3vw;
	}

	header.slideshow {
		height: 50vw;
	}

	section.banner {
		padding-left: 4vw;
		padding-right: 4vw;
	}

	section.banner p.headline {
		font-size: 5.2vw;
	}

	section.banner p.cta {
		font-size: 2.8vw;
	}

	section.banner div.productphoto {
		margin-left: 2vw;
	}
	
	section.banner div.productphoto img {
		max-height: 35vw;
	}

	#banner-6 div.productphoto {
		margin-left: 1vw;
		margin-right: -2vw;
	}

}

@media (max-width: 640px) {

	body.index > main > header {
		min-height: 50vw;
	}

}

@media (max-width: 480px) {

	main > header h1,
	main > header p.headline {
		font-size: 2.4rem;
	}

}

@media (min-width: 60rem) {

	nav.adminlinks,
	#sitefooter {
		padding-left: calc(50vw - 29.4rem);
		padding-right: calc(50vw - 29.4rem);
	}

}