@import url('stile_businessUnit.css?version=3');



/* variabili */
:root {
    /*** COLLEZIONI ***/
    /* Inspired by Elite */
    --al-oliva-mediterraneo: #B6B584;
    --al-karite: #B4C9DC;
    --al-argan-source: #DBB6AD;
    --al-tea-matcha: #9DD3A6;
    --al-acqua-colonia: #4E5054;
    --al-oro: #DB9D61;
    --al-bio-hemp: #7C9113;
    --al-samboost: #7E7790;
    --al-montania: #bc9061;
    /* Fresh Vibes */
    --al-aloesir: #B4C5B5;
    --al-energy: #27402D;
    --al-havana: #CEAAD6;
    --al-one-for-you: #E3AB13;
    --al-natural-mix: #AC4048;
    --al-bamboo: #F8A1A1;
    --al-toji: #93C9BF;
    /* Shade of Green */
    --al-b-natural: #5E6C44;
    --al-natural-lab: #5B4514;
    --al-amoenia:  #D8BE9B;
    --al-find-your-eco:#CEC7C0 ;
    /* Kids */
    --al-cocci-nella: #E781A9;
    /* Safe Emotions */
    --al-hygiene-care: #909CB5;
    /*** BRAND CREATIONS ***/
    --al-dr-vranjes: #816E5C;
    --al-hemp-care: #621C1F;
    --al-baija-paris: #C8A735;
    --al-skinius: #74A4A9;
    --al-pikenz: #B9B7A6;
    --al-profumeria-inglese: #576DB1;
}


/* CLASSI COLORI */

.color-al-al-oliva-mediterraneo {
    color: var(--al-oliva-mediterraneo) !important;
}


.color-al-al-montania {
    background: var(--al-montania)!important;
}


/* CLASSI BACKGROUND */

/* Inspired by Elite */
.al-bg-al-montania {
    background: var(--al-montania)!important;
}

.al-bg-al-oliva-mediterraneo {
    background: var(--al-oliva-mediterraneo)!important;
}
.al-bg-al-karite {
    background: var(--al-karite) !important;
}
.al-bg-al-argan-source {
    background: var(--al-argan-source) !important;
}
.al-bg-al-tea-matcha {
    background: var(--al-tea-matcha) !important;
}
.al-bg-al-acqua-colonia {
    background: var(--al-acqua-colonia) !important;
}
.al-bg-al-oro {
    background: var(--al-oro) !important;
}
.al-bg-al-bio-hemp {
    background: var(--al-bio-hemp) !important;
}
.al-bg-al-samboost {
    background: var(--al-samboost) !important;
}
/* Fresh Vibes */
.al-bg-al-aloesir {
    background: var(--al-aloesir) !important;
}
.al-bg-al-energy {
    background: var(--al-energy) !important;
}
.al-bg-al-havana {
    background: var(--al-havana) !important;
}
.al-bg-al-one-for-you {
    background: var(--al-one-for-you) !important;
}
.al-bg-al-natural-mix {
    background: var(--al-natural-mix) !important;
}
.al-bg-al-bamboo {
    background: var(--al-bamboo) !important;
}
.al-bg-al-toji {
    background: var(--al-toji) !important;
}
/* Shade of Green */
.al-bg-al-b-natural {
    background: var(--al-b-natural) !important;
}
.al-bg-al-natural-lab {
    background: var(--al-natural-lab) !important;
}
/* Kids */
.al-bg-al-cocci-nella {
    background: var(--al-cocci-nella) !important;
}
/* Safe Emotion */
.al-bg-al-hygiene-care {
    background: var(--al-hygiene-care) !important;
}
/* Amoenia */
.al-bg-al-amoenia {
    background: var(--al-amoenia) !important;
}
/* Find your Eco */
.al-bg-al-find-your-eco {
    background: var(--al-find-your-eco) !important;
}


/*** BRAND CREATIONS ***/
.al-bg-al-dr-vranjes {
    background: var(--al-dr-vranjes) !important;
}
.al-bg-al-hemp-care {
    background: var(--al-hemp-care) !important;
}
.al-bg-al-baija-paris {
    background: var(--al-baija-paris) !important;
}
.al-bg-al-skinius {
    background: var(--al-skinius) !important;
}
.al-bg-al-pikenz {
    background: var(--al-pikenz) !important;
}
.al-bg-al-profumeria-inglese {
    background: var(--al-profumeria-inglese) !important;
}


/* dettaglio articolo */
.al-dettaglio-articolo {
    margin-top: 12rem;
    margin-bottom: 5rem;
}
/* CALL TO ACTION */
.al-cta--4 {
    color: var(--al-cosm-40);
}
.al-cta--4:hover {
   background-color: var(--al-cosm-40);
}

.al-cta--white {
    color:var(--al-cosm-40)!important
}
    .al-cta--white:hover {
        background: var(--al-cosm-10) !important;
        color: var(--al-cosm-60) !important;
        border-color: #fff !important;
    }

.nav-hamburger span {
    background-color: var(--al-cosm-40);
}


.al-nav-offcanvas li:hover {
    background-color: var(--al-cosm-30);
}

.al-nav-offcanvas ul li li:hover {
    background-color: var(--al-cosm-20);
}
.al-nav-offcanvas ul li li li a {
    border-radius:var(--al-border-radius);
    width:100%
}

.al-nav-offcanvas ul li li li a:hover {
    background-color: var(--al-bg-1);
}
.al-nav-offcanvas ul li li .li-h {
    color: var(--al-cosm-60);
}



.al-offcanvas-footer a {
    color: var(--al-cosm-10);
}


.al-carousel-caption {
    background-color: var(--al-cosm-30);
}

