html, body {
	height: 100%;
	margin: 0;
	user-select: none; /* supported by Chrome and Opera */
   -webkit-user-select: none; /* Safari */
   -khtml-user-select: none; /* Konqueror HTML */
   -moz-user-select: none; /* Firefox */
   -ms-user-select: none; /* Internet Explorer/Edge */
}
html {
	text-rendering: optimizeLegibility;
	scroll-behavior: smooth;
}
body{
	font-family: 'Poppins', sans-serif;
	color: #565656;
}
/* remove highlight background when click a button, link, ecc.*/
* {
    -webkit-tap-highlight-color: transparent;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Poppins', sans-serif;
	 line-height: 1.2;
	 color: #284d61;
}
a {
	text-decoration: none;
}
b, strong {
    font-weight: 700;
}
.margin-0{
	margin: 0px;
}
.padding-top-0{
	padding-top: 0px!important;
}
.margin-top-meno-20{
	margin-top:-20px;
}
@media (min-width:992px){
	.vertical-align{
		display: flex;
		align-items: center;
	}
}
.text {
    font-weight: 200;
	 font-size: 15px;
	 text-align: justify;
}
@media (min-width:992px){
	.separator-24{
		padding: 24px 0;
	}
}
.aligned {
   display: flex;
   align-items: center;
}
::-webkit-input-placeholder { /* Edge */
  color: #fff;
  font-weight: 200;
}

:-ms-input-placeholder { /* Internet Explorer */
  color: #fff;
  font-weight: 200;
}

