
body{
    font-family: 'Museo Sans Rounded', sans-serif;
}
/****** NOU MENU DESPLEGABLE 25 ******/

#caixa_menu_blau {
    display: none;
}

.hideElement{
    display: none;
}

.showElement {
    display: block !important;
}
#caixa_menu_blau.mostrat {
/*        transition: left .3s ease-in-out;*/
/*        transition-delay: 0s !important;*/
    transition: left .3s;
    left: -900px;
    display: block !important;
}
@media (max-width: 990px) {
    #caixa_menu_blau.mostrat {
/*        transition: left .3s ease-in-out;*/
/*        transition-delay: 0s !important;*/
        transition: left .3s;
        left: -900px;
        display: block !important;
    }


    #caixa_menu_blau.show_menu {
        display: flex !important;
        left: 0 !important;
    }
    .div_imatge_categoria img {
        width: 75px;
        height: 49px;
    }


}


@media (max-width: 600px) {
    #caixa_menu_blau {
        display: block;
        background-color: white;/*#263a81;*/
        /*width: 64%;*/
        position: fixed;
        top: 0px;
        /*        left: 0px;*/
        left: -900px;
        /*height: 100%;*/
        bottom: 0;
        overflow-y:auto;
        overflow-x: hidden;
        z-index: 102;
        /*min-width: 55%;*/
        width: 100%;
        transition: left 0.3s;
    }
    
    .menu_2 {
        padding: 5px 0px !important;
    }

    #fons_modal {
        background-color: black;
        bottom: 0;
        display: none;
        height: 120%;
        left: 0;
        opacity: 0.5;
        position: fixed;
        right: 0;
        top: 0;
        width: 150%;
        z-index: 10;
    }

    #tanca_menu {
        cursor: pointer;
        float: left;
        height: 23px;
        padding: 7px 0 10px 0px;
        position: absolute;
        left: 10px;
        top: 11px;
        width: 23px;
    }

    #tanca_menu:active {
        background-color: activecaption;
    }

    #div_tanca_menu {
        display: inline-block;
    }

    #div_idiomes_list_menu {
        display: inline-block;
        height: 50px;
        float: right;
        text-align: right;
        height: 50px;
    }

    #div_idiomes_list_menu a {
        position: relative;
        top: 6px;
        padding: 10px;
        height: 40px;
    }

    .sel_idiomes_list_item_menu {
        display: inline-block;
        width: 40px;
        padding: 7px 0;
        text-align: center;
        border: 1px solid #666;
        border-radius: 25px;
    }

    .menu_idioma {
        left: 0 !important;
    }

    .sel_idiomes_list_item_menu .idioma_actiu {
        display: inline-block;
    }

    .idioma_actual .sel_idiomes_list_item_menu{
        color: #005898 !important;
        border: 1px solid #005898;
        border-radius: 25px;
        width: 40px;
    }
}

.flexsearch--wrapper {
    height: auto;
    width: auto;
    max-width: 100%;
    overflow: hidden;
    background: transparent;
    margin: 0;
   /* position: relative;
    top: 5px;
    position: relative;
    left: 5%;*/
}

/*@media (min-width: 900px) and (max-width: 1100px){
    .flexsearch--wrapper {
        width: 85%;
    }
}*/

.flexsearch--form {
    overflow: hidden;
    position: relative;
}

.flexsearch--input-wrapper {
    padding: 0 66px 0 0; /* Right padding for submit button width */
    overflow: hidden;
}

.flexsearch--input {
    width: 95%;
}

.flexsearch {
    /*display: inline-block;
    position: relative;*/
}

.flexsearch--input {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 25px;
    padding: 5px 45px 5px 12px;
    border: 1px solid #878686;
    border-radius: 35px; /* (height/2) + border-width */
    margin: 5px 10px 0 10px;
    color: #333;
    font-size: 16px;
    -webkit-appearance: none;
    -moz-appearance: none;
    bottom: 2px;
    position: relative;
    box-shadow: none;
}

.flexsearch--submit {
    pointer-events:none;
    cursor:default;
    position: absolute;
    right: 25px;
    top: 12px;
    display: block;
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    background: transparent;
    color: #888;
    font-size: 40px;
    line-height: 60px;
    background: url(/templates/camaloon/img/icones/lupa.png)center top no-repeat;
    background-size: 50% 50%;
}

.flexsearch--input:focus {
    outline: none;
}

.flexsearch--input:focus.flexsearch--submit {
    color: #333; 
}

.flexsearch--input::-webkit-input-placeholder {
    color: #767677;
}

.flexsearch--input::-moz-placeholder {
    color: #767677;
}

