/* ------------------------------------------------------------- */
/* ROOT                                                          */
/* ------------------------------------------------------------- */
:root {
	--font_size: 0.8333vw;
	--section_height: 90vh;
	--nero: #1F1F1F;
	--rosso: #9D0000;
	--verde: #8AA893;
}

/* griglia di lavoro */
.workgrid {
	position: fixed;
	top: 0;
	width: 0px;
	height: 100vh;
	z-index: 999999999999;
	border-left: 1px dotted rgba(255, 0, 0, 0.5);
	pointer-events: none;
}

/* ------------------------------------------------------------- */
/* BODY E REGOLE GENERALI                                        */
/* ------------------------------------------------------------- */
body {
	font-family: 'fira-sans', sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: var(--font_size);
	line-height: 1.6;
	color: var(--nero);
	position: relative;
	-webkit-font-smoothing: antialiased;
}

/* ------------------------------------------------------------- */
/* HEADER                                                        */
/* ------------------------------------------------------------- */
header {
	position: relative;
	height: 93.75vw;
	overflow: hidden;
}

header nav {
	position: absolute;
	top: 7%;
	left: calc(100% * 3.5 / 16);
	width: calc(100% * 9.5 / 16);
	z-index: 4;
	display: flex;
	justify-content: space-between;
	opacity: 0;
	transform: translate(0, -100%);
}

header nav.animate {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1s 2s, transform 1s 2s;
}

header nav > div {
	align-self: center;
}

header nav div.menu {
	width: calc(100% * 5.25 / 10);
}

header nav div.menu ul {
	list-style: none;
	display: flex;
	justify-content: space-between;
}

header nav div.menu ul li {
	align-self: center;
}

header nav div.menu ul li:nth-child(1) {
	display: none;
}

header nav div.menu ul li a {
	text-decoration: none;
	text-transform: uppercase;
	color: var(--nero);
	transition: color 0.35s;
	position: relative;
}

header nav div.menu ul li a:hover {
	color: var(--rosso);
	transition: color 0.35s;
}

header nav div.menu ul li a span {
	position: absolute;
	top: 0;
	right: 0;
	width: 0.5vw;
	height: 0.5vw;
	border-radius: 50%;
	background: var(--rosso);
	transform: translate(150%, -6%);
}

header nav.sticky {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: var(--nero);
	padding: 0.5% 6.25%;
	opacity: 1;
	transform: translate(0, 0);
	transition: 0s 0s;
}

header nav.sticky div.menu {
	width: 100%;
}

header nav.sticky div.menu ul li {
	margin-left: 5%;
}

header nav.sticky div.menu ul li a {
	text-decoration: none;
	text-transform: uppercase;
	color: hsl(0, 0%, 70%);
	font-weight: 300;
	transition: color 0.35s;
	font-size: 90%;
}

header nav div.menu ul li a:hover {
	color: var(--rosso);
	transition: color 0.35s;
}

header nav.sticky div.menu ul li a:hover {
	color: white;
	transition: color 0.35s;
}

header nav.sticky div.menu ul li:nth-child(1) {
	margin-left: 0;
	display: block;
	flex: 1;
}

header nav.sticky div.menu ul li:nth-child(1) a {
	display: block;
}

header nav.sticky div.menu ul li:nth-child(1) a img {
	display: block;
	width: auto;
	height: 2vw;
	min-height: 40px;
}

header nav div.social {
	width: calc(100vw * 1 / 16);
}

header nav div.social ul {
	list-style: none;
	display: flex;
	justify-content: flex-start;
}

header nav div.social ul li {
	margin-right: 10%;
}

header nav div.social ul li a {
	display: block;
	transition: opacity 0.35s;
}

header nav div.social ul li a:hover {
	opacity: 0.65;
	transition: opacity 0.35s;
}

header nav div.social ul li a img {
	width: 1.667vw;
	min-width: 32px;
}

header nav div.close {
	display: none;
}

header nav.sticky div.social {
	display: none;
}

header div.testata {
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% * 11 / 16);
	height: 100%;
	z-index: 2;
	overflow: hidden;
}

header div.testata div.logo {
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% * 3 / 11);
	height: 100vh;
	background: var(--nero);
	z-index: 2;
	padding: 10vw 0 0 0;
	text-align: center;
	opacity: 1;
	transform: translate(-100%, 0);
}

header div.testata div.logo #logo_ruota {
	transform: rotate(-180deg);
}