::placeholder {
  color: #fff;
  font-weight: 200;
}
/* W3CSS
 ========================================================*/
 .w3-auto {
     max-width: 1280px;
 }
 .w3-auto2 {
     max-width: 1500px;
	  margin-left: auto;
     margin-right: auto;
 }
 .w3-auto3 {
     max-width: 1000px;
	  margin-left: auto;
     margin-right: auto;
 }
 .w3-padding-large-h {
    padding: 0px 24px!important;
}
.w3-green,.w3-hover-green:hover{color:#fff!important;background-color:#95c11f!important}
.w3-text-green,.w3-hover-text-green:hover{color:#95c11f!important}
.w3-text-blue,.w3-hover-text-blue:hover{color:#284d61!important}
.w3-blue,.w3-hover-blue:hover{color:#fff!important;background-color:#284d61!important}
.w3-button-blue {
    width: auto;
    display: block;
    background-color: #284d61;
    color: #fff;
    text-align: center;
    padding: 12px 10px;
    line-height: 20px;
    font-size: 14px;
    border: solid 1px #284d61;
    transition: ease all.3s;
    text-transform: uppercase;
    font-weight: 300;
    cursor: pointer;
    letter-spacing: 1px;
	 margin-top:30px;
}
.w3-button-blue:hover {
	background-color: #fff!important;
	color: #284d61!important;
	text-decoration: none;
}
.w3-button-white {
    width: auto;
    display: block;
    background-color: #fff;
    color: #284d61;
    text-align: center;
    padding: 12px 10px;
    line-height: 20px;
    font-size: 14px;
    border: solid 2px #284d61;
    transition: ease all.3s;
    text-transform: uppercase;
    font-weight: 500;
    cursor: pointer;
    letter-spacing: 1px;
	 margin-top:30px;
}
.w3-button-white:hover {
	background-color: #284d61!important;
	color: #fff!important;
	text-decoration: none;
}
.w3-button-blue-negative {
    width: auto;
    display: block;
    background-color: #284d61;
    color: #fff;
    text-align: center;
    padding: 12px 10px;
    line-height: 20px;
    font-size: 14px;
    border: solid 1px #fff;
    transition: ease all.3s;
    text-transform: uppercase;
    font-weight: 300;
    cursor: pointer;
    letter-spacing: 1px;
	 margin-top:0;
}
.w3-button-blue-negative:hover {
	background-color: #fff!important;
	color: #284d61!important;
	text-decoration: none;
}
.w3-cell {
    display: table-cell;
	 line-height: 0;
}
.w3-input {
    background: transparent;
	 color: #fff;
}
/* Button with line before/after
 ========================================================*/
button.w3-button-blue:before,
button.w3-button-blue:after,
button.w3-button-white:before,
button.w3-button-white:after {
  background-color: #284d61;
  content: "";
  display: inline-block;
  height: 1.6px;
  position: relative;
  vertical-align: middle;
  width: 18px;
}
button.w3-button-blue-negative:before,
button.w3-button-blue-negative:after {
  background-color: #fff;
  content: "";
  display: inline-block;
  height: 1.6px;
  position: relative;
  vertical-align: middle;
  width: 18px;
}

button:before {
  right: 1.4em;
  margin-left: -50%;
}

button:after {
  left: 1.4em;
  margin-right: -50%;
}
/* Preloader
 ========================================================*/
#preloader {
  overflow: hidden;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100000;
  background-color: #ffffff;
}

.site-load {
  -webkit-animation: 1500ms linear 0s normal none infinite running site-load;
  animation: 1500ms linear 0s normal none infinite running site-load;
  background: transparent;
  border-color: #ffffff;
  border-top-color: #95c11f;
  border-left-color: #95c11f;
  border-right-color: #95c11f;
  border-radius: 50%;
  border-style: solid;
  border-width: 3px;
  height: 50px;
  left: calc(50% - 25px);
  position: relative;
  top: calc(50% - 25px);
  width: 50px;
  z-index: 9; }

@-webkit-keyframes site-load {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }
@keyframes site-load {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }
/* PARALLAX
 ========================================================*/
.parallax {
  min-height: 550px;
  background-attachment: static;
  /* background-attachment: fixed; */
  background-position: 50% 50%;
  /* background-position: 50% 80%; */
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.px1{
  background-image: url("../images/px1.jpg");
}
.px2{
  background-image: url("../images/px2.jpg");
}
.px3{
  background-image: url("../images/px3.jpg");
  margin-top: 146.31px;
}
.px4{
  background-image: url("../images/px4.jpg");
}
.px5{
  background-image: url("../images/px5.jpg");
  margin-top: 146.31px;
  min-height: 500px;
}
/* .px3{
  background: rgba(0, 0, 0, 0) url('../images/px3.jpg');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-blend-mode: darken;
} */
@media only screen and (max-width: 1200px) {
  .parallax {
	  margin-top: 0;
	  background-attachment: scroll;
	  min-height: 350px;
  }
}
/* Logo
 ========================================================*/
 .logo, #myContainer .logo {
     position: absolute;
     z-index: 2;
     top: 0;
     left: 0;
     width: auto;
     height: auto;
     background: #fff;
     padding: 44px 15px;
 }
 #myContainer .logo img {
	 max-width: 200px;
 }
@media (max-width: 650px) {
	.logo img,  #myContainer .logo img {
		display: none;
	}
	.logo, #myContainer .logo {
		padding: 24px 10px;
	}
	.logo::before,  #myContainer .logo::before {
	 content: url(../images/logo-mobile.png);
	}
}
/* Menu
 ========================================================*/
 .toggle{
	 position: absolute;
	 right: 60px;
	 top: 60px;
	 z-index: 2;
	 font-size:30px;
	 cursor:pointer;
	 font-stretch: ultra-expanded;
 }
 .toggle div {
     width: 46px;
     height: 2px;
     background-color: white;
     margin: 12px 0;
 }
 .sidenav {
   height: 100%;
   width: 0;
   position: fixed;
   z-index: 3;
   top: 0;
   right: 0;
   overflow-x: hidden;
   transition: 0.5s;
   padding-top: 60px;
	background: url(../images/metro_menu.png), #FFF;
	background-position: 30px 30px;
	background-repeat: no-repeat;
 }

.sidenav .box {
	margin: 0;
   position: absolute;
   top: 50%;
   left: 50%;
   -ms-transform: translate(-50%, -50%);
   transform: translate(-50%, -50%);

	opacity: 0;
}
.sidenav .active-box {
	transition: 0.5s;
	transition-delay: 0.3s;
	opacity: 1;
}

.sidenav .box a, .sidenav .closebtn {
    padding: 20px 0;
    text-decoration: none;
    font-size: 22px;
    color: #284d61;
    font-weight: 600;
    display: block;
    transition: 0.3s;
    letter-spacing: 2px;
}
@media screen and (max-height: 640px) {
	.sidenav .box a {
	    padding: 10px 0;
	}
}
@media screen and (max-height: 400px) {
	.sidenav .social-nav {
		display: none;
	}
}
 .sidenav a:hover, .sidenav a.active {
   color: #95c11f;
 }

 .sidenav .closebtn {
   position: absolute;
   top: 0;
   left: 280px;
   font-size: 36px;
   margin-right: 0px;
 }
 .sidenav .social-nav {
	 color: #284d61;
   position: absolute;
   top: 0;
   left: 177px;
   font-size: 36px;
   margin-right: 0px;
 }
 .sidenav .social-nav a {
     padding: 18px 10px;
     font-size: 33px;
     display: table-cell;
 }
 @media screen and (max-height: 450px) {
   .sidenav {padding-top: 15px;}
   .sidenav a {font-size: 18px;}
 }
