@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,400;0,700;1,400&display=swap');


:root {
  --padding: 1.5rem;
  --color-black: #000;
  --color-white: #fff;
  --color-grey: #eee;
  --color-blue:  #00a;
  --color-yellow: #ffdd10;
  --color-red: #f00;
  --color-green: #7d9650;
  --color-light-green: rgba(125,150,80,.35);
  --color-hover-green: rgba(125,150,80,.6);
  --color-hover-darker: rgba(0,0,0,.4);

  --color-text: var(--color-black);
  --color-text-grey: var(--color-grey);
  --color-background: var(--color-white);

  --font-family-mono: 'Roboto Mono', monospace;
}

html {
  font-family: var(--font-family-mono);
  color: var(--color-text);
  background: var(--color-background);
  box-sizing: border-box;
  scroll-behavior: smooth;
}

*, *:before, *:after {
  box-sizing: inherit;
  margin: 0;
  padding: 0;

}


*::selection{
  color:   rgba(255,255,255,0.8);
  background: rgba(0,0,0,0.9) !important; 
}
 *::-moz-selection{
  color:   rgba(255,255,255,0.8);
  background: rgba(0,0,0,0.9)  !important;
}

body {
  margin: 0 auto;
  font-weight: 400;
}
img{
  width: 100%;
}
.home{
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 6rem;
  margin-top: 0 !important;
}
.vertical-section{
  display: flex;
  justify-content: center;
  margin-top: 1rem;
}
.start-box{
  padding-top: 6rem;
  margin-top: 0 !important;
}
.start-box-2{
  padding-top: 6rem;
  margin-top: 4rem !important;
}
.no-m-top{
  margin-top: 0 !important;
}
.no-p-top{
  padding-top: 0 !important;
}
.no-m-bottom{
  margin-bottom: 0 !important;
}
.no-p-bottom{
  padding-bottom: 0 !important;
}
.el-relative{
  position: relative;
}
main {
  overflow-x: hidden;
  display: flex;
  position: sticky;
  top:0;
}
.pure-g  {
    overflow: hidden;
}


.pure-g [class*="pure-u"] {
    font-family: var(--font-family-mono);
    overflow: hidden;
}
.pure-g div{
  /*overflow: hidden;*/
}

.pure-g .gallery-container{
  width: 100%;
  margin-top: 2rem;
  float: left;
}


strong{
  letter-spacing: 0.04rem;
}
h1 {
  margin: 0;
  padding: 0;
}
a{
  color: var(--color-text);
}

.pure-g a{

  background: linear-gradient(0deg, var(--color-green), var(--color-green)) no-repeat right bottom / 0 var(--bg-h);
  transition: background-size 0.6s;
  --bg-h: 100%;
}
.pure-g a:where(:hover, :focus-visible) {
  background-size: 100% var(--bg-h);
  background-position-x: left;
}



div{
  box-sizing: border-box;
}

section {
  min-width: 100vw;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
section:nth-child(even) {
  
}


.green-text{
  color: var(--color-green);
}

.white-text{
  color: var(--color-white);
}

.red-text{
  color: var(--color-red);
}
.green-bg {
  background-color: var(--color-green);
}
.grey-bg {
  background-color: var(--color-grey);
}
.light-green-bg {
  background-color: var(--color-light-green);
}


.bg-img-dark{
  box-shadow: inset 0 0 0 4000px rgba(0,0,0,.5);
}
.text-up{
  text-transform: uppercase;
}


figure{
  text-align: center; /* ensures the image is always in the h-middle */
  overflow: hidden; /* hide the cropped portion */
  max-height: 100vh;
}
.center-img img{
  position: relative; /* allows repositioning */
  left: 100%; /* move the whole width of the image to the right */
  margin-left: -200%; /* magic! */
  overflow: hidden;
}
.scaled-img img{
  width: 100%;
  overflow: hidden;
}

.half-img img{
  width: 35%;
  margin-top: 3rem;
}


.vertical-section h1{
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 1rem;
  float: left;
  width: 100%;
}

.vertical-section h2{
  font-size: 2.4rem;
  letter-spacing: 0.05rem;
  font-weight: 700;
  margin-bottom: 0.8rem;
  float: left;
  width: 100%;
}

.vertical-section h3{
  font-size: 1.6rem;
  font-weight: 700;
  float: left;
  width: 100%;
}
.vertical-section h4{
  font-size: 1.3rem;
  font-weight: 700;
  float: left;
  width: 100%;
}

.vertical-section p{
  font-size: 1rem;
  line-height: 1.5;
  margin-bottom: 0.8rem;
  float: left;
  width: 100%;
}
.vertical-section li{
  font-size: 1rem;
  line-height: 1.5;
  margin-left: 1rem;
  float: left;
  width: 100%;
}

.vertical-section hr{
  border-top: 2px solid var(--color-black);
  float: left;
  margin: 2rem 0;
  width: 100%;
}

.vertical-section.area-riservata li{
  margin-left: 0;
}

.blog-prevnext .boxed{
  border-top: 2px solid var(--color-black);
}
.blog-prevnext h2{
  font-style: normal;
  font-size: 1.2rem;
  font-weight: 700;
  margin-top: 0.5rem;
}
.blog-prevnext a{
  text-decoration: none;
}

.prodotto-prevnext .boxed{
  border-top: 2px solid var(--color-black);
}
.prodotto-prevnext a{
  text-decoration: none;
}
.prodotto-prevnext p{
  margin-top: 0;
}
.prodotto-prevnext h2{
  font-size: 1.6rem;
  margin-top: 0.5rem;
  margin-bottom: 0 ;
}
.prodotto-prevnext h4{
  margin-top: 0;
}
.prodotto-prevnext .pagination-prev {
  margin-top: 1rem;
  margin-bottom: 0.8rem;
  font-size: 2.6rem;
  float: left;
}
.prodotto-prevnext .pagination-next {
  margin-top: 1rem;
  margin-bottom: 0.8rem;
  font-size: 2.6rem;
  float: left;
}

.prodotto-prevnext .note-link{
  float: left;
  background: none;
}

.prodotto-prevnext .vertical-section .price1{
  margin-top: 0;
}

.prodotto-prevnext .pagination-prev strong{
  display: none;
}
.prodotto-prevnext .pagination-next strong{
  display: none;
}
.full {
  width: 100%;
}

.boxed {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
}

.boxed2 {
  width: 100%;
  max-width: 920px;
  margin: 0 auto;
}


.header {
  background-color: rgba(255,255,255, 1);
  position: fixed;
  width: 100%;
  z-index: 99;
  top: 0;
}
.header .logo {
  float: left;
  background-color: rgba(0,28,44,0);
  transition: 0.5s cubic-bezier(.86,0,.07,1);
  position: fixed;
  right: 1.5rem;
  top:1.2rem;
  z-index: 999;
}
.scrolling .header .logo {
  /*background-color: var(--color-text);*/
}
.header .logo .lpw{
  /*fill: var(--color-white);*/
}

.header .logo svg{
  width: 160px;
  transition: 0.5s cubic-bezier(.86,0,.07,1);
  padding: 1.5rem 1.2rem;
}


.header .logo .logo-d {
  fill: var(--color-green);
}

.header .logo .logo-e {
  fill: var(--color-black);
}

.header .opened .logo .logo-d {
  fill: var(--color-black);
  transition: 0.5s cubic-bezier(.86,0,.07,1);
}


.header .the-logo {
  top: 0;
  transition: 0.5s cubic-bezier(.86,0,.07,1);
  position: fixed;
  z-index: 999;
  
}
.header .the-logo svg{
  width: 180px;
  transition: 0.5s cubic-bezier(.86,0,.07,1);
  padding: 0.3rem 0;
  margin-left: 0;
}
.scrolling .header .the-logo {
  /*transform: translateY(-0rem);*/
  transition: 0.5s cubic-bezier(.86,0,.07,1);
  transition-delay: .5s;
}





.header .fast-contact {
  display: none;
}
.header .fast-contact svg{
  width: 300px;
  transition: 0.5s cubic-bezier(.86,0,.07,1);
  padding: 0.3rem 0;
  margin-left: -150px;
}
.scrolling .header .fast-contact {
  transform: translateY(0);
  transition: 0.5s cubic-bezier(.86,0,.07,1);
  top: 0.3rem;
}










#typo-leo{
  display: none;
}

