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

    @import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

    @import url('https://fonts.googleapis.com/css2?family=Sora:wght@100..800&display=swap');


    @import url('https://api.fontshare.com/v2/css?f[]=satoshi@700,500,400&display=swap');


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

    :root {
        
        /** --------------- GESTIONE FONTS ----------------- */
        
        --font:             'Inter';
        --titoli:           'Sora';
        --hand:             'Barlow';
        
         /** --------------- GESTIONE COLORI ----------------- */
        
        --main:            #153873;
        --second:          #387DC1;
        --green:           #9BC325;
        
        --bianco:           #fff;   
        --nero:             #111;
        
        --second-rgb:       255, 255, 255;
        --green-rgb:        155, 195, 37;
        
        
        /** --------------- SCROLLA ----------------- */
        
        --size:                clamp(10rem, 1rem + 40vmin, 30rem);
        --gap:                 calc(var(--size) / 14);
        --duration:            60s;
        --scroll-start:        0;
        --scroll-end:          calc(-100% - var(--gap));
        --color-text:          #cc0000;
    }

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

    html, body              {  }
    body            		{ font-family: var(--font), Serif; font-size: 16px; font-weight: 400;  color: #333;   }

    body.lock-scroll        { overflow: hidden;}

    
    section                 { padding: 80px 0 ; }
    .menu                   { background-color: var(--giallo); }


     .home #hero             { background-size: cover !important;  }
     #hero                   { background-size: cover !important; padding: 40px; position: relative; background-position: left -260px !important; min-height: 500px;}

    .container-fluid        { padding: 0}

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

    header                  { padding:0; }
    .pagina                 { padding: 40px 0; }
    .singolo                 { background-image: url(../img/service-bg.png); background-size: contain; }

    footer                  { display: block; padding: 50px 0; background-color: var(--main); position: relative; }
    .logo-foot              { width: 250px; height: auto; margin-bottom: 40PX;}

    #nav                    { position: absolute; right: 40px; top: 100px; width: 30vw; text-align: right; padding-right: 40px;  z-index: 9999; }
    #nav                    { display: flex; align-items: center; flex: 1; text-align: right; justify-content: flex-end; }

    #call                   { position: absolute; }

    .free                   { position: absolute; right: 10px; bottom: 70px; transform: rotate(-90deg); width: 65px; height: auto; }
    
    #call, #claim                  { z-index: 9999; }

    .contatto   { background-image: url("../img/sfondo.jpg");  background-repeat: no-repeat; background-size: cover; min-height: 600px; }


    #mapid                  { width: 100%; height: calc( 100vh - 250px); min-height: 500px;  }


        

        .wp-block-table table {
            min-width: 1000px !important;
            width: 100%;
            background: #f6f6f6;
            margin-top: 40px;
        }

        .wp-block-table thead {
            background: var(--second);
            border: none !important;
        }

        .wp-block-table  thead th {
            border: none;
            padding: 20px 30px;
            font-size: 14px;
            color: #fff;
        }

        .wp-block-table  tbody tr {
            margin-bottom: 10px;
        }

        .wp-block-table tbody th,
        .wp-block-table tbody td {
            border: none;
            padding: 20px 30px;
            border-bottom: 1px solid #ccc;
            font-size: 14px;
        }

/** *   VIDEO BACKGROUND ---------------------------------------------------------------------------------------------- */


    .video-background       { position: relative; width: 100%; height: 100vh; /* o qualsiasi altezza tu voglia */ overflow: hidden; }
    .video-background .content { position: relative; z-index: 1; }

        .video-background video {
          position: absolute;
          top: 50%;
          left: 50%;
          min-width: 100%;
          min-height: 100%;
          width: auto;
          height: auto;
          z-index: 0;
          transform: translate(-50%, -50%);
          object-fit: cover;
        }

        .video-background::after {
          content: "";
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background: rgba(0,0,0,0.5); /* scurisce il video */
          z-index: 0;
        }


/** *   SIDE SINGLE ---------------------------------------------------------------------------------------------------------------- */


            #pin                { position: sticky; top: 20px; margin-right: 20px; }
            .page-category-list { overflow: hidden; margin-bottom: 80px;}

            .partners       { padding: 80px;}
            .partners .row       { margin-bottom: 40px; }
            #cap            { padding: 40px 80px 20px;}

            .leaflet-container a { color: #fff !important; }

            .card           { transition: transform 0.25s ease, box-shadow 0.25s ease; } 
            .card:hover     { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15); }

.leaflet-control-zoom a {
    color: #000 !important;
    background-color: #ffffff;
    border: 1px solid #ccc;
    width: 30px;
    height: 30px;
    line-height: 28px;
    text-align: center;
    font-size: 18px;
}

        

/** *   ITALIA ---------------------------------------------------------------------------------------------------------------- */

        #italia { background-image: url("../img/italia.jpg");  background-repeat: no-repeat; background-size: cover; min-height: 600px; }

/** *   BANNER HOME CENTRO ---------------------------------------------------------------------------------------------------- */

        .banner { background-image: url("../img/hero.jpg");  background-repeat: no-repeat; background-size: cover;  }

/** *   FORM ---------------------------------------------------------------------------------------------------- */

        .form { background: linear-gradient(0deg,rgba(21, 56, 115, 1) 5%, rgba(56, 125, 193, 1) 100%); }
        .form-content { background: var(--bianco); padding: 40px; border-top-left-radius: 20px;border-bottom-left-radius: 20px; margin-top: 100px; }

        .form h3    { font-size: 3.8em; line-height: 100%; color:var(--bianco); }
        .form h4    { font-size: 1.8em; line-height: 100%; color:var(--bianco); font-weight: 600; margin: 0 0 60px 0; }
        .form h6    { font-size: 16px; line-height: 100%; color:var(--bianco); }
        .form p     { font-size: 15px;  font-weight: 500; color:var(--bianco);  }
        .form a     { font-size: 15px;  font-weight: 500; color:var(--bianco);  }
        .form-content p { color: var(--main); font-size: 15px;  font-weight: 700; } 

        .wpcf7-list-item-label { font-size: 12px; font-weight: 400; color: #444; line-height: 160%; margin-left: 30px;  display: block;}
        .wpcf7-list-item { display: flex; align-items: flex-start;  }
        .wpcf7-list-item label { display: flex; align-items: flex-start;}
        .wpcf7-list-item input[type="checkbox"] { margin-top: 3px; }

        .wpcf7-form a { font-size: 12px; color:var(--green); }



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

   /** Tipografia globale fluida -------------------------------------------------------------------------- */

    #italia h3, .banner h3  { font-size: clamp(1.875rem, 2.079vw + 1.337rem, 3rem); line-height: clamp(2.813rem, 2.009vw + 2.293rem, 3.9rem);}
    .form h3  { font-size: clamp(1rem, 0.0317rem + 3.0986vw, 3.75rem); line-height: 1.2;}

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

    a, input, submit, textarea, button, .btn-default { transition: all 0.4s ease-out 0s; }

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

    h3  { font-size: 2em; font-weight: 700; color: var(--main);   }
    h5  { font-size: 16px; color:var(--green); font-family:var(--hand), 'serif'; text-transform: uppercase; letter-spacing: 2px;}


    #claim h2   { color: var(--bianco); font-weight: 700; }
    #claim span   { color: var(--green); }

    p           { margin-bottom: 20px; line-height: 28px;  }
    
    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; }

    em          { font-family: var(--corsivo); }

    .titoletto  { font-size: 28px; font-weight: 600; line-height: 32px; color:var(--giallo); }


    #crumbs     { color: var(--bianco);}
    #crumbs a   { color: var(--green);}

/** *   HOME & PAGINA ---------------------------------------------------------------------------------------------------- */

    .home h3        { margin-bottom: 80px;}

    .pagina h3 strong    { color: var(--green); }
    .singolo h3 strong    { color: var(--green); }

/** *   DEFINITION LIST ---------------------------------------------------------------------------------------------------- */


    .grid-dl    { margin: 40px 0;}

    .grid-dl dt { border-top: 1px solid #eee; padding: 15px 0; font-weight: 600; color: var(--second);}
    .grid-dl dd { margin: 0; padding: 15px 0;}

    .grid-dl { display: grid; grid-template-columns: 0.5fr 1fr; grid-template-rows: auto; } 
    .grid-dl dt { grid-column-start: 1; } 
    .grid-dl dd { grid-column-start: 2; } 
    .grid-dl dt+dd { border-top: 1px solid #eee; }


/** *   TESTATINA ---------------------------------------------------------------------------------------------------------------- */

    #testatina a  { color: var(--bianco); text-decoration: none; margin-right: 10px;   position: relative;  display: inline-block; }
    #testatina i  { color: var(--green); margin-right: 15px; }

    #testatina a::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: -4px;              
      width: 100%;
      height: 1px;
      background: rgba(255, 255, 255, 0.5);;        
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.3s ease;
    }

    #testatina a:hover::after { transform: scaleX(1); }

/** *   BOX SIDE GET IN TOUCH---------------------------------------------------------------------------------------------------- */


    .lista-servizi          { margin-bottom: 40px; overflow: hidden; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3); }
    .lista-servizi h3       { font-size: 2em; font-weight: 600; color: var(--main); padding: 20px 30px; }
    .lista-servizi ul       { list-style: none; margin: 0; padding: 30px; }
    .lista-servizi ul li    { line-height: 1.5em; border-bottom: 1px solid #ccc; padding-bottom: 15px; margin-bottom: 15px; }

    .lista-servizi ul li:last-child             { border-bottom: none; margin: 0; padding: 0 }
    .lista-servizi ul li a:hover                { color: var(--green); }
    .lista-servizi ul li a:hover::before        { transform: rotate(45deg); }


    .lista-servizi ul li a{
        position: relative;
        display: block;
        text-transform: capitalize;
        color: var(--main);
        padding-right: 30px;
        text-decoration: none;
        font-family: var(--titoli), sans-serif;
    }


    .lista-servizi ul li a::before{
        content: '';
        position: absolute;
        top: 5px;
        right: 0;
        background: url('../img/arrow-primary.svg') no-repeat;
        background-position: center center;
        background-size: cover;
        width: 12px;
        height: 12px;
        transition: all 0.4s ease-in-out;
    }


    .sidebar-cta-box{
        position: relative;
        background: url('../img/sidebar-cta-bg-image.jpg') no-repeat;
        background-position: center center;
        background-size: cover;
        border-radius: 12px;
        text-align: center;
        padding: 60px;
        overflow: hidden;
    }

    .sidebar-cta-box:before{
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: var(--nero);
        opacity: 70%;
        width: 100%;
        height: 100%;
        z-index: 0;
    }

    .sidebar-cta-content,
    .sidebar-cta-btn{
        position: relative;
        z-index: 1;
    }



    .sidebar-cta-content h2{ font-size: 28px !important; color: var(--bianco); } 
    .sidebar-cta-content p{ color: var(--bianco); margin: 15px 0 0; } 
    .sidebar-cta-btn{ margin-top: 30px; }

/** *   ITALIA ---------------------------------------------------------------------------------------------------------------- */

        #italia h3 { color: var(--bianco); }
        #italia p { color: var(--bianco); }

/** *   BANNER HOME CENTRO ---------------------------------------------------------------------------------------------------- */

        .banner h3 { color: var(--bianco);  }

/** *   FOOTER ---------------------------------------------------------------------------------------------------------------- */

        footer h2   { font-weight: 700; font-size: 24px; margin-bottom: 20px; }

        footer h3, footer h4, footer h5             { color: var(--green);  }
        footer h4             { font-size: 18px; font-weight: 600; margin: 50px 0 20px 0; }
        footer h5             { width:80%;  }

        footer a              { font-size: 15px; color: var(--bianco); position: relative;  display: inline-block; }
        footer a:hover        { color: var(--bianco); }

        footer p              { color: var(--bianco); font-weight: 600; font-size: 14px; }

        .dati p i          { font-size: 1.8em; color: var(--green );}



           .footwid a::after {
              content: "";
              position: absolute;
              left: 0;
              bottom: 0px;              /* distanza dal testo */
              width: 100%;
              height: 1px;
              background: rgba(255, 255, 255, 0.3);         /* colore della linea */
              transform: scaleX(0);
              transform-origin: left;
              transition: transform 0.3s ease;
            }

        .footwid a:hover::after     { transform: scaleX(1); } 

        .footwid ul li              { line-height: 30px; }
        .footwid ul li a            { text-decoration: none; }
        .footwid ul li a:hover      { color:var(--bianco); }


/** *   TITLE ( pagina + single ) ------------------------------------------ */


    section.title       { padding: 0; position: absolute;  bottom: 50px; }

    .title h2           { color: var(--bianco); font-weight: 700; }


    
/** *   TITOLO ------------------------------------------ */
    
    #titolo             { position: absolute; left: 40px; top: 50%; transform: translateY(-50%); z-index: 100; }
    #titolo small       { color: var(--bianco); }
    #titolo small a     { color: var(--giallo); }

    #titolo h2             { color: var(--bianco); letter-spacing: 1px; z-index: 2; font-size:50px; } 
    #titolo h6             { font-size:11px;   font-family: var(--hand), 'serif'; color: var(--giallo);  } 

/** *   LINKS ------------------------------------------ */
    a                     { }
    a:link                { }
    a:focus               { outline: 0;}
    a:hover               { text-decoration:none; }

/** *   LIST ------------------------------------------ */

    ul { list-style: none; margin-left: 0; padding-left: 0; }

    .pagina ul              { width: 85%;  } 
    .pagina ul li           { padding:5px 0 5px 1em; text-indent: -1em; } 
    .pagina ul li:before    { content: "\2022"; padding-right: 5px; }

    .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; }



    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);  }

    .singolo ol                     { }
    .singolo ol li                  { line-height: 120%; padding: 10px;}

    .singolo h4:first-child         { margin: 0 0 20px 0;}
    .singolo h4                     { margin: 40px 0 20px 0;}



    /** *  SERVIZI  ------------------------------------------------------------------- */

    #services       { background-color: #F2F2F5;  }      

    .servizio img       { position: absolute; bottom: 20px; right: 20px; width: auto; height: 90px; }
    .servizio p         { margin-top: 40px; font-size: 15px; font-weight: 400;}
    .servizio h3         { margin: 0;}


    .servizio a.btn, .servizio a.btn-light {
      margin-top: auto;   /* spinge il bottone in fondo */
      align-self: flex-start; /* opzionale: lo allinea a sinistra (default) */
    }


    .servizio{
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        background: var(--bianco);
        border-radius: 12px;
        padding: 40px;
        height: calc(100% - 30px);
        margin-bottom: 30px;
        overflow: hidden;
        transition: all 0.4s ease-in-out;
         
    }

    .servizio::before{
        content: '';
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        height: 0;
        width: 100%;
        background: linear-gradient(90deg, var(--main) 0%, var(--second ) 100%);
        transition: all 0.4s ease-in-out;
        z-index: 0;
       
    }

    .servizio.active:before, .servizio:hover:before{ height: 100%; }
    .servizio:hover h3,.servizio.active h3,.servizio:hover p,.servizio.active p { color: var(--bianco);}

     .servizio .content   { z-index: 999 !important; }


