.no_desk{
  display: none;
}
body{
  font-size: 1vw;
  position: relative;
}

.back_dark_menu{
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.3);
  z-index: 999999999;
  top: 0;
  left: 0;
  transition: all 0.2s ease-out;
  opacity: 0;
  pointer-events: none;
}

.back_dark_visible{
  opacity: 1 !important;
  pointer-events: all !important;
  
}


.blur_attivo{
  transition: all 0.2s ease-out;
  filter: blur(6px);
}

/*animazione titoli*/

.anispa{
  opacity: 0;
}

.animate_h1 span{
    width: 100%;
  /*  float: left;*/
      -webkit-clip-path: polygon(0% 50%, 100% 100%, 100% 100%,0% 100%);
      clip-path: polygon(0% 50%, 100% 100%, 100% 100%,0% 100%);
    transform: translateY(-50px);
    opacity: 0;
  }
.animate_h1 span{
  /*animation-delay: 0.6s;*/
  -webkit-animation-fill-mode: forwards;
}


.animate_h1_first span{
  width: 100%;
/*  float: left;*/
    -webkit-clip-path: polygon(0% 50%, 100% 100%, 100% 100%,0% 100%);
    clip-path: polygon(0% 50%, 100% 100%, 100% 100%,0% 100%);
  transform: translateY(-50px);
  opacity: 0;
}
.animate_h1_first span{
/*animation-delay: 0.6s;*/
-webkit-animation-fill-mode: forwards;
}

@keyframes titleAnimation {
    0% {
      transform: translateY(-50px);
      opacity: 0;
      -webkit-clip-path: polygon(0% 50%, 100% 100%, 100% 100%,0% 100%);
      clip-path: polygon(0% 50%, 100% 100%, 100% 100%,0% 100%);
      /*
      -webkit-clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 80%);
      clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 80%);
          */
  }
  100% {
      transform: translateY(0);
      opacity: 1;
          /*
      -webkit-clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 15%);
      clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 15%);
          */
      -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%,0% 100%);
      clip-path: polygon(0% 0%, 100% 0%, 100% 100%,0% 100%);
  }
}




.animate_h1 p{
transition: all 0.5s linear;
opacity:0;
}

.animate_h1 .visible p{
opacity:1 ;
}

.anispan_first,.animate_h1{
  opacity: 0;
}

.animate_h1_first p{
  transition: all 0.5s linear;
  opacity:0;
  }
  
  .animate_h1_first .visible p{
  opacity:1 ;
  }
  
  


header{
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  transition: all 0.2s linear;
padding: 2vh 3.5vw;
}