header div.testata div.logo.animate {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1.5s, transform 1.5s;
}

header div.testata div.logo.animate #logo_ruota {
	transform-origin: 50% 69%;
	transform: rotate(0deg);
	transition: transform 1.5s;
}

header div.testata div.logo img {
	margin: 0 auto;
}

header div.testata div.logo svg {
	width: 52%;
}

header div.testata div.logo a.menu_button {
	display: none;
}

header div.testata div.foto {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 88.8888%;
	background-image: url(../img/home/2560-min.jpg);
	background-size: cover;
	z-index: 1;
	opacity: 0;
	transform: translate(0, 25%);
}

header div.testata div.foto.animate {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1.5s 1s, transform 1.5s 1s;
}

header div.testi {
	position: absolute;
	top: 0;
	right: 0;
	width: 43.75%;
	height: 88.8888%;
	background: var(--verde);
	z-index: 0;
	opacity: 1;
	transform: translate(100%, 0);
}

header div.testi.animate {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1.5s, transform 1.5s;
}

header div.testi div.info {
	position: absolute;
	top: 45%;
	left: calc(100% * 3 / 7);
	margin-top: calc(var(--font_size) * -1);
	opacity: 0;
	transform: translate(50%, 0);
}

header div.testi div.info.animate {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1.5s 2s, transform 1.5s 2s;
}

header div.testi div.info p {
	margin-top: calc(var(--font_size));
	letter-spacing: 0.0521vw;
}

header div.testi div.info p a {
	color: var(--nero);
	text-decoration: none;
	transition: color 0.35s;
}

header div.testi div.info p a:hover {
	color: var(--rosso);
	transition: color 0.35s;
}

header div.frase {
	position: absolute;
	top: 20%;
	left: 50%;
	width: calc(100% * 5.5 / 16);
	z-index: 2;
	color: white;
	font-style: italic;
	font-size: 269%;
	line-height: 1.35;
	opacity: 0;
	transform: translate(0, 50%);
}

header div.frase.animate {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1s 2s, transform 1s 2s;
}

/* ------------------------------------------------------------- */
/* CHI SIAMO                                                     */
/* ------------------------------------------------------------- */
section#chi_siamo {
	margin: 0 6.25%;
	margin-top: -30%;
	position: relative;
	z-index: 3;
	overflow: hidden;
}

section#chi_siamo div.gruppo {
	opacity: 0;
	transform: translate(0, 25%);
}

section#chi_siamo.animate div.gruppo {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1.5s, transform 1.5s;
}

section#chi_siamo div.foto {
	height: 0;
	padding-top: 45%;
	background-image: url(../img/ingresso/3840-min.jpg);
	background-size: cover;
	background-position: center center;
}

section#chi_siamo div.testi {
	position: absolute;
	top: 0;
	right: 0;
	width: calc(100% * 5 /14);
	height: 100%;
	padding: calc(100% * 1 /14);
	background: rgba(115, 99, 87, 0.9);
	color: white;
	font-size: 137.5%;
	opacity: 1;
	transform: translate(100%, 0);
}

section#chi_siamo div.testi.animate {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1.5s 1s, transform 1.5s 1s;
}

/* ------------------------------------------------------------- */
/* SLIDER                                                        */
/* ------------------------------------------------------------- */
section#slider_box {
	overflow: hidden;
}

section#slider_box div#slider {
	color: white;
	font-size: 1.1458vw;
	line-height: 1.6;
	position: relative;
	min-height: var(--section_height);
	margin-top: 6.25%;
	display: block;
	opacity: 0;
	transform: translate(0, 25%);
}

section#slider_box div#slider.animate {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1.5s, transform 1.5s;
}

section#slider_box div#slider::before {
	content: '';
	background: rgba(138, 168, 147, 0.9);
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% * 4 / 16);
	height: 100%;
}

section#slider_box div#slider div.gruppo {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: calc(100% * 1 / 16) calc(100% * 13 / 16) calc(100% * 1 / 16) calc(100% * 1 / 16);
}

section#slider_box div#slider div.gruppo div.item {
	padding-bottom: 2vw;
}

section#slider_box div#slider div.gruppo div.item div.titolo a {
	text-decoration: none;
	color: white;
	position: relative;
	transition: 0.35s;
	font-weight: 400;
}

section#slider_box div#slider div.gruppo div.item div.titolo::before {
	content: '· ';
	font-size: 125%;
}