.menu .news-menu{
  align-items: left;
  justify-content: center;
  flex-direction: column;
  display: none;
}
.menu .news-menu div {
  max-width: 520px;
}
.menu a {
  margin: 1.5rem;
  display: block;
}
.menu a[aria-current] {
  opacity: 0.7;
  --bg-h: 0%;
}

.menu .news-menu a{
  margin: 0;
  padding: 0;
}
.menu .news-menu h2{
  margin-top: 0.5rem;
  margin-bottom: 1.5rem;
}
.menu .news-menu h3{
  margin-top: 0.5rem;
}
.menu .news-menu h4{
  margin: 0.5rem 0 1.5rem 0;
}

.menu .news-menu h5{
  margin-top: 0;
  margin-bottom: 0.5rem;
}

.menu .menu-button {
  width: 100%; 
  position: fixed;
  z-index: 3;
  top: 1rem;
  text-align: left;
  transition: 0.5s cubic-bezier(.86,0,.07,1);
}
#open-menu{
  cursor: pointer;
}
.closed #open-menu:after{
  content: "menu";
}
.opened #open-menu:after{
  content: "close";
}



.menu .menu-button a{
  color: var(--color-black);
  font-weight: 700;
  font-size: 2rem;
  display: inline;
  transition: 0.5s cubic-bezier(.86,0,.07,1);
}


.menu .menu-search{
  position: fixed;
  z-index: 4;
  left: 8rem;
  margin-top: 1.8rem;
  transition: 0.5s cubic-bezier(.86,0,.07,1);
}

.menu .menu-search a{
  font-size: 1.2rem;
  margin: 0;

}


/*.scrolling .menu .menu-button a{
  color: var(--color-text);
  background-color: var(--color-white);
}*/

.box-menu {
  display: none;
  height: 100vh;
}

.box-menu .pure-g{
  width: 100%;
}

.box-menu ul{
  margin: 2rem 0;
  padding: 0;
  float: left;
}
.box-menu a{
  line-height: 1.1;
  margin: 0;
  padding: 0.5rem 0 0 0;
}
.box-menu ul li a{
  color: var(--color-white);
  font-size: 2rem;
  line-height: 1;
  margin: 0;
  padding: 0.3rem 1.6rem;
  font-weight: 700;
  text-decoration: none;
  background: linear-gradient(0deg, var(--color-green), var(--color-green)) no-repeat right bottom / 0 var(--bg-h);
  transition: background-size 0.6s;
  --bg-h: 5%;
}
.box-menu ul li a:where(:hover, :focus-visible) {
  background-size: 100% var(--bg-h);
  background-position-x: left;
}


.box-menu ul li a.area-riservata{
  color: var(--color-black);
  margin-top: 2rem;
  font-size: 2rem;
  line-height: 1;
  padding: 1rem 2rem;
  font-weight: 700;
  text-decoration: none;
  background: linear-gradient(0deg, var(--color-white), var(--color-white)) no-repeat right bottom / 0 var(--bg-h);
  transition: background-size 0.6s;
  --bg-h: 5%;
}

.box-menu ul li a.area-riservata:where(:hover, :focus-visible) {
  background-size: 100% var(--bg-h);
  background-position-x: left;
}

.box-menu ul li a.info-utente{
  color: var(--color-black);
  font-size: 2rem;
  line-height: 1;
  padding: 1rem 2rem;
  font-weight: 700;
  text-decoration: none;
  background: linear-gradient(0deg, var(--color-white), var(--color-white)) no-repeat right bottom / 0 var(--bg-h);
  transition: background-size 0.6s;
  --bg-h: 5%;
  float: left;

}

.box-menu ul li a.info-utente:where(:hover, :focus-visible) {
  background-size: 100% var(--bg-h);
  background-position-x: left;
}


.box-menu ul li span{
  float: left;
  padding: 0 2rem 0 2rem;
  width: 100%;
  
  box-sizing: border-box;

}

.box-menu h5{
  margin-bottom: 0.1rem;
  margin-top: 1rem;
}
.box-menu .lpw{
  fill: var(--color-white);
}
.box-menu svg{
  width: 160px;
  transition: 0.5s cubic-bezier(.86,0,.07,1);
  padding: 0;
  padding: 1.5rem 1.2rem;
}