.shrink{
  background-color: rgba(98,90,90,0.5);
  padding: 1vh 2vw;
  transition: all 0.2s linear;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/*
.lang{
  width: 55%;
  padding:0 0 3vh 1.2vw;
  text-align: center;
	 }

   .lang a{
    opacity: 0.5;
    width: 47%;
    display: block !important;
    padding: 0.5vh 0.5vw !important;
    border: 1px solid #fff;
    text-decoration: none;
    color: #fff !important;
    font-size: 80% !important;
    background-color: transparent;
    transition: all 0.2s linear;
   }*/




.lang{
  width: 95%;
  padding:0 0 3vh 1.2vw;
  text-align: center;
	 }

   .lang a{
    opacity: 0.5;
    width: 20%;
    display: block !important;
    padding: 0.2vh 0.5vw !important;
    border: 1px solid #fff;
    text-decoration: none;
    color: #fff !important;
    font-size: 80% !important;
    background-color: transparent;
    transition: all 0.2s linear;
   }

   .lang a:hover{
    opacity: 1 !important;
    background-color: #222;
    border: 1px solid #222;
   }

   .lang_select{
    opacity: 1 !important;
    pointer-events: none;
   }


   /*

	 	 .lang .select_img{
	 		 height: 2vh;
	 		 margin:0 1vw;
       cursor: auto;
	 	 }

      .lang .ita{
	 		 height: 2vh;
	 		 margin:0 1vw 0 0 !important;
       cursor: auto;
	 	 }

	 .lang .lang_img{
		 height: 2vh;
		 margin-right: 0;
		 /*cursor: pointer;*/
	/*	 filter: gray; /* IE6-9 */
 /*-webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
 /*filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
	/* }

	 	 .lang .lang_img:hover{
			 -webkit-filter: grayscale(0) brightness(0);
			   filter: none;
         cursor: pointer;
		 }
*/

     .logo_shrink{
      width: 35%;
      opacity: 0;
     }


.logo_shrink img{
  height: 4.2vw;
 /* height: 9vh;*/
}

.shrink .logo_shrink img{
  height: 3.2vw;
padding-top: 1vh;
}
/*
.shrink .empty{
  display: none;
}*/


.menu{
  opacity: 0;
  width: 36%;
}

.menu a{
  display: block;
  font-size: 100%;
  color: #fff;
  position: relative;
  text-decoration: none;
  transition: 0.4s;
}

.menu a:hover{
  color: #238EB8;
  text-decoration: none;
}


.menu a::before {
  content: "";
  position: absolute;
  width: 0%;
  height: 1px;
  bottom: 0;
  left: 50%;
  background-color: #238EB8;
  transition: all 0.4s;
  z-index: 99999;
}
.menu a:hover::before {
  width: 100%;
  left: 0;
}


.shrink .menu {
  width: 30%;
}

.shrink .menu a{
  font-size: 90%;
}

.link_scale{
  margin-bottom: 0 !important;
  position: relative;
}

.link_contatti{
  margin-bottom: 0 !important;
  position: relative;
}

.link_scale::after,.link_contatti::after{
  content: '\25BC';
  color: #fff;
  position: absolute;
  top: 24%;
  right: 69%;
  font-size: 70%;
}



.sottomenu{
  display: none;
  width: 100%;
  padding:1vh 0;
  margin-bottom: 0.5vh;
  background-color: rgba(0,0,0,0.3);
}

.sottomenu a{
  font-size: 90%;
}

.sottomenu a:last-child{
  margin-bottom: 0 !important;
}

.menu_select{
  background-color: #222 !important;
}


.back_intro {
    position: absolute;
    z-index: 999;
    top: 0;
    height: 100%;
    background: #0B1320;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
  }

  .left {
    width: 50%;
    left: 0;
    }

  .right {
    width: 50%;
    right: 0 !important;
    }

    .anima_left{
      animation: left 1.5s ease-in-out 0.5s 1 normal forwards;
    }

    .anima_right{
     animation: right 1.5s ease-in-out 0.5s 1 normal forwards;
        }


  @keyframes left {
      0%{
          opacity: 1;
      }


      100% {
          opacity: 1;
  width: 0;
      }
  }

  @keyframes right {
    0%{
      opacity: 1;
    }
    100% {
      opacity: 1;
      width: 0;
    }
  }


/*INIZIO SLIDE HP*/

#start{
	opacity:0;
		display:none;
	
	}
	#wrapper{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	padding:0;
	margin:0;
	opacity:0;
	overflow:hidden;
	}


	#wrapper2{
		position: absolute;