section#slider_box div#slider div.gruppo div.item div.titolo a:hover {
	opacity: 0.65;
	transition: 0.35s;
}

section#slider_box div#slider div.gruppo div.item.active div.titolo::before {
	content: '';
}

section#slider_box div#slider div.gruppo div.item.active div.titolo a {
	font-weight: 700;
}

section#slider_box div#slider div.gruppo div.item div.descrizione {
	display: none;
	overflow: hidden;
}

section#slider_box div#slider div.gruppo div.item:nth-child(1) div.descrizione {
	display: block;
}

section#slider_box div#slider div.gruppo div.item div.galleria {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	display: none;
	overflow: hidden;
}

section#slider_box div#slider div#slider_pag {
	position: absolute;
	bottom: 6.25%;
	right: 6.25%;
	display: block;
}

section#slider_box div#slider div#slider_pag ul {
	list-style: none;
	color: #D3D3D3;
	text-decoration: none;
	font-size: 0px;
	display: flex;
	margin-right: -1.0416vw;
}

section#slider_box div#slider div#slider_pag ul li {
	width: 1.0416vw;
	height: 1.0416vw;
	min-width: 20px;
	min-height: 20px;
	margin-right: 1.0416vw;
}

section#slider_box div#slider div#slider_pag ul li a {
	display: block;
	width: 100%;
	height: 100%;
	background: #D3D3D3;
	border-radius: 50%;
	transition: 0.35s;
}

section#slider_box div#slider div#slider_pag ul li a:hover,
section#slider_box div#slider div#slider_pag ul li.showPage a {
	background: var(--rosso);
	transition: 0.35s;
}

section#slider_box div#slider div#slider_loader {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding-left: calc(100% * 4 / 16);
	overflow: hidden;
	display: flex;
	justify-content: center;
	background: var(--nero);
	z-index: -2;
}

section#slider_box div#slider div#slider_loader img {
	align-self: center;
	width: 5.2083vw;
	min-width: 100px;
	height: 5.2083vw;
	min-height: 100px;
	animation: slider_loader_animation 2.5s infinite linear;
}

@keyframes slider_loader_animation {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

/* ------------------------------------------------------------- */
/* BGSTRETCHER                                                   */
/* ------------------------------------------------------------- */
.bgstretcher-area {
	text-align: left;
}

.bgstretcher {
	position: fixed;
	_position: absolute;
	width: 100%;
	overflow: hidden;
	z-index: 1;
}

.bgstretcher,
.bgstretcher ul,
.bgstretcher li {
	left: 0;
	top: 0;
}

.bgstretcher ul,
.bgstretcher li {
	position: absolute;
}

.bgstretcher ul,
.bgstretcher li {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ------------------------------------------------------------- */
/* CIBI                                                          */
/* ------------------------------------------------------------- */
section#cibi {
	padding: 12.5% 6.25%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	position: relative;
	overflow: hidden;
}

section#cibi div.testo,
section#cibi div.foto.foto_1,
section#cibi div.foto.foto_2,
section#cibi div.foto.foto_3,
section#cibi div.foto.foto_4 {
	opacity: 0;
	transform: translate(0, 25%);
}

section#cibi div.testo.animate,
section#cibi div.foto.foto_1.animate,
section#cibi div.foto.foto_2.animate,
section#cibi div.foto.foto_3.animate,
section#cibi div.foto.foto_4.animate {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1.5s, transform 1.5s;
}

section#cibi div.testo {
	order: 2;
	width: calc(100% * 2 / 14);
	margin-top: 9%;
	margin-left: calc(100% * 1 / 14);
	font-size: 130%;
}

section#cibi div.foto.foto_1 {
	order: 1;
	width: calc(100% * 4 / 14);
}

section#cibi div.foto.foto_2 {
	order: 2;
	width: calc(100% * 6 / 14);
	margin-top: 5%;
	margin-left: calc(100% * 1 / 14);
}

section#cibi div.foto.foto_3 {
	order: 3;
	width: calc(100% * 7 / 14);
	margin-top: -5%;
}

section#cibi div.foto.foto_4 {
	order: 4;
	width: calc(100% * 5 / 14);
	margin-top: 30%;
	margin-left: calc(100% * 1 / 14);
}

section#cibi div.ruota {
	position: absolute;
	top: 60%;
	right: 3.125%;
	width: calc(100% * 2.5 / 14);
	z-index: -1;
}

section#cibi div.ruota svg .svg_loader {
	fill: var(--verde);
}