.opened .box-menu {
  display: block;
}



.closed{
  transition: 0.6s cubic-bezier(.86,0,.07,1);
}
.opened{
  width: 100%;
  background-color: var(--color-green);
  background-size: cover;
  transition: 0.6s cubic-bezier(.86,0,.07,1);
  z-index: 999;
  position: fixed;
}

.opened .menu-button a {
  color: var(--color-white);
}

.hide{
  opacity: 0;
  transition-delay: 0.5s;
  transition: 0.6s cubic-bezier(.86,0,.07,1);
}
.show{
  opacity: 1;
  transition-delay: 0.5s;
  transition: 0.6s cubic-bezier(.86,0,.07,1);
}


.hero-box a .hero h2{
  opacity: 0;
  transition: all 0.3s cubic-bezier(.86,0,.07,1);
  display: none;
}
.hero-box a:hover .hero h2{
  opacity: 1;
}
.hero-box a .hero {
  transition: all 0.3s ease-in-out;
}
.hero-box a:hover .hero {
  background-color: var(--color-green);
}


.hero{
  height: 60vh;
  padding: 4rem 2rem 2rem 2rem;
  box-shadow: inset 0 0 0 2000px var(--color-green);
  position: relative;
}

.hero .hero-img{
  width: 100%;
  float: left;
  height: 100%;

}
.vertical-section .hero h1{
  color: var(--color-white);
  font-size: 2.3rem;
  position: absolute;
  top: 0;
  left:2rem;

}
.vertical-section .hero h2{
  color: var(--color-white);
  font-size: 3rem;
  font-weight: 700;
  position: relative;
  top: 0;
  float: right;

}
.hero h1 span{
  font-size: ;
}
.hero h1 a{
  color: var(--color-white);
}

.social {
  display: none;
  width: 48px;
  margin: 20px 2rem;
  float: right;

}
.social a {
  padding: .7rem .5rem;
}



