@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap');
html,body{height:100%;width: 100%;overflow-x: hidden!important;font-family: 'Poppins', sans-serif;}
.no-scroll{overflow: hidden;}
#fade{z-index:10;}
p{font-weight: 400;letter-spacing: 1px;margin-bottom: 0;}


#azienda p{font-weight: 500;font-size: 15px;font-weight: 300;letter-spacing: .5px;color: #00312D}
a.nav-link{font-size: 18px;font-weight: 400;letter-spacing: 1px;color: #000;}
a:hover{opacity: .6;}
a.active{font-weight: 600!important;}
.bg-green{background-color: #00312D}


.btn-green{background-color: #04433E;color: #fff}
.btn-green:hover{background-color: #04433E;color: #fff;opacity: .8}



@media screen  and (min-width: 1200px)  {
  #menu{position: absolute;top: 0;right: 0;width: 33%;transform: translateX(100%);z-index: 1}
  #box{bottom: 0; left: 5em;z-index: 1;color: #fff;background-color: rgba(0,49,45,.66);backdrop-filter: blur(10px)}
  .bg-sm{background-color: transparent;}
}

@media screen  and (max-width: 1199px)  {
  
  #azienda{pointer-events: none!important;}
  #menu{position: absolute;top: 0;right: 0;width: 50%;transform: translateX(100%);z-index: 1}
  #box{bottom: 0; left: 0;z-index: 1;color: #fff;background-color: rgba(0,49,45,.66);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px)}
  .bg-sm{padding-top: 40px;padding-bottom: 40px;background-color: rgba(0,49,45,.36);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);margin-bottom: 30px}
  .bg-sm p {color: #fff!important}
}
@media screen  and (max-width: 700px)  {
  #menu{position: absolute;top: 0;right: 0;width: 70%!important;transform: translateX(100%);z-index: 1}
}

#azienda{background-image: url(img/bosco.png);background-size: cover;background-position: center top;}
.move_bg{background-position: center bottom!important;}
h2{font-size: 30px;color: #04433E;font-weight: 600: letter-spacing: 1px
-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}


h3{margin-bottom:0;font-weight:600;letter-spacing:2px;font-family: 'Poppins', sans-serif;color:#000;font-size:26px;}
.animations_logo{
	-webkit-transition: all 1.5s ease-in-out;
    -moz-transition:    all 1.5s ease-in-out;
    -o-transition:      all 1.5s ease-in-out;
    -ms-transition:     all 1.5s ease-in-out;
    transition:         all 1.5s ease-in-out;
}
.animations{
	-webkit-transition: all 1s ease-in-out;
    -moz-transition:    all 1s ease-in-out;
    -o-transition:      all 1s ease-in-out;
    -ms-transition:     all 1s ease-in-out;
    transition:         all 1s ease-in-out;
}
.animations_fast{
  -webkit-transition: all .3s ease-in-out;
    -moz-transition:    all .3s ease-in-out;
    -o-transition:      all .3s ease-in-out;
    -ms-transition:     all .3s ease-in-out;
    transition:         all .3s ease-in-out;
}

.out-left{transform: translateX(-100%);opacity: 0}



.out-right{transform: translateX(100%);opacity: 0}



.out-bottom{transform: translateY(0);}



.line{height:15%;width:4px;background-color: #000;position:absolute;bottom:0;left:50%;transform: translateX(-50%);z-index: 999999}
.line_w{height:15%;width:4px;background-color: #fff;position:absolute;bottom:0;left:50%;transform: translateX(-50%);z-index: 999999}
.line_w:before {
    content: 'MORE';
    color: #fff;
    font-weight: 500;
    position: absolute;
    top: -30px;
    transform: translateX(-50%);
    text-align: center;
}

.remove_line{height:0%!important;}

.footer{background-color: #F7F7F7}
.footer  p,.footer  a{text-decoration:none!important;font-size:13px;line-height:14px;font-weight:300;font-family: 'Poppins', sans-serif;color:#000;margin-bottom:0;}


#lang a{font-weight: 400;color: #000;}
.attivo{text-decoration: underline;}

#logo{padding:16px 40px;background-color:rgba(255,255,255,1);border-radius: 0 0 24px 24px;z-index:999999;top:0;left:50%;transform: translateX(-50%);}
#logo > img{width:180px;}
.move{cursor:pointer;top:40%!important;padding:16px 24px;background-color:rgba(255,255,255,0)!important;border-radius: 0 0 24px 24px;z-index:3;left:50%;transform: translateX(-50%);}
.move>img{width:270px!important;}

.carousel-inner .carousel-item {
  transition: -webkit-transform 1s ease;
  transition: transform 1s ease;
  transition: transform 1s ease, -webkit-transform 1s ease;
}
#box p{font-size:18px;line-height: 22px;}



#contatti h1{font-size: 30px;font-weight: 700;line-height: 30px;margin-bottom: 0;}



.bg-gradient{
background: rgb(206,223,255);
background: rgb(206,223,255);
background: -moz-linear-gradient(120deg, rgba(206,223,255,1) 0%, rgba(151,186,248,1) 100%);
background: -webkit-linear-gradient(120deg, rgba(206,223,255,1) 0%, rgba(151,186,248,1) 100%);
background: linear-gradient(120deg, rgba(206,223,255,1) 0%, rgba(151,186,248,1) 100%);
}



#prodotti h1.title{font-size: 50px!important;font-weight: 700;line-height: 50px!important;margin-bottom: 0;}
#prodotti a:hover{opacity: 1!important}
#prodotti a{color:#000!important;text-decoration: none!important}
#prodotti h1{font-size: 70px;font-weight: 700;line-height: 70px;margin-bottom: 0;}
#prodotti h2{font-size: 18px;font-weight: 700;line-height: 18px;margin-bottom: 0;}
#download_area h3{margin-bottom: 30px ;text-transform: uppercase!important;color:#0063B2!important;font-size: 16px!important;font-weight: 500!important;}
#download_area a{margin-bottom: 20px;color:#000000!important;font-size: 16px;font-weight: 300!important;}

#breadcrumb{text-transform: uppercase;font-weight: 300;letter-spacing: 1px;color: #3F4A5F}
#breadcrumb a {color: #000!important}
.slide_menu{transform: translateX(0)!important}

#open{cursor: pointer;transform: translateY(-50%) ;top:50%;left:-90px;width:90px;height:90px;border-radius: 15px 0 0 15px;}
#open img {
    width: 25px;
    transform: translateY(-50%);
    margin: 50% 0;
}


/*
    Navbar Icon
    ----------------------
*/

#nav-icon3 {
  width: 30px;
  height: 25px;
  top: 35px;
  left: 30px;
  position: absolute;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  z-index: 9
  
}

.x-btn-navbar {
    box-shadow: none !important;
    transition: 0.5s ease-in-out;
    background-color: transparent !important;
    margin-top: 6px !important;
    z-index:9999999999999;
}
#nav-icon3 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #000;
  border-radius: 4px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

/* Icon 3 */

#nav-icon3 span:nth-child(1) {
  top: 0px;opacity:0;
}

#nav-icon3 span:nth-child(2) {
  top: 0px;
}
#nav-icon3 span:nth-child(3) {
  top: 16px;
}


#nav-icon3 span:nth-child(4) {
  top: 20px;opacity:0;
}

#nav-icon3.open span:nth-child(1) {
  top: 0px;
  width: 0%;
  left: 50%;
}


#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 10px;
}

#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 10px;
}