.flexsearch--input::placeholder {
    color: #767677;
}

.flexsearch--submit:hover {
    opacity: 0.9;
    cursor: pointer;
}

::-webkit-input-placeholder {
    color: #888;  
}

input:-moz-placeholder {
    color: #888
}


@media (min-width: 600px) and (max-width: 990px) {
    #caixa_menu_blau {
        display: none;
        background-color: white;/*#263a81;*/
        width: 300px;
        position: absolute;
        top: 0;
        
        height: auto;
        overflow-y:auto;
        left:-900px;
        transition:left 0.3s;
        z-index: 102;
        /*width: 100%;*/
    }

    .menu_2 {
        padding: 0px !important;
    }
    .menu_2 {
        padding: 5px 0px !important;
    }
    .menu_home {
        height: 50px;
        background: #e2e2e2 !important;
    }
    #div_tanca_menu {
        display: inline-block;
    }
    #tanca_menu {
        cursor: pointer;
        float: left;
        height: 23px;
        padding: 7px 0 10px 0px;
        position: absolute;
        left: 10px;
        top: 11px;
        width: 23px;
    }
    #fons_modal {
        background-color: black;
        bottom: 0;
        display: none;
        height: 120%;
        left: 0;
        opacity: 0.15;
        position: fixed;
        right: 0;
        top: 62px;
        width: 150%;
        z-index: 10;
    }

    #tanca_menu {
/*        display: none; */
    }

    .menu_amagat {
        left: 0px !important;
    }

    .menu_home {
/*        display: none;*/
    }
    #div_idiomes_list_menu {
        display: inline-block;
        height: 50px;
        float: right;
        text-align: right;
        height: 50px;
    }
    #div_idiomes_list_menu a {
        position: relative;
        top: 6px;
        padding: 10px;
        height: 40px;
    }
    .idioma_actual .sel_idiomes_list_item_menu {
        color: #005898 !important;
        border: 1px solid #005898;
        border-radius: 25px;
        width: 40px;
    }
    .sel_idiomes_list_item_menu {
        display: inline-block;
        width: 40px;
        padding: 7px 0;
        text-align: center;
        border: 1px solid #666;
        border-radius: 25px;
    }
    .menu_home {
        height: 50px;
        background: #e2e2e2 !important;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }
}



@media (min-width: 990px) {
    
}


#llista_menu_blau li:last-child {
    color: white;
}

/*#caixa_menu_blau *{
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}*/

.menu_contacte {
    /*position: absolute;*/
    bottom: 0px;
    width: 100%;
    background-color: #e2e2e2;
}

#llista_menu_blau {
    margin-bottom: 0px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    margin-top: 0px !important;
    width:100%;
    border-radius: 10px;
}

@media (max-width: 600px) {
    #llista_menu_blau {
        padding-right: 0px !important;
    }
}

@media (max-width: 270px) {
    #llista_menu_blau li {
        font-size: 13px !important;
    }
}

#llista_menu_blau li {
    list-style: none;
    text-align: left;
    font-size: 18px;
    background: #fffffe;
    border: 0 !important;
    /*padding: 8px 0px 0px 0px;*/
}
.container_header_section_menu{
    display: flex;
    align-items: center;
    padding: 7px 10px 7px 14px;
}

.container_image_text_menu{
    display: flex;
    align-items: center;
    width: 100%;
}
.menu_comprimit .cointainer_title_category{
    width: 100%;

    padding: 5px;
}

.familia_menu {
    color: white;
    /*margin-bottom: 5px;*/
}

.familia_menu > ul {
    padding-left: 0px;
    margin-bottom: 20px;
}


.familia_menu > ul li:last-child{
    margin-bottom: 0px;
}
#instashop_menu{
    color: white !important;
    text-decoration: none !important;
}

#instashop_menu:active{
    color: white;
    text-decoration: none !important;
}

.menu_2 a {
    color: #9a9a9a;
    text-decoration: none !important;
    margin-bottom: 5px;
}

.menu_2 {
    background-color: white !important;
    border-top: 1px solid #ededed !important;
}

.menu_2 a {
    position: relative !important;
    left: 50px;
    text-decoration: none;
    color: #243B78;
    font-size: 18px;
}

.menu_2 a:hover {
    color: #66666;
    font-weight: 600;
}

.menu_contacte ul {
    text-align: left; 
    margin-top: 0px;
    padding-bottom: 20px;

    border-style:solid;
    border-color: #9a9a9a;
    border-width: 0px 0px 0px 0px;
    padding-top:0.5px;

    padding: 0px 0px 0px 0px;
    margin-left: 10px;
    margin-right: 10px;
}