.vimeo-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}
.vimeo-wrapper iframe {
  width: 100vw;
  height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
  min-height: 100vh;
  min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.start-button{
  display: none;
}

.start-button a{
  color: var(--color-text);
  font-family: var(--font-family-mono);
  letter-spacing: 0.1rem;
  text-decoration: none;
  font-size: 1.1rem;

}

.start-button a::after {
  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f063";
  font-style: normal;
  width: 100%;
  display: block;
  text-align: center;
  font-size: 2.2rem;
  position: relative;
  animation: pulse 2.5s infinite;
  animation-timing-function: ease-in-out; 
}
@keyframes pulse {
  0% {
    top: 14px;
  }
  50% {
    top: 5px;
  }
  100% {
    top: 14px;
  }
}

.start-button a i{
  font-size: 2rem;
  width: auto;

}

.section {
  padding: 3rem 0;

}

.mini-box-l{
  padding: 0.6rem;
}
.mini-box-r{
  padding: 0.6rem;
}

.box1{
  padding: 0.6rem;
}
.box2{
  padding: 1.2rem;
}
.box3{
  padding: 1.8rem;
}
.box4{
  padding: 2.4rem;
}
.box5{
  padding: 3rem;
}
.box6{
  padding: 3.6rem;
}
.box7{
  padding: 4.2rem;
}
.box8{
  padding: 4.8rem;
}
.box-notes-home{
  padding: 3rem;
}







.mb-0{
  margin-bottom: 0;
}
.mb-1{
  margin-bottom: 1rem;
}
.mb-2{
  margin-bottom: 2rem;
}
.mb-3{
  margin-bottom: 3rem;
}
.mb-4{
  margin-bottom: 4rem;
}
.mb-5{
  margin-bottom: 4rem;
}
.mb-6{
  margin-bottom: 4rem;
}
.mb-7{
  margin-bottom: 4rem;
}
.mb-8{
  margin-bottom: 6rem;
}

.mt-0{
  margin-top: 0;
}
.mt-1{
  margin-top: 1rem;
}
.mt-2{
  margin-top: 2rem;
}
.mt-3{
  margin-top: 3rem;
}
.mt-4{
  margin-top: 4rem;
}
.mt-5{
  margin-top: 4rem;
}
.mt-6{
  margin-top: 4rem;
}
.mt-7{
  margin-top: 4rem;
}
.mt-8{
  margin-top: 6rem;
}
.mt-8{
  margin-top: 8rem;
}
.mt-9{
  margin-top: 8rem;
}
.mt-10{
  margin-top: 8rem;
}
.mt-11{
  margin-top: 8rem;
}
.mt-12{
  margin-top: 9rem;
}
.mt-13{
  margin-top: 9rem;
}
.mt-14{
  margin-top: 9rem;
}
.mt-15{
  margin-top: 10rem;
}
.mt-16{
  margin-top: 10rem;
}

.pb-0{
  padding-bottom: 0;
}
.pb-1{
  padding-bottom: 1rem;
}
.pb-2{
  padding-bottom: 2rem;
}
.pb-3{
  padding-bottom: 3rem;
}
.pb-4{
  padding-bottom: 4rem;
}
.pb-5{
  padding-bottom: 4rem;
}
.pb-6{
  padding-bottom: 4rem;
}
.pb-7{
  padding-bottom: 4rem;
}
.pb-8{
  padding-bottom: 6rem;
}

.pt-0{
  padding-top: 0;
}
.pt-1{
  padding-top: 1rem;
}
.pt-2{
  padding-top: 2rem;
}
.pt-3{
  padding-top: 3rem;
}
.pt-4{
  padding-top: 4rem;
}
.pt-5{
  padding-top: 4rem;
}
.pt-6{
  padding-top: 4rem;
}
.pt-7{
  padding-top: 4rem;
}
.pt-8{
  padding-top: 6rem;
}








.shift-1{
  margin-top: 16rem;
}

.video-container {
  width: 100%;
  height: 100vh;
  position: absolute;
  z-index: -1;
}



.video-container video {
  width: 100%;
  position: absolute;
  z-index: -1;
  right: 0;
  top: 8rem;
  mix-blend-mode: multiply;
  opacity: 0.9;
}


.video-container-2 {
  width: 100%;
  height: 100vh;
  position: absolute;
  z-index: -1;
}

.video-container-2 video {
  width: 100%;
  position: absolute;
  z-index: -1;
  top: 15vh;
  mix-blend-mode: multiply;
  opacity: 0.9;
}
.pure-g video{
  width: 100%;
}


.calls{
  position: relative;
}
.calls > div{
  margin-bottom: 0;
}
.calls > div.call-noleggio{
  margin-bottom: 0;
}
.calls img{
  float: left;
}


.calls .calls-text{
  float: left;
  border-left: 2px solid var(--color-black);
  margin-top: 1.5rem;
  padding-left: 2rem;

}

.calls .calls-cover{
  float: left;
  border-left: 0;
  display: flex;
  align-items: center;
  justify-content: center;

}
.calls .calls-cover img{
  padding: 2rem 3rem 0.5rem 3rem;
  box-sizing: border-box;
  max-width: 360px;
}
.calls  .calls-bg{
  margin-bottom: 4rem;
  min-height: 680px;
}
.calls-bg > div.hover-box{
  padding: 2rem;
  background-color: var(--color-green);
  transition: 0.3s ease;
  float: left;
  width: 100%;
}

.calls-bg:hover > div.hover-box{
  opacity: 1;
}






.vertical-section .calls .hover-box h3 {
  color: var(--color-white);
  font-size: 2rem;
}
.vertical-section .calls .hover-box p {
  color: var(--color-white);
  font-size: 1.4rem;
  margin-top: 0.5rem;
}

.vertical-section .calls .hover-box a {
  color: var(--color-white);
}


.vertical-section .calls .hover-box .btn1 {
  color: var(--color-white);
  border: 3px solid var(--color-white);
  position: absolute;
  bottom: 2.2rem;
  margin-top: 0.5rem;
  font-size: 0.9rem;
  padding: 0.3rem 0.5rem;
}

.vertical-section .calls .hover-box .btn1.btn-alt {
  color: var(--color-black);
  border: 3px solid var(--color-black);
}

.vertical-section .calls .hover-box ul {
  width: 100%;
  float: left;
  margin-top: 1rem;
}
.vertical-section .calls .hover-box ul li{
  list-style-type: none;
  float: left;
  margin-right: 1rem;
  width: auto;
  margin-left: 0;
}
.vertical-section .calls .hover-box ul li:first-child{
  width: 100%;
  color: var(--color-white);
}
.vertical-section .calls .hover-box ul li .btn1 {
  position: static;
}

.vertical-section .calls .hover-box ul li .btn1:hover {
  color: var(--color-green);
  border: 3px solid var(--color-white);
  background-color: var(--color-white);
  background: var(--color-white);
}



.vertical-section .calls p{
  font-size: 1rem;
  line-height: 1.3;
}




.noleggio-bg{
  background-color: var(--color-green);
  mix-blend-mode: multiply;
  aspect-ratio: 2 / 3;

}
.noleggio-bg a{
  text-decoration: none;
}


.noleggio-bg div.hover-box{
  background-color: var(--color-hover-green);
  mix-blend-mode: multiply;
  position: relative;
  z-index: 3;
  height: 100%;
  padding: 1rem;
  transition: 0.4s ease;
}

.noleggio-bg:hover div.hover-box{
  background-color: transparent;
  mix-blend-mode: normal;
}

.vertical-section .calls .noleggio-bg .hover-box h2 {
  color: var(--color-black);
  font-size: 1.7rem;
  transition: 0.4s ease;
}
.vertical-section .calls .noleggio-bg .hover-box p {
  color: var(--color-black);
  font-size: 1.3rem;
  transition: 0.4s ease;
  margin-top: 0.5rem;
}

.vertical-section .calls .noleggio-bg .hover-box span {
  color: var(--color-black);
  font-weight: 700;
  font-size: 2rem;
  transition: 0.4s ease;
  position: absolute;
  bottom: 1rem;
  right: 1rem;
}

.vertical-section .calls .noleggio-bg .hover-box h4 {
  transition: 0.4s ease;
  position: absolute;
  bottom: 1.2rem;
  left: 1rem;
}

  .vertical-section .calls .noleggio-bg .hover-box h4.barrato {
    bottom: 3rem;

  }

.vertical-section .calls .noleggio-bg .hover-box .btn1 {
  color: var(--color-black)
  border: 3px solid var(--color-white);
  position: absolute;
  bottom: 2.2rem;
  transition: 0.4s ease;
}

.vertical-section .calls .noleggio-bg:hover .hover-box h2 {
  color: var(--color-green);
}
.vertical-section .calls .noleggio-bg:hover .hover-box p {
  color: var(--color-green);
}
.vertical-section .calls .noleggio-bg:hover .hover-box span {
  color: var(--color-green);
}
.vertical-section .calls .noleggio-bg:hover .hover-box .btn1 {
  color: var(--color-green);
}











.prodotti-bg{
  background-color: var(--color-green);
  mix-blend-mode: multiply;
  aspect-ratio: 4 / 5;

}
.prodotti-bg a{
  text-decoration: none;
}


.prodotti-bg div.hover-box{
  background-color: var(--color-hover-green);
  mix-blend-mode: multiply;
  position: relative;
  z-index: 3;
  height: 100%;
  padding: 1rem;
  transition: 0.4s ease;
}

.prodotti-bg:hover div.hover-box{
  background-color: transparent;
  mix-blend-mode: normal;
}

.vertical-section .calls .prodotti-bg .hover-box h2 {
  color: var(--color-black);
  font-size: 1.4rem;
  transition: 0.4s ease;
  margin-bottom: 0;
}
.vertical-section .calls .prodotti-bg .hover-box p {
  color: var(--color-black);
  font-size: 1.2rem;
  transition: 0.4s ease;
  margin-top: 0.1rem;
}

.vertical-section .calls .prodotti-bg .hover-box span {
  color: var(--color-black);
  font-weight: 700;
  font-size: 2rem;
  transition: 0.4s ease;
  position: absolute;
  bottom: 1rem;
  right: 1rem;
}

.vertical-section .calls .prodotti-bg .hover-box h4 {
  transition: 0.4s ease;
  position: absolute;
  bottom: 1.2rem;
  left: 1rem;
}

  .vertical-section .calls .prodotti-bg .hover-box h4.barrato {
    bottom: 3rem;

  }

.vertical-section .calls .prodotti-bg .hover-box .btn1 {
  color: var(--color-black)
  border: 3px solid var(--color-white);
  position: absolute;
  bottom: 2.2rem;
  transition: 0.4s ease;
}

.vertical-section .calls .prodotti-bg:hover .hover-box h2 {
  color: var(--color-green);
}
.vertical-section .calls .prodotti-bg:hover .hover-box p {
  color: var(--color-green);
}
.vertical-section .calls .prodotti-bg:hover .hover-box span {
  color: var(--color-green);
}
.vertical-section .calls .prodotti-bg:hover .hover-box .btn1 {
  color: var(--color-green);
}
















.usato-bg{
  background-color: var(--color-green);
  mix-blend-mode: ;
  aspect-ratio: 4 / 3;

}
.usato-bg a{
  text-decoration: none;
}


.usato-bg div.hover-box{
  background-color: var(--color-hover-darker);
  mix-blend-mode: ;
  position: relative;
  z-index: 3;
  height: 100%;
  padding: 1rem;
  transition: 0.4s ease;
}

.usato-bg div.hover-box{
  mix-blend-mode: ;
  position: relative;
  z-index: 3;
  height: 100%;
  padding: 1rem;
  transition: 0.4s ease;
}

.usato-bg:hover div.hover-box{
  background-color: transparent;
  mix-blend-mode: normal;
}

.vertical-section .calls .usato-bg .hover-box h2 {
  color: var(--color-white);
  font-size: 1.7rem;
  transition: 0.4s ease;
}
.vertical-section .calls .usato-bg .hover-box p {
  color: var(--color-white);
  font-size: 1.3rem;
  transition: 0.4s ease;
  margin-top: 0.5rem;
}

.vertical-section .calls .usato-bg .hover-box span {
  color: var(--color-white);
  font-weight: 700;
  font-size: 2rem;
  transition: 0.4s ease;
  position: absolute;
  bottom: 1rem;
  right: 1rem;
}

.vertical-section .calls .usato-bg .hover-box h4 {
  transition: 0.4s ease;
  position: absolute;
  bottom: 1.2rem;
  left: 1rem;
}

  .vertical-section .calls .usato-bg .hover-box h4.barrato {
    bottom: 3rem;

  }

.vertical-section .calls .usato-bg .hover-box .btn1 {
  color: var(--color-black)
  border: 3px solid var(--color-white);
  position: absolute;
  bottom: 2.2rem;
  transition: 0.4s ease;
}

.vertical-section .calls .usato-bg:hover .hover-box h2 {
  color: var(--color-black);
}
.vertical-section .calls .usato-bg:hover .hover-box p {
  color: var(--color-black);
}
.vertical-section .calls .usato-bg:hover .hover-box span {
  color: var(--color-black);
}
.vertical-section .calls .usato-bg:hover .hover-box .btn1 {
  color: var(--color-black);
}











.footer{
  background-color: var(--color-white);
  padding-bottom: 6rem;
  color: var(--color-green);
}
.footer ul{
  margin: 0;
}
.footer ul li{
 list-style-type: none;
  float: left;
  margin-right: 1rem;
}
.footer a{
  color: var(--color-green);
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.2;
  transition: 0.3s cubic-bezier(.86,0,.07,1);
}

.footer a:hover{
  color: var(--color-white);
}

.footer .legal a{
  color: var(--color-green);
  font-style: normal; 
  font-size: 1rem;
  line-height: inherit;
  transition: 0.3s cubic-bezier(.86,0,.07,1);
}

.footer .legal a:hover{
  color: var(--color-white);
}

.footer p{
  font-size: 1rem;
}

.footer p strong{
  letter-spacing: 0.01rem;
}
.footer .pure-g .go-top {
  width: 100%;
  text-align: center;
}
.footer .pure-g .go-top a{
  color: var(--color-black);

  width: 36px;
  height: 36px;
  display: block;
  /*margin-top: 1.2rem;*/
  font-size: 2rem;
  transition: 0.3s cubic-bezier(.86,0,.07,1);
}
.footer .pure-g .go-top a:hover{

  color: var(--color-green);
  background: none;

}

.form-contatto form{
  margin-top: 1.5rem;
}

.form-contatto h4{
  margin-top: 3rem;
}
.form-contatto h4 a{
  color: var(--color-text);
  font-size: 1.6rem;
  font-weight: 700;
}
.form-contatto h4 i{
  color: var(--color-text);
  font-size: 2.2rem;
  font-weight: 700;
  position: relative;
  top: 3px;
  margin-right: 10px;
}

.form-contatto .field{
  width: 100%;
  padding-right: 0;
  margin-bottom: 1.4rem;
  float: left;
  box-sizing: border-box;

}

.form-contatto .text-field{
  padding-right: 0;
}

.form-contatto .field-select{
  width: 100%;
  padding-right: 0;
  margin-bottom: 1.4rem;
  float: left;
  box-sizing: border-box;

}


.form-contatto .field-select select{
  width: 100%;
  float: left;
  box-sizing: border-box;
  background-color: var(--color-white);
  border: 2px solid var(--color-black);
  padding: 0.6rem 1rem;
  margin-top: 0.8rem;
  margin-bottom: 0.1rem;

}

.form-contatto form label{
  display: none;
}

.form-contatto form input:not([type=submit]){
    width: 100%;
    padding: 0.5rem 0.1rem;
    box-sizing: border-box;
    border: 0;
    border-radius: 0;
    transition: 0.35s;
    font-family: var(--font-family-mono);
    font-style: italic;
    letter-spacing: 0.1rem;
    border-bottom: 2px solid var(--color-black);
}


.form-contatto form textarea{
    width: 100%;
    padding: 0.5rem 0.1rem;
    box-sizing: border-box;
    border: 0;
    border-radius: 0;
    transition: 0.35s;
    font-family: var(--font-family-mono);
    font-style: italic;
    letter-spacing: 0.1rem;
    border-bottom: 2px solid var(--color-black);
}


.form-contatto form input[type=submit]{
    margin-top: 1.4rem;
    font-size: 1.4rem;
    padding: 0.4rem 2.2rem;
    border: 0;
    border-radius: 3px;
    color:  var(--color-white);
    background-color:  var(--color-text);
    font-weight: 700;
    cursor: pointer; 
    transition: 0.35s;
}
.form-contatto form input[type=submit]:hover{
  background-color: var(--color-green);
  color: var(--color-black);
}

.form-contatto form input:focus {
  background-color: var(--color-hover-green);
  outline: none;
}

.form-contatto form textarea:focus {
  background-color: var(--color-hover-green);
  outline: none;
}

.form-contatto form input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--color-black);
  opacity: 0.5; 
}

