/**
 * This file should get overwritten if Method 1 is used. If Method 2 is chosen,
 * remove this comment and start adding your styles to this file.
 */

/* CSS Document */
@charset "utf-8";

:root {

}

/*FANCYBOX*/
.fancybox-media-wrap .fancybox-skin { 
    /* background-color: var(--cViola);  */
    background-color: transparent; 
    box-shadow: none!important; 
}
.fancybox-title { text-align: center; }


/* HEADER MAIN */
.header-main .row-header-main { min-height: 30em; } 

.header-main .wrapper-visual .wrapper-video {
    position: absolute;
    top: 0;
    right: -5em;
    right: -10em;
    /* right: -10vw; */
    width: auto;
    padding: 0;
    min-width: 60em;
    /* max-width: 25em; */

    right: -25em;
    min-width: 80em;
}

/* MENU ANCORE */
.mancore { background-color: var(--cLWhite); }

.mancore .wrapper-mancore { }

.mancore .wrapper-mancore a { 
    padding: 2em 0px;
    display: block;
    color: var(--cGray); 
}

.mancore .wrapper-mancore a.active,
.mancore .wrapper-mancore a:hover,
/* .mancore .wrapper-mancore a:focus, */
.mancore .wrapper-mancore a:active { 
    background-color: var(--cViola);
    color: var(--cWhite); 
}






/* TECNOLOGIA */
.tech { background-color: var(--cWhite); }
.tech .wideCustom { min-height: 20em; overflow: hidden; }
.tech .row-fullR .wrapper { 
    padding: 0em 15px 2em 15px; 
    /* padding-left: 0;  */
}
.tech .box-visual .wideCustom {
    background: transparent url("../images/tech_visual.png") scroll no-repeat right center;  
    background-size: cover; 
    min-height: 33em;
}

.tech .box-content.boxL { padding: 2em 2em 2em 2em; }

.tech .box-content.boxL .wrapper-logo { text-align: right; }

.tech .grid-tendina .box-header.active .btn-secondary {
    background-color: var(--cWhite) !important; 
    border-color: var(--cWhite) !important; 
    color: var(--cDViola) !important;
}

.tech .wrapper-collapse .box-close { text-align: right; display: none; }
.tech .wrapper-collapse .btn-close { cursor: pointer; }

.tech .grid-tendina .btn-actions {
    padding: 0.5em 0;
    text-align: right;
    cursor: pointer; 
}

/* VANTAGGI */
.vantaggi .grid-tendina .box-tendina { margin-bottom: 0.5em; }
.vantaggi .grid-tendina .box-header { background-color: var(--cLWhite); }
.vantaggi .grid-tendina .box-header.active,
.vantaggi .grid-tendina .box-header:hover { cursor: pointer; background-color: var(--cViola); }


.vantaggi .grid-tendina .box-header .caption,
.vantaggi .grid-tendina .box-header .icona { }

.vantaggi .grid-tendina .box-header .caption { margin: auto auto auto 1em; }
.vantaggi .grid-tendina .box-header .icona { margin: auto 0.5em auto 0.5em; }

.vantaggi .grid-tendina .box-header .caption p,
.vantaggi .grid-tendina .box-header .icona p { margin: 0; }

.vantaggi .grid-tendina .box-header .icona { position: relative; color: var(--cLGray); }
.vantaggi .grid-tendina .box-header.active .icona,
.vantaggi .grid-tendina .box-header:hover .icona { }

.vantaggi .grid-tendina .box-header .icona .icon { font-size: 2em; }


.vantaggi .grid-tendina .box-header.active .caption p,
.vantaggi .grid-tendina .box-header:hover .caption p,
.vantaggi .grid-tendina .box-header.active .icona,
.vantaggi .grid-tendina .box-header:hover .icona { color: var(--cWhite); }

.vantaggi .grid-tendina .box-body {
    position: relative;
    padding-top: 1em;
}

.vantaggi .grid-tendina .box-body .caption { }


/* BENEFICI */
.benefici .layout-corale {
    background: transparent url("../images/benefici_corale.jpg") scroll no-repeat center bottom;  
    background-color: var(--cViola);
    background-size: cover; 
    min-height: 20em;
}


