body{
    font-family: "cookie";
    font-size: 30px;
    color:  #464A4B  !important;
    width: 100% !important;
    margin: 0%;
    padding: 0%;
    zoom: 100%;
    background-color: #dbdada;
}
#loader{
    position: absolute;
    top: 0rem;
    left: 0rem;
    z-index: 1000;
    background-color: #000 ;
    opacity: 1;
    width: 100%;
    height: 400%;
    display: block;
}

#logoLoader{
    position: absolute;
    top: 10%;
    left: 45%;
}
#bandeauCookie{
    background-color: #000000;
    color: aliceblue;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    z-index: 900;
    position: fixed;
    top: 17%;
    left: 0%;
    opacity: 0.7;
}   
#buttonCookie{
    font-size: 25px !important;
     opacity: 1 !important;
     border-radius: 20px;
}

input{
    font-family: 'Times New Roman', Times, serif;
    font-size: 25px !important;
}

#page{
    clear: both;
    position: absolute;
    top: 11rem;
}
a{
    transition-duration: 2s;
    color: #A0E0B5  !important;
}
em{
    color: #A0E0B5  !important;
}
.pagination a{
    color:  #464A4B !important;
   transition-duration: 10ms;
}
.pagination a:hover{
   color: #A0E0B5 !important;
}
.pagination span{
     color: #A0E0B5 !important;
     font-size: 30px;
     font-family: monospace;
}
.cardProduit{
    font-size: 25px !important;
    width: 19rem;
    border-style: hidden;
    margin-bottom: 15px;
}
.card-img-top{
    height: 304px;
}
.cardProduit:hover{
   
    width: 19rem;
    border-style: solid;
    border-width: 2px;
    border-radius: 1rem;
}

.lienRe{
    color: darkred !important;
}
.lienRe:hover{
    color: #000000 !important;
}


.descriptif{
    height: 2rem;
}
.pad{
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 1rem;
    
}

.btnAd{
    position: relative;
    background-color: #A0E0B5;
    color: #464A4B;
}
.btnAd:hover{
    background-color: #464A4B;
    color: #A0E0B5;
}

.lienAd{
    color: #464A4B !important;
}
.lienAd:hover{
    color: black !important;
    text-decoration-line: underline;
}

.inputQuantPanier{
    width: 5rem;
}
.btnPanier{
    font-size: 1rem;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    background-color: #A0E0B5;
}
#footer-adresse{
 padding-top: 5rem;
}


.lienFooterMap , .lienFooterMap>a{
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    font-size: 15px;
    color: #000000 !important;
}
.lienFooterMap:hover , .lienFooterMap>a:hover{
    color: #000 !important;
}
.lienFooterLegal{
align-items: center !important;
}
.footer-copyright, .footer-copyright>a{
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif !important;
    font-size: 15px !important;
    color: aliceblue !important;  
}

.footer-copyright{
    position: relative;
}
.copyright{
    background-color: darkslategrey; 
}

#motDePasseOublie{
border-style: none;
background-color: transparent;
font-size: 25px;
}

#rechercheClient{
    position: relative;
    
}
#listHistoCommande ul{
    display: none;
}
#listHistoCommande:hover>ul{
    display: block;
}
.prixBarre{
    text-decoration-line: line-through;
}
.caseCommandeValidation th, .caseCommandeValidation td{
    border-color: #A0E0B5;
    border-width: 5px;
}
th, td {
    text-align: right;
}
.logoLivraison{
    width: 10rem;
    margin: 15px;
    border-radius: 1rem;
}
.politiqueCookies{
    border-style: solid;
    padding: 5px;
}

