body{
    background-image: url("images/fond.JPG") ;
    background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
    font-family: Verdana;

}


 


h1{
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    text-align:center;
    font-size: 60px;
    text-decoration: underline;
}

h2 {
    color : #946d1a;

    text-align: center;
    text-shadow: 
    -1px -1px 0 black,  
     1px -1px 0 black,  
 
}

h4 {
    text-decoration: underline;
    color :   #d4ab52;
    text-align: center;
    text-shadow: 
    -1px -1px 0 black,  
     1px -1px 0 black,  
    -1px  1px 0 black,  
     1px  1px 0 black;


}

.titre {
  display: flex;
  justify-content: space-around;
}
.patoune {
    height: 200px;
}

.bloc1 {
  display: flex;
  justify-content: space-around;
  text-align: center;
}

.bloc2 {
    display: flex;
    justify-content: space-around;
    margin-top: 2%;
   
}

.bloc3 {
    display: flex;
    justify-content: center;
    gap: 3%;
    margin-top: 3%;
    margin-bottom: -3%;
}

.c1 {
    background-color: #d4ab52	;
    width: 25%;
    border: solid 2px black;
    border-radius: 20px 20px 0px 0px;
}

.c2 {
    background-color:#d4ab52;
    width: 25%;
    border: solid 2px black;
    border-radius: 20px 20px 0px 0px;
}

.c3 {
    background-color: #d4ab52;
    width: 25%;
    border: solid 2px black;
    border-radius: 20px 20px 0px 0px;
}

.histoire {
  width:45%;
    margin-top: 5%;
  border : 2px solid black;
  border-radius : 15px;
  background-color: rgba(228,200,157	,1.0);
}

.def {
  width: 45%;
  margin-top: 5%;
  border : 2px solid black;
  border-radius : 15px;
  background-color: rgba(228,200,157	,1.0);
}

.left {
    width: 47%;
    border : 2px solid black;
    border-radius : 15px;
    background-color: rgba(228,200,157	,1.0);
    
 
}
.left li::marker {
    color: black;
}

.right {
    width: 47%;
    border : 2px solid black;
    border-radius : 15px;
    background-color: rgba(228,200,157	,1.0);
}
.right li::marker {
    color: black;
}

.img1{
    width: 50%;
}
.img2 {
    width: 100%;
}

.img-carre {
    display: flex;
    flex-direction: column;
}

.long {
    width: 100%;
}
.etaler {
    height: 50%;
    width: 50%;
}

.imgDroite {
    display: flex;
    flex-direction: column;
}

.c3Img {
    display: flex;
}
.imgHaut {
    display: flex;
}

.img10 {
    height: 50%;
}

p {
    margin-left: 3%;
    margin-right: 3%;
    transition: transform 0.3s ease;
}

p:hover {
    transform: scale(1.03);
}

.categorie {
    color : #2a1c00;
    text-decoration: underline;
    text-align: center;
}

.sousCategorie{
    color : #2a1c00;
    text-align: center;
}

.titreCategori {
    text-decoration: underline;
    text-align: center;
    color : #946d1a;
    font-size: 34px;

}


img{
    transition: transform 0.3s ease;
}

img:hover {
    transform: scale(1.05);
}