/* Swipe slider
 ========================================================*/
 #myContainer {
  /* height:calc(100% - 50px); */
  position: relative;
  background: #fff;
 }
 @media (max-width: 650px){
	 #myContainer {
		  padding-top: 0px;
		  /* height:calc(50vw - 130px); */
		  height:50vw;
		  min-height: 250px;
	 }
 }
 #myContainer img{
  height:100%;
  /* filter: brightness(80%); */
  object-position: center;
 }
 .swiper-caption {
     width: auto;
     background: rgba(255,255,255,0.8);
     padding: 15px;
     display: inline-table;
     z-index: 2;
     position: absolute;
     bottom: 0;
     right: 0;
	  padding: 70px 120px;
 }
 @media (max-width: 650px){
	.swiper-caption {
		display: none;
	}
 }
 @media (max-width: 768px){
	 .swiper-caption {
		 padding: 60px;
	 }
	 .swiper-caption h2{
		 font-size:36px!important;
	 }
 }
 .swiper-caption  .w3-padding-large {
    padding: 12px 44px!important;
}
 .swiper-wrapper h1, .swiper-wrapper h2, .swiper-wrapper h3, .swiper-wrapper h4, .swiper-wrapper h5, .swiper-wrapper h6{
  color: #FFF;
 }
 /* @media (max-width:768px){
  .swiper-caption {
		width: calc(100% - 130px);
  }
 } */
 .mouse-helper .ion-mouse {
	 -webkit-filter: invert(100%) sepia(0%) saturate(7456%) hue-rotate(57deg) brightness(115%) contrast(114%);
	 filter: invert(100%) sepia(0%) saturate(7456%) hue-rotate(57deg) brightness(115%) contrast(114%);
 }
 .swiper-button-next, .swiper-button-prev, .mouse-helper {
	 display: none;
 }
 /* LINEE ANIMATE
  ========================================================*/
 .active-line{
	 position: absolute;
	 padding-top:10px;
 }
 .active-line .hline{
	height:0px;
	width:1px;
	border-bottom:2px solid #95c11f;
	-webkit-animation: increase 1s;
	-moz-animation:    increase 1s;
	-o-animation:      increase 1s;
	animation:         increase 1s;
	animation-fill-mode: forwards;
 }
 @keyframes increase {
	  100% {
			width: 60px;
	  }
 }
 .active-line .vline
 {
	 height:0px;
	 width:2px;
	 background-color:#95c11f;
	 margin-top:-10px;
	 margin-left:10px;
	 animation:grow 1s forwards;
	 position:relative;
	 animation-delay:1s;
	 -webkit-animation-delay:1s;
 }
 @keyframes grow
 {
	 100%{
		  height: 120px;
	 }
 }
 /* LINEE PREVIEW IMAGE
  ========================================================*/
  .line-preview{
 	 position: absolute;
 	 padding-top:10px;
  }
  .line-preview .hline{
  height:0px;
  width: 60px;
  border-bottom:2px solid #fff;
  }
  .line-preview .vline
  {
 	 height: 120px;
 	 width:2px;
 	 background-color:#fff;
 	 margin-top:-10px;
 	 margin-left:10px;
 	 position:relative;
  }
 .line-bottom-right{
	 right: 0;
	 bottom: 0;
	 border-color: #fff;
	 transform: rotateX(180deg) rotateY(180deg);
 }
 .line-top-left{
	 left: 0;
	 top: 0;
	 border-color: #fff;
 }
 /* Sezione PLAN in HP
  ========================================================*/
.plan {
  background: url(../images/disegno.jpg), #FFFFFF;
  background-position: 440px center;
  /* background-position: right center; */
  background-repeat: no-repeat;
  background-size: contain;
}
.plan2 {
  background: url(../images/disegno2.jpg), #FFFFFF;
  /* background-position: 440px center; */
  background-position: right center;
  background-repeat: no-repeat;
  background-size: contain;
}
.plan p, .plan2 p {
 text-align: justify;
}
@media (min-width: 651px){
	.plan p, .plan2 p {
     max-width: 500px;
 }
}
/* ZOOM hover
 ========================================================*/
.zoom {
  transition: all .2s ease-in-out 0s; /* Animation */
  margin: 0 auto;
  /* cursor: pointer; */
}
.zoom:hover {
  transform: scale(1.02);
  filter: brightness(75%);
}
/* PREVIEW IMAGES
 ========================================================*/
 .preview{
	 padding: 28px 28px;
	 position: relative;
 }
 .subtitle {
     text-transform: uppercase;
     font-weight: 200;
     letter-spacing: 6px;
     line-height: 30px;
 }
