body {
    font-family: "Mulish", sans-serif !important;
    background-color: #f5f5f5
}

#app{
    min-height:50vh
}

.container-content{
    margin : 0 !important;
    padding-left:15px;
    padding-right :15px
}

.container {
    margin: 0 auto;
    background: white;
   
}

[v-cloak] {
    display: none;
}

.homepage {
    padding:  0;
}

.btn-left-drawer{
    display : none !important
}

.dropdown-content{
margin-top : 0;

}

    .dropdown-content .q-btn__content {
        text-transform: capitalize
    }

.q-btn-content {
    color: white;
    text-transform: capitalize
}

.SubSideNavPanel {
    left: -100%;
    position: fixed;
    transition: transform .5s cubic-bezier(.5,1,.89,1);
    transform: translateX(-100%);
    left: 0;
    height: 0;
    top: 0;
    bottom: 0;
}

.card-list-page{
    background : transparent 
}

.SubSideNavPanel.isActive {
    height: 100vh;
    transform: translateX(0%);
   /* position: absolute;*/
    background-color: white;
    left: 400px;
    z-index: 10000;
    display: block;
    /* top: -161px;*/
    width: 400px;
}

.img-drawer-menu {
    max-width: 100%
}

.row-subside {
    padding-top: 15px
}



.col-img-subdrawer {
    justify-content: center;
    display: flex;
    align-items: center;
    padding-left : 15px;
    padding-right : 15px;
}

    .col-img-subdrawer img{
      /*  height : 350px*/
    }
.row-showlist{
    width : fit-content;
    margin : 0 auto
}

.row-showlist .card-produit {
    width: 19%;
    display: inline-block;
    margin-top: 16px;
    margin-left: 14px;
    padding-left : 5PX
}
.card-produit{
overflow:hidden
}

.chip-free {
    border-radius: 0 !important;
    position: absolute !important;
    top: -4px;
    left: -4px;
    padding-left: 22px !important;
}

.menu-menu .q-btn {
    border-radius: 28px;
}


.menu-menu .q-tabs__content > * {
    margin-top: 8px;
    margin-left: 8px;
}



@media (min-width: 1200px) and (max-width: 1600px) {
    .row-showlist .card-produit {
        width: 24%;
        margin-left: 10px;
    }
}


@media (min-width: 850px) and (max-width: 1200px) {
    .row-showlist .card-produit {
        width: 32%;
        margin-left: 8px;
    }
}









@media (max-width: 850px) {
    .row-showlist .card-produit {
        float: left;
        width: 47%;
    }
}

@media (max-width: 640px) {
    .row-showlist .card-produit {
        float: left;
        width: 100%;
    }
}



@media (min-width: 769px) {
    .container {
        width: 100%;
    }

}

@media (min-width: 1024px) {

    


    .submenu {
        max-width: 95% !important
    }
}

@media (min-width: 1370px) {
    .container {
        margin: 0 auto;
        max-width: 1370px !important;
    }
    .submenu {
        max-width: 1370px !important;
    }
}

@media (min-width: 1620px) {
    .container {
        margin: 0 auto;
        max-width: 1620px !important;
    }

    .submenu {
        max-width: 1620px !important;
    }
}

#menu {
    padding-top: 10px;
    padding-bottom: 10px;
    position: fixed !important;
    width: 100%;
    z-index: 299!important;
    background-color: white;
    left: 0;
    right : 0;
    padding :0
}

#menu .btn-close-drawer .q-btn__content{
    color : white !important
}

.q-space-menu4 {
    display: none
}

@media(max-width : 1400px){
    .SubSideNavPanel.isActive{
        width : 500px
    }
}

@media(max-width : 1024px) {
    #menu {
      
        left: inherit;
        margin-left: inherit;
        transform : inherit
    }
    .SubSideNavPanel.isActive {
        width: 500px
    }
}

h1 {
    font-size: 40px !important;
    margin-bottom : 10px
}

h2 {
    font-size: 30px !important;
}

h3 {
    font-size: 24px !important;
}


/************** HOME ****************************/

.homepage .q-carousel{
    height : inherit

}

.homepage .q-carousel img{
    max-width : 100%;
    width : 100%;
}

    .homepage  .q-carousel .q-carousel--padding, .q-carousel__slide {
        padding: 0 !important
    }

.homepage  .q-carousel__navigation--bottom {
    bottom: 28px !important;
    background: white;
    width: fit-content;
    left: 50% !important;
    right: 50% !important;
    border-radius: 30px;
    height: 30px;
    border: 1px solid #E6E7E8;
}

.homepage  .q-carousel__navigation-icon .q-icon {
    color: #0086D6
}

.homepage  .q-carousel__navigation-icon--active .q-icon {
    color: #04235B
}



.homepage .btn-nav {
    background: #0086D6 !important;
    height: 1em !important;
    width: 1em !important;
    border-radius: 30px;
    margin: 0 7px;
    transition: width 2s ease !important;
    cursor: pointer
}
    .homepage .btn-nav.active {
        background: #04235B !important;
    
    }

.homepage .q-carousel__navigation .q-btn {
    margin: 6px 0 !important
}
/****Bloc catégorie****/
.img-hover-categorie {
    position: relative;
}

    .img-hover-categorie > a > img{
        width : 100%;
        max-width :100%
    }

    .elements-hover {
        position: absolute;
        bottom: 8px;
        left: 25px;
        right: 25px;
    }
    .elements-hover .block_content {
        border-top: none;
    }

.element-hover {
    width: 33%;
    float: left;
    background-color: #fff;
    padding: 10px;
    display :none
}

.img-hover-categorie:hover .element-hover {
    display: block;
}
.element-hover a {
    display: flex;
    align-content: center;
    align-items: center;
    text-decoration: none
}

    .element-hover img {
        border: 1px solid transparent;
        width : 65px;
        height : 67px
    }

    .element-hover span {
      
        padding: 2px 8px 3px 3px;
        color: #545454;
        line-height: 1.2;
        border-radius: 0 10px 10px 0 !important;
        font-size: 13px;
    }
.img-hover-categorie:hover .elements-hover {
    display: block;
 
}

.element-hover:hover img {
    border: 1px solid #e4a95f;
}

.element-hover:hover span {
    background-color: #e4a95f;
}

.row-bloc-cat .img-hover-categorie:first-child .element-hover:hover img {
    border: 1px solid #b5ce87;
}

.row-bloc-cat .img-hover-categorie:first-child .element-hover:hover span {
    background-color: #b5ce87;
}


/**** vignette*****/
#bloc-actu {
    padding: 15px 35px;
}
.box-electronic .ApImage {
    position: relative;
    overflow: hidden;
    border: 1px solid #38a4d6;
    border-radius: 20px;
    text-align: center;
}

