/* base */
* {
    margin: 0;
    padding: 0;
}

/* all the web page */
.wrapper {
    width: 90%;
    margin-left: 5%;
}

/* logo */
.img_banner {
    width: 100%;
}

/* texte under the title */
.img_info {
    width: 100%;
}

/* title */
.img_info h2 { 
    padding: 30px 30px 20px;
    font-family: 'Pacifico', cursive;
    font-size: 30px;
    color: #111;
    line-height: 40px;
}

/* texte */
.img_info p { 
    padding: 0px 30px 20px;
    font-family: cursive;
    font-size: 16px;
    color: #111;
    line-height: 24px;
}


/**/


.weedbox {
    position: relative;
    background-size: cover;
    background-position: center;
    justify-content: space-evenly;

}

.all-flower {
   width: 100%;
   margin-left: 0%;
}


.plant-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, 250px);
    justify-content: space-between;
}

.plant-grid1 {
    background-image: url(../images/weed/Thugroze1.jpg);
    grid-column: 1/1;
    grid-row: 1/1;
    
}

.plant-grid2 {
    background-image: url(../images/weed/Funcky_Charm.jpg);
    grid-column: 2/2;
    grid-row: 1/1;
}

.plant-grid3 {
    background-image: url(../images/weed/Black_Truffle.jpg);
    grid-column: 1/1;
    grid-row: 2/2;
}

.plant-grid4 {
    background-image: url(../images/weed/Blood_Diamond.jpg);
    grid-column: 2/2;
    grid-row: 2/2;
}

.plant-grid5 {
    background-image: url(../images/weed/American_pie1.jpg);
    grid-column: 1/1;
    grid-row: 3/3;
}

.plant-grid6 {
    background-image: url(../images/weed/Haze_joint1.jpg);
    grid-column: 2/2;
    grid-row: 3/3;
}

.weed-details {
    position: absolute;
    width: 100%;
    bottom: 10px;
    background-color: #FFFFFFDF;
    padding: 10px 10px;
    
}

.weed-name {
    font-family: 'Roboto Slab', serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 30px;
}

.weed-thc {
    color: green;
    font-weight: 800;
    line-height: 10px;
}

.weed-info {
    color: purple;
    font-weight: 800;
    line-height: 30px;
}

.weed-effect {
    color: black;
    font-size: 20px;
    font-weight: 800;
    line-height: 20px;
}


/**/

/* promo */

.promo {
    width: 100%;
    margin-left: 0%;
}

/* service */

.bloc {
    width: 100%;
    margin-left: 0%;
}

/* map */

.info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(1, 600px);
    justify-content: space-between;
}

.services {
    display: flex;
    justify-content: space-evenly;
    flex-direction: column;

}

.info-grid1 {
    grid-column: 1/1;
    grid-row: 1/1;
    padding-left: 0px;
}

.info-grid2 {
    grid-column: 2/2;
    grid-row: 1/1;
    padding-right: 0px;
}

.info-grid3 {
    grid-column: 3/3;
    grid-row: 1/1;
}


.service-item-map {
    margin-top: 20px;
    margin-left: 0px;
    width: 100%;
   /* display: flex;*/
}

/* fin de map */

/* info */
.service-item-info {
    width: 100%;
    margin-bottom: 1%;
}

.info-icon {
    margin-top: 60px;
    padding-left: 10px;
    font-size: 50px;
    width: 50%;
}

.service-details-info {
    padding-left: 10px;
    padding-top: 10px;
}

/* fin de info */

/* contact */

.contact-icon {
    margin-top: 60px;
    padding-left: 10px;
    font-size: 50px;
    width: 50%;
}

.service-details-contact {
    padding-top: 10px;
    padding-left: 10px;
}

/* fin de contact */


/* fin de service */

/*  pied de page */

footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 30px 100px;
    font-weight: 600;
}

footer a.cgv {
    text-decoration: none;
    color: black;
}