.form-contatto form input:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: var(--color-black);
  opacity: 0.5;
}

.form-contatto form input::-ms-input-placeholder { /* Microsoft Edge */
  color: var(--color-black);
  opacity: 0.5;
}

.form-contatto form textarea::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--color-black);
  opacity: 0.5;
}

.form-contatto form textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: var(--color-black);
  opacity: 0.5;
}

.form-contatto form textarea::-ms-input-placeholder { /* Microsoft Edge */
  color: var(--color-black);
  opacity: 0.5;
}













.form-login form{
  margin-top: 1.5rem;
}

.form-login h4{
  margin-top: 3rem;
}
.form-login h4 a{
  color: var(--color-text);
  font-size: 1.6rem;
  font-weight: 700;
}
.form-login h4 i{
  color: var(--color-text);
  font-size: 2.2rem;
  font-weight: 700;
  position: relative;
  top: 3px;
  margin-right: 10px;
}

.form-login .field{
  width: 100%;
  padding-right: 0;
  margin-bottom: 1.4rem;
  float: left;
  box-sizing: border-box;

}

.form-login .text-field{
  padding-right: 0;
}

.form-login form label{
  display: none;
}

.form-login form input:not([type=submit]){
    width: 100%;
    padding: 0.5rem 0.1rem;
    box-sizing: border-box;
    border: 0;
    border-radius: 0;
    transition: 0.35s;
    font-family: var(--font-family-mono);
    font-style: italic;
    letter-spacing: 0.1rem;
    border-bottom: 2px solid var(--color-black);
    margin: 1rem 0;
}