.menu_contacte ul li{
    list-style: none;
    text-align: left;
    font-size: 18px;
    border-top: 1px solid white;
    padding: 14px 0px;
    cursor: pointer;
}

.menu_contacte ul li:first-child {
    border-top: 0px solid white;
}

.llista_contacte {
    margin-bottom: 0px;
}
.menu_contacte a {
    color: #243b78 !important;
    margin-bottom: 5px;
    text-decoration: none !important;
}
.menu_contacte a:hover, .menu_contacte ul li:hover a {
    color: #243b78 !important;  
}


/*.familia_menu:hover .fletxa_menu_dreta {
    width: 10px;
    background: url(/templates/stikets/img/fletxes/fletxa_menu_prima.png);
    height: 15px;
    background-repeat: no-repeat;
    margin: 10px;
    cursor: pointer;
}*/

.menu_comprimit {
    cursor: pointer;
}

.menu_amagat {
    /*display: none;*/
    color: #686868 !important;
    /*padding: 15px 20px !important;
    width: 90% !important;
    left: 20px !important;*/
}

.submenu {
    display: none;
    margin-bottom: 0px !important;
    background-image: none;
    font-size: 0;
    padding: 0;
}

.submenu a {
    text-decoration: none;
}

.submenu li:hover {
    font-weight: 600;
}

.submenu li:active, .familia_menu:active {
    background-color: white !important;
}

/** PROVA SCROLL **/

#caixa_menu_blau::-webkit-scrollbar {
    width: 10px;
}

#caixa_menu_blau::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
    background-color: rgba(255,255,255, 0.2);
}

#caixa_menu_blau::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}


#menu_icon_home {
    width: 15px;  
}

.menu_home {
    /*margin-bottom: 5px;*/
    height: 50px;
    display: flex;
    justify-content: right;
    align-items: center;
    background: #e2e2e2 !important;
}

.menu_home a {
    position: relative;
    bottom: 1px;
    font-weight: bold;
    color: #666;
}

.menu_home a:hover {
    text-decoration: underline !important;
}

.fletxa_menu_esquerra {
    width: 10px;
    transform: rotateY(180deg);
    display: none;
    background: url(/templates/camaloon/img/fletxes/fletxa_menu_prima.png);
    height: 15px;
    cursor: pointer;
    background-repeat: no-repeat;
    padding: 15px;
    background-position: center;
}

.fletxa_menu_dreta {
    width: 10px;
    background: url(/templates/camaloon/img/fletxes/fletxa_menu_prima.png);
    height: 15px;
    cursor:pointer;
    background-repeat: no-repeat;
    margin: 10px;
}

.titol_menu {
    /*    padding-left: 25px;*/
    text-transform: uppercase;
    text-decoration: none;
    /*    vertical-align: middle;*/
    width:100%;
    display: flex;
    align-items: center;
}

.titol_menu a {
    font-family: 'Museo Sans Rounded', sans-serif;
    font-weight: 600;
    text-decoration: none !important;
    color: black;
    text-transform: capitalize;
    width: 100%;
    display:block;
    padding: 15px 0px;
}

.fletxa_m_dreta {
    /*    transform: rotate(180deg);*/
    width: 8px;
    height: 15px;
}

.fletxa_m_esquerra {
    transform: scale(0.8);
}

.img_seleccionada {
    text-transform: uppercase;
}

.titol_seleccionat a{
    text-decoration: none !important;
    color: white;
    text-transform: uppercase;
}

.titol_seleccionat:hover{
    text-decoration: none;
}

.div_imatge_categoria {
    margin: 0 27px 0 0;
}

.div_imatge_categoria img {
    width: 75px;
}

.nivell3{
    background: white;
    display: flex;
    padding: 5px 10px 5px 30px;
/*    width: 100%;*/
    align-items: center;
/*    border-top: 1px #d5d5d5 solid;*/
}

/*.nivell3:hover {
    background-color: rgb(235,233,235);
}*/
.icono_submenu{
    width: 1rem;
    height: 2rem;
    margin-right: 10px;
}

.nivell2 {
    background: white;
    display: flex;
/*    width: 100%;*/
    align-items: center;
    border-bottom: 1px solid rgb(235,233,235);
/*    border-top: 1px white solid;*/
    padding: 17px 10px 17px 30px;
}
/*.submenu > .div_titol_submenu ~ .div_titol_submenu {
    
    border-top: 1px #8a8a8a solid;

}*/
.titol_submenu{
    font-family: 'Museo Sans Rounded', sans-serif;
    font-weight: 400;
    color: #5d5d5d;
    font-size: 1.04rem;
}
.node_titol{
    cursor:auto;
}
.familia_oberta {
    padding: 10px 20px 10px 0px;
}