.box-electronic a {
    font-family: 'Mulish', sans-serif;
    letter-spacing: 0px;
    text-decoration : none;
        color : #000;
}

.box-electronic .ApImage img {
    transition: all 2s;
    width: 60%;
    height: auto;
    margin: 0 auto;
}

.box-electronic .ApImage .image_description {
    position: absolute;
    top: 45px;
    left: 0;
    right: 0;
    padding: 0 10px;
    text-align: center;
    font-size: 13px;
    letter-spacing: 2px;
    color: #fe4e55;
}

    .box-electronic .ApImage .image_description strong, .box-electronic .ApImage .image_description b {
        font-size: 24px;
        color: #000;
        font-weight: 600;
    }

.box-electronic .ApImage:hover img {
    transform: scale3d(1.1, 1.1, 1.1);
}




/************ FOOTER *********************/


.footer {
    margin: 0 auto;
    background-color: white;
    padding: 0 65px 0 65px;
}


.footer hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, .1);
}

.footer-upper {
   
    padding: 35px 30px;
}



.footer .title, .footer .title a {
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 15px;
    background: none;
    padding: 0;
    color: #444 !important;
    cursor: auto;
    text-decoration: none
}


.footer .list a {
    color: #898989;
    line-height: 20px;
    padding: 5px 0;
    text-decoration: none;
    display : block
}

.footer-disclaimer {
    font-size: 12px;
    text-align: center;
    margin-top: 60px;
    color: #898989;
}

@media(max-width : 768px){
    .bloc_mit_footer{
        display : none
    }

    .footer-upper hr{
        display : none
    }

    .footer-upper{
        padding : 0 0 15px 0
    }
}

/***************** MENU ******************************/


#menu {
    background-color: #04235B;
    height: 85px;
}

    #menu .q-btn__content{
        color : white !important
    }

.menu-mobile {
    background-color: #04235B;
    padding-left: 30px;
    padding-bottom : 10px
}

.btn-mobile-menu {
    /* background: #006CA9 !important;*/
    padding: 5px 15px !important;
    flex-shrink: 0
}

.title-menu .q-btn__content {
    font-size: 14px;
    color: #555555;
    text-transform: none;
}
.title-submenu{
    margin-bottom : 10px
}
.title-submenu .q-btn__content {
    font-size: 14px;
    color: #555555;
    text-transform: none;
    font-weight: 600;
}
.subtitle-submenu .q-btn__content {
    font-size: 12px;
    color: #555555;
    text-transform: none;
    text-align: left;
}

.logo-essilor-menu {
    max-height: 45px;
    padding-right: 22px;
}

.logo-essishop-menu {
    max-width: 220px;
}

#headercat {
    position: relative;
   
  

}

.link-add-shopping a {
    display : none
}

#MitscriptAlert {
    display: none
}

.menu-desktop {
    padding-left: 20px
}

.submenu {
    position: absolute;
    top: 85px;
    z-index: 100;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    border-top: 1px solid #f1f1f1;
    background: white;

    left: 50%;
    transform: translate(-50%, 0);
    padding: 20px 25px
}

    .submenu .q-btn {
        padding: 3px 5px;
        min-height: inherit
    }

.dropdown-content {
    display: none !important;
    position: fixed !important;
    box-shadow: none;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0
}

.btn-dropdown-menu i {
  display : none !important
}

.show {
    display: block !important;
}

.page-search-pad {
padding-left : 45px;
padding-right : 45px;
padding-top : 25px;
padding-bottom : 25px
}

@media(max-width : 1024){
    .page-search-pad {
        padding-left: 15px;
        padding-right: 15px;
        padding-top: 25px;
        padding-bottom: 25px
    }
}
/*********** DRAWER **************/
.drawer-header {
    background-color: #0089c8;
    color: white;
    padding: 45px 15px 12px 15px
}

.title-drawer {
    font-size: 16px;
    color: #555555;
    font-weight : bold;
    text-decoration : none
}

.subtitle-drawer a {
    font-size: 14px;
    color: #555555;
    text-transform: none;
    
    text-decoration: none;
   
}

.f-overlay {
    align-items: center;
    -webkit-backdrop-filter: blur(1px);
    backdrop-filter: blur(1px);
    background: rgba(35, 35, 35, .7);
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    left: 0;
    opacity: 1;
    padding: 30px;
    position: fixed;
    right: 0;
    top: 0;
    transition: opacity .2s, visibility 0s .2s;
   
    z-index: 1449;
}

   



.subtitle-child a{
    display: flex;
    align-self: center;
}

#drawer-left hr:nth-child(1) {
    display: none
}

#drawer-left hr {
    width: 90%;
    opacity: 0.4;
}

.btn-arrow:hover .q-focus-helper {
    background: none !important
}

.title-drawer:hover {
    color: #0089c8;
   
}



@media(max-wiudth : 1630px) {
    .submenu {
        width: 95%;
        padding: 20px 15px
    }

    
}





/********** SEARCHBAR ********************/
.bloc-searc-menu .q-field--auto-height.q-field--labeled .q-field__native {
    margin-top: -10px
}

.bloc-searc-menu {
    margin-left: auto;
    margin-right: auto;
    max-width: 500px;
    align-self: center;
}

    .bloc-searc-menu .q-field--filled.q-field--rounded .q-field__control {
        border-radius: 20px;
        border: 1px solid #0093d0 !important;
        padding-left: 20px !important;
     
        background-position: 22px 8px;
        background-repeat: no-repeat;
        font-size: 13px !important;
        width: 500px;
        background-color: white;
        height: 44px;
        min-height:44px
    }

    .bloc-searc-menu i {
        color: #053588
    }

    .bloc-searc-menu .q-field__control {
        color: #053588
    }

    .bloc-searc-menu .q-field__label {
        color: #053588
    }

    .q-field--filled .q-field__control:before {
        border: none
    }

.q-field--filled .q-field__control:after{
    height : 0 !important
}

.bloc-searc-menu .q-field__label{
    top :11px
}

.bloc-searc-menu  .q-field__marginal {
    height: 43px;
 
}

@media(max-width : 1024px){
    .bloc-searc-menu{
        width : 100%
    }
}
/**********FIXED HEADER***************/
.div-header-text {
    text-align: left;
    width: 100%;
    background-color: #0086D6;
    font-size: 12px
}



.center-text {
    width: 95%;
    margin: 0 auto;
}

.tel {
    color: #fff;
    padding: 4px;
}

.boutoninactifopticiens a {
    border-radius: 11px;
    background: #212356;
    font-size: .7em;
    letter-spacing: .3em;
    color: #0086d6;
    padding: 1px 6px 1px 6px;
    border: 1px solid #fff;
    max-height: 19px;
    background-color: white;
    border-color: white;
    border-radius: 11px;
    padding: 3px 10px;
    text-decoration: none;
}

