body {
	background-image: image-set(
	    "../images/campo-piccolo.jpg" 1x,
	    "../images/campo-grande.jpg" 2x);
	background-size: max(100vw, 180vh);
	background-position: center 0 !important;
	background-attachment: fixed !important;
}

#banner {
	float: left;
	position: static;
}

#footer, #footer::before, #footer::after {
	display: none;
}

#grafica {
	position: relative;
	padding-top: 100vh;
	z-index: 1;
}

#grafica > *:first-child {
	margin-top: -300px;
}

#grafica strong, #grafica b, #grafica a {
	color: inherit;
}

#grafica > header, #grafica > section {
	position: relative;
	margin-bottom: 6em;
	z-index: 2;
}

#grafica > header {
	padding-bottom: 0em;
}

#grafica > header img {
	display: block;
	margin: 0em auto;
}

#grafica > section {
	margin-top: 6em;
	color: #f1e5d5;
}

#grafica > section:nth-child(2n+1) {
	color: #446137;
}

#grafica h2, #grafica blockquote {
	background: -webkit-linear-gradient(top, #446137 0%,#3d5731 100%);
	background: linear-gradient(top, #446137 0%,#3d5731 100%);
}

#grafica h2 {
	position: relative;
	font-family: Ramona, sans-serif;
	font-weight: 600;
	letter-spacing: 0.05em;
	padding-top: 0.8em;
	padding-bottom: 0.8em;
	margin: 0em;
	font-size: 3.8em;
	color: inherit;
	z-index: 3;
}

#grafica ul, #grafica blockquote {
	position: relative;
	z-index: 2;
	margin: 0em;
	padding: 0.4em 2em;
	list-style: none;
	font-size: 2em;
	line-height: 1.3em;
	border: 0em;
}

#grafica > section li {
	margin: 0.8em 0em;
}

#grafica > section:nth-child(2n+1) h2, #grafica > section:nth-child(2n+1) blockquote {
	background: -webkit-linear-gradient(top, #f1e5d5 0%,#f1d6b5 100%);
	background: linear-gradient(top, #f1e5d5 0%,#f1d6b5 100%);
}

#grafica > section {
	overflow: hidden;
}

@media (max-width: 699px) {
	#top { top: 44px; }
	#grafica h2 { font-size: 2.8em; }
	#grafica ul, #grafica blockquote { font-size: 1.6em; }
}

#grafica > section::before {
	content: '';
	position: absolute;
	width: 600%;
	height: 600%;
	top: -250%;
	left: -250%;
	z-index: 1;
	transform: rotate(15deg);
}

#grafica > section::before {
	background: #446137;
}

#grafica > section:nth-child(2n+1)::before {
	background: #f1e5d5;
}

#grafica > section.cappellino::before {
	background-image: url(../images/Tile/Verde_Cappellino.png);
}
#grafica > section.cappellone::before {
	background-image: url(../images/Tile/Verde_Cappellone.png);
}
#grafica > section.fazzolettone::before {
	background-image: url(../images/Tile/Verde_Fazzolettone.png);
}
#grafica > section.fiore::before {
	background-image: url(../images/Tile/Verde_Fiore.png);
}
#grafica > section.fuoco::before {
	background-image: url(../images/Tile/Verde_Fuoco.png);
}
#grafica > section.pino::before {
	background-image: url(../images/Tile/Verde_Pino.png);
}
#grafica > section.tenda::before {
	background-image: url(../images/Tile/Verde_Tenda.png);
}

#grafica > section:nth-child(2n+1).cappellino::before {
	background-image: url(../images/Tile/Rosa_Cappellino.png);
}
#grafica > section:nth-child(2n+1).cappellone::before {
	background-image: url(../images/Tile/Rosa_Cappellone.png);
}
#grafica > section:nth-child(2n+1).fazzolettone::before {
	background-image: url(../images/Tile/Rosa_Fazzolettone.png);
}
#grafica > section:nth-child(2n+1).fiore::before {
	background-image: url(../images/Tile/Rosa_Fiore.png);
}
#grafica > section:nth-child(2n+1).fuoco::before {
	background-image: url(../images/Tile/Rosa_Fuoco.png);
}
#grafica > section:nth-child(2n+1).pino::before {
	background-image: url(../images/Tile/Rosa_Pino.png);
}
#grafica > section:nth-child(2n+1).tenda::before {
	background-image: url(../images/Tile/Rosa_Tenda.png);
}