/** *  BOX CONTATTO  ------------------------------------------------------------------- */


    .contact-box a{
        position: relative;
        display: flex;
        border-radius: 10px;
        padding: 20px;
        margin-bottom: 30px;
        overflow: hidden;
        
        border: 1px solid rgba(255, 255, 255, 0.3);
        align-items: center;
        gap: 20px;
        text-decoration: none;
        max-width: 93%;
         
    }


    .contact-box:hover          { border-color: #ccc; transform: translateY(-5px); transition: all 0.2s ease-in-out; } 
    .contact-box .icon          { font-size: 40px; min-width: 52px; text-align: center;  } 
    .contact-box .content h3    { margin: 0 0 5px 0; font-size: 34px; color: var(--green); } 
    .contact-box .content p     { font-size: 14px; color: #fff; margin: 0; }



    /** *  BANNER CONTATTO  ------------------------------------------------------------------- */


    .contatto h3   { color: var(--bianco); margin-bottom: 40px; }
    



    /** *  NEWS  ------------------------------------------------------------------- */

    #news h4    { margin: 5px 0; font-weight: 700; }      
    #news img   { box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important; }      
    #news h6    {  margin-top: 20px;}      
    #news h6 a  { font-size: 11px; color: var(--rosso); text-transform: uppercase; text-decoration: none; }      
    #news p     { font-size: 16px; line-height: 150%; } 

    small.date  { font-weight: 800; font-size: 14px;}
    


    /** *   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;}



    /** * A N I M A Z I O N I D I P A G I N A
    ==================================================================================*/

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


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


    .btn-default, .btn-light { font-family:  var(--titoli); font-size: 16px;  font-weight: 600; }
           
        .btn-default{
        position: relative;
        display: inline-block;
        background: linear-gradient(to right, var(--green) 0%, var(--second) 50%, var(--green) 100%);
        background-size: 200% auto;
        border-radius: 10px;
        
        line-height: 1.25em;
        color: var(--bianco);
        padding: 15px 46px 15px 24px;
        border: none;
        transition: all 0.4s ease-in-out;
        z-index: 0;
        text-decoration: none;
        }

        .btn-default:hover{
        background-position: right center;
        color: var(--bianco);
        transform: translateY(-4px);

        }

        .btn-default::before{
        content: '';
        position: absolute;
        top: 50%;
        right: 24px;
        transform: translateY(-50%);
        background-image: url('../img/arrow-white.svg');
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        width: 12px;
        height: 12px;
        transition: all 0.4s ease-in-out;
        z-index: 1;
        }

        .btn-default:hover:before{
        transform: translateY(-50%) rotate(45deg);
        }

        .btn-light{
        position: relative;
        display: inline-block;
        background: var(--second);
        background-size: 200% auto;
        border-radius: 10px;
       
        line-height: 1.25em;
        color: var(--bianco);
        padding: 15px 46px 15px 24px;
        border: none;
        transition: all 0.4s ease-in-out;
        z-index: 0;
        text-decoration: none;
        margin-right: 40px;

        }

        .btn-light:hover{
        background-position: right center;
        background: var(--green);
        color: var(--bianco);

        }

        .btn-light::before{
        content: '';
        position: absolute;
        top: 50%;
        right: 15px;
        transform: translateY(-50%);
        background-image: url('../img/icon-1.svg');
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        width: 20px;
        height: 20px;
        transition: all 0.4s ease-in-out;
        z-index: 1;
        }

        .btn-light:hover:before{
        transform: translateY(-50%);
        }

    .btn-default.btn-highlighted{
        background: transparent;
        border: 1px solid var(--bianco);
        color: var(--bianco);
        padding: 14px 46px 14px 24px;
        overflow: hidden;
    }

    .btn-default.btn-highlighted:hover{
        color: var(--nero);
    }

    .btn-default.btn-highlighted:hover:before{
        filter: brightness(1) invert(1);
    }

    .btn-default.btn-highlighted::after{ 
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 0;
        height: 100%;
        background: var(--bianco);
        z-index: -1;
        transition: all 0.4s ease-in-out;
    }

    .btn-default.btn-highlighted:hover::after{
        right: auto;
        left: 0;
        width: 100%;
    }



/** * MENU
    ==================================================================================*/
   
    #toggle         { display: block; width: 30px; z-index: 20000 !important; }  



    .header-items   { position: absolute; top: 45px; right: 10px; z-index: 13000;}
    .header-items   { display: flex; align-items: center; flex: 1; text-align: right; justify-content: flex-end;}

    .icona          { font-size: 24px; color: #fff; margin: 0 20px;}
    a.icona:hover   { color:var(--giallo); }


    .button_container {
      position: absolute;
      right: 55px;
      top: 150px;
      height: 27px;
      width: 30px;
      cursor: pointer;
      z-index: 100;
      transition: opacity .25s ease;
      z-index: 9999 !important;
      
    }
    .button_container:hover {
      opacity: .7;
    }
    .button_container.active .top {
      -webkit-transform: translateY(11px) translateX(0) rotate(45deg);
              transform: translateY(11px) translateX(0) rotate(45deg);
      background: #FFF;
    }
    .button_container.active .middle {
      opacity: 0;
      background: #FFF;
    }
    .button_container.active .bottom {
      -webkit-transform: translateY(-11px) translateX(0) rotate(-45deg);
              transform: translateY(-11px) translateX(0) rotate(-45deg);
      background: #FFF;
    }
    .button_container span {
      background: var(--bianco); ;
      border: none;
      height: 2px;
      width: 100%;
      position: absolute;
      top: 0;
      left: 0;
      transition: all .35s ease;
      cursor: pointer;
    }
    .button_container span:nth-of-type(2) {
      top: 11px;
    }
    .button_container span:nth-of-type(3) {
      top: 22px;
    }


    .overlay {
      position: fixed;
      background: rgba(21, 56, 115, 0.95); 
      top: 0;
      left: 0;
      width: 100%;
      height: 0%;
      opacity: 0;
      visibility: hidden;
      overflow: hidden;
    }

    .overlay.open {
        opacity: 1;
        visibility: visible;
        height: 100vh;
        overflow: hidden;
        z-index: 12000;
        min-height: 700px;
    }

    .menumain          { display: block; }

    ul.nav             { display:flex; flex-direction:row; justify-content:flex-start;}
    ul.nav li          { list-style:none;  flex:1; }
    ul.nav li a        { color: var(--green); font-size: 24px; font-weight: 800; font-family: var(--titoli), 'serif'; text-decoration: none;  }    
    ul.nav li a:hover  { color: var(--bianco);}    

    ul.menu-verticale               { position: absolute; top: 200px; left: 0;}
    ul.menu-verticale li            { list-style:none;  }
    ul.menu-verticale li a          { color: #fff; font-family: var(--titoli), 'serif'; text-transform: uppercase;}
    ul.menu-verticale li a:hover    { color: var(--bianco); }

    ul.sub-menu         { padding:20px 10px;  }
    ul.sub-menu li      { padding: 0;   }
    ul.sub-menu li a    { font-size: 18px; line-height: 100%; font-weight: 400;  }

     .nav-bar-mobile { display: none; top: 350px; padding: .5rem 2.5rem;}

    
    #address            { position: absolute; bottom: 50px; left: 40px; }
    #address p          { color: #fff; font-size: 15px; }
    #address a          { color: #fff; font-size: 15px; }
    #address a:hover    { color: #222529; text-decoration: underline; }
   



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

    /** * BLOG ------------------------------------------------------------------------ */

    .post-header        { margin-bottom: 80px; }

    .post-meta          { margin-top: 10px; padding-top: 16px; font-size: 1rem; color: #999}

    .post-comments      { float: right; }
    .post-comments .fa  { position: relative; top: -1px; margin-right: 6px }
    .post-meta a        { color: var(--rosso); text-decoration: none }

    .post-categories a { font-size: 14px; text-decoration: none; color: var(--rosso); text-transform: uppercase; font-weight: 600;}







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

    @media all and (max-width: 986px) {
        
        html, body      { overflow-x: hidden; }
        body            { position: relative; }
        
        #hero           { padding: 20px;}

        #menu-icon      { display:block; }
        .grid           { padding: 10px; }

        #claim          { width: 80vw; position: absolute; top: 40%; left: 40px; }
        #claim h2       { font-size: 1.8em; text-align: center; }
        
        #call           { left: 10px;  bottom: 120px; }
        
        .btn-default, .btn-light    { padding: 10px 40px 10px 10px; font-size: 13px; }
        .btn-light                  { margin-right: 10px; }
        
        #testatina a            { font-size: 13px; }
        #testatina .text-end    { display: none;}
        
        #services               { padding: 40px 25px; }  
        
        .button_container { top: 90px; right: 30px; }
        
        section.banner         { padding:15px; }
        section#italia         { padding:20px; }
        section.form           { padding:20px; }
        
        .dati p i          { display: block; margin-bottom: 20px; }
        
        .form-content       { border-radius: 20px !important; }
        
        .menumain          { width:90vw; margin: 30px 0 0 20px; }
        
        ul.nav li a         { font-size: 18px; } 
        ul.sub-menu li      { padding: 3px 0; }
        ul.sub-menu li a    { font-size: 15px; }
        
        .contatto     { padding: 20px; }
        .contatto a   { margin-bottom: 40px; }
        .contatto h3   { font-size: 28px;}
        
        .title h2           { font-size: 2.1em;  }
        
        section.title       {  left: 20px;  }



    }

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


    @media all and (min-width: 986px) {
        
        .site-title             { background-size: cover; width: 380px; height: 100px;  }   
        .site-title a           { display: block; width: 380px; height: 100px; }
        
        .home #hero             { height: 100vh; min-height: 900px; padding: 40px; }
         #claim                 { width: 40vw; position: absolute; top: 50%; left: 40px; }


        
        #testatina      { margin-bottom: 40px;}

        #claim          { bottom: 100px; width: 25vw; }
        #claim h2       { font-size: 2.4em; }

        #call           { left: 40px;  bottom: 80px; }
        
        #services       { padding: 80px 100px; } 
        
        .banner         { min-height: 500px; }
        
        .dati p            { display: flex; align-items: flex-start; gap: 8px; margin: 10px 0;} 
        .dati p i          { margin-top: 2px;margin-right: 20px; }
        
        .singolo h2, .pagina h2 { font-size: 50px; font-weight: 800; line-height: 120%; margin-bottom: 50px;}
        
        .menumain          { width:50vw; margin: 10vh 0 0 40px; }
        
        .title h2           { font-size: 3.8em;  }
        
        section.title       {  left: 40px;  }


    }



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

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

        footer                  { text-align: center; }
        footer p                { text-align: center; }
        
        .navbar-light .navbar-nav .nav-link     { color:var(--maincolor); }
        

        .claim                  { width: 80vw; position: absolute; top:80px; left: 40px;  }
        
        .banner                 {  }
        .banner h3              { font-size: 21px; line-height: 28px; margin-bottom: 40px;  }
        

       
        .scelta                 { text-align: center; }
        .scelta .icona          { margin: 20px 0; }
        
        .singolo, .preventivo   { padding: 80px 20px 20px 20px !important;}
        .title                  { line-height:20px; padding: 0 20px;}
        
        #crumbs                 { margin-bottom: 20px; }
        
        #contatti               { font-size: 16px; }
        #contatti .row > div    { margin: 5px 0; }
        .servizi > div          { margin: 5px 0; }
        
        #address   { display: none; }
        
        .pagina             { padding: 40px 20px; }
        .azienda     { padding: 40px 20px; }
        
        
        #credits            { text-align: center; }
        #credits small      { display: block; padding: 50px 0 20px 0; }
        #credits img        { width: 240px; height: auto; margin-bottom: 40px; }


      }

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

    @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: 1279px) {
         
        .site-title             { background-size: cover; width: 380px; height: 100px;  }   
        .site-title a           { display: block; width: 380px; height: 100px; }
        
        .home #hero             { height: 100vh; min-height: 900px; padding: 40px; }
         #claim                 { width: 60vw; position: absolute; top: 50%; left: 40px; }

    }



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

        #main-menu              { margin-left: 40px;}   
        
        .nav-link                   { padding:20px 40px 20px 0 !important; }
        .dropdown-menu .nav-link    { padding:12px 0 12px 0 !important; font-size: 12px; }

        #banner-centro          { background-size: 100% auto; padding: 0; }
        #banner-centro          { height: 650px; }
        #banner-centro h2       { font-size: 45px; max-width: 30vw; margin-bottom: 40px; }
        
        .banner                 { height:calc( 100vh - 130px ); min-height: 500px;   }
        #claim                  { width: 40vw; position: absolute; top: 50%; left: 40px; }
        .banner h2              { font-size: clamp(1.1em, 4vw, 1.8em); line-height: 110%; text-shadow: 1px 1px 4px #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;}
        
        #crumbs                 { }


    }  


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