top: -10vh;
left: 0vw;
width: 100%;
height: 110%;
padding: 0;
margin: 0;
overflow: hidden;
z-index: 99999;
	}

	#wrapper.attivo{
	
	opacity:1;
	
	}

	#wrapper2.attivo{
	
	opacity:1;
	
	}
	
	#wrapper div{
	position:absolute;
		overflow:hidden;
	padding:0;
		margin:0;
			width:0vw;
	height:100%;
				background-size:100vw auto;
					background-repeat:no-repeat;
	transition:width 0.8s ease-in;
		background-color:#fff;
	}
	
	
	.wrapper.vert div{
				background-size:auto 100vh !important;
	}
	
	
	#wrapper div span.stretta{
			margin-left:3.25vw;
			margin-top:35vh;
			opacity:0;
	transform:scaleX(0);
	transform-origin: top center;
	}
	
	
	
	#wrapper div div{
	position: absolute; top: 0px; left: 0px; z-index: 0; background-color: rgba(0, 0, 0, 0.2); width: 100%;height:100%;
	}
	
	
	#wrapper div span{
	position:absolute;
		/*font-family: 'Abel', sans-serif;*/
		font-family: 'Teko', sans-serif;
			font-size:10vw;
					color:#fff;
				margin-left:-10vw;
						margin-top:35vh;
							opacity:0;
	
	}
	
	#wrapper div span.verticale_su{
			margin-left:3.25vw;
			margin-top:25vh;
			opacity:0;
	
	}
	
	#wrapper div span.verticale_giu{
					margin-left:3.25vw;
					margin-top:45vh;
					opacity:0;
	
	}
	
	
	
	
	
	#wrapper.attivo div span{
	transition:margin-left 0.3s ease-out, margin-top 0.3s ease-out,transform 0.3s ease-out, opacity 0.8s linear;
			margin-left:3.25vw;
			margin-top:35vh;
			opacity:1;
				transform:scaleX(1);
	}
	#wrapper.attivo div:nth-child(1) span{
	transition-delay:2.5s;
	}
	#wrapper.attivo div:nth-child(2) span{
	transition-delay:2.6s;
	}
	#wrapper.attivo div:nth-child(3) span{
	transition-delay:2.7s;
	}
	#wrapper.attivo div:nth-child(4) span{
	transition-delay:2.8s;
	}
	#wrapper.attivo div:nth-child(5) span{
	transition-delay:2.9s;
	}
	#wrapper.attivo div:nth-child(6) span{
	transition-delay:3.0s;
	}
	#wrapper.attivo div:nth-child(7) span{
	transition-delay:3.1s;
	}
	#wrapper.attivo div:nth-child(8) span{
	transition-delay:3.2s;
	}
	
	
	
	
	#contenitore{
	/*position:relative;*/
	padding:0;
			margin:0;
					width:100%;
	height:100vh;
	}
	
	
	
	#wrapper.attivo div{
	/*transform:scaleX(1);*/
			width:12.5vw;
	
	}
	#wrapper div:nth-child(1){
		left:0vw;
		background-position:0 center;
			transition-delay:0ms;
	}
	#wrapper div:nth-child(2){
		left:12.5vw;
		background-position:-12.5vw center;
			transition-delay:100ms;
	}
	#wrapper div:nth-child(3){
		left:25vw;
		background-position:-25vw center;
			transition-delay:200ms;
	}
	#wrapper div:nth-child(4){
		left:37.5vw;
		background-position:-37.5vw center;
			transition-delay:300ms;
	}
	#wrapper div:nth-child(5){
		left:50vw;
		background-position:-50vw center;
			transition-delay:400ms;
	}
	#wrapper div:nth-child(6){
		left:62.5vw;
		background-position:-62.5vw center;
			transition-delay:500ms;
	}
	#wrapper div:nth-child(7){
		left:75vw;
		background-position:-75vw center;
			transition-delay:600ms;
	}
	#wrapper div:nth-child(8){
		left:87.5vw;
		background-position:-87.5vw center;
			transition-delay:680ms;
	}




.grafiche_scale{
opacity:0;
}


  .grafica_scale1{
  position: absolute;
  top: 0;
  left: 0%;
  height: 100%;
  width:100%;
  z-index: 9999;
  }
  



.grafica_scale2{
  position: absolute;
  top: 0;
  left: 0%;
  height: 100%;
  width:100%;
  z-index: 9999;
}
.grafica_scale3{
  position: absolute;
  top: 0;
  left: 0%;
  height: 100%;
  width:100%;
  z-index: 9999;
}
.grafica_scale4{
  position: absolute;
  top: 0;
  left: 0%;
  height: 100%;
  width:100%;
  z-index: 9999;
}


.hide_h{
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  transition: all .6s ease-out;
  opacity: 0;

}

.hide_v{
  /*clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);*/
  /*clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
  transition: all .6s ease-out;*/
  animation: svg_slidedown 1s;
  animation-timing-function:ease-in;
  animation-fill-mode: forwards;
}

.opacity_svg{
  
  clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);opacity:0;
}

.ending_v{
clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);

}


.show_h{
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  transition: all 1.2s ease-out;
  opacity: 1;
}

.show_v{
  /*clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);*/
  /*transition: all 1.2s ease-out;*/
  animation: svg_slideup 1.8s;
  /*animation-timing-function:cubic-bezier(0.185, 0.830, 0.340, 0.905);*/
  animation-timing-function:cubic-bezier(0.08, 0.53, 0.94, 0.54);
  animation-fill-mode: forwards;
  opacity: 1;
}


@keyframes svg_slideup {
  0%   {clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);}
  100% {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
}

@keyframes svg_slidedown {
  0% {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
  100%   {clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);}
}
 
  

/*fine new slide*/

.back_intro_sec{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0 !important;
  left: 0;
  z-index: 999998;
  background: radial-gradient(circle, rgba(0,0,0,0) 60%, rgba(0,0,0,0.8) 100%); 

}


#intest_intro{
  position: absolute;
  top: 35%;
  left: 0;
  right: 0;
  margin: auto;
  width: 90%;
  text-align: left;
  z-index: 999999;
}

#intest_intro h1{
  font-size: 550%;
  font-weight: 300;
  color: #fff;
  margin: 0;
  padding: 0;
  line-height: 1.2;
}


#intest_intro p{
  font-size: 150%;
  font-weight: 300;
  color: #fff;
  margin: 0;
  padding: 0;
}



.owl-carousel1{
    display: inline !important;
    position: absolute !important;
    width: 100vw  !important;
    height: 110vh  !important;
}

