* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}    


/********************************* style particulier *********************************/

.bg-dore{background: -webkit-linear-gradient(30deg, rgba(204, 86, 0, 1) 0%, #FFF501 100%);}

.bg-b-marine{background: rgb(27, 36, 58);}  

.titre-gradiant {
    background: -webkit-linear-gradient(30deg, rgba(204, 86, 0, 1) 0%, #FFF501 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none !important;
    text-shadow: 3.5px 3.5px 2px black;
}

.t-b-tres-leger-shadow-s-h{
    box-shadow: 0px 0px 5px 5px rgb(0 0 0 / 20%);
}
.tres-leger-shadow-s-h{
    box-shadow: 5px 5px 5px 0 rgb(0 0 0 / 30%); transition: 0.5s;
}  

.tres-leger-shadow{
    box-shadow: 2px 2px 3px 0 rgb(0 0 0 / 30%); transition: 0.5s;
}  

.tres-leger-shadow:hover{
    box-shadow: 0 0 0 0 rgb(0 0 0 / 30%); transition: 0.5s;
}  

.tres-leger-shadow-i-s-h{
    box-shadow: -5px 5px 5px 0 rgb(0 0 0 / 30%); transition: 0.5s;
}    

.leger-shadow-s-h{
    box-shadow: 5px 5px 5px 0 rgb(0 0 0 / 80%); transition: 0.5s;
}    

.leger-shadow{
    box-shadow: 5px 5px 5px 0 rgb(0 0 0 / 80%); transition: 0.5s;
}    
.leger-shadow:hover{
    box-shadow: 0 0 0 0 rgb(0 0 0 / 50%); background: rgb(77, 77, 77); transition: 0.5s;
}    

.intense-shadow-s-h{
    box-shadow: 7px 7px 10px 0 rgb(0 0 0 / 50%); transition: 0.5s;
}    
 
.intense-shadow{
    box-shadow: 7px 7px 10px 0 rgb(0 0 0 / 50%); transition: 0.5s;
}    
.intense-shadow:hover{
    box-shadow: 0 0 0 0 rgb(0 0 0 / 50%); background: rgb(77, 77, 77); transition: 0.5s;
}    

.textNor:hover {
    color: transparent; /* Rend le texte transparent */
    background: -webkit-linear-gradient(30deg, rgba(204, 86, 0, 1) 0%, #FFF501 100%);
    -webkit-background-clip: text; /* Applique le dégradé au texte */
    transition: 0.3s;
}

.butNor{border: 2px solid white; background: -webkit-linear-gradient(30deg, rgba(204, 86, 0, 1) 0%, #FFF501 100%) !important; box-shadow: 3px 3px 3px 0 rgba(0, 0, 0, 0.75); color: white; transition: 0.5s;}
.butNor:hover{background: rgb(0, 0, 0) !important; box-shadow: 0 0 0 0 #000; transition: 0.4s;}


.butSel{border: 2px solid white; border-radius: 25px; background: -webkit-linear-gradient(30deg, rgba(204, 86, 0, 1) 0%, #FFF501 100%) !important; box-shadow: 3px 3px 3px 0 #000; color: white; transition: 0.5s;}
.butSel:hover{background: black !important; color: rgb(0, 114, 175); box-shadow: 0 0 0 0 #000; transition: 0.4s;}

.butInt{border: 2px solid white; background: rgb(4, 114, 2); color: white; transition: 0.5s;}
.butInt:hover{background: black !important; color: rgb(4, 114, 2); box-shadow: 0 0 0 0 #000; transition: 0.4s;}

.butUp{border: 2px solid white; border-radius: 25px; background: rgb(145, 68, 1); box-shadow: 3px 3px 3px 0 #000; color: white; transition: 0.5s;}
.butUp:hover{background: black !important; color: rgb(145, 68, 1); box-shadow: 0 0 0 0 #000; transition: 0.4s;}

.butDel{border: 2px solid white; background: rgb(161, 0, 0); box-shadow: 3px 3px 3px 0 #000; color: white; transition: 0.5s;}
.butDel:hover{background: black !important; color: rgb(161, 0, 0); box-shadow: 0 0 0 0 #000; transition: 0.4s;}

.butAdresse{border: 2px solid rgb(0, 0, 0); border-radius: 25px; background: rgb(167, 167, 167); box-shadow: 2px 2px 3px 0 #8b8a8a; color: white; transition: 0.5s;}
.butAdresse:hover{background: rgb(167, 167, 167) !important;  color: white; box-shadow: 0 0 0 0 #000; transition: 0.4s;}

/********************************* modal *********************************/
.overlay{
    position: fixed;
    background: rgba(15, 15, 15, 0.5) !important;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 40;
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal{
    background: rgb(0,0,0);
    background: linear-gradient(33deg, rgba(0,0,0,1) 0%, rgba(15,31,69,1) 100%);
    border: 4px solid rgba(255, 255, 255, 0.7);
    border-radius: 15px;
}

.champ{
    background: rgba(255, 255, 255, 0.0);
    border-radius: 5px 5px 0 0 ;
    outline: none;
}

/********************************* modal ID_AD *********************************/

.fond-cadena{position: absolute; top: 50%;left: 50%;transform: translate(-50% ,-50%);}

@keyframes fadeEffect { 0% {opacity: 0;} 100% {opacity: 0.5;}}

#cadena {animation: fadeEffect 1.5s infinite alternate;}

/********************************* header *********************************/

.bg-nav{
    background: rgb(62,66,78);
    background: linear-gradient(0deg, rgba(62,66,78,1) 0%, rgba(0,12,43,1) 100%);
}    

.bg-but-search{
    background: rgb(255,245,1);
    background: linear-gradient(30deg, rgba(255,245,1,1) 0%, rgba(204,86,0,1) 100%);
}    
.bg-but-search:hover{
    background: rgb(255,245,1);
    background: linear-gradient(30deg, rgba(255,245,1,0.9) 0%, rgba(204, 85, 0, 0.9) 100%);
}    
.transite{
    background: rgb(255,245,1);
    background: linear-gradient(30deg, rgba(255,245,1,1) 0%, rgba(204,86,0,1) 100%);
    box-shadow: 0 3px 5px 0 black;
}  

.transite-w{
    background: rgb(255,245,1);
    background: linear-gradient(30deg, rgba(255,245,1,1) 0%, rgba(204,86,0,1) 100%);
    box-shadow: 2px 0px 5px 0px black;
}    


/********************************* burger *********************************/

.burger{
    overflow: hidden;
    width: 0%;
    transition: 0.2s;
}

/********************************* acceuil *********************************/

.fond-slide{
    background: url(../assets/fond/fond-slide.png) center/cover;
    height: 380px;
}    

.bottom-slide{
    background: rgb(255,255,255);
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
    height: 100px;
}    

/********************************* contact *********************************/  
.bg-contact{
    background: rgb(255, 255, 255);
    background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(0,12,43,1) 100%);
}
.fond-contact{
    background: url(../assets/fond/contact.jpg) center/cover;
    filter: blur(2px);
    font-weight: bold;
}

/********************************* footer *********************************/  

.fond-footer-info {
    background: url(../assets/fond/fond_footer_info.jpg) center/cover;
    filter: blur(8px);
}    

.fond-copyright{
    background: rgb(0,0,0);
}    

/********************************* panier *********************************/

.panier{
    overflow: hidden;
    width: 0%;
    transition: 0.2s;
}

.bg-panier{
    background: rgb(255,255,255);
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(227,227,227,1) 100%);
}

.butPanier{
    background: rgb(27, 36, 58);
}
.butPanier:hover{
    background: black !important; 
    transition: 0.4s;
}

/********************************* slide *********************************/

.slider-container {
    width: 100%;
    overflow: scroll;
    margin-bottom: 20px;
}

.slider {
    display: flex;
    transition: transform 0.5s ease;
}

.card {
    flex: 0 0 auto;
    margin-right: 20px;
    border: 1px solid #ccc;
    border-radius: 8px;
    overflow: hidden;
}


/* Carousel */
.carousel-inner { 
    position: relative; 
    width: 100%; 
    height: 100%; 
    overflow: hidden; 
}
.carousel-item { 
    display: none; 
    width: 100%; 
    height: 100%; 
}
.carousel-item.active { 
    display: block; 
}