@charset 'UTF-8';

a, a:hover, a:focus, button:focus{color: inherit; text-decoration: none; outline: none; box-shadow: none}
.btn.focus, .btn:focus{box-shadow: none; outline: none}
.color-inherit{color: inherit}

.text-center .img-fluid{ margin-left:auto; margin-right:auto; }
.clear{ clear:both; }
.space-5{ height:5px; clear:both; }
.space-10{ height:10px; clear:both; }
.space-20{ height:20px; clear:both; }
.space-40{ height:40px; clear:both; }
.no-padding{ padding:0 !important; }
.no-margin{ margin:0 !important; }

body{font-family: 'Lato', sans-serif; padding-top: 101px; color: #1b1b25}
@media(max-width:767px){
    body{padding-top: 65px}
}

.font-thin{font-weight: 100} 
.font-light{font-weight: 300} 
.font-regular{font-weight: 400} 
.font-bold, strong, b{font-weight: 700} 

.divider{width: 100%; height: 1px; display: block}
.divider-small{width: 270px; display: inline-block; height: 1px; }
.color-white{color: #fff}
.color-green{color: #4b6c00}
.color-brown{color: #9d4425}
.bg-brown{background-color: #9d4425}
.bg-black{background-color: #1B1B25}
.bg-light-gray{background-color: #f2f2f2}

.hover-brown:hover{color: #9d4425}
.hover-green:hover{color: #4b6c00}

.hover-box-shadow-brown{ transition: box-shadow 0.5s ease}
.hover-box-shadow-brown:hover{box-shadow: 0 0 20px rgba(157, 68, 37, 0.2)}

.font-80{font-size: 80px; font-size: calc(25px + 2.9vw); line-height: 1.05}
.font-60{font-size: 60px; font-size: calc(25px + 1.85vw); }
.font-40{font-size: 40px; font-size: calc(25px + 0.8vw); }
.font-36{font-size: 36px; font-size: calc(14px + 1.15vw); }
.font-24{font-size: 24px; font-size: calc(14px + 0.55vw); }
.font-21{font-size: 21px; font-size: calc(14px + 0.4vw); }
.font-18{font-size: 18px; font-size: calc(14px + 0.25vw);}
.font-16{font-size: 16px; font-size: calc(14px + 0.15vw);}
@media(max-width:767px){
    .font-24-xs{font-size: 24px}
}
.btn{padding: 2px 20px; border-radius: 0; transition: all 0.5s ease}
.btn-outline{border: 1px solid}
.btn-outline.color-white span{width: 0%; height: 100%; top: 0; left: 0; background: #fff;position: absolute; z-index: -1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;}
.btn-outline.color-white:hover span{width: 100%;}
.btn-outline.color-brown:hover {color: #fff; border-color: #9d4425}
.btn-outline.color-brown span:first-child{width: 0%; height: 100%; top: 0; left: 0; background: #9d4425;position: absolute;  -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;}
.btn-outline.color-brown:hover span:first-child{width: 100%;}
.btn.bg-brown .effect-btn{position: absolute; z-index: 1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;width: 0; top: 1px; bottom: 1px; left: 50%; background: #fff; opacity: 0; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%) ; transform: translateX(-50%);}
.btn.bg-brown:hover .effect-btn{width: 90%; opacity: 1;}
.btn.bg-brown:hover span{color: #9d4425;}
.btn.wpcf7-submit.bg-brown:hover{color: #9d4425; background-color: #fff; border: 1px solid}

.btn.btn-outline.color-brown:hover, .btn.btn-outline.color-brown:focus{background-color: #9d4425 !important; color: #fff;}

.z-index1{z-index: 1} 
.z-index2{z-index: 2}

.height-50px{height: 50px}
.height-full{height: 100% }
.line-height1{line-height:1}
.line-height-1-1{line-height:1.1}

.width-full{width: 100%}

.border-radius{border-radius: 8px}
.border-radius-circle{border-radius: 50%}
.box-shadow{box-shadow: 0 0 20px rgba(0,0,0,0.2)}

.slick-slider { margin-bottom: 0}

.text-shadow{text-shadow: 0 0 20px rgba(0,0,0,0.6)}

.slick-prev {left: 0; z-index: 5;} 
.slick-next {right: 0; z-index: 5;}
.slick-next, .slick-prev{width: 38px; height: 38px; top: 0; margin-top: 0; position: absolute; top: 0;}
.slick-next::before, .slick-prev::before{color: transparent; width: 38px; height: 38px; content: ''; margin: 0 auto; display: flex; justify-content: center; align-items: center; background-color: #9d4425; border-radius: 50%; opacity: 1}
.slick-next.slick-disabled::before, .slick-prev.slick-disabled::before{background-color: #9b9b9b; opacity: 1}
.slick-prev::before { background-image: url("../images/arrow-left.png"); background-repeat: no-repeat; background-position: center;}
.slick-next::before { background-image: url("../images/arrow-right.png"); background-repeat: no-repeat; background-position: center;}

.slider-modelli .slick-next{ right: 0}
.slider-modelli .slick-prev{ right: 50px; left: auto}
@media(max-width:767px){
    .slider-modelli .slick-next{ top: 40%}
    .slider-modelli .slick-prev{ top: 40%}
}
/*.slider-gallery{margin-left: -150px}*/

.hover-effect .img-fluid{transition: transform 0.5s ease}
.hover-effect:hover .img-fluid{transform: scale(1.1);}
.hover-effect-small .img-fluid{transition: transform 0.5s ease}
.hover-effect-small:hover .img-fluid{transform: scale(0.9);}

 
.modal-dialog { max-width: 700px;}
@media(max-width:800px){
    .modal-dialog { max-width: 90%;}
}

/* HEADER */
.lingua { position: absolute; right: 20%;}
.lingua-singola { display: inline-block; padding: 0 10px; border-left: 1px solid; line-height: 1;}   
.lingua-singola:first-child { border: 0;}
.lingua-singola.active{color: #9d4425; font-weight: 700}

.navbar{box-shadow: 0 0 40px 0 rgba(0,0,0,0.3)}
.navbar-expand-lg .navbar-nav .nav-link { border-right: 2px solid #9d4425; padding: 0 15px; margin: 10px 0; line-height: 1; color: #1b1b25}
.navbar-expand-lg .navbar-nav .dropdown-menu .nav-link { border: none}
.navbar-expand-lg .navbar-nav > li:last-child .nav-link { border: none}
.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link{color: #9d4425}

@media(max-width:767px){
    .navbar-toggler{border: none; padding: 0; margin: 0}
    .navbar-light .navbar-toggler-icon {  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgb(157, 68, 37)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");}
    .lingua { top: 21px;}
    .navbar-expand-lg .navbar-nav .nav-link{border: none}
    .dropdown-menu{text-align: center}
    .navbar-expand-lg .navbar-nav .nav-link{font-size: 18px; padding: 10px}
}


/* header video */
#header-video{ height:calc(100vh - 91px); overflow:hidden; background:#000; }
#header-video .videobg-width { position: absolute; height: 100%; left: -9999px;right: -9999px; margin: auto; width: 100%; /* Change width value to cover more area*/ }
#header-video .videobg-aspect { position: absolute; width: 100%; height: 0; top: -9999px; bottom: -9999px; margin: auto; overflow: hidden; padding-bottom: 56.25%; /* 16:9 ratio */ }
#header-video .videobg-make-height{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
#header-video .videobg-hide-controls { box-sizing: content-box; position: relative; height: 100%; width: 100%; /* Vimeo timeline and play button are ~55px high */ padding: 55px 97.7777px; /* 16:9 ratio */ top: -55px;  left: -97.7777px; /* 16:9 ratio */ }
#header-video #player, #header-video iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; border: 0 none; }
#header-video #player{ pointer-events: none;}
#header-video #header-video-mask-image{ position:absolute; top:0; left:0; width:100%; height:100%; cursor:pointer; }
#header-video #header-video-mask-image .video-bg{ position:relative; width:100%; height:100%; object-fit:cover; z-index:4; }
#header-video .container{ position:relative; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); }
.tax-categorie_prodotti #header-video .container, .single-products #header-video .container{transform: none; -webkit-transform: none; top: 10%;}
#header-video .video-title{ overflow:hidden; text-shadow:0 0 15px rgba(0,0,0,0.8);}
#header-video .video-title span{ transition:transform ease 0.7s 0.3s, opacity ease 1s 0.3s; -webkit-transition:transform ease 0.7s 0.3s, opacity ease 1s 0.3s; overflow:hidden; transform:translateY(15%); -webkit-transform:translateY(15%); opacity:0; display:block; }
#header-video .active .video-title span{ -webkit-transform:translateY(0); transform:translateY(0); opacity:1; transition:transform ease 0.7s 1.3s, opacity ease 1s 1.3s; -webkit-transition:transform ease 0.7s 1.3s, opacity ease 1s 1.3s; }
#header-video .video-wrapper{ overflow:hidden; }

.page-template-page-cose-mattonflex #header-video { height: 60vh;}

@media(max-width:1199px){
    #header-video .video-title span{-webkit-transform:translateY(0); transform:translateY(0); opacity:1; transition:transform ease 0.7s 1.3s, opacity ease 1s 1.3s; -webkit-transition:transform ease 0.7s 1.3s, opacity ease 1s 1.3s; }
    #header-video .container{z-index: 5;}
}
@media(max-width:767px){
    #header-video{height: auto;}
    .page-template-page-cose-mattonflex #header-video { height: auto;}
    #header-video .videobg-width {position: relative; top: 0; left: 0; right: 0; bottom: auto;}
    #header-video .videobg-aspect {position: relative; top: 0;bottom: auto; }
    #header-video .videobg-make-height {position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: 0;}
    #header-video .videobg-hide-controls { top: 0; padding: 0; left: 0;}
    /*
    #header-video .videobg-width { position: relative; height: auto; top: 0; bottom: auto}
    #header-video .videobg-aspect { position: relative; height: auto; top: 0; bottom: auto; padding-bottom: 56.25%; }
    #header-video .videobg-make-height{ position: relative; height: auto; top: 0; bottom: auto; }*/
    #header-video .container{position: absolute; left: 0; right: 0;}
    /*#header-video .videobg-hide-controls {box-sizing: content-box; position: relative; height: 100%; width: 100%; padding: 0; top: 160px; left: 0;}*/
}




/* Homepage */
.claim-header-home{position: absolute; left: 20%; top: 50%; transform: translateY(-50%)}
.immagine-principale-home{margin-top: -125px}

.slider-lasciati-ispirare .slick-list{padding-top: 40px}
.slider-lasciati-ispirare .slide{transition: transform 0.5s ease ;transform: translateY(0);}
.slider-lasciati-ispirare .slide.slick-slide.slick-current.slick-active {transform: translateY(-40px);}
.slider-lasciati-ispirare .slick-next{right: 10px}
.slider-lasciati-ispirare .slick-prev{left: auto; right: 60px}
@media(max-width:767px){
    .slider-lasciati-ispirare {padding-bottom: 40px}
    .slider-lasciati-ispirare .slick-next{top: auto; bottom: 0}
    .slider-lasciati-ispirare .slick-prev{top: auto; bottom: 0}
}

.animate-slide{opacity: 0}
.slick-current.slick-active .animate-slide{ -webkit-animation: slide-in-out 5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; 
   animation: slide-in-out 5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}

@media(max-width:767px){
    .slider-loghi .slick-next{top: 50%; transform: translateY(-50%)}
    .slider-loghi .slick-prev{top: 50%; transform: translateY(-50%)}
}
.slider-applicazione{margin-left: -150px}

.slider-loghi .slick-track { display: flex; align-items: center;}

.img-cappotto-home{margin-top: -20px; margin-bottom: -20px}
@media(max-width:767px){
    .immagine-principale-home { margin-top: -150px;}
    .claim-header{left: 0; right: 0; padding: 15px; top: 50%; transform: translateY(-60%)}
}

.bg-box-pagine-home{position: absolute; left: 0; right: 0; top: 0; height: 90%}
.box-pagina{border: 2px solid #fff; border-radius: 20px}
@media(max-width:767px){
    .bg-box-pagine-home{height: 100%}
    .box-pagina{height: auto !important}
}
/*.lasciati-ispirare .slick-current.slick-active{transform: translateY(-20px)}*/
 
.mattonflex-animationd-mattonflex-animationatteristica{border-bottom: 1px solid #1B1B25}
.mattonflex-animationd-mattonflex-animationatteristica-link::after{content: ''; display: block; width: 35px; height: 35px; background-image: url(../images/arrow-mattonflex-animationd.png); position: absolute; right: 0; top: 50%; transform: translateY(-50%)}
.mattonflex-animationd-mattonflex-animationatteristica-link:hover{color: #9d4425}

/* Certificazioni */
.ciaim-header-certificazioni{position: absolute; top: 50%; right: 20%; max-width: 700px; transform: translateY(-50%)}
.img-cam{position: absolute; bottom: 10px; right: -30px}
@media(max-width:767px){
    .img-cam{position: relative; bottom: auto; right: 0; margin-top: 20px}
    .ciaim-header-certificazioni{position: relative; top: 0; right: auto; max-width: none; transform:none;}
}

/* Applicazione */
.container-circle{width: 25%; margin: 0 auto;}
@media(max-width:991px){.container-circle{width: 50%;}}
@media(max-width:767px){.container-circle{width: 100%;}}
.circle{ overflow: hidden; padding-top: 100%; position: relative; background-color: #fff; border-radius: 50%; border: 1px solid #b44f26}
.circle .icon-applicazione{padding: 15px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
.circle.active{border: 6px solid #b44f26; margin: -6px}

.row-applicazione{font-size: 0;}
.col-applicazione{display: inline-block; float: none; vertical-align: top;}
.row-applicazione{display: none; height: 0; overflow: hidden}
.row-applicazione.active{display: block; height: auto}

.link-scheda-applicazione{color: #9d4425; background-color: #fff; border: 1px solid #9d4425}
.link-scheda-applicazione.active{background-color: #9d4425; color: #fff}

/* Portfolio */
.slider-lavori .slick-prev {left: auto; right: 50px;}
.col-preview-lavori { display: flex; flex-wrap: wrap; flex-direction: column; justify-content: space-between; }

@media(max-width:767px){
    .slider-lavori .slick-next{ top: 55%}
    .slider-lavori .slick-prev{ top: 55%}
}
  
  
.wpcf7 form .wpcf7-response-output{border: 0; margin: 10px 0; padding: 0}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output{border: none; color: #dc3232}

.wpcf7 form.sent .wpcf7-response-output {color: #46b450;}
.wpcf7-spinner{display: block}

.wpcf7-list-item{margin: 0}
  
  
@-webkit-keyframes slide-in-out {
  0% {
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px);
  }
  20% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  80% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
/*  100% {
    -webkit-transform: translateX(100px);
            transform: translateX(100px);
  }*/
}
@keyframes slide-in-out {
  0% {
    -webkit-transform: translateX(-200px);
            transform: translateX(-200px);
            opacity: 0;
  }
  20% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
            opacity: 1;
  }
  80% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
            opacity: 1;
  }
/*  100% {
    -webkit-transform: translateX(200px);
            transform: translateX(200px);
            opacity: 0;
  }*/
}

/* Cos'è mattonflex */
.claim-header{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.number-timeline{font-size: 100px; writing-mode: vertical-rl; text-orientation: mixed; transform: rotate(180deg); line-height: 1; position: relative; left: calc(100% - 100px);}
.number-timeline::after{content: ' '; width: 30px; height: 8px; background-color: #9d4425; display: block; transform: translate(100%, -200%)}
.slider-timeline .slick-next{bottom: 0; top: auto}
.slider-timeline .slick-prev{bottom: 0; top: auto; left: auto; right: 50px}
.point-timeline{width: 10px; height: 10px; background-color: #9d4425; border-radius: 50%; margin-top: -5px}
.line-timeline{height: 1px; width: 100%; background-color: #9d4425}
.slider-timeline .slick-list { overflow: visible;}
.slider-timeline .slick-track .slide:first-child .line-timeline { display: none;}

.number-box-number{font-size: 170px; -webkit-text-stroke-width: 3px; -webkit-text-stroke-color: #fff; color: transparent; font-weight: 700; line-height: 1}
@media(max-width:767px){
    .number-box-number{font-size: 150px}
}
.bg-contenuto-extra{position: absolute; top: 0; bottom: 0; right: 0; width: 80%; border-bottom-left-radius: 40px; border-top-left-radius: 40px;}
@media(max-width:767px){
    .bg-contenuto-extra{width: 100%; border-radius: 0 !important}
}

#accordion .mattonflex-animationd-header .faq-link:after {  content: "-"; float: right; font-size: 36px; color: #9d4425; font-weight: 700; line-height: 1 }
#accordion .mattonflex-animationd-header .faq-link.collapsed:after { /* symbol for "collapsed" panels */ content: "+"; }

.mattonflex-animationd-header{background: none; padding-left: 0; border-color: #9d4425; border-width: 0 0 1px}
.mattonflex-animationd{border: none}

.bg-brown.color-white .slick-dots li.slick-active button::before{color: #fff}
.bg-brown.color-white .slick-dots li button::before{color: #fff}

.modal-colorazioni .modal-dialog{max-width: 80%}
@media(max-width:767px){
    .modal-colorazioni .modal-dialog{max-width: 100%}
}

/* TEAM */
.row-team{min-height: 70vh}
.row-team .img-team{display: none;}
.row-team .img-team:last-child{display: block}
.row-team .img-team{position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
@media(max-width:767px){
    .team .gallery{height: 50vh; }
    .row-team .img-team { max-height: 100%; width: auto;}
}



#mattonflex-animation {
  width: 480px;
  height: 650px;
  position: relative;
  background: transparent url(../images/file-unico.jpg);
  margin: 0 auto;
}
@media(max-width:767px){
    #mattonflex-animation {
      width: 350px;
      height: 475px;
      position: relative;
      background: transparent url(../images/file-unico-small.jpg);
      margin: 0 auto;
    }
    
}
/*
.counter {
  position: fixed;
  right: 150px;
}*/