.owl-carousel1 .item{
    width: 100vw;
    height: 110vh;
    position: relative;
    background-repeat:no-repeat;
  background-size:cover;
  background-position:center center;
}



.owl-carousel1 .item::after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.3) 60%, rgba(0,0,0,1) 100%);
}



footer{
  background-color: #dcd8d8;
  padding: 6vh 0 0 0;
}

.foot{
  width: 90%;
  margin: 0 auto;
  color: #222;
}

.foot a{
  color: #222;
}
.foot a:hover{
  color: #238EB8;
}

.foot img{
  height: 7vh;
  margin-bottom: 0;
}

.txt_foot{
  padding-bottom: 3vh;
  font-size:90%;

}


.img_logo_foot{
  height: 20vh;
}

.img_logo_foot img{
  height: 4vh;
  margin: 0 0.3vw;
}





.location{
  width: 100%;
  margin: 0 auto;
  padding: 0 0 0 0;
  overflow: hidden;
}

#map{
  width: 100%;
  height: 80vh;
}

.txtmaps {
  padding: 10px 20px 20px 20px;
  font-size: 13px;
  text-align: center;
  color: #222;
}

.txtmaps img{
  height:6vh;margin-bottom:10px;
}

.txtmaps h2{
  font-weight:bold;font-size:150%;
}


.txtmaps p{
line-height:1.5;
font-size:100%;
}




.text-modulo {
  padding: 10vh 0;
  width: 70%;
  margin: 0 auto;
 text-align:center;
 min-height:30vh;
}


.text-modulo h1{
  font-size: 250%;
  font-weight: 800;
  color: #222;
}

.text-modulo p{
  margin: 20px 0 30px 0;
}

.text-modulo a{
  color: #238EB8;
  text-decoration: none;
}
.text-modulo a:hover{
  color: #222;
  text-decoration: none;
}



.about_hp{
  width: 100%;
  padding: 15vh 0 20vh 0;
  margin: 0 auto 0px auto;
  background-color: #fff;
  position: relative;
  overflow: hidden;
}

.content_about{
  width: 80%;
  margin: 0 auto 28vh auto;
  position: relative;
}


.content_professional{
  width: 80%;
  margin: 40vh auto 4vh auto;
  position: relative;
}

.empty_about{
  width: 20%;
}

.txt_about_hp{
  width: 75%;
  /*! padding-right: 18vw; */
}


.txt_about_hp h1{
  color: #222;
  font-weight: 400;
  padding: 0 0 1vh 0;
  font-size: 300%;
  }
  
  .txt_about_hp p{
    width: 51%;
    color: #222;
    font-size: 100%;
    font-weight: 300;
    line-height: 1.4;
  }


.grafica_scale_black{
  width: 70vw;
  height: auto;
  position: absolute;
  top: -20%;
  right: -16%;
  z-index: 0;
}

.concepts{
  position: absolute;
  z-index: 11;
  width: 45%;
  padding: 3vh 2vw 6vh 3vw;
  background-color: #625a5a;
  color: #fff;
  right: 1%;
  bottom: -6%;
  cursor: pointer;
  transition: all 0.2s linear;
cursor: pointer;
}

.txt_concepts{
  width: 80%;
  position: relative;
}


.content_arrow_concept{
  width: 20%;
  position: relative;
  height: 100%;
}

.arrow_concept{
  position: absolute;
  top: 5vh;
  right: 0vh;
  height: 8vh;
  background-position: center center;
  transition: all 0.2s linear;
}

.arrow_concept:hover{
  top: 5vh;
  right: -2vh;
}

.concepts:hover .arrow_concept{
  cursor: pointer;
  top: 5vh;
  right: -2vh;
}
.concepts:hover {
  background-color:#222;
}



.txt_concepts h1{
  color: #fff;
  font-weight: 400;
  padding: 0 0 1vh 0;
  font-size: 300%;
  }
  
  .txt_concepts p{
  color: #fff;
  font-size: 90%;
  line-height: 1.4;
  font-weight: 300;
  width: 90% !important;
  }

 


.owl_about{
  width: 100% !important;
  margin: 4vh auto 0 auto;
  height:  85vh !important;
  position: relative !important;

}

.owl_about .item{
width: 100%  !important;
text-align: center;
}

.owl_about .item{
  width: 100%;
  background-color: #fff;
  height: 80vh !important;
  margin: 0 auto;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}


  

