/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */

a, .btn-link {    color: #84482a;
    color: #a74819;}
    
a:hover, .btn-link:hover    {color: #84482a;}
  

.btn-outline-primary {
    color: #a74819;
    border-color: #a74819; }
.all-product-link.btn i {color: #a74819;}
.btn-outline-primary:hover, .product-miniature form:hover button.btn.btn-primary.flex-grow-1.flex-md-grow-0, .btn:hover {background-color: #84482a; color: #fff; border-color: #a74819;}
.all-product-link.btn i:hover {color: #fff;}
.carousel .carousel-indicators button.active {background-color: #a74819;}

.main-menu__tree>li .menu-container a[data-depth="1"]:hover, .main-menu__tree>li .menu-container a[data-depth="1"]:hover i, .header a:not(.dropdown-item):not(.btn):hover, .header a:not(.dropdown-item):not(.btn):hover i {color: #a74819;}
.product-miniature form:hover .quantity-button.js-quantity-button.w-100.w-sm-auto {border-color: #84482a;}


#product h1,  .modal-dialog .h3 {font-size: 2.8rem; margin-top: .5rem;}
#product .product__current-price {font-size: 1.8rem;}

 #product span.color.texture, .modal-dialog span.color.texture {
    width: 64px;
    height: 40px;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

 #product .info-credit {
    border: 1px solid var(--bs-border-color);
    padding: 15px;
    text-transform: lowercase;
    border-radius: 4px;
}
 #product .info-credit p {margin: 0; font-size: 14px;}

 #product  .product__add-to-cart {margin: 35px 0 0;}

 #product .prices__wrapper {
    flex-direction: row !important;
    align-items: baseline;
}



/* Header */ 
#search_widget form input::placeholder {
    color: #eee;
    font-size: .9rem; }
    
#search_widget form i {color: #eee;}

.header-bottom .js-menu-item-lvl-0 > a.main-menu__tree__link {color: #eee !important;}

.header-bottom {background: #222; border: none;}

.header-block__icon {font-size: 1.6rem;}

#search_widget form input {background-color: #5555; color: #eeeeee !important;}

a.header-block__action-btn span.d-none.d-md-inline.header-block__title {display: none !important;}

.header-block.blockcart.cart-preview.inactive span.d-none.d-md-flex.header-block__title {display: none !important;}

.header-block__badge {
    position: relative;
    top: -11px;
    left: -19px;
    background: #eee;
    font-size: .8rem; }
    
.menu-container.shadow-sm.js-sub-menu .row-cols-4>* {width: 16%;}

.main-menu__tree>li .menu-container a[data-depth="1"] {
    font-size: 1.1rem;
    margin-bottom: 10px;}
    
li.category ul.submenu li.category {margin-bottom: 4px;}

.main-menu__tree>li .menu-container {padding: 45px 0;}

.menu-container.shadow-sm.js-sub-menu .row-cols-4>li.col-md-12 {
    width: 100%;
    border-top: 1px solid #55555512;
    padding-top: 30px;
    margin-top: 30px; 
    display: flex; }
    
.menu-container.shadow-sm.js-sub-menu .row-cols-4>li.col-md-12 > a {width: 115px;}

.menu-container.shadow-sm.js-sub-menu .row-cols-4>li.col-md-12 ul {display: flex;}

a.menu-marque {
    margin-right: 18px;
    text-transform: uppercase;
    text-decoration: underline;
    font-size: 0.9rem; }
    
.product-miniature .product-miniature__variants .variant-links>a {
    width: 47px;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    height: 30px;}
    
#category .product-list-reviews {display: none !important;}
#category .product-miniature__variants {margin-bottom: 10px;}

.product-miniature .input-group.flex-nowrap.mb-0 button i {font-size: 0.9rem !important;}

.product-miniature .input-group.flex-nowrap.mb-0 button, .input-group.flex-nowrap.mb-0 input {
    border: none;
    margin: 0;
    padding: 00;
    width: 30px;
    border-radius: 3px 0 0 3px; }
    
.product-miniature button.btn.btn-primary.flex-grow-1.flex-md-grow-0 {
    border-color: #222;
    border-radius: 0 3px 3px 0;
    background: #222;
    border: 4.5px solid #222; 
    width: 100%; }



.product-miniature .quantity-button.js-quantity-button.w-100.w-sm-auto {
    border: 1px solid #222;
    border-radius: 3px 0 0 3px; 
}


.product-miniature form span.visually-hidden {
    display: block;
    position: inherit !important;
    height: auto !important;
    overflow: visible !important;
    width: auto !important;
    font-size: .9rem; }

.product-miniature form > button > i, .product-miniature .product-list-reviews {display: none;}

.product-miniature .product-miniature__infos__bottom a {
    width: 100%;
    color: #222;
    border-color: #222;
    font-size: .9rem; }
    
.product-miniature .product-miniature__infos__bottom a:hover {
    background-color: #222;
    color: #eee; }

.product-miniature .gap-3 {gap: 0 !important;}

#index .product-flags {display:none;}

.product-miniature button.wishlist-button-add {
    box-shadow: none;
    background: #f7f7f7;
}

.product-miniature button.wishlist-button-add i {color: #a74819;}

.product-miniature .product-flags li {
    background: #84482a;
    background: #a74819;
}

button.wishlist-button-add i {
    color: #fff;
}

button.wishlist-button-add {
    box-shadow: none;
    background: grey;
}

a.carousel-link:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #5555; }
    
.ratio-homeSlider {--bs-aspect-ratio: 30.33333%;}

a.carousel-link h2, a.carousel-link h3, a.carousel-link p, .caption-description {
    color: #EEE !important;
    max-width: 550px;
    width: 550px !important; }
    
.section-services {margin: 75px 0 115px;}
    
.section-services, .services, .section-grande-cat, .cats {display: flex;}

.section-services h2, h2.section-title , .section-grande-cat h2 {font-size: 2.5rem;}

.service {margin-left: 40px;}


.service {
    margin-left: 50px;
    width: 33%;
    background: #f7f7f7;
    padding: 10px 30px;
    border-radius: 8px;
}



.unit-cat img {height: 60px; margin-right: 20px; }

.cat-velo {justify-content: space-evenly; margin-bottom: 115px;}
.cat-velo .unit-cat {justify-content: center;}

.cat-velo, .cat-velo .unit-cat {
    display: flex;
    align-items: center; }

.cat-velo h2 {
    font-size: 1.4rem;
    color: #84482a;
    color: #a74819;
}

.cat-velo .unit-cat {
    width: 20%;
    margin: 0 15px;
    padding: 15px;
    border: 1px solid #e9ecef;
    border-radius: 8px;
}


.brand {
    display: flex;
    justify-content: center;
    margin: 115px 0;
    background: #f8f9fa;
    padding: 15px;
}

.brand img {
    margin: 15px 30px;
    border-radius: 8px;
    height: 100px;
}

.section-grande-cat {justify-content: space-between;}

.section-grande-cat .text {
    width: 20%;
    margin-top: 50px;}

.cats div {
    height: 350px;
    width: 300px;
    margin-left: 30px;
    position:relative;
}

.cat1 { 
    background: url("https://colmar.veloland.fr/modules/ps_imageslider/images/e413f53657d8e5a5e9a2c50ecb5a4db43924d88d_homme-cycliste-faire-du-velo-sur-la-route (1).jpg");
    background-size: cover;
    background-position: center; }
    
.cat2 { 
    background: url(../img/cat-chaussure.jpg);
    background-size: cover;
    background-position: center; }
    
.cat3 { 
    background: url(../img/cat-accessoire.jpg);
    background-size: cover;
    background-position: center; }
    



.section-grande-cat {
    overflow: hidden;
    max-width: 1300px;
    margin: 0 auto 115px;}
    
.cats h3 {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    color: #FFFF;
    border-bottom: 1px solid;
}


.cats a {position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    z-index: 10;}
    
div#block-reassurance ul {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 0;
}

div#block-reassurance {
    margin: 100px 0 -112px;
    background: #f7f7f7;
    padding: 30px;
}
    
 div#block-reassurance li {width: 16%; margin: 0 30px;}
div#block-reassurance img {width: 35px;} 
.block-reassurance-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}