.boutonactif a {
    padding: 1px 6px 1px 6px;
    border-radius: 11px;
    font-size: .7em;
    letter-spacing: .3em;
    color: #fff;
    padding: 3px 10px;
    text-decoration: none;
    border: 1px solid white;
}

/*********** Page search********************/

.page-search {
    padding: 10px 0px 0 0px;
    background-color : transparent;
    margin-bottom : 15px
}

.sub-category-item {
    border: 1px solid #e5e5e5;
    text-align: center;
    margin-bottom: 10px;
}

.title-page {
    font-size: 30px;
    font-weight: normal;
    color: #444;
}

.sub-category-item a {
    color: #444;
    text-decoration: none
}

.sub-category-item .title {
    height: 36px;
    display: block;
    font-size: 12px;
    text-align: center;
   
}

.block-category-navigation {
    margin: 0 0 20px;
}

.block-category-navigation .title {
    font-size: 16px;
    font-weight:bold;
    color: #444;
    padding: 12px 30px 12px 10px;
    border-bottom: 1px solid #ddd;
}

.listbox .list{
    padding-left: 0;
    list-style: none;
}

.listbox .sublist {
    list-style: none;
    padding-left: 15px;
}

.listbox .list li {
    padding: 5px 0 5px 15px;
}

.listbox a {
    text-decoration : none
}



.listbox .list a {
    display: inline-block;
    position: relative;
    padding: 5px 0;
    font-size: 14px;
    color: #444;
    -webkit-transition: all 0.1s ease;
    transition: all 0.1s ease;
}

    .listbox .list a:before {
        content: "";
        position: absolute;
        top: 12px;
        left: -15px;
        width: 5px;
        height: 5px;
        background-color: #ddd;
    }

.listbox .list a.active {
    color: #0089c8
}

.bread-crumb {
   
    margin-top : 10px

}

.inner-breadcrumb {
    padding: 10px 15px;
    background-color: #f6f6f6;
}
    .inner-breadcrumb span {
        color: #777777;
    }


    .inner-breadcrumb a {
        display: inline-block;
        margin: 0 5px;
        font-size: 14px;
        line-height: 32px;
        font-weight : 600;
        text-decoration: none;
        color: #0089c8
    }

.summary-filter {
    margin-bottom : 10px
}

#drawer-filter .q-dialog__inner{
    padding : 0
}


.title-filterlist {
    font-weight: bold;
    font-size: 15px
}


/********* PRODUIT *************/

.product{
    display: flex;
    flex-flow: row nowrap;
}

    .product .picture-container {
        position: relative;
        display: table-cell;
        width: 175px;
        padding: 0 15px 30px 0;



    width: 190px;


}

.product .product_main_container {
    flex: 1;
    width: auto;
    display: flex;
    flex-flow: column;
    vertical-align: top;

}

    .product .picture-link {
        width: 100%;
        height: 100%;
        display: block;
        padding-top : 15px
    }

    .product .main_top_container {
        display: flex;
        justify-content: space-between;
        margin-bottom: 20px;
    }


    .product .product_main_container .infos_container {
        width: 100%;
        max-width: 450px;
        display: table-cell;
        vertical-align: top;
    }

    .product .product_main_container a {
        color: #353535;
        text-decoration: none;
        font-size :14px
    }

    .product .main_top_container .product_price {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        justify-content: flex-start;
    }

.product_price .price {
    font-weight: bold;
    font-size: 24px;
    line-height: 1.3;
    color: #333333;
    white-space: nowrap;
    text-align:right
}

    .product_price .price .min-price {
        font-size: 14px;
        font-weight: inherit;
        margin-top: 5px;
        color: #33333396
    }


.main_bottom_container .q-btn {
    width: 230px;
    margin-bottom: 10px
}

.product_short_description {
    max-height: 100px;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}

.product .main_bottom_container {
    display: flex;
    flex-direction: column;
    text-align: right;
}



/***********Détails produit ****************/

.page-detail-product{
    background : transparent;
    margin-bottom:20px
}

.product_infos_thumbnail {
    background-color: #ffffff;
    border-radius: 0 0 3px 3px;
   
   
  
   
   
    display: flex;
    flex-direction: column
}

.price-details{
    font-size : 24px
}

.btn-quantity .q-field__before{
    padding-right : 0  !important
}

    .btn-quantity .q-field__before .q-btn {
        border-radius: 25px 0 0 25px !important;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .btn-quantity .q-field__after {
        padding-left: 0 !important
    }

        .btn-quantity .q-field__after .q-btn {
            border-radius: 0 25px 25px 0 !important;
            padding-top: 8px;
            padding-bottom: 8px;
        }

.btn-quantity  .q-field--outlined .q-field__control{
    border-radius : 0 !important
}

.bloc-detail-product{
    margin-bottom:20px;
    margin-left : 0 !important;
    margin-top : 0 !important
}


.bloc-description-product, .bloc-detail-product {
    background: white
}

.container-mini-img {
    height: 55px;
    width: 70px;
    position: relative;
    display: inline-block;
    margin: 11px 4px 0;
    max-width: 75px;
    text-align: center;
    cursor: pointer;

}

    .container-mini-img:hover {
        border: 1px solid rgb(216, 216, 216) !important;
    }

    .container-mini-img img {
        max-width: 100%;
        height: auto;
        max-height: 100%;
        margin: auto;
    }

.container-img {
    width: 100%;
    min-height: 250px;
    height: 350px;
    position: relative;
    text-align: center;
    cursor:pointer
}

    .container-img img {
        max-width: 100%;
        max-height:100%;
        height: auto;
        
      
        bottom: 0;
        margin: auto;
    }



    /********** BLOG **************/

.page-actu .post {
    margin: 0 0 30px;
}

.post-title{
    display: inline-block;
    padding: 20px 10px;
    line-height: 20px;
    font-size: 16px;
    font-weight: bold;
    color: #444;
    text-decoration : none
}

.post-date {
    display: block;
    margin: 0 0 15px;
    background-color: #f6f6f6;
    padding: 10px;
    font-style: italic;
    color: #444;
}

.post-body {
    margin: 0 0 20px;
    padding: 0 10px;
    line-height: 22px;
}

.post-details{
    padding : 15px
}

.year-list{
    display: block;
    color: #444;
    
    font-weight : bold
}
.month-list {
    padding: 3px 0 3px 0px;
    color: #444;
    font-size: 14px;
    position: relative;
    cursor: pointer;
}

.month-list:hover {
    color: #0089C8
}

    .month-list::marker {
        width: 5px;
        height: 5px;
        color: #DDDDDD;
    }

.tag-list {
    color: #0089C8;
    cursor:pointer
}


/**********Page panier***********/

.page-panier{
    background : inherit
}

    .page-panier .product .picture-container {
        height:  165px;
    }


    .page-panier .product .main_top_container {
        margin-bottom: 0
    }

#tooltip-shop{
    max-width : 400px !important;
    width : 400px
}

