/*
	   	Theme Name: F.LLI NATOLINO versione mobile
	   	Theme URI: https://natolino.it
	   	Author: BMBDesign
	   	Author URI: https://www.bmbdesign.it
		font-family: "DM Sans", sans-serif;
*/
@media (max-width: 1439px) {
	.footercontent,
	.footerbasso,
	.fascia-introduttiva,
	.contenitore-testo,
	.fascia-esperienza,
	.fascia-title-realizzazioni,
	.fascia-title-servizi,
	.fascia-chisiamo,
	.accordion-header,
	.accordion-content,
  	.accordion-content.open,
	.fascia-lavoraconnoi,
	.box-inostrivalori,
	.i-clienti,
	.certificazioni,
	.naviga-post,
	.fascia-count,
	.testo-aggiuntivo,
	.tornaprogetti {
		width: 90%;
		padding-left: 5%;
		padding-right: 5%;
	}
	.slider-anteprima-realizzazioni {
		padding-left: 5%;
		width: 95%;
	}
	.content-esperienza, .contentpersone {
		width: 90%;
		margin-left: 5%;
		margin-right: 5%;
	}
	#tutte-le-anteprime, .galleria-fotografica {
		width: calc(90% + 22px);
		width: -webkit-calc(90% + 22px);
		width: -moz-calc(90% + 22px);
		padding-left: calc(5% - 11px);
		padding-left: -webkit-calc(5% - 11px);
		padding-left: -moz-calc(5% - 11px);
		padding-right: calc(5% - 11px);
		padding-right: -webkit-calc(5% - 11px);
		padding-right: -moz-calc(5% - 11px);	
	}
	#video-controls {
	  	position: absolute;
	  	bottom: 20px;
	  	right: 20px;
	  	display: flex;
	  	flex-direction: row; /* da column a row */
	  	gap: 12px; /* mantiene lo spazio tra le icone */
	}
}



@media (max-width: 1279px) {
	.sfondoripetuto {
		height: 320px;
		background-size: auto 320px;
		bottom: -160px;
	}
	.footercontent {
	  	font-size: 16px;
	  	line-height: 22px;
	}
	.sx-fascia-contatti {
	  	margin-right: 60px;
	  	width: calc(40% - 60px);
	  	width: -webkit-calc(40% - 60px);
	  	width: -moz-calc(40% - 60px);
	}
	.colonna-elenco-clienti {
	  	column-count: 1;
	}
  /* Tutti i box */
  .valore-1, .valore-2, .valore-3,
  .valore-4, .valore-5, .valore-6,
  .valore-7, .valore-8 {
    position: relative;
    float: left;
		width: calc(33.33% - 46px);
		width: -webkit-calc(33.33% - 46px);
		width: -moz-calc(33.33% - 46px);
    border-right: 1px solid rgba(255, 255, 255, 0.3);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    border-left: none;
    border-top: none;
    padding: 38px 22px 50px 22px;
  }

  /* prima colonna: 1, 4, 7 */
  .valore-1, .valore-4, .valore-7 {
    border-left: 1px solid rgba(255, 255, 255, 0.3);
  }

  /* prima riga: 1, 2, 3 */
  .valore-1, .valore-2, .valore-3 {
    border-top: 1px solid rgba(255, 255, 255, 0.3);
  }
	
}