#caixa_menu_blau::-webkit-scrollbar {
    display:none;
}
.text_submenu{
    max-width: 85%;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
    font-size: 18px;
}
.submenu > a:focus {
    background-color: rgb(235,233,235);
}
.nivell3{
    border-bottom: 1px solid rgb(235,233,235);
}

@media (min-width: 990px){
    #caixa_menu_blau {
        display: block;
        background-color: transparent;
        width: fit-content;
        min-width: 19%;
        position: fixed;
        top: 107px;
        max-height: 90vh;
        height: auto;
        left: -900px;
        transition: left 0.3s;
        z-index: 102;
    }
    
    #llista_menu_blau {
        overflow-y: scroll;
        scrollbar-width: none;
    }
    
    #caixa_menu_blau.show_menu {
        display: flex !important;
        left: 0 !important;
        
    }
    .menu_2 {
        background-color: white !important;
        border-top: 1px solid #ededed !important;
        padding: 0px !important;
    }

    #fons_modal {
        background-color: black;
        bottom: 0;
        /*display: none;*/
        height: 120%;
        left: 0;
        position: fixed;
        right: 0;
        top: 103px;
        width: 150%;
        z-index: 10; 
        visibility: hidden;
        opacity: 0;
        /*transition: opacity 0.3s, visibility 0.3s;*/
    }
    #fons_modal.showElement {
        visibility: visible;
        opacity: 0.15;
        transition: opacity 0.3s, visibility 0.3s;
    }
    #tanca_menu {
        display: none; 
    }

    .menu_home {
        display: none;
    }

    .flexsearch {
        /*display: inline-block;
        position: absolute;*/
    }

    #btn_mbl_menu {
        display: none;
    }
    .familia_menu {
        cursor:pointer;
    }
    .div_imatge_categoria img {
        width: 67px;
    }

    .hoverFamilia{
        background-color: #F3F3F3 !important;
    }
    .element_llista_productes{
        display:none;
    }
    .showProducts{
        display: flex !important;
        flex-direction: column;
    }
    .imatgeNegre {
        filter: brightness(30%);
        
    }
    .submenu {
        display: none;
        flex-direction: column;
        background-color: white;
        left: 100%;
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 97%;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .showFamilia {
        display: flex !important;
    }
    .menu_fixed{
/*        position: fixed !important;*/
        z-index: 10;
        background-color: #fffff;
    }
    #llista_menu_blau li {
        font-size: 1rem;
        height: 56px
    }
    /*#llista_menu_blau {
        
        overflow-y: scroll;
    }*/
    #llista_menu_blau::-webkit-scrollbar {
        width: 0px;  /* Remove scrollbar space */
        background: transparent;  /* Optional: just make scrollbar invisible */
    }
    .submenu::-webkit-scrollbar {
        width: 41px;
        background-color: rgba(255,255,255,0);
    }

    .submenu::-webkit-scrollbar-track,
    .submenu::-webkit-scrollbar-thumb {
        border: 16px solid rgba(255,255,255,0);
        border-radius: 50px;
        background-clip: padding-box;
    }

    .submenu::-webkit-scrollbar-track {
        background-color: #ccc;
    }

    .submenu::-webkit-scrollbar-thumb {
        background-color: #333;
        
    }
    #tanca_menu_dsk {
        width: 16px;
        margin-left: 7px;
        margin-right: 11px;
        cursor:pointer;
    }
    #boto_menu_blau{
        cursor:pointer;
    }
    .text_submenu{
        font-size:1rem;
        display: block;
        max-width: 85%;
        white-space: nowrap;
        overflow: hidden !important;
        text-overflow: ellipsis;
    
    }
    .nivell3:hover {
        background-color: rgb(235,233,235);
    }
    .nivell3:focus {
        font-weight: bold;
    }
    .nivell2:hover {
        background-color: rgb(235,233,235);
    }
    .nivell2:focus {
        font-weight: bold;
    }

    
    
}
@media (max-width: 990px) {
    
    .flexsearch--wrapper {
        top: 5px;
        left: 0;
    }
    .titol_menu a{
        width: auto;
    }
}
/*IPAD PRO*/
@media (width: 1024px) {
    #caixa_menu_blau {
        display: block;
        background-color: transparent;
        width: 30%;
        position: fixed;
        top: 103px;
        max-height: 85vh;
        height: auto;
        left: -900px;
        transition: left 0.3s;
        z-index: 102;
    }
}
