/* ------------------------------------------------------------- */
/* REGOLE VERSIONE MOBILE                                        */
/* ------------------------------------------------------------- */
@media only screen and (max-width: 767px) {

	/* ------------------------------------------------------------- */
	/* ROOT                                                          */
	/* ------------------------------------------------------------- */
	:root {
		--font_size: 16px;
		--section_height: 50vh;
	}

	/* ------------------------------------------------------------- */
	/* BODY E REGOLE GENERALI                                        */
	/* ------------------------------------------------------------- */
	body {
		line-height: 2;
	}

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

	header nav,
	header nav.animate {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: var(--verde);
		z-index: 999;
		flex-direction: column;
		justify-content: space-between;
		opacity: 1;
		padding: 16.6667% 16.6667% 8.3333% 16.6667%;
		transform: translate(-100%, 0);
		transition: transform 0.5s;
	}

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

	header nav li {
		opacity: 0 !important;
		transform: translate(0, 100%) !important;
		transition: 0s 1s !important;
	}

	header nav.open li {
		opacity: 1 !important;
		transform: translate(0, 0) !important;
		transition: 1s 1s !important;
	}

	header nav div.menu {
		width: 100%;
		font-size: 120%;
		line-height: 2;
	}

	header nav div.menu ul {
		flex-direction: column;
	}

	header nav div.menu ul li:nth-child(1) {
		display: block !important;
		margin-bottom: 16.6667%;
	}

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

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

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

	header nav div.social {
		display: none;
	}

	header nav div.close {
		display: block;
	}

	header nav div.close ul {
		list-style: none;
	}

	header nav div.close ul li a {
		color: var(--nero);
		text-decoration: none;
		font-size: 500%;
		line-height: 0;
		font-weight: 100;
		display: inline-block;
		transition: 0.35s;
	}

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

	header div.testata {
		position: relative;
		width: 100%;
		height: 60vh;
	}

	header div.testata div.logo {
		width: calc(100% / 3);
		height: 100%;
		padding: 10vw 0;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	header div.testata div.logo svg {
		width: 55%;
		align-self: center;
	}

	header div.testata div.logo a.menu_button {
		display: inline-block;
		align-self: center;
	}

	header div.testata div.logo a.menu_button svg {
		width: 25%;
	}

	header div.testata div.logo a.menu_button svg .cls-1 {
		transition: 0.35s;
	}

	header div.testata div.logo a.menu_button:hover svg .cls-1 {
		stroke: var(--verde);
		transition: 0.35s;
	}

	header div.testata div.foto {
		position: absolute;
		width: 100%;
		height: 100%;
		opacity: 1;
		transform: translate(0, 0);
	}

	header div.frase {
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		opacity: 1;
		transform: translate(0, 0);
		background: var(--verde);
		padding: 16.6667%;
		overflow: hidden;
		font-weight: 300;
		font-size: 140%;
		text-align: center;
	}

	header div.frase p {
		opacity: 0;
		transform: translate(0, 25%);
	}

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

	section#chi_siamo {
		margin: 0;
		position: relative;
		overflow: hidden;
	}

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

	section#chi_siamo div.foto {
		padding-top: 50%;
	}

	section#chi_siamo div.testi {
		position: relative;
		width: 100%;
		height: auto;
		padding: 16.6667%;
		background: white;
		color: var(--nero);
		font-size: 87.5%;
		transform: translate(0, 0);
	}

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

	section#slider_box div#slider {
		position: relative;
		min-height: auto;
		margin-top: 0;
		display: block;
		opacity: 1;
		transform: translate(0, 0);
	}

	section#slider_box div#slider::before {
		content: none;
	}

	section#slider_box div#slider div.gruppo {
		position: relative;
		width: 100%;
		height: auto;
		padding: 0;
		background: var(--verde);
		font-size: 16px;
	}

	section#slider_box div#slider div.gruppo div.item {
		padding-bottom: 0;
		display: flex;
		flex-direction: column;
		position: relative;
	}

	section#slider_box div#slider div.gruppo div.item:last-child:not(.active) {
		padding-bottom: 6.3333%;
	}

	section#slider_box div#slider div.gruppo div.item div.titolo {
		order: 1;
		padding: 0 16.6667%;
		margin: 6.3333% 0 0 0;
	}

	section#slider_box div#slider div.gruppo div.item div.descrizione {
		order: 2;
		padding: 0 16.6667%;
	}

	section#slider_box div#slider div.gruppo div.item div.galleria {
		order: 3;
		position: relative;
		width: 100%;
		height: 56.25vw;
		z-index: auto;
		display: none;
		background: var(--nero);
		margin: 6.3333% 0 0 0;
	}

	section#slider_box div#slider div.gruppo div.item div.galleria::after {
		content: '';
		position: absolute;
		top: 43.75%;
		left: 43.75%;
		width: 12.5vw;
		height: 12.5vw;
		background: url(../img/layout/loader.svg);
		background-size: cover;
		animation: slider_loader_animation 2.5s infinite linear;
	}

	section#slider_box div#slider div.gruppo div.item.active div.galleria {
		display: block !important;
	}

	section#slider_box div#slider div#slider_pag {
		z-index: 10;
		position: absolute;
		bottom: 15px;
		right: 50%;
		display: block;
		transform: translate(50%, 0);
	}

	section#slider_box div#slider div#slider_pag ul li {
		min-width: 15px;
		min-height: 15px;
		margin: 0 5px;
	}

	section#slider_box div#slider div#slider_loader {
		display: none !important;
	}

	/* ------------------------------------------------------------- */
	/* CIBI                                                          */
	/* ------------------------------------------------------------- */
	section#cibi {
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		position: relative;
		overflow: hidden;
		flex-direction: column;
	}

	section#cibi > div {
		width: 100% !important;
		padding: 0 !important;
		margin: 0 !important;
		opacity: 1 !important;
		transform: none !important;
	}

	section#cibi div.testo {
		order: 1;
		padding: 16.6667% !important;
		font-size: 87.5%;
	}

	section#cibi div.foto.foto_1 {
		order: 2;
		padding: 0 16.6667% !important;
		height: 50vw;
		z-index: 1;
	}

	section#cibi div.foto.foto_1 img {
		transform: translate(0, 0);
		z-index: 1;
	}

	section#cibi div.foto.foto_2 {
		padding-bottom: 16.6667% !important;
	}

	section#cibi div.foto.foto_3 {
		order: 4;
	}

	section#cibi div.foto.foto_4 {
		order: 3;
		padding: 0 16.6667% !important;
		height: 50vw;
	}

	section#cibi div.foto.foto_4 img {
		transform: translate(0, 0);
		z-index: 1;
	}

	/* ------------------------------------------------------------- */
	/* MAMOIÀ                                                        */
	/* ------------------------------------------------------------- */
	section#mamoia {
		flex-direction: column;
		margin-top: 8.3333%;
	}

	section#cibi div.ruota,
	section#mamoia div.bg {
		display: none;
	}

	section#mamoia div.testo {
		color: white;
		width: 100%;
		margin: 0;
		padding: 16.6667% 0 33.3333% 0;
		font-size: 87.5%;
		opacity: 1;
		order: 1;
		position: relative;
	}

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

	section#mamoia div.testo::after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-image: url(../img/vini/vini-min.jpg);
		background-position: left center;
		background-size: cover;
		background-repeat: no-repeat;
		z-index: -2;
	}

	section#mamoia div.testo p {
		padding: 1em 16.6667%;
		opacity: 1;
	}

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

	section#mamoia div.foto {
		width: 100%;
		margin: 0;
	}

	section#mamoia div.foto div {
		margin-top: 0;
		padding: 0 16.6667%;
	}

	section#mamoia div.testo div.label,
	section#mamoia div.testo div.label.animate {
		display: block;
		opacity: 1;
		transform: translate(0, 0);
		width: 33.3333%;
		margin: 8.333% 0;
	}

	section#mamoia div.foto div:nth-child(1) {
		margin-bottom: 6.3333%;
	}

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

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

	/* ------------------------------------------------------------- */
	/* NOTIZIE                                                       */
	/* ------------------------------------------------------------- */
	h2#notizie_head {
		display: block;
		color: var(--verde);
		text-align: center;
		font-weight: 300;
		font-size: 175%;
	}

	section#notizie {
		opacity: 1;
		background: var(--verde);
		height: auto;
		min-height: inherit;
		padding-bottom: 6.333%;
		margin: 6.25vw 0 0 0;
	}

	section#notizie div.slider {
		position: relative;
	}

	section#notizie div.slider div.item div.foto {
		position: relative;
		width: 100%;
		height: 70vw;
		opacity: 1;
	}

	section#notizie div.slider div.item div.testo {
		position: relative;
		top: auto;
		left: auto;
		width: 100%;
		min-height: inherit;
		transform: translate(0, 0);
		padding: 8.3333% 16.6667%;
		font-size: 87.5%;
		display: none;
		opacity: 1;
		transition: opacity 1s;
	}

	section#notizie div.slider div.item.active div.testo {
		display: block;
	}

	section#notizie div.slider div.item div.testo::before {
		content: none;
	}

	section#notizie div.slider div.item div.testo > * {
		opacity: 0;
		transition: opacity 0.35s;
	}

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

	section#notizie div.arrows {
		display: flex;
		padding: 0 16.6667%;
	}

	section#notizie div.dx,
	section#notizie div.sx {
		position: relative;
		top: 0;
		transform: translate(0, 0);
		min-width: 30px;
		display: block;
	}

	section#notizie div.dx {
		right: 0;
	}

	section#notizie div.sx {
		left: 0;
		margin-right: 5%;
		opacity: 0.35;
	}

	section#notizie div.dx a,
	section#notizie div.sx a {
		opacity: 1;
		mix-blend-mode: normal;
	}

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

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

	section#notizie div.archivio {
		position: relative;
		bottom: 0;
		left: 0;
		font-size: 80%;
		padding: 0 16.6667%;
		margin-top: 5%;
	}

	/* ------------------------------------------------------------- */
	/* NOTIZIE ARCHIVIO                                              */
	/* ------------------------------------------------------------- */
	div#notizie_archivio div#notizie_archivio_close {
		top: 3.35%;
		right: 5.5%;
	}

	div#notizie_archivio #notizie_archivio_lista {
		position: relative;
		top: 7%;
		left: 0;
		width: 100%;
		height: 92%;
		padding: 6% 6% 8% 8%;
		font-size: 80%;
	}

	div#notizie_archivio #notizie_archivio_lista div.item {
		display: block;
		margin-top: 30%;
	}

	div#notizie_archivio #notizie_archivio_lista div.item div.img {
		width: 100%;
		margin-bottom: 1em;
	}

	div#notizie_archivio #notizie_archivio_lista div.item div.txt {
		width: 100%;
		padding-right: 0;
	}

	div#notizie_archivio #notizie_archivio_lista div.item div.txt h2 {
		font-size: 125%;
		margin-top: 2em;
	}

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

	/* ------------------------------------------------------------- */
	/* FOOTER                                                        */
	/* ------------------------------------------------------------- */
	footer {
		font-size: 80%;
		padding: 8.3333% 0;
		flex-direction: column;
	}

	footer div.logo,
	footer div.info,
	footer div.social {
		width: 100%;
		text-align: center;
	}

	footer div.logo {
		margin-bottom: 4%;
	}

	footer div.logo img {
		width: 100%;
		max-width: 16.6667%;
	}

	footer div.info,
	footer div.social {
		margin-top: 4%;
	}

	footer div.social ul {
		justify-content: center;
	}

	footer div.social ul li {
		margin: 0 2%;
	}

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

	footer div.up {
		display: block;
		text-align: center;
		margin-top: 20%;
	}

	footer div.up a {
		display: inline-block;
		width: 30px;
		height: 30px;
		transition: opacity 0.35s;
	}
	
	footer div.up a:hover{
		opacity: 0.5;
		transition: opacity 0.35s;
	}

	footer div.up a svg {
		width: 100%;
		height: 100%;
		transform: rotate(-90deg);
	}

	footer div.up a svg .svg_freccia_mobile {
		stroke: #fff;
	}

	/* ------------------------------------------------------------- */
	/* DISCLAIMER                                                    */
	/* ------------------------------------------------------------- */
	section#disclaimer ul {
		justify-content: space-around;
		font-size: 80%;
	}

	section#disclaimer ul li {
		margin: 0;
	}

}