.form-login form textarea{
    width: 100%;
    padding: 0.5rem 0.1rem;
    box-sizing: border-box;
    border: 0;
    border-radius: 0;
    transition: 0.35s;
    font-family: var(--font-family-mono);
    font-style: italic;
    letter-spacing: 0.1rem;
    border-bottom: 2px solid var(--color-black);
}


.form-login form input[type=submit]{
    margin-top: 2.4rem;
    font-size: 1.6rem;
    padding: 0.4rem 4.2rem;
    border: 0;
    border-radius: 3px;
    color:  var(--color-white);
    background-color:  var(--color-text);
    font-weight: 700;
    cursor: pointer; 
    transition: 0.35s;
}
.form-login form input[type=submit]:hover{
  background-color: var(--color-green);
  color: var(--color-black);
}

.form-login form input:focus {
  background-color: var(--color-light-green);
  outline: none;
}

.form-login form textarea:focus {
  background-color: var(--color-green);
  outline: none;
}

.form-login form input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--color-black);
  opacity: 1; /* Firefox */
}

.form-login form input:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: var(--color-black);
}

.form-login form input::-ms-input-placeholder { /* Microsoft Edge */
  color: var(--color-black);
}

.form-login form textarea::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--color-black);
  opacity: 1; /* Firefox */
}

.form-login form textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: var(--color-black);
}

.form-login form textarea::-ms-input-placeholder { /* Microsoft Edge */
  color: var(--color-black);
}


.only-desk{
  display: none;
}
.only-mob{
  display: block;
}

.box-menu .languages{
  margin: 2.6rem 0 0 0;
}

.box-menu .languages ul .active a{
  text-decoration: underline;
}

.box-menu .languages ul li a{
  font-size: 1.8rem;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 0.7rem;
}

.notes h3 a{
  text-decoration: none;
}