/*------------------------------ for tablette ----------------------------------------------------*/
@media only screen and (min-width: 768px) {

    .wrapper {
        width: 90%;
    }

    .img_banner {
        display: block;
        width: 100%;
        padding-bottom: 30px;
        margin-left: 0%;
    }

    .all-flower {
        width: 100%;
        padding-top: 10px;
        padding-bottom: 10px;
        margin-left: 0%;
    }

    .plant-grid1 {
        background-image: url(/images/weed/Thugroze1.jpg);
        
    }

    .plant-grid2 {
        background-image: url(/images/weed/Funcky_Charm.jpg);
    }
    
    .plant-grid3 {
        background-image: url(/images/weed/Black_Truffle.jpg);
    }

    .plant-grid4 {
        background-image: url(/images/weed/Blood_Diamond.jpg);
    }

    .plant-grid5 {
        background-image: url(/images/weed/American_pie2.jpg);
    }

    .plant-grid6 {
        background-image: url(/images/weed/Haze_joint1.jpg);
    }

    .promo {
        margin-left: 0%;
    }

    /* debut service */
    .services {
        display: flex;
        justify-content: space-evenly;
        flex-direction: column;
        padding-top: 3%;
        padding-bottom: 3%;
    
    }
    
    .info-grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: repeat(3, 600px);
        justify-content: space-between;
    
    }

    .info-grid1 {
        grid-column: 1/1;
        grid-row: 1/1;
    }
    
    .info-grid2 {
        grid-column: 2/2;
        grid-row: 1/1;
    }
    
    .info-grid3 {
        grid-column: 3/3;
        grid-row: 1/1;
    }
    
    /* map */

    .service-item-map {
        width: 100%;
        margin-left: 0%;
    }

    /* fin de map */

    /* info */

    .info-icon {
        margin-top: 60px;
        font-size: 40px;
        width: 20%;
        margin-left: 40%;
    }

    .service-details-info {
        margin-left: 5%;
        padding-top: 10px;
        font-size: 30px;
    }

    /* fin de info */
        
    /* contact */
        
    .contact-icon {
        margin-top: 60px;
        margin-left: 40%;
        width: 20%;
    }
        
    .service-details-contact {
        padding-top: 10px;
        margin-left: 30%;
        font-size: 30px;    
    }
    /* fin de contact */

    .bloc-comment {
        width: 100%;
        margin-left: 0%;
    }
        
    /* fin de service */
}

/*------------------------- for pc --------------------------------------------------------------------------*/
@media only screen and (min-width: 1000px) {

    .wrapper {
        width: 80%;
        
    }

    .img_banner {
        width: 100%;
        margin-left: 5%;
    }

    .img_info {
        width: 20%;
        float: left;
        margin-left: 5%;
    }


    .all-flower {
        width: 100%;
        padding-top: 90px;
        padding-bottom: 80px;
        margin-left: 5%;
    }
     
     
    .plant-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(3, 600px);
        justify-content: space-between;
    }

    .plant-grid1 {
        background-image: url(../images/weed/Thugroze1.jpg);
        grid-column: 1/1;
        grid-row: 1/1;
        
    }
    
    .plant-grid2 {
        background-image: url(../images/weed/Funcky_Charm.jpg);
        grid-column: 2/2;
        grid-row: 1/1;
        
    }
    
    .plant-grid3 {
        background-image: url(../images/weed/Black_Truffle.jpg);
        grid-column: 1/1;
        grid-row: 2/2;
    }
    
    .plant-grid4 {
        background-image: url(../images/weed/Blood_Diamond.jpg);
        grid-column: 2/2;
        grid-row: 2/2;
    }
    
    .plant-grid5 {
        background-image: url(../images/weed/American_pie2.jpg);
        grid-column: 1/1;
        grid-row: 3/3;
    }
    
    .plant-grid6 {
        background-image: url(../images/weed/Haze_joint1.jpg);
        grid-column: 2/2;
        grid-row: 3/3;
    }

    /* promo */
    
    .promo {
        width: 275%;
        margin-left: 0%;
    }

    /* service */

    .bloc {
        width: 100%;
        margin-left: 5%;
    }

    .info-grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: repeat(3, 600px);
        justify-content: space-between;
    
    }

    .services {
        display: block;
        justify-content: space-evenly;
        flex-direction: column;
        margin-left: 55%;
    }

    .info-grid1 {
        grid-column: 1/1;
        grid-row: 1/1;
        padding-right: 10%;
    }

    .info-grid2 {
        grid-column: 2/2;
        grid-row: 1/1;
    }

    .info-grid3 {
        grid-column: 2/2;
        grid-row: 1/1;
    }

    /* map */

    .service-item-map {
        width: 100%;
    }

    /* fin de map */

    /* info */

    .info-icon {
        margin-top: 3%;
        width: 20%;
        margin-left: 10%;
    }

    .service-details-info {
        padding-left: 0px;
        padding-top: 3%;
        font-size: 30px;
    }

    /* fin de info */
        
    /* contact */
        
    .contact-icon {
        margin-top: 60px;
        margin-left: 10%;
        width: 20%;
    }
        
    .service-details-contact {
        margin-top: 3%;
        margin-left: 10%;
    }
    /* fin de contact */

    .bloc-comment {
        width: 100%;
        margin-left: 5%;
        margin-top: 5%;
    }
        
    /* fin de service */

    /*  pied de page */

    footer {
        
        width: 1000px;
        padding-top: 5%;
        padding-right: 0%;
        
    }

    footer a.cgv {
        text-decoration: none;
        color: black;
        padding-right: 10%;
    }

}