/* ------------------------------------------------------------- */
/* MAMOIÀ                                                        */
/* ------------------------------------------------------------- */
section#mamoia {
	position: relative;
	overflow: hidden;
	display: flex;
}

section#mamoia > div {
	align-self: center;
}

section#mamoia div.bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../img/vini/vini-min.jpg);
	background-size: cover;
	background-attachment: fixed;
	z-index: -1;
}

section#mamoia div.bg::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--nero);
	opacity: 0.75;
	mix-blend-mode: multiply;
}

section#mamoia div.testo {
	color: white;
	font-size: 120%;
	order: 2;
	width: 18.75%;
	margin-left: 18.75%;
	padding: 6.25% 0;
}

section#mamoia div.testo p {
	margin-top: 1.25vw;
	opacity: 0;
}

section#mamoia div.testo p:first-child {
	margin-top: 0;
}

section#mamoia div.testo p.animate {
	opacity: 1;
	transition: opacity 1.5s
}

section#mamoia div.testo p a {
	color: white;
	transition: color 0.35s;
}

section#mamoia div.testo div.label {
	display: none;
}

section#mamoia div.testo p a:hover {
	color: var(--rosso);
	transition: color 0.35s;
}

section#mamoia div.foto {
	order: 3;
	width: 18.75%;
	margin-left: 12.5%;
}

section#mamoia div.foto div {
	margin-top: 3.125vw;
}

section#mamoia div.foto div img {
	opacity: 0;
	transform: translate(0, 25%);
}

section#mamoia div.foto div.animate img {
	opacity: 1;
	transform: translate(0, 0);
	transition: opacity 1.5s, transform 1.5s;
}

section#mamoia div.label {
	order: 0;
	width: 12.5%;
	opacity: 0;
	transform: translate(-50%, -200%);
}

section#mamoia div.label.animate {
	opacity: 1;
	transform: translate(0, -200%);
	transition: opacity 1.5s, transform 1.5s;
}

/* ------------------------------------------------------------- */
/* NOTIZIE                                                       */
/* ------------------------------------------------------------- */
h2#notizie_head {
	display: none;
}

section#notizie {
	position: relative;
	overflow: hidden;
	min-height: calc(100vh - 12.5vw);
	margin: 6.25vw 0;
	opacity: 0;
}

section#notizie.animate {
	opacity: 1;
	transition: opacity 2s 0.5s;
}

section#notizie div.slider {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
}

section#notizie div.slider div.item {
	width: 100vw;
	position: relative;
}

section#notizie div.slider div.item div.foto {
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% / 2);
	height: 100%;
	background-position: center center !important;
	background-repeat: no-repeat !important;
	background-size: cover !important;
	opacity: 0;
	transition: opacity 1s;
}

section#notizie div.slider div.item.active div.foto {
	opacity: 1;
	transition: opacity 1s;
}

section#notizie div.slider div.item div.testo {
	position: absolute;
	top: 50%;
	left: calc(100% * 4 / 16);
	width: calc(100% * 10 / 16);
	min-height: 60%;
	transform: translate(0, -50%);
	padding: 3.125% 6.25% 3.125% 31.25%;
	font-size: 130%;
	opacity: 0;
	transition: opacity 1s;
}

section#notizie div.slider div.item.active div.testo {
	opacity: 1;
	transition: opacity 1s 0.5s;
}

section#notizie div.slider div.item div.testo::before {
	content: '';
	background: rgba(138, 168, 147, 0.75);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	mix-blend-mode: multiply;
}

section#notizie div.slider div.item div.testo h2 {
	font-weight: 500;
	font-size: 125%;
}

section#notizie div.slider div.item div.testo p {
	margin-top: 1em;
}

section#notizie div.dx {
	position: absolute;
	top: 50%;
	right: 6.25%;
	width: 4vw;
	min-width: 40px;
	transform: translate(0, -50%);
	display: none
}

section#notizie div.sx {
	position: absolute;
	top: 50%;
	left: 6.25%;
	width: 4vw;
	min-width: 40px;
	transform: translate(0, -50%);
}

section#notizie div.sx a img {
	transform: rotate(180deg);
}

section#notizie div.sx a,
section#notizie div.dx a {
	opacity: 0.5;
	transition: opacity 0.35s;
}

section#notizie div.sx a:hover,
section#notizie div.dx a:hover {
	opacity: 1;
	transition: opacity 0.35s;
}

