* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-family: "Nunito", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}

:root {
    --color-jaune-or: #c0af16 !important;
}

.text-title {
    color: var(--color-jaune-or) !important;
}




/*
*---------------------------
* Page Layout
*---------------------------
*/
header nav ul.dropdown-menu li:hover a {
    color: var(--color-jaune-or) !important;
}

ul li a.dropdown-item:focus {
    background-color: black;
}

.actif {
    border-bottom: 3px solid #ffffff;
    line-height: 5px;
}

.active-link:hover {
    border-bottom: 3px solid #ffffff;
    line-height: 5px;
}

/* Modal Login */
[name="username_email"]:focus,
[name="password"]:focus,
[name="username"]:focus,
#remember:focus,
.form-input:focus {
    border: 1px solid var(--color-jaune-or);
    box-shadow: 0px 0px 5px 3px var(--color-jaune-or);
}

#remember,
#another_adress {
    border: 1px solid black;
    box-shadow: 0px 0px 0px 0px var(--color-jaune-or);
}

#remember:checked,
#another_adress:checked {
    background-color: black;
    box-shadow: 0px 0px 5px 3px var(--color-jaune-or);
}

#forgetPassword:hover,
#login-space div small a {
    color: var(--color-jaune-or);
    text-decoration: underline;
}

.a-link {
    font-weight: bold;
    color: black;
    text-transform: uppercase;
    text-decoration: none;
}

.a-link:hover {
    color: var(--color-jaune-or);
    border-bottom: 2px solid var(--color-jaune-or);
    line-height: 5px;
}

.search-link {
    background-color: #ffffff;
}

.search-link:hover {
    cursor: pointer;
    background-color: #d8d8d8;
    transition: 0.5s;
}

#exampleModal swiper-container::part(button-prev),
#exampleModal swiper-container::part(button-next) {
    opacity: 0;
}

/* OFFCANVAS */
.btn-offcanvas-footer {
    background-color: black;
    border: 2px solid black;
    text-decoration: none;
    color: white;
    transition: 0.5s;
}

.btn-offcanvas-footer:hover {
    background-color: var(--color-jaune-or);
    border: 2px solid var(--color-jaune-or);
    color: white;
}

/*
*---------------------------
* Page Nouveautés
*---------------------------
*/
.container h1 span {
    display: inline-block;
    font-style: italic;
    font-weight: bold;
    padding: 7px;
    color: var(--color-jaune-or);
    border: 2px solid var(--color-jaune-or);
    box-shadow: 7px 7px 15px 7px var(--color-jaune-or);
}

.button-view {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
}

.div-image-move div div a {
    opacity: 0.5;
}

.div-image-move div div a:hover {
    opacity: 1;
}

.custom-popover {
    --bs-popover-bg: #212529;
    --bs-popover-body-color: #ffffff;
    --bs-popover-body-padding-x: .5rem;
    --bs-popover-body-padding-y: .5rem;
}

/*
* ----------------------------------------
* Flottants de bas de page (Page Layout)
* ----------------------------------------
*/
#scrollTopButton {
    position: fixed;
    display: none;
    bottom: 15%;
    background-color: black;
    color: white
}

#divPanier {
    border-radius: 50%;
    width: 60px;
    height: 60px;
    background-color: black;
}

#badgePanier {
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 50%;
    background-color: var(--color-jaune-or);
}

/*
*-----------------------------------
* Page Design Single
*-----------------------------------
*/
.div-btn-navigation a {
    display: inline-block;
    border-radius: 50%;
    color: #ffffff;
    background-color: #000000;
    transition: 0.5s;

}

.div-btn-navigation a:hover {
    color: #ffffff;
    background-color: var(--color-jaune-or);
}

.div-btn-navigation+div a img {
    width: 50%;
    opacity: 0.5;
    transition: 0.5s;
}

.div-btn-navigation+div a img:hover {
    opacity: 1;
}

#taille:focus {
    border: 1px solid var(--color-jaune-or);
    box-shadow: 0px 0px 10px 5px var(--color-jaune-or);
}

#quantity,
#quantity+div div {
    color: #ffffff;
    background-color: #000000;
}

#quantity+div div:hover {
    transition: 0.5s;
    background-color: var(--color-jaune-or);
}

/*
 * ----------------------------------------
 * Page Collection
 * ----------------------------------------
 */
#divTrie select {
    border: none;
}

#divTrie div+div div a {
    opacity: 0.5;
    transition: 0.5s;
}

#divTrie div+div div a:hover {
    opacity: 1 !important;
}

.column-active {
    opacity: 1 !important;
}

[data-id="column"] {
    padding: 0 8px 8px 8px;
}

[data-id="column"] div div {
    cursor: pointer;
}

/*
* ----------------------------------------
* Page Panier
* ----------------------------------------
*/
#layout-2 a {
    display: inline-flex;
    align-items: center;
    font-weight: bold;
    color: #cccccc;
}

#layout-2 a.active {
    color: #000000;
}

#layout-2 .number {
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

.a-btn-close {
    color: #000000;
    border-radius: 50%;
    padding: 4px;
}

.a-btn-close:hover {
    color: #ffffff;
    background-color: #00000049;
}

/*
* ----------------------------------------
* Page Facturation
* ----------------------------------------
*/

input[type="radio"]:checked {
    background-color: #000000;
    border: 1px solid #000000;
    box-shadow: 0px 0px 0px 4px var(--color-jaune-or);
}

input[type="radio"]:focus {
    background-color: #000000;
    box-shadow: 0px 0px 0px 4px var(--color-jaune-or);
}

/*
 * ----------------------------------------
 * animation Page A propos
 * ----------------------------------------
 */
.text-focus-in {
    -webkit-animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
    animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

@-webkit-keyframes text-focus-in {
    0% {
        -webkit-filter: blur(12px);
        filter: blur(12px);
        opacity: 0;
    }

    100% {
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }
}

@keyframes text-focus-in {
    0% {
        -webkit-filter: blur(12px);
        filter: blur(12px);
        opacity: 0;
    }

    100% {
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }
}

/*
*---------------------------
* Page Nouveauté
*---------------------------
*/
.scale-up-center {
    -webkit-animation: scale-up-center 0.7s cubic-bezier(0.390, 0.575, 0.565, 1.000) infinite alternate-reverse;
    animation: scale-up-center 0.7s cubic-bezier(0.390, 0.575, 0.565, 1.000) infinite alternate-reverse;
}

@-webkit-keyframes scale-up-center {
    0% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }

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

@keyframes scale-up-center {
    0% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }

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

/*
*---------------------------
* Modal Login
*---------------------------
*/
/* .slide-left {
	-webkit-animation: slide-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes slide-left {
    0% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
    }
    100% {
      -webkit-transform: translateX(-100px);
              transform: translateX(-100px);
    }
  }
  @keyframes slide-left {
    0% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
    }
    100% {
      -webkit-transform: translateX(-100px);
              transform: translateX(-100px);
    }
  }
   */