.benefici .grid-tendina .box-tendina { margin-bottom: 1em; }
.benefici .grid-tendina .box-header { background-color: var(--cWhite); }
.benefici .grid-tendina .box-header.active,
.benefici .grid-tendina .box-header:hover { cursor: pointer; background-color: var(--cWhite); }


.benefici .grid-tendina .box-header .caption,
.benefici .grid-tendina .box-header .icona { }

.benefici .grid-tendina .box-header .caption { margin: auto auto auto 0em; }
.benefici .grid-tendina .box-header .icona { margin: auto 0.5em auto 0.5em; }

.benefici .grid-tendina .box-header .caption p,
.benefici .grid-tendina .box-header .icona p { margin: 0; }

.benefici .grid-tendina .box-header .icona { position: relative; color: var(--cLGray); }
.benefici .grid-tendina .box-header.active .icona,
.benefici .grid-tendina .box-header:hover .icona { }

.benefici .grid-tendina .box-header .icona .icon { font-size: 2em; }


.benefici .grid-tendina .box-header.active .caption p,
.benefici .grid-tendina .box-header:hover .caption p,
.benefici .grid-tendina .box-header.active .icona,
.benefici .grid-tendina .box-header:hover .icona { color: var(--cViola); }

.benefici .grid-tendina .box-body {
    position: relative;
    padding-top: 1em;
}

.benefici .grid-tendina .box-body .caption { margin: auto auto auto 0; }
.benefici .grid-tendina .box-body .icona {  margin: auto 0em auto 0.5em; }

.benefici .grid-tendina .box-body .btn-close { cursor: pointer; }

.benefici .box-content-popup {
    position: relative;
    /* position: absolute; */
    /* top: 0; */
    /* left: 0; */
    z-index: 99;
    width: 100%;
    background-color: var(--cWhite);
    /* overflow: visible;  */
    /* min-height: auto;   */
}

/* COMPONENTI */
.compo .wrapper-box .box-head { 
    padding: 1em 1em; 
    margin-bottom: 1em; 
    height: 6em; 
}

/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/