@media (max-width: 1023px) {
	.box-inostrivalori {
		padding-bottom: 130px;
	}
	.accorcia {
		width: 100%;
	}
	img.photorealiz {
		display: block;
		width: 100%;
		height: auto;
		margin-top: 70px;
    	margin-bottom: 80px;
		float: left;
	}
	.menu-header-centro, .logo-tecnorisorse, .pls-email, .pls-telefono {
		display: none;
	}
	.header, .logo-header, .logo-header img {
		height: 46px;
	}
	.lingue, .linguenohome {
		top: 71px;
	}
	#trigger-overlay {
		display: block;
		width: 30px;
		float: right;
		height: 16px;
		margin-top: 15px;
	}
	#trigger-overlay:hover {
		cursor: pointer;
		opacity: 0.5;
    	filter: alpha(opacity=50); /* For IE8 and earlier */
	}
	.fascia-header-menu {
		height: 46px;
		margin-top: 10px;
		width: 90%;
		margin-left: 5%;
		margin-right: 5%;
	}
	.logo-menu-mob {
		width: 220px;
		height: 46px;
		float: left;
	}
	.logo-tecnorisorse-mobile {
		position: absolute;
		bottom: 5vw;
		width: 90%;
		left: 5%;
		right: 5%;
		height: 34px;
	}
	.pls-email-mob {
		height: 37px!important;
		line-height: 37px!important;
		padding-left: 26px;
		padding-right: 26px;
		color: #575756!important;
		display: inline-block;
		font-size: 17px!important;
		border-radius: 10px;
		background: #FFF;
		font-weight: 500!important;
		cursor: pointer;
	}
	.pls-telefono-mob {
		background: url("https://www.natolino.it/wp-content/themes/fllinatolino/images/phone-off.svg") no-repeat bottom 9px left 11px,
					#fff;
		background-size: 19px 19px!important;
		height: 37px!important;
		line-height: 37px!important;
		padding-left: 50px;
		padding-right: 26px;
		color: #575756!important;
		display: inline-block;
		font-size: 17px!important;
		border-radius: 10px;
		font-weight: 500!important;
		margin-bottom: 18px;
		cursor: pointer;
	}
	.pls-telefono-mob:hover {
		background: url("https://www.natolino.it/wp-content/themes/fllinatolino/images/phone-on.svg") no-repeat bottom 9px left 11px,
					#575756!important;
		background-size: 19px 19px!important;
		color: #fff!important;
	}
	.pulsanti-telmail-mob {
		width: 100%;
		float: left;
		margin-top: 51px;
	}
	.pls-email-mob:hover {
		background: #575756!important;
		color: #FFF!important;
	}
	img.ico-foo-desktop {
		display: none;
	}
	img.ico-foo-mobile {
		display: block;
		margin-bottom: 30px;
	}
	.colonna-footercontent-sx img {
		margin-top: 0px;
	}
	.footer-meta, .colonna-footercontent-sx, .colonna-footercontent-dx {
		width: 100%;
	}
	.colonna-footercontent-sx {
	  	padding-bottom: 25px;
	  	margin-bottom: 25px;
	  	border-bottom: 1px solid #dfddda;
	}
	.footercontent-dx-sopra {
	  	padding-bottom: 0px;
	  	margin-bottom: 25px;
	}
	.footer-meta {
		margin-bottom: 25px;
	}
	.footer-linkedin {
	  	width: 100%;
	  	margin-top: 0px;
	  	text-align: left;
	}
	.footercontent {
  		padding-top: 100px;
  		padding-bottom: 50px;
	}
	.footerbasso {
		padding-bottom: 120px;
	}
	.sinistra-footerbasso {
  		width: 100%;
	}
	.footer-v-mobile {
		display: block;
	}
	.sinistra-footerbasso, .destra-footerbasso {
		display: none;
	}
	.footerbasso {
  		line-height: 18px;
	}
	.fascia-title-servizi, .fascia-title-realizzazioni {
  		height: auto;
  		font-size: 35px;
  		line-height: 37px;
	}
	.contenitore-testo h1, .sx-fascia-contatti h1, .fascia-lavoraconnoi h1, .testo-chisiamo h1, .content-esperienza h1, .contentpersone h1, .colonna-titolo-clienti h1, .prefazione-certificazioni h1 {
  		font-size: 35px;
  		line-height: 37px;	
	}
	.contenitore-testo {
		margin-top: 250px;
	}
	.foto-fullscreen-servizi {
		height: 50vh;
	}
	.titolo-accordion h3, .contenitore-testo h2 {
		font-size: 25px;
		line-height: 30px;
	}
	.accordion-icon {
		font-size: 40px;
		line-height: 30px;
		width: 60px;
	}
	.titolo-accordion {
  		width: calc(100% - 60px);
  		width: -webkit-calc(100% - 60px);
  		width: -moz-calc(100% - 60px);
	}
	.fascia-introduttiva {
		margin-top: 250px!important;
	  	height: auto!important;
		display: block!important;
	}
	.sx-fascia-contatti {
    	margin-right: 0px!important;
    	width: 100%!important;
  	}
	.centra-fascia-corallo {
    	display: block;
    	align-items: unset;
	  	height: auto;
		margin-top: 0px;
	}
	.dx-fascia-contatti, .dx-fascia-realiz {
	  	height: 60vh;
	  	width: 100%!important;
		margin-top: 70px;
		margin-bottom: 120px;
	}
	.modulo-form {
  		width: 50%;
	}
	.foto-destra-form {
		width: calc(50% - 50px);
		width: -webkit-calc(50% - 50px);
		width: -moz-calc(50% - 50px);
		margin-left: 50px;
  		margin-top: 29px;
	}
	.singolo-thumb {
	  	width: calc(50% - 22px);
	  	width: -webkit-calc(50% - 22px);
	  	width: -moz-calc(50% - 22px);
	}
	.galleria-fotografica {
		width: calc(90% + 10px)!important;
		width: -webkit-calc(90% + 10px)!important;
		width: -moz-calc(90% + 10px)!important;
		padding-left: calc(5% - 5px)!important;
		padding-left: -webkit-calc(5% - 5px)!important;
		padding-left: -moz-calc(5% - 5px)!important;
		padding-right: calc(5% - 5px)!important;
		padding-right: -webkit-calc(5% - 5px)!important;
		padding-right: -moz-calc(5% - 5px)!important;	
	}
	.riga-uno-foto img, .riga-tre-foto img, .colonna-sinistra-foto img {
	  	width: calc(50% - 10px);
	  	width: -webkit-calc(50% - 10px);
	  	width: -moz-calc(50% - 10px);
	  	margin-left: 5px;
	  	margin-right: 5px;
	}
	.colonna-destra-foto {
		display: none;
	}
	.riga-uno-foto, .riga-due-foto {
		margin-bottom: 10px;
	}
	img.photo-full {
		width: calc(100% - 10px)!important;
		width: -webkit-calc(100% - 10px)!important;
		width: -moz-calc(100% - 10px)!important;
		margin-right: 0;
		margin-top: 10px;
		margin-left: 5px;
	}
	img.marginesotto {
  		margin-bottom: 0px;
	}
	.headercontent {
  		margin-left: 5%;
	    margin-right: 5%;
  		width: 90%;
	}
	.colonna-sinistra-foto {
  		width: 100%;
  		margin-left: 0px;
  		margin-right: 0px;
	}
	.riga-due-foto {
		display: block;
	}
	.foto-mob-sola {
		display: block;
		float: left;
		width: 100%;
	}
	.fascia-count h1 {
  		font-size: 40px;
  		line-height: 40px;
	}
	.fascia-count {
		padding-top: 95px;
		padding-bottom: 95px;
	}
	.sfondoripetuto-count {
		height: 320px;
		background-size: auto 320px;
		margin-top: -160px;
	}
	.dx-fascia-corallo {
		width: 100%;
		height: auto;
  		background: none !important;
	}
	.sx-fascia-corallo {
	  	margin-right: 0px;
	  	width: 100%;
	}
	.sx-fascia-corallo h1 {
	  	font-size: 35px;
	  	line-height: 37px;
		margin-bottom: 35px;
	}
	.dx-fascia-corallo img {
		display: block;
		width: 70%;
		height: auto;
		margin-left: 30%;
		margin-bottom: 110px;
		margin-top: 50px;		
	}
	.sezione-esperienza-sinistra, .sezione-esperienza-destra {
	  font-size: 35px;
	  line-height: 40px;
	}
	.sezione-centrale {
  		font-size: 40px;
	}
	.pls-scopripiu {
		display: none;
	}
	.pls-scopripiu-mobile, .pls-scopripiu-mobile-rientra {
		display: block;
	}
	.fascia-chisiamo {
		display: block;   /* oppure inline/inline-block a seconda del caso */
  		align-items: normal; /* o semplicemente elimina la proprietà */
	}
	.pls-scopripiu-mobile-rientra {
		margin-left: 5%;
	}
	.foto-chisiamo {
		display: none;
	}
	.testo-chisiamo {
	  	margin-left: 0px;
		width: 100%;
	}
	img.photochisiamomob {
		display: block;
		width: 100%;
		height: auto;
		margin-top: 75px;
		float: left;
	}
	img.photoaziende {
		display: block;
		width: 100%;
		height: auto;
		margin-top: 120px;
		float: left;
	}
	.fascia-esperienza-big {
		margin-top: 120px;
	}
	.colonna-titolo-clienti, .colonna-elenco-clienti {
		width: 100%;
	}
	.colonna-elenco-clienti {
		margin-top: 50px;
	}
	.frase-che-scorre {
  		line-height: 100px!important;
  		font-size: 90px!important;
	}
	/* Tutti i box */
	.valore-1, .valore-2,
	.valore-3, .valore-4,
	.valore-5, .valore-6,
	.valore-7, .valore-8 {
		position: relative;
		float: left;
		width: calc(50% - 46px);
		width: -webkit-calc(50% - 46px);
		width: -moz-calc(50% - 46px);
		border-right: 1px solid rgba(255, 255, 255, 0.3);
		border-bottom: 1px solid rgba(255, 255, 255, 0.3);
		border-left: none;
		border-top: none;
		padding: 38px 22px 50px 22px;
	}
	/* prima colonna: 1, 3, 5, 7 */
	.valore-1, .valore-3, .valore-5, .valore-7 {
		border-left: 1px solid rgba(255, 255, 255, 0.3);
	}
	/* prima riga: 1, 2 */
	.valore-1, .valore-2 {
		border-top: 1px solid rgba(255, 255, 255, 0.3);
	}
	.fascia-sopra-cert {
		width: 100%;
		float: left;
		display: block;
		align-items: initial; /* oppure unset */
	}
	.box-destra-certificazioni {
		padding-left: 30px;
		padding-right: 30px;
		margin-left: 0px;
		width: calc(100% - 60px);
		width: -webkit-calc(100% - 60px);
		width: -moz-calc(100% - 60px);
		padding-top: 40px;
		padding-bottom: 54px;
	}
	.prefazione-certificazioni {
		width: 100%;
		margin-right: 0px;
		margin-bottom: 95px;
	}
	.box-destra-certificazioni h2,
	.colonna-sx-sotto-cert h2 {
		font-size: 20px;
		margin-bottom: 24px;
	}
	.colonna-sx-sotto-cert {
		margin-right: 0px;
		padding-left: 30px;
		padding-right: 30px;
		margin-left: 0px;
		width: calc(100% - 60px);
		width: -webkit-calc(100% - 60px);
		width: -moz-calc(100% - 60px);
	}
	.logo-cert-sot {
		padding-left: 30px;
		padding-right: 30px;
		margin-left: 0px;
		width: calc(100% - 60px);
		width: -webkit-calc(100% - 60px);
		width: -moz-calc(100% - 60px);
	}
	.colonna-dx-sotto-cert {
		width: calc(100% - 60px);
		width: -webkit-calc(100% - 60px);
		width: -moz-calc(100% - 60px);
		padding-left: 30px;
		padding-right: 30px;
		margin-left: 0px;
		margin-top: 20px;
	}
	.fascia-sotto-cert {
		margin-top: 80px;
		padding-top: 40px;
		padding-bottom: 54px;
	}
	.frecciaarancione {
		top: 40px;
	}
	.i-clienti {
		padding-bottom: 90px;
		margin-bottom: 90px;
	}
	.quadro-bianco-sx, .quadro-bianco-dx {
	  width: calc(100% - 70px);
	  width: -webkit-calc(100% - 70px);
	  width: -moz-calc(100% - 70px);
	}
	.quadro-bianco-dx {
		margin-left: 0;
		margin-top: 50px;
		padding-bottom: 50px;
	}
	.padding-quadrosx {
		display: none;
	}
	.fascia-esperienza-big {
		padding-bottom: 170px;
	}
	.img-experience {
	  	width: 220px;
	  	bottom: -170px;
	}
	.quadro-bianco-sx {
		margin-top: 110px;
	}
	.contentpersone {
		margin-top: 220px!important; 
	}
	.foto-sx-persone {
		display: none;
	}
	.foto-boxsnpersone {
	  	width: 100%;
	  	display: block;
		margin-left: 0;
	}
	.box-sx-persone {
		width: calc(100% - 70px);
		width: -webkit-calc(100% - 70px);
		width: -moz-calc(100% - 70px);	
		margin-left: 0;
		display: block;
		flex-wrap: nowrap; /* corretto */
	}
	.box-persone {
		margin-top: 60px;
	}
	.quadro-bianco-sx h2, .quadro-bianco-dx h2, .box-sx-persone h2, .box-dx-persone h2 {
		font-size: 20px;
		line-height: 24px;
		margin-bottom: 90px;
	}
	.box-dx-persone {
		width: calc(100% - 70px);
		width: -webkit-calc(100% - 70px);
		width: -moz-calc(100% - 70px);	
		margin-top: 50px;
	}
	.foto-boxsnpersone-mob {
		display: block;
		margin-top: 50px;
		width: 100%;
		float: left;
	}
	.foto-boxsnpersone-mob img {
		width: 68%;
		height: auto;
		margin-bottom: 20px;
		border: 1px solid #FFF;
	}
	img.allineadx {
		float: right;
	}
	.lingue-in-riga {
	  	justify-content: left;
	}
	.lingue, .linguenohome {
		width: 90%;
		padding-left: 5%;
		padding-right: 5%;
	}
}