#nav-icon3.open span:nth-child(4) {
  top: 0px;
  width: 0%;
  left: 50%;
}

#popup .form-control{border-radius: 0!important}
#popup p,#popup input {font-size: 14px!important;letter-spacing: 1px!important;}
.btn-submit,.btn-submit:hover{
  color: #fff!important;
  border: 0px solid transparent;
  border-radius: 0!important;
  border: 0px solid transparent!important;
  padding: 4px 20px!important;
  background: rgb(206,223,255);
background: -moz-linear-gradient(270deg, rgba(206,223,255,1) 0%, rgba(151,186,248,1) 100%);
background: -webkit-linear-gradient(270deg, rgba(206,223,255,1) 0%, rgba(151,186,248,1) 100%);
background: linear-gradient(270deg, rgba(206,223,255,1) 0%, rgba(151,186,248,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cedfff",endColorstr="#97baf8",GradientType=1);
}



.close {
  position: absolute;
  right: 50px;
  top: 30px;
  width: 32px;
  height: 32px;
  opacity: 0.7;
}
.close:hover {
  opacity: 1;
}
.close:before, .close:after {
  position: absolute;
  left: 15px;
  content: ' ';
  height: 33px;
  width: 2px;
  background-color: #333;
}
.close:before {
  transform: rotate(45deg);
}
.close:after {
  transform: rotate(-45deg);
}

/* EXTEND BOOTSTRAP CLASSES */
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
  .w-xs-100 {
    width: 100% !important;
  }
  .h-xs-100 {
    height:100% !important;
  }

  .w-xs-75 {
    width: 75% !important;
  }
  .h-xs-75 {
    height:75% !important;
  }

  .w-xs-50 {
    width: 50% !important;
  }
  .h-xs-50 {
    height:50% !important;
  }

  .w-xs-25 {
    width: 25% !important;
  }
  .h-xs-25 {
    height:25% !important;
  }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
  .w-sm-100 {
    width: 100% !important;
  }
  .h-sm-100 {
    height: 100% !important;
  }

  .w-sm-75 {
    width: 75% !important;
  }
  .h-sm-75 {
    height: 75% !important;
  }

  .w-sm-50 {
    width: 50% !important;
  }
  .h-sm-50 {
    height: 50% !important;
  }

  .w-sm-25 {
    width: 25% !important;
  }
  .h-sm-25 {
    height: 25% !important;
  }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {

  .w-md-100 {
    width: 100% !important;
  }
  .h-md-100 {
    height: 100% !important;
  }

  .w-md-75 {
    width: 75% !important;
  }
  .h-md-75 {
    height: 75% !important;
  }

  .w-md-50 {
    width: 50% !important;
  }
  .h-md-50 {
    height: 50% !important;
  }

  .w-md-25 {
    width: 25% !important;
  }
  .h-md-25 {
    height: 25% !important;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {

  .w-lg-100 {
    width: 100% !important;
  }
  .h-lg-100 {
    height: 100% !important;
  }

  .w-lg-75 {
    width: 75% !important;
  }
  .h-lg-75 {
    height: 75% !important;
  }

  .w-lg-50 {
    width: 50% !important;
  }
  .h-lg-50 {
    height: 50% !important;
  }

  .w-lg-25 {
    width: 25% !important;
  }
  .h-lg-25 {
    height: 25% !important;
  }


}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

  .w-xl-100 {
    width: 100% !important;
  }
  .h-xl-100 {
    height: 100% !important;
  }

  .w-xl-75 {
    width: 75% !important;
  }
  .h-xl-75 {
    height: 75% !important;
  }

  .w-xl-50 {
    width: 50% !important;
  }
  .h-xl-50 {
    height: 50% !important;
  }

  .w-xl-25 {
    width: 25% !important;
  }
  .h-xl-25 {
    height: 25% !important;
  }

}