#projects .box0 {
    padding: 70px 0 60px 130px;
    max-width: 670px;
}
 #projects .box1 {
	 padding: 0 30px;
 }
 #projects .box1 img {
    height: 450px;
    width: 100%;
    object-fit: cover;
}
 #projects .box2 {
	 padding: 0 60px;
 }
 #projects .box2 img {
    height: 370px;
    width: 100%;
    object-fit: cover;
}
#projects .box3 {
	 padding: 0;
 }
#projects .box3 img {
    height: 370px;
    width: 100%;
    object-fit: cover;
}
#projects .box4 {
	 padding: 0 60px;
 }
#projects .box4 img {
    height: 370px;
    width: 100%;
    object-fit: cover;
}
#projects .box5 {
	 padding: 0 30px;
 }
#projects .box5 img {
    height: 450px;
    width: 100%;
    object-fit: cover;
}
@media (max-width:992px){
#projects .box0, #projects .box1, #projects .box2, #projects .box3, #projects .box4, #projects .box5 {
		padding: 0;
		max-width: none;
		margin-bottom:40px;
	}
	#projects .box1 img, #projects .box2 img, #projects .box3 img, #projects .box4 img, #projects .box5 img {
		height: 307px;
	}
	#projects .w3-padding-top-32{
		padding: 0!important;
	}
}
/* FOOTER
 ========================================================*/
 footer{
	 border-top:1px solid #6c9eb9;
	 font-size: 20px;
	 font-weight: 200;
	 line-height: 1.2;
 }
 footer .preview{
	padding: 20px 24px;
	position: relative;
 }
 footer .line-preview .hline, footer .line-preview .vline{
	 border-color: #95c11f;
	 background-color: #95c11f;
 }
 footer .line-preview .vline
   {
  	 height: 60px;
   }
footer span{
	font-weight: 400;
}
@media (max-width:992px){
	footer .w3-col{
		margin-bottom:20px;
	}
}
.subfooter {
    border-top: 1px solid #6c9eb9;
    padding: 15px;
    font-weight: 200;
}
.subfooter a{
	text-decoration: none;
}
/* Go to Top
 ========================================================*/
#button {
  display: inline-block;
  background-color: #95c11f;
  width: 50px;
  height: 50px;
  text-align: center;
  border-radius: 50px;
  position: fixed;
  bottom: 30px;
  right: 30px;
  transition: background-color .3s,
  opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 10;
  cursor:pointer;
}
#button > i {
 border: solid #FFF;
 border-width: 0 3px 3px 0;
 display: inline-block;
 padding: 10px;
 transform: rotate(-135deg);
 -webkit-transform: rotate(-135deg);
 margin-top:18px;
}
@media (min-width: 1201px) {
 #button {
	/* display: none!important; */
 }
#button:hover {
  cursor: pointer;
  background-color: #fffefe;
  text-decoration: none;
}
#button:hover > i {
 border: solid #95c11f ;
 border-width: 0 3px 3px 0;
 display: inline-block;
 padding: 10px;
 transform: rotate(-135deg);
 -webkit-transform: rotate(-135deg);
 margin-top:18px;
}
}
#button:active {
  background-color: #fffefe;
}
#button.show {
  opacity: 1;
  visibility: visible;
}
/* Progress Bar
 ========================================================*/
 .skillbar{
	 height:5px;
	 width:20%;
 }
 .skillnumber {
     font-size: 26px;
     font-weight: 700;
     margin: 16px 0;
 }
.punti-di-forza {
     width: 340px;
 }
 @media (min-width:993px){
	 .punti-di-forza {
 	     margin: 0 auto;
 	 }
 }
 /* SERVIZI
  ========================================================*/
#services p {
  text-align: justify;
}
#services h2 {
  letter-spacing: -0.8px;
}
 #services .box1 {
     padding: 0px 50px 60px;
 }
 #services .box2 {
    padding: 80px 28px;
}
 #services .box3  {
    padding: 15px;
    margin-top: -180px;
}
#services .box4 {
	 padding: 0px 50px 60px;
}
 #services .box5{
    margin-top: -90px;
}
 #services .box6 {
    padding: 0 0 0 40px;
}

