    /** * C U S T O M  F O N T S  E M B E D 
    ==================================================================================*/

    @import url('https://fonts.googleapis.com/css2?family=Hind+Madurai:wght@300;400;500;600;700&family=Jost:ital,wght@0,100..900;1,100..900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

    /** * V A R I A B I L I
    ==================================================================================*/

    :root {
        
        /** --------------- GESTIONE FONTS ----------------- */
        
        --font:             'Plus Jakarta Sans';
        --titoli:           'Hind Madurai';
        --hand:             'Jost';

        
         /** --------------- GESTIONE COLORI ----------------- */
        
        --maincolor:        #3D839A;
        --fontcolor:        #333;
        --rosa:             #F88E70;
        --grey:             #F3F1F1;
        
        --bianco:           #fff;   
    }

    /** * STRUTTURA
    ==================================================================================*/

    html, body              {  }
    body            		{ font-family: var(--font), Serif; font-size: 17px; font-weight: 300;  color: #333;  }
    
    section                 { padding: 80px 0 ; }
    section#catalogo        { background-color: var(--grey); }

    .grey                   { background-color: var(--grey); }

    .menunav                { padding: 0; }

    .banner                 { background-size: cover; position: relative; padding: 0 0 80px 0 !important; }

    .container-fluid        { padding: 0}

    .site-title             { background-image: url("../img/logo.svg"); text-indent: -9999px; display: block; }   
    .site-description       { display: none; }

    .pagina                 { padding: 40px 0; }

    footer                  { display: block; padding: 50px 0; background-color: #1D1E1F; }
    .credit                  { display: block; padding: 10px 0; background-color: #000; }

    .servizio               { box-shadow: 0px 0px 18px -9px rgba(0,0,0,0.4); position:relative; overflow:hidden; margin:15px auto;  padding:20px; }


    .title                 { background-color: var(--maincolor); position: relative;  padding: 0; overflow: hidden;    }
    .title img             { position: absolute; top: 50%; transform: translateY(-50%);}


    #s-inr .title   { min-height: auto !important; }
    

    .free                   { width:70px; height:auto; margin: 40px 0;}

    #mapid                  { width: 100%; height: 550px; }
    
    #greenvision          { background-image: url(../img/green.webp); background-repeat: no-repeat; display: flex; justify-content: center; flex-direction: column; background-position: top center;}

    #modulo          { background-image: url(../img/contact.jpg); background-repeat: no-repeat; display: flex; justify-content: center; flex-direction: column; background-position: top center; height: 650px;}

    #wpcf7-f2362-o1 { margin-top: 80px;}



    .owl-theme                      { margin: 40px 0; }
    .owl-item                       { margin: 0 40px; }

    .owl-carousel .owl-stage        { display: flex; } 
    .owl-carousel .owl-item img     { width: auto; height: 100%; }

    .owl-stage-outer                { padding: 30px 0; } 

    #progetti .owl-nav              { display: none; } 
    #progetti .owl-dots             { text-align: center; } 
    #progetti .owl-dots span        { position: relative; height: 10px; width: 10px; border-radius: 50%; display: block; background: var(--maincolor); margin: 0 5px; } 

    .owl-dots                       { display: block} 
    .owl-dots .span                 { display: block} 
    .owl-dots .active               { box-shadow: none; } 
    .owl-dots  span                 { background: var(--maincolor); box-shadow: none; height: 12px; width: 12px; margin-bottom: -1px; }


    .positioning    { position: absolute;}


/** * SLIDER 2
    ==================================================================================*/

    .slidex     { position:relative; width: 100%; height: calc( 100% - 200px ); min-height: 500px; }
    .slidex h2  { position:absolute; z-index: 9999; left: 40px; top: 50%; transform: translateY(-50%); color: #fff; width: 35vw; }


    .items { position: relative; overflow: hidden; width: 100%; padding-bottom: 56.25%; }

    .pippo { position: absolute; top: 0; left: 0; width: 100%; height: calc( 100vh - 150px ); opacity: 0; transition: opacity 0.6s ease-in-out; } 
    .pippo.current { opacity: 1; } 
    .pippo img { width: 100%; height: calc( 100vh - 150px );; object-fit: cover; }

    .buttons {
      position: absolute;
      z-index: 1;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }



    .dots {
        display: none;
      
    }

   


    /** * page animation
    ==================================================================================*/

    .reveal         { position: relative; transform: translateY(150px); opacity: 0; transition: 2s all ease;}
    .reveal.active  { transform: translateY(0); opacity: 1;}




    /** * SCROLLDOWN -------------------------------------------------- */

    #scroll{ position: absolute; bottom: 30px; right: 50px; font-family: sans-serif; text-align: center; text-transform: uppercase; letter-spacing: 1px; font-size: 12px; color: #fff; } 

    #scroll svg { width: 14px; color: #fff;  }

    #scroll svg .arrow { -webkit-animation: scroll 0.35s ease-in alternate infinite; animation: scroll 0.35s ease-in alternate infinite; }

    @-webkit-keyframes scroll {
      0% {
        transform: translateY(0);
      }
      100% {
        transform: translateY(10px);
      }
    }

    @keyframes scroll {
      0% {
        transform: translateY(0);
      }
      100% {
        transform: translateY(10px);
      }
    }



    /** *   T I P O G R A F I A
    ==================================================================================*/
    

    h1, h2, h3,h4, h5, h6    { font-family: var(--titoli), 'serif'; color:var(--maincolor); font-weight: normal; font-style: normal;   }

    h3  { font-weight: 700; font-size: 2.7em; line-height: 120%; }
    h5  { font-family: var(--hand), 'serif'; font-size: 14px; color: var(--rosa); text-transform: uppercase; letter-spacing: 2px; }
    
    p    { font-family: var(--font), sans-serif;  margin-bottom: 20px; font-weight: 400; line-height: 180%; }
    
    html 				  { text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none;} 
    body 				  { *zoom: 1; text-align: left; overflow-x: hidden; -ms-word-wrap: break-word; word-wrap: break-word; }

    .title h2             { color: #fff; z-index: 2; font-weight: 700; text-shadow: 1px 1px 2px #3D839A; } 
    .title h6             { color: #eee; margin: 10px 0 0 0; font-weight:normal; letter-spacing:1px; } 
    
    footer p              { color: var(--bianco); font-size: 14px; line-height: 150% }
    footer h4             { font-size: 21px; color: #fff; font-weight: 600; margin: 0 0 20px 0; }
    footer h5             { color:var(--rosa);  }

    footer a              { color: var(--bianco); font-style: normal; text-decoration: underline; text-underline-offset: 8px; text-decoration-color: rgba(238, 238, 238, 0.5); }
    footer a:hover        { color: var(--bianco); opacity: 0.8;   }

    footer img            { width: 200px; height: auto; margin:0 0 20px 0; }

    .btn-default          { background-color: #086F38; color:#fff; font-size: 12px; text-transform: uppercase; letter-spacing: 1px;  border-color: #086F38;}
    .btn-default:hover    { background-color: #000; color:#fff; }
    .button:hover         { background-color: #000; color:#fff; }
    
    a                     { }
    a:link                { }
    a:focus               { outline: 0;}
    a:hover               { text-decoration:none; }

    ul              { font-style: italic; }
    ul li           { padding: 2px 0; }

    .widget ul                { margin:20px 0;; padding: 0; list-style-type: none; }
    .widget ul li             { border-bottom: 1px solid #eee;  padding: 10px 0; }
    .widget ul li a           { font-size: 14px; font-weight: 400; color: #086F38; }
    .widget ul li a:hover     { color:#222; }

    .footwid ul                { margin:0; padding: 0; list-style-type: none; }
    .footwid ul li             {  }
    .footwid ul li a           { font-size: 14px; }

    ul.sitemap          { columns: 2; -webkit-columns: 2; -moz-columns: 2; list-style-type: none; padding: 0; margin: 40px 0;  column-gap: 40px;}
    ul.sitemap li       { line-height: 30px; }
    ul.sitemap li a     { color: var(--gold); text-decoration: none; border-bottom: 1px dotted rgba(212, 165, 53, 0.5); padding-bottom: 1px; }
    ul.sitemap li a:hover     { color: var(--maincolor);  }

    ul.elenco-categorie-prodotti            { list-style-type: none; text-align: center;}
    ul.elenco-categorie-prodotti li         { display: inline-block; margin: 0 20px;}
    ul.elenco-categorie-prodotti li img     { background-color: #fff; padding: 20px; border-radius: 90px; margin-bottom: 40px;}
    ul.elenco-categorie-prodotti li a       {  text-decoration: none; color: var(--rosa);}


    .servizi img       { margin-bottom: 20px; }
    .servizi h4        { font-family: var(--titoli), 'serif'; font-size: 18px;   }
    .servizi a         { text-decoration: none;}
    .servizi p         { font-size: 14px; line-height: 21px; margin-bottom: 0;  }

    .banner h2          { color: #fff; font-weight: 900;   }

    #greenvision h2     { font-weight: 800;  color: #fff;  position: relative;}    


    .claim p        { color: #fff; }
    
    .sedi h3, .sedi h5, .sedi a, .sedi p           { color: #fff;}

    section.pagina h3, section.singolo h3      { margin: 40px 0 20px 0;  }

    .perche         { color:#fff; }
    .perche h3      { color:#fff; font-size: 32px; margin-bottom: 80px; }        
    .perche h4      { color:#fff; font-size: 18px; font-weight: normal; }  


    /** *   CATALOGO --------------------------------------------------------------------- */

    .catalogo      { text-align: center; }
    .catalogo h3   { font-size: 20px; font-weight: 700; color: var(--rosa); padding: 0 40px; margin: 0 !important;}
    .catalogo a    { text-decoration: none; text-transform: uppercase; font-size: 13px; font-weight: 700; }
    
    .prodotto:hover   { }

    .catalogo a { overflow: hidden; position: relative; display: inline-block;}
    .catalogo a::before,.catalogo a::after { content: ''; position: absolute; width: 100%; left: 0;}
    .catalogoa::before { background-color: #54b3d6; height: 2px; bottom: 0; transform-origin: 100% 50%; transform: scaleX(0); transition: transform .3s cubic-bezier(0.76, 0, 0.24, 1);}
    
    .catalogo a::after { content: attr(data-replace); height: 100%; top: 0; transform-origin: 100% 50%; transform: translate3d(200%, 0, 0); transition: transform .3s cubic-bezier(0.76, 0, 0.24, 1); color: #54b3d6;}
    .catalogo a:hover::before { transform-origin: 0% 50%; transform: scaleX(1);}
    .catalogo a:hover::after { transform: translate3d(0, 0, 0);}
    .catalogo a span { display: inline-block; transition: transform .3s cubic-bezier(0.76, 0, 0.24, 1);}
    .catalogo a:hover span { transform: translate3d(-200%, 0, 0);}

    .sing-prod h3     { text-transform: none; color: var(--rosa); margin-bottom: 40px; }
    .sing-prod h4     { margin: 40px 0 15px 0; }

    /** * --------------------------------------------------------------------------------- */   



    .testatina  { font-size: 12px; color: #fff; }

    #crumbs     { color: #fff; font-size: 12px; }
    #crumbs a   { color: #fff; }

    #box p  { font-size: 11px; text-transform: uppercase; font-weight: 200; letter-spacing: 2px; line-height: 18px !important; margin-top: 10px;}

    .wp-block-column        { margin-top: 40px; }
    .wp-block-column  p     { line-height: 30px; text-align:justify; hyphens: auto; }

    #contatti   { font-family: var(--titoli); font-size: 21px; text-transform: uppercase; }    
    #contatti a   { color: var(--maincolor); text-decoration: none;}
    #contatti a:hover   { color: #604830; text-decoration: underline;}

    .pagina p       { text-align: left !important; hyphens: none; }

    .azienda img    { box-shadow: 20px 20px 40px rgb(0 0 0 / 40%); }

    #greenvision p { color: #fff; }

    strong  { font-weight: bold;}

    .credit a  {  color: #fff; font-size: 11px; letter-spacing: 1px; text-transform: uppercase; text-decoration: none;  }

    
    a.call i         { margin-right: 20px; }

    #produzione p     { font-size: 14px; font-weight: 400; }
    #produzione h4    { font-weight: 600; }

    #modulo h2        { font-size: 65px; color:#fff; font-weight: 700; }
    #modulo p         { font-size: 16px; color:#fff; }


    /** *   F O R M
    ==================================================================================*/

    span.wpcf7-list-item { margin: 0;}


    /** * G U T E N B E R G
    ==================================================================================*/

    .alignwide          { margin: 32px calc(25% - 25vw); max-width: 100vw;}
    .alignwide img      { max-width: 1600px; display: inline; }
    
    .alignleft,.alignright  { margin-bottom: 20px;    width: 40%; }
    .alignleft              { float: left;	margin: 5px 40px 30px 0; }

    .alignfull              { margin: 50px calc(50% - 50vw); max-width: 100vw; width: 100vw;}

    .wp-block-cover .wp-block-cover-image-text, .wp-block-cover .wp-block-cover-text, .wp-block-cover h2, .wp-block-cover-image .wp-block-cover-image-text, .wp-block-cover-image .wp-block-cover-text, .wp-block-cover-image h2 {  font-size: 28px; color: #fff; font-weight: 200; letter-spacing: 4px; text-transform: uppercase; }

    .wp-block-cover, .wp-block-cover-image { min-height: 500px;}


    /** * BTN
    ==================================================================================*/

    .btn        { font-size: 14px; font-weight: 600; padding: 10px 25px; letter-spacing: 1px; }

    .btn-outline-primary {
        
        color: var(--maincolor);
        background-color: transparent;
        background-image: none;
        border-color: rgba(61, 43, 20, 0.3);
        text-transform: uppercase; font-size: 14px; letter-spacing: 3px; font-weight: 500;
        padding: 10px 15px;
        
    }

    .btn-outline-light  { font-size: 14px; letter-spacing: 3px; font-weight: 500;  border-color: rgba(255, 255, 255, 0.5); }
    
    .btn-outline-primary:hover {
     
        background-color: var(--gold);
        border-color: var(--gold);
        
    }

    .btn-primary.disabled, .btn-primary:disabled { color: var(--maincolor); background-color: #eee; border-color: #eee;}

    .btn-primary        { color: #fff; background-color: var(--maincolor); border-color: var(--maincolor); text-transform: uppercase; }
    .btn-primary:hover  { color: #fff; background-color: var(--rosa); border-color: var(--rosa);}



    /** * MENU
    ==================================================================================*/
    
    .navbar         { padding: 0 !important;  }
    .navbar-light .navbar-nav .nav-link { font-size: 12px; font-weight: 600; }

    .nav-link { font-family:var(--font), 'serif'; font-weight: 600; font-style: normal; font-size: 13px; text-transform: uppercase;  }

    .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { color: var(--rosa); }
    
    .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: var(--rosa); font-weight: 700; }


    /** * NEWS
    ==================================================================================*/
    
    .notizia            { margin: 20px 0; }
    .notizia h3         { font-size: 24px; }
    .notizia img        { margin-bottom: 20px; }
    .notizia p          { margin: 20px 0; }
    .notizia .data      { color: #F59B1C; }


    /** * W I D G E T
    ==================================================================================*/
    
    .widget         { margin:  0 0 40px 0;}



    /** *   R E S P O N S I V E
    ==================================================================================*/
    

    @media all and (max-width: 986px) {
        
        header          { padding: 0; }

        #menu-icon      { display:block; }
        
        .positioning    { left: 10px; bottom:0; }
                
        .title h2       { font-size:28px;  } 
        
        .pagina         { padding: 30px; }
        
        .dropdown-menu { border: 0; text-align: center; background-color: #f4f4f4;}
        .dropdown-menu li:last-child { border: 0 !important; }


        
    }

    @media all and (min-width: 986px) {
        
         header                  { padding: 30px; }

        
        .title:after           { background-position: left -600px; }
        #greenvision h2        { font-size: 46px !important; line-height: 150%; }
        
        section.preventivo     { padding: 0 0 80px 0 !important; }
        
        .navbar-expand-md .navbar-nav .dropdown-menu        { width: 220px; }
        .navbar-expand-md .navbar-nav .dropdown-menu a.nav-link     { padding: 5px 16px !important; }
        
        .positioning    { left: 40px; top:50%; transform: translateY(-50%); }
        
        .title h2       { font-size:50px;  } 





    }



    /** * ==================================================================================*/

    @media (max-width: 480px) {
          
        .site-title             { background-size: cover;  width: 280px; height: 58px; margin: 20px auto; }   
        .site-title a           { display: block; height: 58px; width: 280px; }
        
        .menunav                { padding-bottom: 40px; background-color: transparent; }
        .navbar-toggler         { margin: 0px auto; border-color:transparent !important; }
        .navbar-nav             { text-align: center; margin-bottom: 40px; }
        .navbar-nav li          { border-bottom: 1px solid #ededed;  }

        footer                  { text-align: center; }
        
        .navbar-light .navbar-nav .nav-link     { color:var(--maincolor); }
        
        .banner                 { min-height:550px; }
        .claim                  { width: 80vw; position: absolute; top:80px; left: 40px;  }
        .banner h2              { font-size: 21px; line-height: 28px; margin-bottom: 40px;  }
        
        #greenvision          { background-size:cover; }
        #greenvision h2       { font-size: 18px; line-height: 26px; max-width: 80vw; margin-left: 40px; }
        #greenvision .btn     { margin-left: 40px; }
       
        .scelta                 { text-align: center; }
        .scelta .icona          { margin: 20px 0; }
        
        .singolo, .preventivo   { padding: 80px 40px 20px 40px !important; }
        
        .title                  { height: 350px; padding: 0; }
        .title img              { width: auto; height: 100%; left: -60%; }
        
        #crumbs                 { margin-bottom: 20px; }
        
        #contatti               { font-size: 16px; }
        #contatti .row > div    { margin: 5px 0; }
        .servizi > div          { margin: 5px 0; }
        
        .call                   { margin: 20px 0;}
        


      }

    /** * ==================================================================================*/

    @media (min-width: 480px) and (max-width: 760px) {

        .site-title             { background-size: cover; height: 85px; width: 300px; margin: 50px 0; }   
        .site-title a           { display: block; height: 85px; width: 300px; }
        
    
      }

    /** * ==================================================================================*/

    @media (min-width: 768px) and (max-width: 980px) {
         
        .site-title             { background-size: cover; height: 85px; width: 300px; margin: 50px 0; }   
        .site-title a           { display: block; height: 85px; width: 300px; }
        
        .title                      { height: 80px; line-height:80px; padding: 0 20px;}

    }

    /** * ==================================================================================*/

    @media (min-width: 980px) and (max-width: 1200px) {
         
        .site-title             { background-size: cover; height: 85px; width: 300px; margin: 50px 0; }   
        .site-title a           { display: block; height: 85px; width: 300px; }
        
        .title                      { height: 80px; line-height:80px; padding: 0 20px;}


    }

    /** * ==================================================================================*/
    
    @media (min-width: 1200px) {

        .site-title             { background-size: cover; width: 290px; height: 60px;  margin:0; }   
        .site-title a           { display: block; width: 290px; height: 60px; }
        
        .nav-link               { padding:18px !important;  }

        #greenvision          { background-size: 100% auto; padding: 0; }
        #greenvision          { height: 700px; }
        #greenvision h2       { font-size: 45px; max-width: 30vw; margin-bottom: 40px; }
        
        .banner                 { max-height: calc( 100vh - 100px ); overflow: hidden;  }
        .banner h2              { font-size: 40px; line-height: 110%; text-shadow: 1px 1px 1px #333;  }
        
        .footwid ul             { max-width: 70%; }
        
        .scelta                 { display: inline-block; margin-bottom: 60px;  }
        .scelta h4              { margin-bottom: 20px;  }
        .scelta p               { display: block;  float: left; margin: 0 0 0 30px; width: 250px;  }
        .scelta .icona          { display: block; vertical-align: middle; float: left; width: 50px;}
        
        .singolo               { padding: 80px 0; }
        
        .title                 { height: 500px; }



    }  


    /** * THE END ================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================== 
    */