#logoCE{
width: 18rem;

}
/* <<<<<<<<<<<<<<<<<<<<<<<<<<<<<  page d'acceuil >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
#isaStor{
    background-color: floralwhite;
    border-radius: 2rem;
    font-size: 20px;
    padding: 1rem;
}
.cardAccueil{
    position: relative;
    border-radius: 2rem;
    border-top-left-radius: 5rem;
    width: 30rem;
}
.imgCarrouselAcceuil{
    border-top-right-radius: 2rem !important;
    border-top-left-radius: 3rem;
}
.titre_bandeau{
    font-size: 5rem;
    padding: 1rem;
    background-image: linear-gradient(transparent,#A0E0B5,#A0E0B5,#A0E0B5,transparent)

}
.bandeau{   
    height: 15rem;
}
#bandeauArticle{
    background-image: url(../images/global/bandeauArticle.png) !important;
    background-repeat: no-repeat;
    background-size: cover;
}
#bandeauPromo{
    background-image: url(../images/global/bandeauPromo.png) !important;
    background-repeat: no-repeat;
    background-size: cover;
}
#bandeauMagasin{
    background-image: url(../images/global/bandeauMagasinCouleur.png) !important;
    background-repeat: no-repeat;
    background-size: cover;
}
.imgBandeau{
    position: relative;
    bottom: 2rem;
    
}
@keyframes bounce{
     from {top: 106px;}
     to   {top: 86px;}
}
#titreDecoAcceuil{
    background-color: #A0E0B5;
    text-align: center; 
    border-radius: 30rem;
    color: #464A4B !important;
    position: relative;
    font-size: 4rem;
    top: 8rem;
     left: 10rem;
    width: 25rem;
    padding: 1rem;
    animation: bounce 0.35s ease infinite alternate;
}
#titreDecoAcceuil:hover{  
    color: #464A4B !important;
     text-decoration-line: none !important; 
    font-style: normal !important;
}   
@keyframes bounce2{
     from {top: 80px;}
     to   {top: 120px;}
}
#titreFleursAcceuil{
     text-align: center;
    background-color: #464A4B;
    border-radius: 30rem;
    color: #A0E0B5 !important;
     position: relative;
    font-size: 4rem;
    top: 8rem;
    left: 10rem;
    width: 25rem;
    padding: 1rem;
    animation: bounce2 0.35s ease infinite alternate;
}
#titreFleursAcceuil:hover{  
   color: #A0E0B5 !important;
     text-decoration-line: none !important; 
    font-style: normal !important;
}  
@keyframes bounce3{
     from {top: 116px;}
     to   {top: 66px;}
}
#titreJardinAcceuil{
     text-align: center;
    background-color: #A0E0B5;
    border-radius: 30rem;
    color: #464A4B !important;
     position: relative;
    font-size: 4rem;
    top: 8rem;
     left: 10rem;
    width: 25rem;
    padding: 1rem;
    animation: bounce3 0.35s ease infinite alternate;
}
#titreJardinAcceuil:hover{  
    color: #464A4B !important;
     text-decoration-line: none !important; 
    font-style: normal !important;
}  

#contenuPromo{
   background-image: linear-gradient(transparent, #ffffff ,#ffffff, #ffffff,transparent );
    opacity: 0.8;
    margin: 10px;
    position: inherit;
    top: -2rem;
    border-radius: 10rem;
    padding: 2rem;   
}
#contenuPromo>h3{
font-size: 50px;
text-shadow: 2px 2px 2px #A0E0B5;
 color: #000000;
 opacity: 1 !important;
}
#contenuPromo>p{
    font-size:40px;
    line-height: 35px;
    text-shadow: 2px 2px 2px #A0E0B5;
    color: #000000;
    opacity: 1 !important;
}
/* <<<<<<<<<<<<<<<<<<<<<<<<<<<<< Nos Magasins >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
.cardMagasin{
    border-style: none !important;
}

.lienCardMagasin:hover{
    text-decoration-line: unset !important;
    font-style: normal;
}
.cardMagasin:hover{
    border-style: solid !important;
    border-color: #A0E0B5;
    border-width: 3px;
}

/* <<<<<<<<<<<<<<<<<<<<<<<<<<<<< Vue articles >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
.bandeauVerticale{
    position: relative;
    top: 5rem;
    opacity: 0.8;
}
.sousMenuClassCat{
    display: none;
}
.menuClassCat{
    list-style-type: circle;
}

.menuClassCat a{
    color: #464A4B !important;
}
.menuClassCat a:hover{
    color: #A0E0B5 !important;
    text-decoration-line: none; 
}
.menuClassCat:hover>.sousMenuClassCat{
    display: block;
}
.menuClassCatRow{
    background-color: whitesmoke;
    border-radius: 3rem;
    padding: 1rem 3rem 1rem 3rem;
}
.lienCardArticle{
     background-color: #464A4B;
       border-radius: 5px;
       padding: 4px;
}

/* <<<<<<<<<<<<<<<<<<<<<<<<<<<<< Adresse client >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

.lienAdresse{
    background-color: #464A4B;
    padding: 4px;
    border-radius: 5px;
    position: relative;
}
.titreAdresse{
    font-style: italic;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
.carddAdresseClient{
    border-radius: 10px;
}

/* <<<<<<<<<<<<<<<<<<<<<<<<<<<<< Responsive >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

@media screen and (max-width: 1200px) {
  .cardAccueil{
       border-radius: 2rem;
       border-top-left-radius: 5rem;
       width:20rem;
       left: 0rem;
}
#page{
    position: relative;
   top: 5rem;
}
.imgRubrique{
    width: 10rem !important;
}
.bandeau{   
    display: none;
}
#titreDecoAcceuil{
    position: relative;
    font-size: 2rem;
    left: 0rem;
    top: 4rem;
    width: 10rem;
    animation: none;

}
#titreFleursAcceuil{
    position: relative;
    font-size: 2rem;
    left: 0rem;
    top: 3rem;
     width: 10rem;
     animation: none;
    
}
#titreJardinAcceuil{
    position: relative;
    font-size: 2rem;
    left: 0rem;
    top: 3rem;
     width: 10rem;
    animation: none;
    
}
.footer-copyright{
    position: relative;
    left: 20%;
}
#logoLoader{
    position: absolute;
    top: 10%;
    left:40%;
}
.footer-copyright{
    left: 0%;
    font-size: 15px !important;
}
#googleMap{
   width: 300px !important;
}
.card-img-top{
    height: 176px;
}
.logoLivraison{
    width: 3rem !important;
}  
.cardProduit{
    width: 100% !important;
    font-size: 16px !important;
}
#carrouselBandeau{
    display: none;
 }
}