video {
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.video-wrapper {
  border: 0;
  width: 100%;
  height: 100%;
  height: 100vh;
  position: relative;
}

.opaco{
  position: absolute;
  z-index: 5;
   border: 0;
  width: 100%;
  height: 100%;
  height: 100vh;
  overflow: hidden;
  text-align: center;
  
  background-color: rgba(0, 0, 0, 0.6);
}

#navbar-container{width: 100%; position: fixed;}
.navbar-container-scroll{background-color: rgba(0, 0, 0, 0.6);}
.navbar-container-scroll .navbar-brand svg {width: 40px; height: 40px}


.navbar-toggler{width:42px; height:38px; border:#fff 1px solid; border-radius: 0; background: none; text-align: center; font-size: 0.5em !important; color: #fff; text-transform: uppercase; padding: 0; margin-left: 8px}
.navbar-toggler svg{width: 16px; height: 16px; fill:#fff; }
.navbar-toggler.collapsed svg {transform: rotate(180deg); fill:#fff; }

.navbar{background: none !important;}
.navbar-brand svg {width: 90px; height: 90px;}
.nav-item{border-radius:30px; background: none; margin-left: 40px}
.nav-item:hover {background: rgba(255, 255, 255, 0.4) !important;}

.nav-link { text-transform:uppercase; font-weight:500 }
.nav-link:link, .navbar-hp .nav-link:visited {color: #fff}
.nav-link:hover {color: #000}

.slogan{margin-top: 200px; color: #fff;}
.slogan span{font-size: 3em; font-weight: 500; color: var(--azu);}
.slogan hr {max-width: 40%; border-color:#fff; border-width: 2px; opacity: 0.6; margin: auto;margin-top: 50px; margin-bottom: 50px}
.slogan p {max-width:650px; margin: 0 auto 20px auto; font-size: 1.3em}
.block-arrow .scopri{font-size: 0.8em; opacity: 1}
.block-arrow svg {width: 80px; height: 80px; fill: #fff; transform: rotate(180deg); }
.block-arrow svg:hover {width: 80px; height: 80px; fill: var(--azu)}
.block-arrow:hover {cursor:pointer;}
.block-arrow:hover .scopri { opacity: 1; }

strong {font-size: 700}

#servizi {margin-top: 40px; margin-bottom: 40px}
.box-servizi img {max-width: 240px; opacity: 0.7}
.box-servizi:hover img {opacity: 1}
.box-servizi:hover .servizi-title{padding-bottom:10px}
.box-servizi hr {max-width: 200px; border-color:#666; border-width: 2px;  margin: 16px auto 16px auto}
.servizi-title{text-align: center; font-weight: 500; font-size: 1.4em; text-transform: uppercase; color:  var(--azu); height: 90px; display: flex; align-items: center; justify-content: center}
.servizi-ds{font-size: 1.1em; padding-left: 20px; padding-right: 20px; margin: auto;}
.box-servizi a {color:#000; text-decoration: underline;}

.fascia-carousel{min-height: 600px; background-color: var(--giallo)}
.fascia-title{text-align: center; font-size: 2em; font-weight: 500; padding-top: 40px}

#brand-slider{width:80%}
.brand-slider-side {width: 10%}
.prev-arrow-brand svg, .next-arrow-brand svg {width: 50px; fill: #fff; cursor: pointer;}
.prev-arrow-brand, .next-arrow-brand {opacity: 0.8}
.prev-arrow-brand:hover, .next-arrow-brand:hover {opacity: 1}

.slide-item{position: relative;  margin-left: 20px; margin-right: 20px; margin-top: 40px; border:#666 1px solid}
.slide-item .slide-overlay {position: absolute; width:100%; top: 10px; left: 20px; z-index: 10; text-transform: uppercase;}
.slide-sub {font-size: 1em; color: #d4d4d4; font-weight: 500; color:#fff; text-shadow:2px 2px 5px rgba(0, 0, 0, 0.9); }
.slide-overlay .btn-aqua {min-width: 150px;}

.max14{max-width: 1400px;}
.txt-home{padding-top: 40px; text-align: center; padding-bottom: 40px}
.txt-home p {max-width: 1100px; margin:auto; padding-left: 10px; padding-right: 10px; padding-bottom: 12px}
.fascia-subtitle{padding-top:20px; font-size: 1.2em; text-align:center}
.contatti-home{display: flex; align-items: center; justify-content: center; flex-wrap: wrap; margin-top: 34px;}
.contatti-home a span {padding-right: 4px}
.contatti-home a {border:var(--azu) 2px solid; background-color: #fff; width: 140px; border-radius: 30px; margin: 6px; font-size: 0.75em; color: #000}
.contatti-home a svg {width: auto; height: 20px}
.contatti-home a:hover {background-color: var(--azu); color: #fff}
.contatti-home a:hover svg {fill: #fff}
.contatti-home .spacer{width: 80px}

.fascia-title-azu{text-align: center; font-size: 2em; font-weight: 500; padding-top: 40px; color: var(--azu);}

@media (max-width: 1199px) {
.nav-item{margin-left:10px}
}

@media (max-width: 1199px) {
.nav-item{margin-left:10px}
}

@media (max-width: 991px) {

.nav-item{margin-left:0; margin-top: 20px}
.nav-link{font-size: 1.3em}
.velo {background-color: rgba(0, 0, 0, 0.85) !important;}
}

@media (max-width: 767px) {
  .box-servizi {margin-bottom: 40px}
  .prev-arrow-brand svg, .next-arrow-brand svg {width: 40px;}
}

@media (max-width: 575px) {
  .prev-arrow-brand svg, .next-arrow-brand svg {width: 20px;}
  .slogan{margin-top: 180px;}
  .slogan span{font-size: 2.2em;}
  .slogan hr {max-width: 60%; margin-top: 20px; margin-bottom: 20px}
  .contatti-home .spacer{width: 50px}
}