.notes h3 a:hover{
  opacity: 0.6;
}
.notes h5{
  margin-bottom: 0.2rem;
 float: left;
}
.notes h4 a{
 text-decoration: none;
 margin-top: 1rem;
 float: left;
}
.note h5{
  margin-bottom: 2rem;
  float: left;
}
.note ul li{
  margin-left: 1rem;
}
.note figure{
  max-height: 100%;
  margin-top: 2rem;
  margin-bottom: 1.2rem;
}
.note figure li{
  margin-bottom: 1rem;
}
.default figure{
  max-height: 100%;
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.default figure li{
  margin-bottom: 1rem;
}
.block-figure{
  width: 100%;
  float: left;

}
.about-block .note-tags{
  list-style-type: none;
  float: left;
  width: 100%;
  margin-top: 1rem;
  margin-bottom: 2rem;
}
.about-block .note-tags li{
  float: left;
  margin-right: 1rem;
  margin-left: 0;
}



.search-block ul{
}
.search-block ul a:hover li{
  background: var(--color-light-green);
}
.search-block ul a li{
  list-style-type: none;
  margin: 0 0 2rem 0;
  padding: 2rem;
  background: var(--color-grey);
  transition: 0.3s ease;
}
.search-block ul a h4{
  margin-top: 0;
}

.calls .note-tags{
  list-style-type: none;
  float: left;
  width: 100%;
  margin-top: 1rem;
  margin-bottom: 2rem;
}
.calls .note-tags li{
  float: left;
  margin-right: 1rem;
  margin-left: 0;
  width: auto;
}

.calls .note-tags-2{
  list-style-type: none;
  float: left;
  width: 100%;
  margin-top: 0.2rem;
}
.calls .note-tags-2 li{
  float: left;
  margin-right: 1rem;
  margin-left: 0;
  width: auto;
  margin-top: 0.3rem;
}
.calls .note-tags-2 li .btn1{
  margin-top: 0;
}
.calls .note-tags-2 li .btn1.filterSingleReset{
  background-size: 100% var(--bg-h);
  border: 3px solid var(--color-green);
}

.calls .note-tags-2 li .btn3{
  margin-top: 0;
}
.calls .note-tags-2 li .btn3.filterSingleReset{
  background-size: 100% var(--bg-h);
  border: 3px solid var(--color-green);
}
.calls .titolo-filtro{
  float: left;
  margin-top: 0.6rem;
}

.pagination{
  text-align: center;
  display: block;
  margin-top: 1rem;
}

.pagination span{
  font-size: 2.6rem;
  padding: 1rem;
  opacity: 0.3;

}

.pagination strong{
  display: none;

}

.pagination a{
  font-size: 2.6rem;
  padding: 1rem;
  text-decoration: none;
}

.gallery-small{
  float: left;
  margin-top: 2rem;
}

.gallery-small .caption{
  float: left;
  width: 100%;
  text-align: center;
  font-size: 1rem;
}

.gallery-original{
  float: left;
  margin-top: 2rem;
}

.gallery-original > div{
  cursor: pointer;
}


.gallery-container > div{
  cursor: pointer;
  display: none;
}
.gallery-container > div.active{
 
  display: block;
}
.gallery-container .left-img{
  margin-bottom: 2rem;
}
.gallery-container .right-img{
  margin-bottom: 2rem;
}
.gallery-container span{
  font-style: italic;
}

.video-box{
  float: left;
  width: 100%;
}

.swiper {
  width: 100%;
  float: left;
}
.pure-g .swiper a {
  background: transparent;
}
.new-swiper-btn{
  float: left;
  width: 100%;
  font-size: 2.2rem;
  position: relative;
  z-index: 9;
  height: 0;
  top: -0.2rem;
  margin-bottom: 2rem;
}
.new-swiper-button-prev{
  float: left;
  display: block;
  cursor: pointer;
  min-width: 25px;
  margin-left: 0.6rem;
}
.new-swiper-button-next{
  float: right;
  display: block;
  cursor: pointer; 
   min-width: 25px;
   margin-right: 0.6rem;
}
.new-swiper-button-prev:hover{
  color: var(--color-green);
}
.new-swiper-button-next:hover{
  color: var(--color-green);
}

.swiper2{
}

.swiper2 figcaption{
  margin-top: 0.5rem;
  font-size: 1.2rem;
  font-weight: 700;
}

.new-swiper-button-prev2{
  float: right;
  display: block;
  cursor: pointer; 
   min-width: 25px;
   animation: moving1 1.5s infinite;
  animation-timing-function: ease-in-out; 
  position: relative;
}
.new-swiper-button-next2{
  float: left;
  display: block;
  cursor: pointer;
  min-width: 25px;
  animation: moving2 1.5s infinite;
  animation-timing-function: ease-in-out; 
  position: relative;
}


.new-swiper-button-prev2[aria-disabled="true"] {
  opacity: 0.2;
  cursor: default;
  color: var(--color-green);
  position: static;
}
.new-swiper-button-next2[aria-disabled="true"] {
  opacity: 0.2;
  cursor: default;
  color: var(--color-green);
  osition: static;
}



.new-swiper-button-prev2:hover{
  color: var(--color-green);
}
.new-swiper-button-next2:hover{
  color: var(--color-green);
}


@keyframes moving1 {
  0% {
    left: 15px;
  }
  50% {
    left: 0px;
  }
  100% {
    left: 15px;
  }
}

@keyframes moving2 {
  0% {
    right: 15px;
  }
  50% {
    right: 0px;
  }
  100% {
    right: 15px;
  }
}





.search-files{
  margin-bottom: 2rem;
  max-width: 320px;
}

.search-files input{
  width: 100%;
  border: 0;
  padding: 1rem 2rem;
  box-sizing: border-box;
  background-color: rgba(0,0,170, 0.1);
  outline: none;
  text-align: center;
  font-size: 1.2rem;
  animation: blinking 2s 2;
  
}

.search-files input:focus {
  background-color: var(--color-green);
  outline: none;
}


.search-files input::placeholder { 
  color: var(--color-black);
  opacity: 0.8; /* Firefox */
  font-style: italic;
  font-size: 1.2rem;

}


@keyframes blinking {
  0% {
    background-color: rgba(0,0,170, 0.1);
  }
  50% {
    background-color: rgba(0,0,170, 0.2);
  }
  100% {
    background-color: rgba(0,0,170, 0.1);
  }
}

.alert p{
  color: var(--color-green);
}


.file-list{
  column-count: 1;
  column-gap: 0;
}

.file-list li{
  list-style-type: none;
  margin-bottom: 0.4rem;
}
.file-list li::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f56d";
  font-style: normal;
  margin-right: 0.6rem;
  font-size: 1.3rem;
  width: 100%;
  margin-left: 2px;
}

.child-list li{
  list-style-type: none;
  font-size: 1.4rem;
  text-transform: uppercase;
  letter-spacing: 0.2rem;
  font-weight: 700;
  line-height: 2.2rem;
}
.child-list li::after {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f061";
  font-style: normal;
  margin-left: 0.6rem;
  font-size: 1.4rem;
  width: 100%;
}


.box-logo-partner-1{
  width: 100%;
  float: left;
}

.box-logo-partner-2{
  width: 100%;
  float: left;
}


.box-logo-partner-1 img{
  max-width: 220px;
  float: right;
}

.box-logo-partner-2 img{
  max-width: 220px;
  float: left;
}

.box-img-partner{
  width: 100%;
  float: left;
  margin-top: 4rem;
}
.box-img-partner figure{
  width: 100%;
  float: left;
  margin-bottom: 1rem;
}
.box-img-partner figure img{
  float: left;
}
.breadcrumb{
  float: left;
}
.breadcrumb ul{
  float: left;

}
.breadcrumb ul li{
  float: left;
  list-style-type: none;
  margin-right: 0.2rem; 
  margin-left: 0;
  font-size: 1rem;
  width: auto;
}

.breadcrumb ul li::after{
  content: '>';
}
.breadcrumb ul li:last-child::after{
  content: '';
}
.breadcrumb ul li a{
  text-decoration: none;
  font-size: 0.8rem;
}
.breadcrumb ul li a.active{
  opacity: 0.5;
  background: none;
  cursor: default;
}

.wow{
  overflow: hidden;
}


