@charset "utf-8"; /* les boites ne grossissent plus avec padding et border*/
* {
    box-sizing: border-box;
    
}


/* header / entete */

img {
    max-width: 100%;
}

.wrapper {
    font-family: 'Nanum Gothic', sans-serif;
    max-width: 1920px;
    min-height: 3320px;
    background-image: url("../images/background-vert.jpg");  
}

.image-entete {

    max-width:100%;
    height : 377px;
    background-image: url("../images/enteteb.jpg");
    
}

.zone-bas {
    display: block;
    margin-top: 30px;
    max-width : 1200px;
    height: 100px;
    display: flex;
    justify-content: space-around;
    padding-top: 80px;
}

.phrase-titre {

    flex : 0 0 50%;
    text-align: center;
    font-family: 'Marck Script', cursive;
}

.rech {
    right:20px;
    flex : 0 0 50%;
}

.zone-1200x377 {

    max-width : 1200px;
    min-height: 377px;
    margin: 0 auto;

}


.zone-logo {
   /* position: absolute; */
   flex : 0 0 30%; /*new*/
   /*top:30px;*/
   /*left: 23%;*/
   width:200px;
   height:100px;
   object-fit: cover;
}



.phrase-titre {
   
    position: absolute;
    top:210px;
    left: 23%;
    width:300px;
    height:130px;
    color: #c1e4b0;
    

}

.phrase-titre>h1 {

    font-weight: lighter;
}

.nav-reseaux {/* position: absolute; *//* top:30px; *//*left: 58%;*/
    flex : 0 0 23%;
    width:300px;
    height:130px;
    object-fit: cover;
    display: flex;
    padding-top : 30px; 
    padding-left : 60px; 
}


.nav-outils {/* position: absolute; *//*top:30px;*//*left: 70%;*/
    flex : 0 0 23%;
    width:300px;
    height:130px;
    object-fit: cover;
    display: flex;
    padding-top : 30px; 
}


.logo-reseaux {

    width: 100%;
    margin: 0 auto;
    height: 150px;
    display : flex;/*new*/
    justify-content: space-around; /*new*/
    align-items: center;
}

h1 {

    text-align: center;
    color: #c8d584;

}

.picto {
    display: block;
    width: 30px;
    max-width:30px;
    text-align: center;
}

.picto+.picto {

    margin-left: 15px;
}

.picto .btn-reseaux {

    display:inline-block;
    width: 40px;
    max-height: 40px;
    object-fit: contain;

}

.picto>a {

    display: block;
   max-width: 100%;

}

/* nav principale */

.container-nav {
    display: block;
    max-width: 1200px;
    min-height: 50px;
    padding: 10px;
    margin: 0 auto;
}

