


 /*SELON TAILLE ECRAN -------------- TAILLE FONT ET TAILLE IMAGES */

/*---------pour ordinateur ecran > 768 px------ */
@media screen and (min-width: 1024px) {

             }
 /*---------pour tablette  ecran > 768 px---- */
 @media screen and (min-width: 768px) and (max-width: 1023px)  {



.EveryOne { width:472px; columns:2;   align-content:flex-start;
          column-gap:2px;
           }

           }


 /*---------pour SMARTPHONE ecran  px----*/
 @media screen and (max-width: 767px) {


 header img {
     width : 30%;
   max-width: 131px;
      min-width: 70px;
        }


 .T  img {
    width : 30%;
   max-width: 125px;
      min-width: 100px;
        }


#cont .EveryOne { width:472px; columns:2;
  align-content:flex-start;
          column-gap:4px;
           }

 #cont .EveryOne img { width:100%;
           }

#contPic  .NavG {
width:7%;
columns:2;
align-content:flex-start;
column-gap:2px;
}

#contPic  .NavG img{
width:70%
}

#contPic  #Pic
 {  margin-left : 0.2rem; }

#contPic  #Pic img
 {  width:75% }



 #Pic  img {
      width : 100%;
      max-width: 500px;
      min-width: 200px;
        }

html {
       font-size:90%;

      }

 body {
width:80%;

}

}


  /*--------------------------------------------------------
  --------------------------------------------  ---------*/
 html {
 font-size: 14px;
 font-family : Arial, Helvetica, sans-serif;
      }


body {
width:100%;
background-color:#dbe7d9;
}


#todo {
  /*  max-width: 820px; 800px;*/
   max-width: 780px;
    margin-left: auto;
    margin-right: auto;     margin-top: 0.8rem;

      }


header {width:100%;}

nav {width:90%;}


#cont {width:100%;}

/*si décide centrer image et son texte justify-content: center;  */
#contPic {
width:625px;
display: flex;
columns:2;
align-content:flex-start;
column-gap:4px;
}

#contCont{
width:625px;
display: flex;
columns:2;
align-content:flex-start;
column-gap:20px;
}


#contPic  .NavG img{
width:90%
}



.NavG {
width:10%;
columns:2;
align-content:flex-start;
column-gap:2px;
margin-left : 0.6rem;
}

#Pic
 {  margin-left : 0.8rem; }


#Pic  img {
     /*  border : 1px solid #a3b19d; */
     box-shadow:4px 4px 4px 0px rgba(143,157,137,0.5);     }

/*  position horizontale, position verticale, intensité du flou, épaisseur, couleur.
     rgba(0,0,0,0.5);  163 177 157
margin-right : 0.6rem;    margin : marge haut droit bas gacuhe   padding:  margin: 2em auto 2em auto  */

footer {width:100%;}


p {}

ul {/*font-size : 1rem;
    line-height:1.3rem;
    letter-spacing:0.07rem;
    color: #6d6c6e;
    text-decoration:none  */
    }

ul a {   /*
    color: #6d6c6e;
    font-weight:bold; */
    }

li {}

hr {
       border: none;
     border-top : 1px solid #b1c1ae;
     border-bottom : 1px solid  #f9fbf9;  }



hr.hr2 {
width: 50%;
margin-left:0px;
          }




/* MISE EN FORME   */



  .EveryOne
  { width:709px; columns:3;   align-content:flex-start;
          column-gap:2px;
           }



.Verde { color :#a0b29e;
}

.G {font-weight:bold;
}

.GI {font-weight:bold; font-style:italic;
}

.I {font-style:italic;
}
/* GRILLE IMAGE */
.MEOI {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 100px 100px;
    grid-gap: 10px;
}


/* TEXTE */

 .T6 {
    font-size : 0.7rem;
    line-height:2rem;
    letter-spacing:0.05rem;
    font-style:regular;
    color: #6d6c6e;
    text-decoration:none
    }


.T7,.T7i,.T7ib   {
   font-size : 0.9rem;
   line-height:1.1rem;
    /*   font-size : 0.8rem;
    letter-spacing:0.05rem;
    color: #6d6c6e;
    font-weight:bold;
  color : #3e545b;       */
        color: #6b7769;
    text-decoration:none
    }

.T7 { font-style:regular
    }

.T7i { font-style:italic
    }

.T7ib {font-style:italic;
    font-weight:bold
    }
       /*

.T8Cv {
    font-size: 0.98rem;
    line-height:1rem;
    font-style:bold;
    color: #aabba7;
    text-decoration:none
    }
        */
.T8Cr {
   font-size : 1rem;
    line-height:1rem;
    font-style:regular;
    color: red;
    text-decoration:none
    }

.T8,.T8i,.T8b,.T8bV   {
    font-size: 0.98rem;
    line-height:1.6rem;
    letter-spacing:0.05rem;
    /*color : red;  */
    color : #6d6c6e;

    text-decoration:none
    }

.T8 {
    font-style:regular;
    }


.T8i {
     font-style:italic;
    }

.T8b {
   font-weight:bold;
        }

.T8bV {
   font-weight:regular;   color :#9dac9a;    letter-spacing:0.03rem;
        }


.T9b {
    font-size: 1rem;
    line-height:1.6rem;
    letter-spacing:0.03rem;
    color :  #aabba7;
     font-weight:bold  ;
    text-decoration:none
    }



.T10b {
/*font-size: calc(0,6rem + 3vw);#a3b19d;#98a593;  */
    font-size: 1.2rem;
     line-height:1.6rem;
    font-weight:bold;
    color : #3e545b;
    text-decoration:none
    }













a:hover { text-decoration:none;  color :#fe0e41;   }

a { text-decoration: none;}
a:link { text-decoration: none;}
a:visited { text-decoration: none;}
a:focus {text-decoration: none;}
 { text-decoration:none;  }
a:active {text-decoration: none;}