@media (max-width: 767px) {
	.ombra-sopra-foto {
		left: 22%;
	}
	.modulo-form {
  		width: 100%;
	}
	.foto-destra-form {
		width: 100%;
		margin-left: 0px;
  		margin-top: 90px;
	}
	.titolo-sezione-foto-sinistra {
	  	padding: 0;
	  	position: static;
	  	top: 0;
	  	left: 0;
		margin-bottom: 30px;
	}
	.sezione-esperienza-sinistra {
		width: 78%;
		padding-right: 22%;
	}
	.fascia-esperienza {
		display: block;
		align-items: initial;
	}
	.fascia-esperienza {
		padding-top: 110px;
		padding-bottom: 110px;
	}
	.sezione-esperienza-destra {
	  	width: 78%;
		padding-left: 22%;
		margin-top: 34px;
	}
	.sezione-centrale {
	  	display: none;
	}
	.sezione-centrale-mobile {
		display: block;
		position: absolute;
		bottom: 0;
		right: 0;
		font-size: 40px;
		color: #FFF;
		line-height: 30px;
	}
	.titolo-sezione-foto-destra {
		left: 0;
		padding-left: 0;
	}
	.fascia-realizzazioni {
		padding-top: 100px;
		padding-bottom: 100px;
	}
.valore-1, .valore-2,
.valore-3, .valore-4,
.valore-5, .valore-6,
.valore-7, .valore-8 {
    position: relative;
    float: none;
    width: calc(100% - 46px);
    width: -webkit-calc(100% - 46px);
    width: -moz-calc(100% - 46px);
    border-left: 1px solid rgba(255, 255, 255, 0.3);
    border-right: 1px solid rgba(255, 255, 255, 0.3);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    border-top: none; /* niente bordo superiore */
    padding: 38px 22px 50px 22px;
}

/* il primo box mantiene il bordo superiore */
.valore-1 {
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}
	.icona-valore {
  width: 40px;
  height: 40px;
}
	.icona-valore img {
		height: 25px;
		width: auto;
	}
}




@media (max-width: 600px) {
	.singolo-thumb {
	  	width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
	#tutte-le-anteprime {
		width: 90%!important;
		padding-left: 5%!important;
		padding-right: 5%!important;
	}
}