.div-popover-cart a {text-decoration : none; color : black}




/*************** COMPARE ************************/


.compare-img img {
    max-height : 100px; max-width : 100%
}

.compare-page.container{
    background:transparent
}




/*************** Accueil bloc catégorie **********************/

.bloc-categorie {

    padding: 20px 85px 0 20px
}

.bloc-cat-title {
    line-height: 20px;
    text-align: center;
    margin: 0 auto;
    font-size: 20px !important;
    font-weight: bold;
    padding: 10px 15px;
    background-color: rgba(255,255,255,0.5);
    width: fit-content;
    border-radius: 25px;
    text-transform: uppercase;
    margin-bottom: 15px
}

.bloc-cat-title-home {
    line-height: 20px;
    text-align: center;
    margin: 0 auto;
    font-size: 20px !important;
    font-weight: bold;
    padding: 10px 15px;
    background-color: rgba(255,255,255,0.5);
    width: fit-content;
    border-radius: 25px;
    text-transform: uppercase;
    margin-bottom: 30px
}


.card-subchildren .q-item > div{
    width : 100%;
    text-align:left
}



.bloc-sous-cat {
    width: 80%;
    margin: 0 auto
}

    .bloc-sous-cat a{
        text-decoration:none
    }

    .mini-cat {
        text-align: center;
        z-index: 2;
        position: relative;
    }

    .mini-cat:hover{
        cursor : pointer
    }


    .mini-cat-img img {
        max-width: 80px;
        border-radius : 50px
    }

.mini-cat-title {
    padding: 10px 10px;
    color: white;
    font-weight: 600;
    font-size: 18px;
    width: fit-content;
    border-radius: 14px;
    margin: 0 auto;
    margin-top: -15px;
    z-index: 1;
    position: relative;
    text-decoration: none;
    line-height: 16px;
    display: flex;
    align-items: center;
    min-height:52px
}



.bloc-produit-cat {
    margin-top: 30px !important;
    padding: 10px 15px 20px 15px;
}

    .bloc-produit-cat .card-produit {
        width: 290px;
    }

    .bloc-produit-cat-mobile {
        margin-top: 30px !important;
        padding: 10px 15px 20px 15px;
    }

.card-produit .top-card {
    height: 32px
}

.card-produit .img-card img {
    max-width: 100%;
    transition: transform .5s ease;
    position: absolute;
    top: 22px;
    right: 0;
    bottom: 0;
    left: 0;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
}
.img-card > div{
    height : 200px
}

.text-h4 {
    font-size: 2.125rem !important
}
    .card-produit .img-card {
    height: 200px;
    overflow: hidden;
    position: relative;
}

.first-card img {
    max-width: 100%;
    max-height: 100%;
}

.first-card > .q-card__section{
    text-align :center
}

.card-produit .cat-card {
    font-size: 12px;
    margin-top: 5px
}

.card-produit .cat-card {
    font-size: 12px;
   
}
.card-produit .title-card {
    font-size: 16px;
    font-weight: bold;
    line-height: 20px;
    height: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: #04235B;
    text-wrap: auto
}



.card-produit .bottom-card{
    margin-top : 5px
}
.card-produit .price-card {
    font-size: 18px;
    min-height : 27px
}

.card-produit .ref-card {
    font-size: 10px
}



.card-produit {
    border-radius: 20px !important
}

.link-card-produit{
    text-decoration : none;
    color : inherit
}

.card-produit .link-card-produit:hover .img-card img {
    transform: scale(1.2);
}

.card-produit .link-card-produit:hover .title-card {
    text-decoration: underline
}


.sliders-home{
    width : 70%
}

.q-carousel__slide{
    background-color:transparent !important
}

.q-carousel {
    background-color: #f5f5f5 !important
}

.q-carousel img{
    border-radius : 30px
}

    .q-carousel .q-carousel__arrow .q-btn {
        background: #38A4D6
    }

.highlight-menu {
    background: rgba(255,255,255,0.9) !important;
    color: #38A4D6 !important;
    font-weight: bold !important;
    padding: 0.285em 0.7em !important;
    min-height: 2em !important;
}

.bloc-img{
    text-align : center;
    margin-top : 70px;
    margin-bottom : 70px
}

.bloc-img img{
    width : 70%
}

.q-toolbar img {
    width: 238px;
    height: 81px;
    max-height: 60px !important;
    padding-left: 25px;
}

.q-badge--floating{
    z-index:1
}

#item-menu-shoppingcart {
    font-size: 19px !important;
    padding-top: 9.4px;
}

#item-menu-shoppingcart .q-badge--floating {
    top: -7px;
    right: -14px;
    font-size: 14px;
}

.btn-jackpot i{
    font-size: 30px !important
}

#menu .fa-cart-shopping {
    font-size: 25px;
}

#menu .fa-user, #menu .fa-cogs {
    font-size: 25px !important
}

#menu .fa-user {
    padding-top: 4px;
}
#adminMenuBtn{
    padding : 0.285em
}

#MenuLoginHeaderMobile .text-label-menu {
    padding-top: 4px;
}

.btn-jackpot .q-badge--floating {
    top: 22px;
    right: -5px;
}


.slider-cat .q-carousel{
    height : inherit
}



.chipcagn .q-chip__content {
    flex-wrap: wrap;
    white-space: normal;
}

.q-carousel img {
    max-width: 100%;
    width: 100%;
}

.card-category-page .bloc-cat-title{
   
    font-weight:bold;
    letter-spacing:0.5px;
    font-size : 22px !important;
    border : none
}

.card-category-page a{
    text-decoration :none
}
.card-category-page a:hover {
    text-decoration: none
}


.card-subchildren .title-subchildren {
     overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display:block
}

.card-subchildren {
    height: 148px;
    overflow: hidden;
    z-index: 1;
    border-radius: 20px !important;
    margin-top: -8px;
}

    .card-subchildren .q-list {
        position: relative
    }



.card-subchildren .q-card__section {
    padding-bottom: 6px
}



.icon-cat-down {
   
    font-size: 22px !important;
    margin-left:-5px
    
}


.card-subchildren .q-item--dense, .card-subchildren .q-list--dense > .q-item {
    padding: 2px 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.link-subchildren {
    color: #43620E
}

.link-subchildren:hover{
    text-decoration:underline !important
}


.hide{
    display : none
}

.show {
    display: block
}



.first-card{
    height : 100%
}



.text-first-card {
    padding-top: 25px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    text-align: left;
    height: 73px;
    text-wrap: auto;
}

.first-card .q-card__actions{
    justify-content : left
}

.btn-first-card {
}

.link-menu-child {
    color: #555555;
    text-decoration: none
}

    .link-menu-child span{
        padding-top : 5px
    }

.col-btn-product-card .q-btn {
    padding: 10px 13px;
}

.span-txt-menu{
    position:relative;
    display: flex;
    flex-direction:column
}


.div-btn-menu{
    display : flex; 
    flex-wrap : nowrap;
    
}

.div-btn-menu.q-gutter-sm > span:nth-child(1){
    margin-top : 6px
}

.bloc-compare .price-compare {
    margin-top: 9px;
    line-height: 43px;
}

.input-pj .q-field__control:after, .input-pj .q-field__control:before {
    content: none !important
}

#MenuLoginHeaderMobile > .q-btn__content {
    flex-direction: column
}