.img-responsive { display: inline-block; }


    /*==========  Mobile First Method  ==========*/

    /* Custom, iPhone Retina */ 
    @media only screen and (min-width : 300px) {

        body { font-size: 16px; }

    }

    /* Extra Small Devices, Phones */ 
    @media only screen and (min-width : 480px) {

        body { font-size: 16px; }
    }

    /* Small Devices, Tablets */
    @media only screen and (min-width : 768px) {

        body { font-size: 16px; }

        /* BENEFICI */
        .benefici .box-content-popup { width: 710px; }
        .benefici .box-content-popup { 
            position: absolute;
            top: 0;
            left: 0;
            left: 15px;
            overflow: visible; 
            min-height: auto;    
            height: 100%;
        }

        /* .benefici .grid-tendina .box-content-popup:nth-child(odd)  { left: unset; } */
        /* .benefici .grid-tendina .box-content-popup:nth-child(even)  { left: -98%; } */
        /* .benefici .grid-tendina .box-header .caption { max-width: 16em; } */

        .benefici .grid-tendina .box-body {
            padding: 1.5em 1.5em;
            padding: 1.5em 15px;
            border: 0px solid var(--cLGray);
        }



    }

    /* Medium Devices, Desktops */
    @media only screen and (min-width : 992px) {

        body { font-size: 18px; }

        /* VANTAGGI */
        /* .vantaggi .grid-tendina .box-header .caption { max-width: 22em; } */

        /* BENEFICI */
        .benefici .box-content-popup { width: 940px; }

        .benefici .grid-tendina .box-header .caption { margin-top: 0.5em; max-width: 20em; }
        .benefici .grid-tendina .box-header .icona { margin-top: 0; }

    }

    /* Large Devices, Wide Screens */
    @media only screen and (min-width : 1200px) {

        body { font-size: 20px; }

        /* HEADER MAIN */
        .header-main .wrapper-visual .wrapper-video { min-width: 80em; right: -35vw; right: -20em; }

        /* BENEFICI */
        .benefici .box-content-popup { width: 1140px; }

    }

    /* Large Devices, Wide Screens */
    @media only screen and (min-width : 1440px) {

        /* HEADER MAIN */
        .header-main .wrapper-visual .wrapper-video { 
            /* min-width: 90em;  */
            right: -10em;
        }

    }





    /*==========  Non-Mobile First Method  ==========*/

    @media only screen and (max-width : 1440px) {

        /* HEADER MAIN */
        .header-main .wrapper-visual .wrapper-video {  }

    }


    /* Large Devices, Wide Screens LG */
    @media only screen and (max-width : 1200px) {


    }

    /* Medium Devices, Laptop MD*/
    @media (min-width: 992px) and (max-width: 1199px) { 


        /* VANTAGGI */
        .vantaggi .grid-tendina .box-header .caption { max-width: 22em; }

        /* BENEFICI */
        .benefici .grid-tendina .box-header .caption { max-width: 20em; }


    }

    /* Medium Devices, Desktops MD*/
    @media only screen and (max-width : 991px) {

        /* VANTAGGI */
        .vantaggi .grid-tendina .box-header .caption { 
            margin: 0.3em auto 0.3em 1em;            
            max-width: 15em; 
        }

        /* BENEFICI */
        .benefici .grid-tendina .box-header .caption { max-width: 17em; }

    }

    /* Portrait tablets and small desktops */
    @media (min-width: 768px) and (max-width: 991px) {

        /* HEADER MAIN */
        .header-main .wrapper-visual .wrapper-video { 
            /* right: -40vw;  */
            /* right: -15em;  */
        }

        /* MENU ANCORE */
        .mancore .wrapper-mancore p { font-size: 0.9em;  }


    }

    /* Small Devices, Tablets SM*/
    @media only screen and (max-width : 767px) {


        /* HEADER MAIN */
        .header-main .wrapper-visual .wrapper-video {
            position: relative;
            top: 0;
            right: unset;
            width: 100%;
            padding: 0;
            min-width: 100%;
            left: 0;
        }

        .header-main .wrapper-visual .wrapper-video.mask {
            -webkit-mask-image: none;
            mask-image: none;
        }

        /* MENU ANCORE */
        .mancore { padding: 1em 0; padding: 0em 0; }
        
        .mancore .wrapper-mancore { padding: 0; }
        .mancore .wrapper-mancore a { padding: 0.8em 0px; padding: 1em 0px;  }


        /* TECNOLOGIA */
        .tech .box-visual .wideCustom {
            background-image: none;
            min-height: auto;
        }
        
        .tech .box-content { padding: 0;  }
        .tech .box-content.boxL { padding: 0; padding-bottom: 3em; }

        .tech .grid-tendina .btn-actions { text-align: center; }

        /* VANTAGGI */
        .vantaggi { padding-top: 1em; }


        /* BENEFICI */
        .benefici .layout-corale { min-height: auto; }
        
        .benefici .grid-tendina .box-tendina { 
            border-bottom: 1px solid var(--cLGray);
            padding-bottom: 1em; }
        
        .benefici .grid-tendina .box-body .box-title { display: none; }

        /* COMPONENTI */
        .compo .wrapper-box .box-head { padding: 2em 15px; margin-bottom: 2em; height: auto; }
        .compo .wrapper-box { padding: 0; }


    }

    /* Mobile Large, Extra Small Devices, Phones XS*/ 
    @media only screen and (max-width : 480px) {

    }

    /* Mobile Medium, iPhone Retina */ 
    @media only screen and (max-width : 375px) {


    }

    /* Mobile Small, Custom iPhone Retina */ 
    @media only screen and (max-width : 320px) {

        /* VANTAGGI */
        .vantaggi .grid-tendina .box-header .caption { max-width: 10em; }

        /* BENEFICI */
        .benefici .grid-tendina .box-header .caption {  max-width: 13em; }


    }

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */
@media (min-width: @screen-sm-min) {  }

/* Medium devices (desktops, 992px and up) */
@media (min-width: @screen-md-min) {  }

/* Large devices (large desktops, 1200px and up) */
@media (min-width: @screen-lg-min) {  }


@media (max-width: @screen-xs-max) {  }
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {  }
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {  }
@media (min-width: @screen-lg-min) {  }

    /*==========  CROSS BROWSER  ==========*/

/*HOOK EXPLORER11*/
@media all and (-ms-high-contrast:none) { 

}