.al-headSection {
    background-color: var(--al-cosm-bg-1);
    width: 100%;
    top: 0;
    text-align: left;
    padding-top: 5rem;
    position: absolute;
    z-index: 1;
}

.al-headSection-container {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .al-headSection-container h1 {
        font-size: var(--al-fs-3);
        margin-left: 2rem !important;
    }

        .al-headSection-container h1 span {
            display: inline;
            font-size: var(--al-fs-1);
            font-weight: 500;
        }


    .al-headSection-container .al-subNav .nav-link {
        color: var(--al-gray-20);
        padding: 0.5rem 1rem;
        position: relative;
        font-weight: 400;
        text-transform: uppercase;
        border-bottom:1px solid rgba(255,255,255,0);
        font-size:var(--al-fs-5);
    }
        .al-headSection-container .al-subNav .nav-link:hover {
        
        }



        .footer {
            background-color: var(--al-cosm-30);
        }


.offcanvas.offcanvas-end {
    background-color: var(--al-cosm-bg-1);
}


.al-box-multiply-bg::after {
    /* background-color: #1F5F73;*/
    background-color: var(--al-cosm-60);
}


.list-group-item {
    border-color: var(--al-cosm-40);
}

.list-group-s1.list-group-flush>.list-group-item:last-child {
    border-bottom-width: thin;
}

.form-check-input:checked {
    background-color: var(--al-cosm-40);
    border-color: var(--al-cosm-40);
}

.al-form .form-control {
    background-color: var(--al-gray-10);
    color: var(--al-gray-60);
}

/*  PIRAMIDE OLFATTIVA  */
.div-piramide-olfattiva {
    color: var(--al-cosm-40);   
    font-weight: 500;
}


/* al-nav-pills */
.al-nav-pills {

}

    .al-nav-pills .nav-item {
        margin: 0.5em ;
    }

    .al-nav-pills .nav-link {
        border: 1px solid var(--al-cosm-30);
        color: var(--al-cosm-30);
    }

        .al-nav-pills .nav-link:hover {
            background-color: var(--al-cosm-30);
            color: var(--al-gray-10);
        }

        .al-nav-pills .nav-link.active, .al-nav-pills .show > .nav-link {
            color: var(--al-gray-10);
            background-color: var(--al-cosm-40);
        }

.al-nav-pills--2 .nav-link {
    border: 1px solid var(--al-cosm-70);
    color: var(--al-cosm-70);
}

.al-nav-pills--2 .nav-link:hover {
    text-decoration: none;
    background-color: var(--al-cosm-40);
}

.al-nav-pills--2 .nav-link.active, .al-nav-pills--2 .show > .nav-link {
    color: var(--al-gray-10);
    background-color: var(--al-cosm-70);
}

.al-section-cosmetic-slider-prodotti .card{
    text-align:left;
    background-color:transparent
}

.al-section-cosmetic-slider-prodotti .al-nav-pills {
    margin:2rem 0;

}
.splide .splide__arrow svg {
    fill: var(--al-cosm-40);
}

.al-slider-prodotti2--b li:nth-child(even) {
    padding-top:5rem
}

.al-catalogo .card-img-top {
  border: 1px solid var(--al-cosm-40);
}

.al-catalogo .card .card-body {
    text-align: center;
    margin-top: 1rem;
}


.header-al-slider--2 {
    justify-content: end;
    padding: 0;
    margin-bottom: 4rem;
    position: absolute;
    top: -5.5rem;
    right: 0;
}

.splide__arrows {
   /* display:none*/
}

.al-accordion .accordion-button:not(.collapsed) {
    color: var(--al-cosm-50);

}

/********************************************************************************************

RESPONSIVE: UP VALUES 

*********************************************************************************************/
/******************* MD (tablets, 768px and up) */
@media (min-width: 768px) {
    .al-headSection-container {
        /*  padding-left: 4.6rem;*/
    }
        .al-headSection-container h1 {
            font-size: var(--al-fs-1);
            margin-left: 4.4rem !important;
        }
    .splide__arrows {
        display: block
    }
    .al-section-cosmetic-slider-prodotti .al-nav-pills {
        margin: 0rem;
    }

    .al-nav-pills .nav-item {
        margin: 0rem 0.5rem 2.5em;
    }

    }
    /******************* XXL (extra large desktops, 1400px and up) */
    @media (min-width: 1400px) {
        .al-headSection-container .al-subNav .navbar-nav {
                    display: flex;
        }

        .al-headSection-container h1 span {
            display: none;
        }
        .al-nav-pills .nav-item {
            margin: 2rem;
        }
        .al-nav-pills--2 .nav-item {
            margin: 0 1rem 2.2rem;
        }
    }



/********************************************************************************************
	
	RESPONSIVE: DOWN VALUES  

*********************************************************************************************/

/******************* XL (desktops, less than 1399px) */
@media (max-width: 1399px) {
    .boxes-scroll-1 .box svg, .boxes-scroll-2 .box svg { 
        width:260px;
    }
}

/******************* LG  (desktops, less than 1200px) */
@media (max-width: 1199px) {
        .boxes-scroll-1 .box svg, .boxes-scroll-2 .box svg { 
        width:230px;
    }
}

/******************* MD (tablets, less than 992px) */
@media (max-width: 991px) {
}

/******************* SM (landscape phones, less than 768px) */
@media (max-width: 767px) {

   .boxes-scroll-1 .box svg, .boxes-scroll-2 .box svg { 
width:200px;
}
}

/******************* XS (portrait phones, less than 576px) */
@media (max-width: 575px) {
        .boxes-scroll-1 .box svg, .boxes-scroll-2 .box svg { 
        width:170px;
    }
}

/******************* XXS (portrait phones, less than 461px) */
@media (max-width: 460px) {
}