.text-label-menu{
    font-size : 12px;
    text-transform: initial;
    color:white
}

.btn-jackpot > .q-btn__content, #item-menu-shoppingcart > .q-btn__content {
    flex-direction: column
}

.link-vu{
    color : black;
    text-decoration:none
}

.link-vu:hover {

    text-decoration: underline
}

#zoomC {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: contain;
    background-repeat : no-repeat
}

.picture-container img{
    max-width : 160px;
    max-height:160px
}





/*#layout-filtre .q-drawer {
    width: 100% !important
}*/
#stepper-order{
    background:transparent
}

    #stepper-order .q-stepper__header {
        /*background-color: #38A4D6;*/
        color : white
    }

.q-stepper__label {
    border: 1px solid white;
    padding: 6px 15px 6px 5px;
    border-radius: 0 25px 25px 0;
    border-left: none;
}
#stepper-order .q-stepper__dot {
    background: transparent;
    border: 1px solid white;
    margin: 0;
    border-right: none;
    padding: 3px 16px 27px 26px;
    border-radius: 25px 0 0 25px;
}
#stepper-order .q-stepper__dot span {
    color: inherit
}
.q-stepper__tab .q-stepper__dot, .q-stepper__tab .q-stepper__label {
    background: white !important;
    color: #0086d6 !important;
    border-color: transparent !important
}
.q-stepper__tab--active .q-stepper__dot, .q-stepper__tab--active .q-stepper__label {
    background: transparent !important;
    color : white !important;

  
}

#stepper-order .q-stepper__tab--done .q-stepper__dot, .q-stepper__tab--done .q-stepper__label {
    color: white !important;
    background: #003068 !important;
    border-color: #003068
}
#stepper-order .q-stepper__tab--active .q-stepper__dot, #stepper-order .q-stepper__tab--active .q-stepper__label {
    color: white !important;
    background: #003068 !important;
    border-color: #003068 !important;
    font-weight : bold
}



#stepper-order .q-stepper__dot .q-icon {
    margin-top: 2px;
}
    #stepper-order .q-stepper__dot i{
        font-size : 22px
    }



.q-stepper--horizontal .q-stepper__line:after, .q-stepper--horizontal .q-stepper__line:before {
    background: #0086d6 !important;
}

.q-stepper--horizontal .q-stepper__dot:after, .q-stepper--horizontal .q-stepper__label:after {
    margin-left: 0px !important
}

.q-stepper--horizontal .q-stepper__dot:before {
    margin-right: 0 !important
}

.bg-custom-indicator {
    background: #006CA9 !important;
}

.text-custom-indicator {
    color: #006CA9 !important;
}
.btn-mobile-menu {
    width: 166px !important;


}

.img-drawer{
    max-height : 100px;
    max-width:100%
}

.subtitle-drawer:hover a, .subtitle-child:hover span {
    color: #0089c8;
    padding-left: 15px;
}

.subtitle-first-child:hover .self-center {
   color: #0089c8;
}

#drawer-left .first-list {
    margin-top: 100px
}

#drawer-left .drawer-header {
    position: fixed;
    width: 100%;
    z-index: 1;
}

.subtitle-drawer .icon-subtile-drawer {
    display: none
}
.subtitle-drawer:hover .icon-subtile-drawer{
    display : block
}

.price-details{
    font-size : 30px;
    color : #38a4d6
}

.title-compare{
    line-height:15px !important
}

.bloc-name{
    height : 42px
}

.compare-img{
    height : 125px
}

.bloc-compare{
    font-size : 14px;
    font-weight : 500
}



.q-loading-bar--top{
    display : none !important 
}

.q-chip-frais {
    flex-wrap: wrap !important;
    height: inherit !important
}

    .q-chip-frais .q-chip__content {
        white-space: normal;
    }

#item-menu-shoppingcart .q-focus-helper, .btn-jackpot .q-focus-helper {
    height: 86% !important
}
/***ANIMATION*/




*, *:before, *:after {
    position: relative;
    box-sizing: border-box;
}

:root {
    --color-heart: #9E9E9E;
    --easing: cubic-bezier(.7,0,.3,1);
    --duration: .5s;
}


.text-btn-like {
    font-size: 12px;
    margin-left: 2px;
    padding-top: 10px;
    color: #9E9E9E;
    line-height: 1.715em;
}



.like-btn-detail .text-btn-like {
    font-size: 14px;
    margin-left: 2px;
    padding-top: 10px;
    color: #9e9e9e;
    font-weight: 500;
}

.like-button {
    display: flex;
    border-radius: 5px;
    font-size: 38px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background: transparent;
    padding: 0;
    margin: 0;
    outline: none;
    z-index: 2;
    -webkit-transition: -webkit-transform var(--duration) var(--easing);
    transition: -webkit-transform var(--duration) var(--easing);
    transition: transform var(--duration) var(--easing);
    transition: transform var(--duration) var(--easing), -webkit-transform var(--duration) var(--easing);
    cursor: pointer;
    padding-right: 12px;
    margin: 0 auto
}

    .like-button.like {
        transition: none
    }

.like-btn-detail {
    font-size: 42px;
    margin-top: 5px
}

.like-button-card {
    font-size: 30px;
    border: 1px solid #757575;
    border-radius: 24px;
    padding: 2px 5px;
}

   /* .like-button-card .particles {
        display: none
    }*/

.like-button:hover {
    background: rgba(0,0,0,0.05)
}

.like-button:before {
    z-index: -1;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    -webkit-transition: inherit;
    transition: inherit;
}

.like-button:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    z-index: -1;
}

.like-button:active:before {
    -webkit-animation: depress-shadow var(--duration) var(--easing) both;
    animation: depress-shadow var(--duration) var(--easing) both;
}

.like-button:focus:after {
    -webkit-animation: depress var(--duration) var(--easing) both;
    animation: depress var(--duration) var(--easing) both;
}

@-webkit-keyframes depress {
    from, to {
        -webkit-transform: none;
        transform: none;
    }

    50% {
        -webkit-transform: translateY(5%) scale(0.9);
        transform: translateY(5%) scale(0.9);
    }
}

@keyframes depress {
    from, to {
        -webkit-transform: none;
        transform: none;
    }

    50% {
        -webkit-transform: translateY(5%) scale(0.9);
        transform: translateY(5%) scale(0.9);
    }
}