section#notizie div.arrows a img.mobile {
	display: none;
}

section#notizie div.archivio {
	position: absolute;
	bottom: 0;
	left: 56.25%;
}

section#notizie div.archivio a {
	text-decoration: none;
	font-size: 115%;
	color: var(--nero);
	opacity: 0.5;
	transition: 0.35s;
}

section#notizie div.archivio a:hover {
	opacity: 1;
	transition: 0.35s;
}

/* ------------------------------------------------------------- */
/* NOTIZIE ARCHIVIO                                              */
/* ------------------------------------------------------------- */
div#notizie_archivio {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 5;
	display: none;
}

div#notizie_archivio::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--verde);
	opacity: 0.97;
}

div#notizie_archivio div#notizie_archivio_close {
	position: absolute;
	top: 12.5%;
	right: 6.25%;
	z-index: 8;
}

div#notizie_archivio div#notizie_archivio_close a {
	text-decoration: none;
	color: white;
	font-size: 500%;
	line-height: 0;
	opacity: 0.5;
	transition: 0.35s;
}

div#notizie_archivio div#notizie_archivio_close a:hover {
	opacity: 1;
	transition: 0.35s;
}

div#notizie_archivio div#notizie_archivio_close a img {
	width: 30px;
	height: 30px;
}

div#notizie_archivio #notizie_archivio_lista {
	position: relative;
	top: 12.5%;
	left: 18.75%;
	width: 62.5%;
	height: 75%;
	z-index: 7;
	color: white;
	font-size: 130%;
	overflow: auto;
}

div#notizie_archivio #notizie_archivio_lista div.item {
	display: flex;
	justify-content: space-between;
	margin-top: 10%;
}

div#notizie_archivio #notizie_archivio_lista div.item:first-child {
	margin-top: 0;
}

div#notizie_archivio #notizie_archivio_lista div.item div.img {
	width: 40%;
}

div#notizie_archivio #notizie_archivio_lista div.item div.txt {
	width: 50%;
	align-self: center;
	padding-right: 6.25%;
}

div#notizie_archivio #notizie_archivio_lista div.item div.txt h2 {
	font-weight: 500;
	font-size: 125%;
}

div#notizie_archivio #notizie_archivio_lista div.item div.txt p {
	margin-top: 1em;
}

/* ------------------------------------------------------------- */
/* MAPPA                                                         */
/* ------------------------------------------------------------- */
section#mappa {
	border-top: 2vw solid var(--nero);
	height: 70vh;
}

/* ------------------------------------------------------------- */
/* FOOTER                                                        */
/* ------------------------------------------------------------- */
footer {
	background: var(--nero);
	color: #D3D3D3;
	padding: 6.25%;
	display: flex;
}

footer a {
	color: #D3D3D3;
	text-decoration: none;
	transition: 0.35s;
}

footer a:hover {
	color: var(--rosso);
	transition: 0.35s;
}

footer div.logo,
footer div.info {
	width: calc(100% * 3 / 14);
	align-self: flex-end;
}

footer div.logo img {
	margin: 0 auto;
}

footer div.info p {
	margin-bottom: 2.0833vw;
}

footer div.info p span {
	display: block;
}

footer div.social {
	width: calc(100% * 2 / 14);
	align-self: flex-end;
}

footer div.social ul {
	list-style: none;
	display: flex;
	justify-content: flex-end;
	width: 100%;
	margin-bottom: 2.0833vw;
}

footer div.social ul li {
	margin-left: 5%;
}

footer div.social ul li a {
	display: block;
	transition: opacity 0.35s;
}

footer div.social ul li a:hover {
	opacity: 0.65;
	transition: opacity 0.35s;
}

footer div.social ul li a img {
	width: 1.667vw;
	min-width: 32px;
}

footer div.up {
	display: none;
}

/* ------------------------------------------------------------- */
/* DISCLAIMER                                                    */
/* ------------------------------------------------------------- */
section#disclaimer {
	background: var(--verde);
	color: var(--nero);
	padding: 3.125% 6.25%;
}

section#disclaimer ul {
	list-style: none;
	display: flex;
	justify-content: flex-end;
}

section#disclaimer ul li {
	margin-left: 1vw;
}

section#disclaimer ul li a {
	color: var(--nero);
	text-decoration: none;
	transition: 0.35s;
}

section#disclaimer ul li a:hover {
	color: var(--rosso);
	transition: 0.35s;
}