.g-map p{
  font-size: 1rem;
}
.pure-g .btn1{
  margin-top: 1.5rem;
  padding: 0.5rem 0.7rem;
  color: var(--color-black);
  border: 3px solid var(--color-black);
  float: left;
  text-decoration: none;
  font-weight: 700;
  font-size: 1rem;
  transition: 0.3s cubic-bezier(.86,0,.07,1);
  text-transform: uppercase;
}
.pure-g .btn1.active{
  background-color: var(--color-green);
}

.pure-g .btn1:hover{
  color: var(--color-black);
}



.pure-g .btn2{
  padding: 0.3rem 0.7rem;
  margin: 0.4rem 0.4rem 0 0;
  color: var(--color-black);
  border: 3px solid var(--color-black);
  float: left;
  text-decoration: none;
  font-weight: 700;
  font-size: 1rem;
  transition: 0.3s cubic-bezier(.86,0,.07,1);
  text-transform: uppercase;
  min-height: 5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.pure-g .btn2.importante{
  background-color: var(--color-light-green);

}
.pure-g .btn2 a{
  text-decoration: none;
  clear: both;
  float: left;
  text-align: center;
  width: 100%;
}
.pure-g .btn2 a.small{
  font-size: 0.8rem;
  margin-top: 0.1rem;
}
.pure-g .btn2.active{
  background-color: var(--color-green);
}

.pure-g .btn2:hover{
  color: var(--color-black);
}



.pure-g .btn3{
  margin-top: 1.5rem;
  padding: 0.5rem 0.7rem;
  color: var(--color-black);
  border: 3px solid var(--color-black);
  background-color: var(--color-light-green);
  float: left;
  text-decoration: none;
  font-weight: 700;
  font-size: 1rem;
  transition: 0.3s cubic-bezier(.86,0,.07,1);
  text-transform: uppercase;
}
.pure-g .btn3.active{
  background-color: var(--color-green);
}

.pure-g .btn3:hover{
  color: var(--color-black);
}






.vertical-section .calls .hover-box .btn3{
  padding: 0.3rem 0.7rem;
  margin: 0.4rem 1rem 0 0;
  color: var(--color-green);
  border: 3px solid var(--color-white);
  float: left;
  text-decoration: none;
  font-weight: 700;
  font-size: 1rem;
  transition: 0.3s cubic-bezier(.86,0,.07,1);
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: var(--color-white);
}
.vertical-section .calls .hover-box .btn3 a{
  text-decoration: none;
  clear: both;
  float: left;
  text-align: center;
  width: 100%;
}

.vertical-section .calls .hover-box .btn3.active{
  background-color: var(--color-green);
}


.vertical-section .calls .hover-box .btn3:hover {
  color: var(--color-white);
  border: 3px solid var(--color-black);
  background-color: var(--color-black);
  background: var(--color-black);
}





.pure-g .spacing {
  clear: both;
  float: left;
  width: 100%;
}



.pure-g .btn-clear {
  clear: both;
  float: left;
}

.pure-g .blocco-cover .btn1{
  color: var(--color-white);
  border: 3px solid var(--color-white);
}


.pure-g ol li{
  margin-left: 2rem;
}

#map {
  width: 100%;
  height: 460px;
  

}




.servizi ul li{
  margin: 0.2rem 1rem;
  font-weight: 700;
}










.m-scroll {
  display: flex;
  position: relative;
  width: 100%;
  height: 16px;
  margin: auto;
  overflow: hidden;
  z-index: 1;
}
.m-scroll__title {
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  height: 100%;
  white-space: nowrap;
  transform: scale(2);
  transition: all 1s ease;
}
.m-scroll__title > div {
  display: flex;
  -webkit-animation: scrollText 33s infinite linear;
          animation: scrollText 33s infinite linear;
}
.m-scroll__title span {
  margin: 0;
  font-size: 0.55rem;
  transition: all 2s ease;
}
.m-scroll__title a {
  text-decoration: none;
}
.m-scroll__title a:hover {
  -webkit-text-stroke: 1px white;
  color: transparent;
}
/*div:hover {
  animation-play-state: paused;
}*/
@-webkit-keyframes scrollText {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(50%);
  }
}
@keyframes scrollText {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(50%);
  }
}






.maximg img{
  max-width: 600px;
}





.barrato{
  text-decoration: line-through;
  margin-top: 0.5rem;
  line-height: 1.5rem;
  opacity: 0.4;
}



.vertical-section .default-subtitle{
  font-weight: 400;
  font-size: 2rem;
}

.vertical-section .price1{
  margin-top: 0.5rem;
  font-size: 1.6rem;
}

.blocco-cover{
  color: var(--color-white);
}

.blocco-kirby{

}


.blocco-kirby > :not(div) {
  /*margin: 0 1rem;*/
  padding: 0 1rem;
  float: left;
  width: 100%;

}

.sbframe {

}

.about-block ul li{
  margin-left: 1rem;
}

.video-block {
    height: 0;
    overflow: hidden;
    padding-bottom: 56.25%;
    padding-top: 30px;
    position: relative;
    display: block;
}
.video-block iframe,
.video-block object,
.video-block embed {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.fade-box{
  width: 100%;
  height: 100%;
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 0;
  right: 0;
  background-color: var(--color-hover-green);
  z-index: 110;
}
.popup-box{
  position: fixed;
  z-index: 111;
  background-color: var(--color-grey);
}

.popup-box button{
  position: absolute;
  right: 1rem;
  top: 0.9rem;
  border: 0;
  background: none;
  cursor: pointer;
  font-size: 1.4rem;

}
.popup-box h3{
  margin: 0 0.9rem 0.4rem 0.9rem;
  font-size: 1.3rem;
  line-height: 0.9;
}
.popup-box > div{
  border-bottom: 2px solid var(--color-black);
  max-width: 260px;
}
.popup-box > div:last-child{
  border-bottom: 0 solid var(--color-black);
}

.popup-box .popup-img{
  max-width: 220px;
  margin-top: 0.8rem;
  margin-bottom: 0.4rem;
}
.popup-box .popup-img img{
  mix-blend-mode: multiply;
}

.popup-box .barrato{
  margin-top: 0;
  font-size: 0.8rem;
  line-height: 1rem;
}

.honeypot {
  position: absolute;
  left: -9999px;
}





.zoom {
  position: relative;
  display: inline-block;
  overflow: hidden;
  cursor: all-scroll;
}