@-webkit-keyframes depress-shadow {
    from, to {
        -webkit-transform: none;
        transform: none;
    }

    50% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }
}

@keyframes depress-shadow {
    from, to {
        -webkit-transform: none;
        transform: none;
    }

    50% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }
}

.like-wrapper {
    display: grid;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    z-index: 1;
}

    .like-wrapper > * {
        margin: auto;
        grid-area: 1 / 1;
    }

.heart {
    width: .5em;
    height: .5em;
    display: block;
    -webkit-transform-origin: center 80%;
    transform-origin: center 80%;
}

    .heart > path {
        stroke: var(--color-heart);
        stroke-width: 2;
        fill: transparent;
        -webkit-transition: fill var(--duration) var(--easing);
        transition: fill var(--duration) var(--easing);
    }

/*.like-button:focus .heart > path {
    fill: #0089c8;
    stroke: #0089c8
}
*/
.like-button:focus .heart {
    -webkit-animation: heart-bounce var(--duration) var(--easing);
    animation: heart-bounce var(--duration) var(--easing);
}

.like-button-like .heart > path {
    fill: #0089c8;
    stroke: #0089c8
}

@-webkit-keyframes heart-bounce {
    40% {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
    }

    0%, 80%, 100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes heart-bounce {
    40% {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
    }

    0%, 80%, 100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
/* Added wrapper to prevent layout jank with resizing particles */
.particles {
    width: 1px;
    height: 1px;
}

.particle {
    position: absolute;
    top: 0;
    left: 0;
    height: .1em;
    width: .1em;
    border-radius: .05em;
    background-color: var(--color);
    --percentage: calc( var(--i) / var(--total-particles) );
    --Θ: calc( var(--percentage) * 1turn );
    -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0) scaleY(0);
    transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0) scaleY(0);
    -webkit-transition: all var(--duration) var(--easing);
    transition: all var(--duration) var(--easing);
}



.like-button-like:focus .particle {
    -webkit-animation: particles-out calc(var(--duration) * 1.2) var(--easing) forwards;
    animation: particles-out calc(var(--duration) * 1.2) var(--easing) forwards;
}


.like-button-like .particles {
    display: none
}




@-webkit-keyframes particles-out {
    50% {
        height: .3em;
    }

    50%, 60% {
        height: .3em;
        -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0.8em) scale(1);
        transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0.8em) scale(1);
    }

    60% {
        height: .2em;
    }

    100% {
        -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(1em) scale(0);
        transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(1em) scale(0);
    }
}

@keyframes particles-out {
    50% {
        height: .3em;
    }

    50%, 60% {
        height: .3em;
        -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0.8em) scale(1);
        transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0.8em) scale(1);
    }

    60% {
        height: .2em;
    }

    100% {
        -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(1em) scale(0);
        transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(1em) scale(0);
    }
}

.ripple {
    height: 1em;
    width: 1em;
    border-radius: 50%;
    overflow: hidden;
    z-index: 1;
}

    .ripple:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 0.4em solid var(--color-heart);
        border-radius: inherit;
        -webkit-transform: scale(0);
        transform: scale(0);
    }

.like-button:focus .ripple:before {
    -webkit-animation: ripple-out var(--duration) var(--easing);
    animation: ripple-out var(--duration) var(--easing);
}

@-webkit-keyframes ripple-out {
    from {
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    to {
        -webkit-transform: scale(5);
        transform: scale(5);
    }
}

@keyframes ripple-out {
    from {
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    to {
        -webkit-transform: scale(5);
        transform: scale(5);
    }
}



.section-iframe {
    text-align: center
}

    .section-iframe iframe {
        border: none
    }



.card-produit{
    height : 375px;
    width : 290px
}


.scroll-area-card{
    height : 405px !important;
    width : 100%;
    padding-left : 10px;
    padding-top : 15px
}

.scroll-area-min-img {
    width: 100%;
    height : 100px !important
}

.scroll-area-menu {
    width: 100%;
    height: 34px !important
}

    .scroll-area-menu .q-scrollarea__bar, .scroll-area-menu .q-scrollarea__thumb {
        display: none
    }

#drawer-right a {
  padding-top: 12px;
}

#drawer-left .title-drawer .q-item {
    padding: 12px 16px;
}

.q-carousel .q-carousel__arrow .q-btn {
    background: white;
    color: rgba(0, 0, 0, 0.5);
    /* padding: 15px 10px; */
    border-radius: 5px;
    height: 6rem;
    /* font-size: 15px; */
    width: 3rem;
}

.q-carousel__prev-arrow--horizontal{
    left : 0 !important;
 
}

    .q-carousel__prev-arrow--horizontal .q-btn {
        border-radius: 0 4px 4px 0 !important
    }

    .q-carousel__next-arrow--horizontal{
        right : 0 !important
    }

        .q-carousel__next-arrow--horizontal .q-btn {
            border-radius:  4px 0 0 4px  !important
        }

.q-carousel__arrow .q-icon{
    font-size : 50px !important
}

.scroll-area-card .q-gutter-md > * {
    margin-left: 17px !important;
    margin-top:17px !important
}