.owl-dots{
  position: absolute;
  z-index: 999999999;
  bottom: 0;
  left: 0vw;
  width: 100%;
  text-align: center;
  }
  
  .owl-dots .owl-dot span {
      width: 15px !important;
      height: 15px !important;
      display: block;
      border-radius: 100%;
      margin: 0 5px;
      background-color: #999;
  }
  
  .owl-dots .owl-dot.active span, .owl-dots .owl-dot:hover span {
      background: #222 !important;
      scale: 0.7;
  
  }
  
.clip1, .clip2,.clip_prof,.clip_p{
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
}

.txt_professional{
  width: 50%;
  padding: 3vh 0vw 6vh 3vw;
  background-color: #625a5a;
  color: #fff;
  position: relative;
}


.txt_professional h1{
  color: #fff;
  font-weight: 400;
  padding: 0 0 1vh 0;
  font-size: 300%;
  }
  
  .txt_professional p{
  color: #fff;
  font-size: 90%;
  line-height: 1.4;
  font-weight: 300;
  width: 75% !important;
  }

  .start_project{
    display: block;
    width: 30%;
    height: 6vh;
    padding: 1vh 0vw;
    color: #222;
    font-size: 120%;
    background-color:#dcd8d8;
    position: absolute;
    right: 0;
    left: 0;
    bottom: -10%;
    margin: auto;
    text-align: center;
  }

  .start_project:hover{
    background-color: #222;
    color: #fff;
  }

  .img_professional{
    width: 35vw;
    height: 35vw;
    background-image: url(../images/foto1.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
  }




.catalogue{
  width: 100%;
  padding-bottom: 20vh;
  background-image: url(../images/curva_footer.svg);
  background-repeat: no-repeat;
  background-size: 112% auto;
  background-position: center bottom;
}

.content_catalogue{
  width: 80%;
  margin: 0 auto;
}

.img_catalogue{
  width: 70%;
  height:75vh;
  background-image: url(../images/discover_cat.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.empty_cat{
  width: 20%;
}

.img_catalogue h1{
  color: #222;
  font-weight: 400;
  padding: 0 0 0 0;
  font-size: 300%;
  text-align: center;
}

.content_link_cat{
  width: 90%;
  margin: 3vh auto 0 auto;
}



.content_link_cat a{
  display: block;
  width: 48%;
  padding: 1vh 0.2vw;
  color: #222;
  font-size: 110%;
  background-color:#dcd8d8;
  text-align: center;
}

.content_link_cat a:hover{
  background-color: #222;
  color: #fff;
}






/*form scheda*/


.form_info{
	width: 100%;
	padding: 0vh 0 10vh 0;
  position: relative;
  background-color: #dcd8d8;
}


	.form_info h2{
	font-size: 250%;
	margin: 4vh 0 2vh 0;
	padding: 0 0 0 0;
	color: #222;
	line-height: 1.2;
	text-align: center;
	font-weight: 400;
	}





	.container-contact-info {
	  width: 60%;
		margin: 0 auto 0 auto;
	  padding:1vh 0;
	}



	.cont-form{
		width: 100%;
	}




	.text-modulo {
    padding: 10vh 0;
    width: 70%;
    margin: 0 auto;
   text-align:center;
   min-height:30vh;
	}


	.text-modulo h1{
  	font-size: 250%;
		font-weight: 800;
	  color: #222;
	}

	.text-modulo p{
		margin: 20px 0 30px 0;
}

	.text-modulo a{
		color: #238EB8;
		text-decoration: none;
	}
	.text-modulo a:hover{
		color: #222;
		text-decoration: none;
	}


  .blog_hp{
    width: 80%;
    margin: 8vh auto 20vh auto;
  }

  .img_blog{
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-image: url(../images/sfondo_blog.jpg);
    background-size: cover;
    background-position: center center;
  }

  .gradient_blog_hp{
    width: 100%;
    padding: 18vh 0;
    background-color: rgba(58,50,50,0.4);
  }
  .gradient_blog_hp h1{
    color: #fff;
    font-weight: 400;
    padding: 0 0 0 0;
    font-size: 300%;
    text-align: center;
  }


  .gradient_blog_hp p{
    color: #fff;
    padding: 0 0 0 0;
    font-size: 100%;
    text-align: center;
  }
  
  
  .content_link_blog{
    width: 40%;
    margin: 3vh auto 0 auto;
  }
  
  
  
  .content_link_blog a{
    display: block;
    width: 100%;
    padding: 1vh 0.2vw;
    color: #222;
    font-size: 110%;
    background-color:#dcd8d8;
    text-align: center;
  }
  
  .content_link_blog a:hover{
    background-color: #222;
    color: #fff;
  }