@media (min-width:993px){
	#services .box1 p, #services .box4 p, #services .box5 p {
		/* font-size: 13px; */
		font-size: 15px;
  }
	#services .box1 h2, #services .box4 h2, #services .box5 h2 {
		/* font-size: 26px; */
		font-size: 30px;
  }
}
@media (max-width:992px){
	#services .box1, #services .box2, #services .box3, #services .box4, #services .box5, #services .box6 {
			padding: 0;
			margin-top:0;
			margin-bottom:30px;
		}
}
#services .box2 .active-line .hline, #services .box3 .active-line .hline, #services .box6 .active-line .hline{
  height:0px;
  width:1px;
  border-bottom:2px solid #95c11f;
  -webkit-animation: increase2 1s;
  -moz-animation:    increase2 1s;
  -o-animation:      increase2 1s;
  animation:         increase2 1s;
  animation-fill-mode: forwards;
}
@keyframes increase2 {
	 100% {
		  width: 100px;
	 }
}
#services .box2 .active-line .vline, #services .box3 .active-line .vline, #services .box6 .active-line .vline
{
	height:0px;
	width:2px;
	background-color:#95c11f;
	margin-top:-10px;
	margin-left:10px;
	animation:grow2 1s forwards;
	position:relative;
	animation-delay:1s;
	-webkit-animation-delay:1s;
}
@keyframes grow2
{
	100%{
		 height: 160px;
	}
}
/* GET IN TOUCH
 ========================================================*/
.get-in-touch span{
	font-size: 20px;
	font-weight: 200;
}
.get-in-touch h2{
	font-weight: 700;
}
/* PROGETTI
 ========================================================*/
 .detail {
	 padding: 60px;
	 padding-bottom:30px;
 }
  @media (max-width: 650px){
	  .detail {
		padding-left: 0;
		padding-right: 0;
	  }
  }
 .green-line{
	 background-color: #95c11f!important;
	 height: 5px;
 }
 /* BXSLIDER
  ========================================================*/
  .bx-wrapper {
  	-moz-box-shadow: none;
  	-webkit-box-shadow: none;
  	box-shadow: none;
  	border: none;
  	background: transparent;
  	margin: 0 auto;
  }
  .bx-viewport {
  	 height:auto!important;
  }
  .bx-wrapper .bx-prev {
  	left: -45px;
  	background: url('../bxslider/controls2.png') no-repeat 0 0px;
  }
  .bx-wrapper .bx-next {
  	right: -45px;
  	background: url('../bxslider/controls2.png') no-repeat -43px 0px;
  }
  .bx-wrapper .bx-controls-direction a {
    height: 64px;
	 z-index: 9;
}
.bx-wrapper .bx-prev:hover, .bx-wrapper .bx-prev:focus {
    opacity: .5;
}
.bx-wrapper .bx-next:hover, .bx-wrapper .bx-next:focus {
    opacity: .5;
}

 .bx-wrapper .img-box {
     display: block;
     height: 568px;
     object-fit: cover;
     width: 100%;
 }
 .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
     bottom: -40px;
	  display: none;
 }
 .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus {
     background: #1e7b88;
 }
 .bx-wrapper .bx-pager.bx-default-pager a {
     background: #88cac1;
 }
 .w3-auto-bxslider {
     padding: 0 55px;
 }
 /* CONTATTI
  ========================================================*/
  .contacts img{
	  max-height: 40px;
	  margin-right: 25px;
  }
  .contacts span{
 	 font-size: 20px;
	 line-height: 1.2;
  }
  .contacts {
      font-weight: 300;
  }
  /* Change Autocomplete styles in Chrome*/
  input:-webkit-autofill,
  input:-webkit-autofill:hover,
  input:-webkit-autofill:focus,
  textarea:-webkit-autofill,
  textarea:-webkit-autofill:hover,
  textarea:-webkit-autofill:focus,
  select:-webkit-autofill,
  select:-webkit-autofill:hover,
  select:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff;
    -webkit-box-shadow: 0 0 0px 1000px transparent inset;
    transition: background-color 5000s ease-in-out 0s;
  }
  input:focus-visible {
    border-radius: 0;
  }
  /* PRIVACY
   ========================================================*/
.info-privacy h1, .info-privacy h2, .info-privacy h3, .info-privacy h4, .info-privacy h5 {
	color:#94c11f;
}
/* GDPR
 ========================================================*/
 .gdpr-alert {
	  color: #000;
	  background: #E8E8E8;
	  height: 472px;
	  max-width: 100%;
 }
 @media (max-width: 1200px){
 	.gdpr-alert {
 		 margin-top: 0px;
 		 height:calc(50vw - 130px);
 		 min-height: 250px;
 	}
 }
 /*==================  404  ======================*/
 @media (max-width: 1103px) {
 	 .not-found i{
 		  font-size: 180px!important;
 	 }
 }
 .not-found i{
  font-size: 15vw;
   color: #94c11f;
 }
 .not-found h2{
 	 font-size: 100px;;
 }
 .not-found h3{
 	 font-size: 28px;;
 }