@media(max-width : 1300px) {
    .span-txt-menu .q-btn {
            font-size: 16px !important
        }

        #item-menu-shoppingcart {
            font-size: 17px !important
        }

        .bloc-searc-menu {
            max-width: 380px;
        }




        .product .product_main_container .infos_container {
            max-width: 324px;
        }


        #headercat {
            position: relative;
            margin-top: 57px;
        }



        #menu .fa-user, #menu .fa-cogs {
            font-size: 18px !important
        }

        #menu .fa-cart-shopping {
            font-size: 22px
        }
    }

    @media(max-width : 1024px) {
        .menu-desktop {
            display: none !important
        }

        .menu-desktop {
            display: none !important
        }


        #menu {
            position: relative !important;
        }

        #headercat {
            margin-top: 0 !important
        }
    }



    @media(max-width : 1024px) {

        .bloc-detail-product.q-col-gutter-lg > *, .bloc-detail-product.q-col-gutter-x-lg > * {
            padding-left: 0 !important;
            padding-top: 0
        }

        .bloc-detail-product .col-right-product {
            margin-top: 15px
        }



        .bloc-produit-cat .card-produit {
            width: 315px;
        }

        .bloc-cat-title, .bloc-cat-title-home {
            font-size: 16px !important
        }

        .bloc-sous-cat .mini-cat-img img {
            max-width: 80px !important;
            max-height: 80px !important;
        }


        .bloc-sous-cat .mini-cat-title {
            min-height: 45px;
            padding: 3px 7px;
            font-size: 15px
        }


        .bloc-img img, .sliders-home {
            width: 88%;
        }

        .container-img {
            height: 150px
        }


        .btn-jackpot i {
            font-size: 35px !important;
        }

        .btn-jackpot .q-badge--floating {
            top: 27px;
            right: -11px;
        }

        #menu .fa-cart-shopping {
            font-size: 28px;
        }

        .div-btn-menu {
            height: 57px
        }

        #menu .fa-user, #menu .fa-cogs {
            font-size: 25px !important;
        }

        #menu .fa-user {
            padding-top: 0
        }

        #item-menu-shoppingcart .q-badge--floating {
            top: -8px;
            right: -12px;
        }

        .card-category-page {
            height: inherit
        }

        .lastview {
            display: none
        }



        .product .picture-container {
            width: 135px;
        }

        .product .main_top_container {
            flex-direction: column
        }

        .card-category-page .bloc-cat-title {
            margin: inherit;
            font-size: 14px !important;
            margin-bottom: inherit;
            background: white;
            /*border-bottom: 1px solid rgba(0,0,0,.12);*/
            letter-spacing: 0;
            border-radius: 0;
            width: 100%;
            text-align: left;
        }

        .list-cat-expansion {
            background: white;
        }

            .list-cat-expansion a {
                color: black
            }

        .text-label-menu {
            display: none
        }

        .q-space-menu3 {
            display: none
        }

        .bloc-searc-menu {
            max-width: 400px;
        }


        #headercat {
            margin-top: -1px !important;
        }

        .menu-mobile {
            padding-left: 15px;
        }

        .highlight-menu {
            padding: 0.285em 0.7em !important;
            min-height: 2em !important;
        }


        .btn-mobile-menu {
            width: 55px !important
        }

        .picture-container img {
            max-width: 110px;
            max-height: 160px;
        }
    }

    @media(max-width : 768px) {
        .q-toolbar img {
            max-height: 35px !important;
            padding-left: 0px;
        }


        .bloc-img img, .sliders-home {
            width: 100%
        }

        .bloc-img img {
            width: 95%
        }

        .sliders-home .q-carousel__control {
            display: none
        }



        .div-btn-menu {
            height: 57px
        }



        .compareprod {
            display: none !important
        }


        .bloc-categorie {
            padding: 20px 15px !important;
        }
    }

    @media(max-width : 580px) {

        .page-panier .text-h6 {
            font-size: 1rem;
        }

       

        .q-toolbar img {
            max-height: 40px !important;
        }

        .div-btn-menu .btn-jackpot i {
            font-size: 22px !important;
            padding-top: 9px
        }


        .div-btn-menu .fa-cart-shopping {
            font-size: 20px !important
        }

        #menu .fa-user, #menu .fa-cogs {
            font-size: 20px !important;
        }

        #menu .fa-cart-shopping {
            padding-top: 6px;
        }
    }

@media (max-width: 1400px) {
    .card-produit .price-card {
        font-size: 18px
    }
}

@media (max-width: 1024px) {
    .card-produit .price-card {
        font-size: 16px
    }
}



/************* CAGNOTTE *********************/

.head-cagnotte {
    background-image: linear-gradient(to right, #08568e, #0088c7, #08568e);
    color: white;
   
    
    margin-top: 20px;
}

.bloc-head-cagnotte {

    background-repeat: no-repeat;
    background-position: top left;
    min-height: 230px;
    padding: 55px 40px;
    
}
    .bloc-head-cagnotte.bloc-01 {
        background-image: none;
    }
    .bloc-head-cagnotte > .titre_big_1 {
        font-size: 40px;

        font-weight: 300;
        line-height: 1.2em;
    }

    .bloc-head-cagnotte > .titre_big_2, .bloc-head-cagnotte > .titre_big_3 {

        font-weight: 500;
        font-size: 14px;
        letter-spacing: 1.5px;
    }

    .bloc-head-cagnotte.bloc-02 {
        padding: 55px 15px 55px 40px;
    }

    .bloc-head-cagnotte > .titre_big_3 {
        font-size: 24px;
        text-transform: uppercase;

    }

    .bloc-head-cagnotte.bloc-02 span {
        font-size: 26px;
        font-weight: bold;
    }

    .bloc-head-cagnotte.bloc-03 {
        padding: 55px 0px 55px 40px;
    }

    .bloc-head-cagnotte > .titre_big_3 {
        font-size: 24px;
        text-transform: uppercase;
  
    }

    .bloc-head-cagnotte img {
        display: inline-block;
        width: 40px;
        margin-top: -15px;
        margin-left: 15px;
    }

.cagnotte-liens .liens {
    text-align: center;
    margin: 30px;
}

    .cagnotte-liens .liens a {
        background-color: white;
        border-radius: 20px;
        text-align: center;
        padding: 5px 15px;
        color: black;
        display: inline-block;
        text-transform: uppercase;
    
        font-size: 20px;
        font-weight: bold;
        margin-right: 15px;
        cursor: pointer
    }

        .cagnotte-liens .liens a:hover, .cagnotte-liens .liens a:active, .cagnotte-liens .liens a:focus, .cagnotte-liens .liens .active {
            background-color: #0088c7;
            color: white;
            text-decoration: none;
        }


.bloc-principe {
    background-color: #f5f5f5;

    background-repeat: no-repeat;
    background-position: top 20px left -2px;
    padding: 30px 30px 30px 45px;
    min-height: 300px;
    text-align: left;
    margin-top: 30px;
    color : #777777
}

.page-cagnotte{
    background-color:white
}


.bloc-principe h3 {
    color: #0088c7;
    text-transform: uppercase;
    font-size: 24px;
    margin-bottom: 30px;
  
    letter-spacing: 3px;
    font-weight: 500;
    font-size: 18px;
    margin: 0;
    line-height: 1.2em;
    margin-bottom: 15px;
}


.page-cagnotte h2 {
    color: #0088c7;
    font-weight: 200;
    margin-bottom: 30px;
    font-size: 30px;
}
.mentions {
    font-size: 10px;
}

.bloc-avantages {
    background-color: #f5f5f5;
   
    background-repeat: no-repeat;
    background-position: top 20px left -2px;
    padding: 30px 30px 30px 45px;
    min-height: 590px;
    margin-top: 30px;
}

    .bloc-avantages.bloc-01 h2, .bloc-avantages.bloc-01 h3 {
        color: #b5ce87;
        border-color: #b5ce87;
        margin-bottom: 30px;
      

        line-height:1.1em
    
    }

    .bloc-avantages.bloc-02 h2, .bloc-avantages.bloc-02 h3 {
        color: #e4a95f;
        border-color: #e4a95f;
        margin-bottom: 30px;
        line-height: 1.1em
    }
    .bloc-avantages h3 {

        font-size: 18px !important;
        font-weight: bold;
       
    }
.cadrant {
    background-repeat: no-repeat;
    background-size: contain;
    margin-bottom: 30px;
    height: 260px;
    position: relative;
    background-position: center;
}
.cadrant img {
    max-width: 40%;
    position: absolute;
    bottom: -5px;
    left: 40%;
    transform-origin: 81% 50%;
    display: inline;
    margin-left: -24.3%;
}

.page-cagnotte tbody tr:nth-of-type(even) {
    background-color: rgba(0, 0, 0, .05);
}

.page-cagnotte table thead  {
    background-color: rgba(0, 0, 0, .1);
}

.card-panier-fixed {
    position: sticky !important;
    top: 80px;
}
p {
    margin: 0 0 5px !important;
}
.stepper-panier .q-panel-parent, .stepper-panier .scroll {
    overflow: inherit
}
.chip-attribute{
    display : none !important
}

.btn-quantity .q-field__marginal, .btn-quantity .q-field--dense .q-field__control {
    height: 35px !important;
    font-size: 14px;
    padding: 0 4px;
    font-weight : bold
}

.btn-quantity .q-field__inner {
    width : 60px !important
}

.btn-quantity button {
    background: transparent;
    border: none;
    cursor:pointer
}

.btn-quantity .q-field--outlined .q-field__control:before {
    border: none
}

.btn-quantity .q-field {
    border: 1px solid #1976d2;
    border-radius:5px;
    padding: 0 2px;
    width: 105px
}

.btn-quantity .q-field__native {
    color: #1976d2 !important
}

.btn-quantity .q-field__input, .btn-quantity .q-field__native {
    text-align: center;
}

.btn-quantity .fa-minus, .btn-quantity .fa-plus {
   color: #1976d2
}

.new-div-product {
    width: 50%;
    margin-top: 30px
}

.bloc-actu-home {
    color: #04235B
}
.actu-category-home{
    font-size : 14px;
    margin-top : 5px;
    font-weight : 600;
}

.actu-title-home {
    font-size: 18px;
   
    font-weight: bold
}

.link-home-title-cat{
    color : inherit;
    text-decoration : none
}

    .link-home-title-cat:hover h1 {
       
        font-size: 22px !important;
    }


.div-img-first-card {
    height: 215px;
}

.carousel-wrapper {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    scroll-behavior: smooth;
    width: 100%;
    cursor: grab;
    -ms-overflow-style: none;
    scrollbar-width: none;
    height: 405px;
}

    .carousel-wrapper::-webkit-scrollbar {
        display: none;
    }

.carousel-content {
    display: flex;
    user-select: none;
}

.carousel-wrapper .card-produit {
    margin-left: 16px
}

    .carousel-wrapper .card-produit * {
        pointer-events: auto;
    }

.carousel-wrapper {
    -webkit-overflow-scrolling: touch; /* momentum scroll on iOS */
}

.carousel-wrapper {
    scroll-behavior: smooth;
}

.carousel-wrapper, .carousel-content, .carousel-wrapper .card-produit {
    user-select: none;
}

.card-card-list{
    background : transparent !important
}

.card-category-page .bloc-cat-title{
    color : white
}

.dialog-dec thead tr{
    background : #f6f6f6
}

.dialog-dec thead label {
    background: white
}

.btn-mobile-menu {
     width: 123px !important; 
    margin-top: 8px;
}

.txt-mob {
    display: none
}

    @media(max-width : 1024px) {
        .bloc-head-cagnotte {
            background-image: none !important;
            border-bottom: 1px solid white;
            a padding: 25px !important;
            min-height: 160px
        }

        .card-panier-fixed {
            position: relative !important;
            top: 0
        }
    }

    .item-icon {
    z-index: 10; /* au-dessus des liens */
    position: relative;
}

#drawer-left img{
    max-width : 97%
}
.nav-arrows {
    width: 106% !important;
    left: -43px !important;
    
}