.nav {
    
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.nav li {

    flex : 0 0 15%;

}


.container-nav .nav a {

    display: block;
    color: rgb(8, 0, 0);
    max-width:1200px;
    font-size: 23px;
    text-align: center;
    
}


.btn-nav:hover{

    display: block;
    color: rgb(8, 0, 0);
    background-color:  #c7d58479;
    max-width:1200px;
    font-size: 23px;
    Font-Weight: Bold;
    text-align: center;
    text-decoration: none;

}

/* nav principale fin */

/* carroussel */


.carousel {
    top : 90px;
    max-width: 1200px;
    min-height: 650px;
    margin : 0 auto;
}

/* carroussel */

/* article 1 nouveaux-thes */

.nouveaux-thes {
    top:150px;
    max-width : 100%;
    min-height: 640px;
    margin: 0 auto;
    position: relative;
    
}

.zone-titre-article1 {

    position: absolute;
    max-width:1560px;
    min-height: 30px;
    background-color:  #bef19454;
    padding-right: 1285px;
    left:360px;
   
}

.zone-images-1 {

    top:80px;
    max-width : 1200px;
    min-height: 570px;
    margin: 0 auto;
    position: relative;
    
}

.image1 {

    position : absolute;
    width: 400px;
    height:325px;
    z-index: 1 ;
    
}

.image2 {

    position : absolute;
    width: 400px;
    height:325px;
    top:130px;
    left : 370px;
    z-index: 2;
}


.image3 {

    position : absolute;
    width: 466px;
    height:280px;
    top:0;
    right : 0px;
    z-index: 1;

}

.divimage img {

    display: block;
    object-fit: cover;
}

.divimage {

    box-shadow: 14px 20px 12px #28461d96;
}

.divimage p {

    text-align: center;
    margin : 30px;
    color : black;
}


.lien-autre {

    width: 530px;
    height: 70px;
    margin: 0 600px 0 60%;
    display: flex;

}


/*********************  SURVOL ************************************** */


.lien-autre a:hover p {

    color: black;
    text-decoration: none;

}


.lien-autre a:hover {
    text-decoration: none;
}


.divimage a:hover p {

    color: rgb(40, 94, 19);
    text-decoration: none;

}

.divimage a:hover {
    text-decoration: none;
}


.lien-autre img {

    display: block;
    max-width: 100%;
    object-fit: cover;
}


.texte>a>p {
    margin-top:55px; 
    margin-right: 10px;
    height: 70px;
    color :  #546e31;
    font-weight:bold;
    font-size: 25px;
    text-align: right;
}


.image-feuille {

    width: 130px;
    height: 70px;
    flex : 0 0 40%;
}

.texte {

    flex : 0 0 60%;
}

/* fin article 1 nouveaux-thes */
/******************* article 2 coups de coeur *********************/

.coups-coeur {
    top: 200px;
    max-width : 100%;
    min-height: 380px;
    margin: 0 auto;
    position: relative;
    
}

.zone-titre-article2 {

    position: absolute;
    max-width:100%;
    min-height: 30px;
    background-color:  #bef19454;
    padding: 0 350px 0 360px;


}

.zone-images-2 {

    top:80px;
    max-width : 1200px;
    min-height: 350px;
    margin: 0 auto;
    position: relative;
    
}


.image4 {
    display: block;
    object-fit: cover;
    position : absolute;
    width: 400px;
    height:325px;
    z-index: 1 ;
    
}

.image5 {

    position : absolute;
    width: 400px;
    height:325px;
    top:130px;
    left : 370px;
    z-index: 2;
}


.image6 {

    position : absolute;
    width: 466px;
    height:280px;
    top:0;
    right : 0px;
    z-index: 1;
}


.coups-coeur .lien-autre {

        margin-top: 200px;

}

/******************* article 3  Théières et accessoires *********************/

.theieres {
    top: 250px;
    max-width : 100%;
    min-height: 640px;
    margin: 0 auto;
    position: relative;
    
}

.zone-titre-article3 {

    position: absolute;
    max-width:100%;
    min-height: 30px;
    background-color:  #bef19454;
    padding: 0 20px 0 360px;
   
}

.zone-images-3 {

    top:80px;
    max-width : 1200px;
    min-height: 650px;
    margin: 0 auto;
    position: relative;
    
}


.image7 {
    display: block;
    object-fit: cover;
    position : absolute;
    width: 350px;
    height:350px;
    z-index: 1 ;
    
}

.image8 {

    position : absolute;
    width: 600px;
    height:420px;
    top:140px;
    left : 320px;
    z-index: 2;
}


.image9 {

    position : absolute;
    width: 350px;
    height:350px;
    top:0;
    right : 0px;
    z-index: 1;
}


/******************* article 3 FIN  Théières et accessoires *********************/

.divimage img {

    display: block;
    object-fit: cover;
}

.divimage {

    box-shadow: 14px 20px 12px #28461d96;
}

.divimage p {

    text-align: center;
    margin : 30px;
    color : black;
}


.lien-autre {

    width: 530px;
    height: 70px;
    margin: 0 300px 0 60%;
    display: flex;
}

.lien-autre img {

    display: block;
    max-width: 100%;
    object-fit: cover;


}
.texte>a>p {
    margin-top:55px; 
    margin-right: 10px;
    height: 70px;
    color :  #546e31;
    font-size: 16px;
    text-align: right;
}

.image-feuille {

    width: 130px;
    height: 70px;
    flex : 0 0 40%;
}

.texte {

    flex : 0 0 60%;
}

/******************* FOOTER *********************/

footer {
    max-width: 100%;
    height: 450px;
    background-color: black;
}


.navfooter {

    display: flex;
    height: 200px;
    flex-direction: column;
    justify-content: space-between;
    text-decoration: none;
    list-style-type:none;
    color:  #546e31;

}

.navfooter a {

    color : #c9dd8f;
}

.navfooter ul {

    margin-top: 100px;
}


.zone-logo-footer {

    width:300px;
    height:130px;
    object-fit: cover;
}


.footer-contenu {

    padding : 10px 0;
    max-width:1200px ;
    height: 500px;
    display: flex;
    margin: 0 auto;
}


.footer-gauche {

    flex : 0 0 50%;
}

.footer-droit {

    flex : 0 0 50%;
}

.nav-reseaux-footer {

    top:20px;
    left: 60%;
    width:300px;
    height:80px;
    object-fit: cover;
    display: flex;

}

.partager {

    width : 100%;
    min-height: 100px;
    color :  #c9dd8f;
    margin-top: 20px;
}

.partager a {

    color :  #c9dd8f;
}

.picto8, .picto9 {

    margin-left : 50px;
}

.contact {

    color :  #c9dd8f;
}

.picto10 {

    margin : 40px;

}

/* recherche openclassrooms.com ssans java script*/
      
.rech {
 
    max-width: 1200px;
    height: 24px;
    margin: 10px 0 10px 1270px;
  }

    #recherche {
    
    width:208px;
    height:24px;
    background-position-x: 100%;
    background:  #c9dd8f;
    border-bottom: 3 solid black;
  
    }
      
    #recherche .loupe {
    background:url(http://www.larevuedekenza.fr/wp-content/themes/quarter/images/sidebar/loupe.png) no-repeat 0 0;
    width:24px;
    }
      
    #recherche input {
    outline:0;
    border:0;
    margin:0;
    height:24px;
    float:left;
    display:block;
    }
      
    #recherche input[type=text] {
    font:300 12px HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    background:none;
    width:180px;
    padding:0 9px;
    color:rgb(3, 3, 3);
    }
    /* fin recherche */

      /*
    @media screen and (max-width : 728px){

        


    }

    */