.card-category-page {
    height: 420px
}

.slider-cat-desk{
    display : block
}

.slider-cat-mob{
        display : none

}

@media(max-width : 1024px) {
    .dropdown-content {
       
        position: fixed;
        background-color: white !important;
        padding: 5px 10px !important;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2) !important;
        z-index: 1 !important;
    }

    .card-category-page {
        height: inherit
    }

    .txt-mob{
        display: block
    }

}

    @media(max-width : 768px) {
        .q-toolbar img {
            width: inherit
        }

        .slider-cat-desk {
            display: none
        }

        .slider-cat-mob {
            display: block
        }

        .menu-mobile {
            padding-left: 0
        }

        .btn-mobile-menu {
            width: 50px !important
        }

        .btn-logo-global {
            padding-left: 0 !important
        }

        .page-search-pad {
            padding: 15px
        }

        #app > div.row.q-col-gutter-lg.q-pa-md.bloc-detail-product > div.col-lg-8.col-md-9.col-12.col-right-product > div > div > div.new-div-product > div.q-card.q-card--flat.no-shadow > div:nth-child(2) > button > span.q-btn__content.text-center.col.items-center.q-anchor--skip.justify-center.row {
            text-align: left !important
        }

        .new-div-product {
            width: 100%
        }

        .nav-arrows {
            width: 100% !important;
            left: 0px !important;
        }
    }



    .scroll-x {
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch; /* inertie sur mobile */
        cursor: grab;
    }

        .scroll-x::-webkit-scrollbar {
            display: none; /* optionnel */
        }

        .scroll-x > * {
            flex: 0 0 auto; /* éviter que les enfants se compressent */
        }



    @media(max-width : 580px) {
        .btn-jackpot .q-badge {
            display: none
        }

        .btn-mobile-menu {
            padding-left: 0 !important;
        }

        .card-produit {
            height: 375px;
            width: 268px;
        }

         .row-showlist .card-produit {
            margin-left: 0 !important
        }

        .nav-arrows {
            top: 46% !important
        }

        .card-category-page {
            padding: 0
        }

        .card-card-list > div {
            padding: 0
        }

        .card-category-page {
            padding: 0 !important
        }

        .product .picture-container {
            width: 90px;
        }

        .picture-container img {
            max-width: 100%;
            max-height: 160px;
        }

        .row-showlist.list-search {
            margin-left: 0
        }


        .bloc-categorie {
            padding: 20px 0px !important;
        }

        .carousel-wrapper .card-produit {
             margin-right: 0px !important; 
        }

        #slider-top {
            padding-left: 0px !important;
             padding-right: 0px !important;
        }

        .nav-arrows {
            width: 98% !important;
            left: 3px !important;
        }
        
    }

    @media(max-width : 365px) {

        #app > div.row.q-col-gutter-lg.q-pa-md.bloc-detail-product > div.col-lg-8.col-md-9.col-12.col-right-product > div > div > div.new-div-product > div.product_infos_thumbnail > div:nth-child(3) > div > div:nth-child(2) {
            margin-left: 0 !important;
            margin-top: 10px
        }
    }