/* ==========================
   GOOGLE FONT
========================== */

@import url('https://fonts.googleapis.com/css2?family=Mirza&display=swap');


/* ==========================
   RESET
========================== */

body{
    margin:0;
    padding:0;
    background:#F1FDE7;
    font-family:'Open Sans', Arial, Helvetica, sans-serif;
    color:#633E09;
}

table{
    border-spacing:0;
    border-collapse:collapse;
}

img{
    display:block;
    border:0;
    max-width:100%;
    height:auto;
}

a{
    color:#ffffff;
}


/* ==========================
   WRAPPER
========================== */

.wrapper{
    width:100%;
    background:#F1FDE7;
}

.container{
    width:900px;
    max-width:900px;
    background:#ffffff;
    border-left:7px solid #111D05;
    border-right:7px solid #111D05;
}


/* ==========================
   TITRES
========================== */

h1,
h2,
h3{
    margin:0 0 20px;
    font-family:'Mirza', cursive, serif;
    font-weight:600;
    color:#3E700C;
}

h1{
    font-size:55px;
    line-height:1.3;
    color:#ffffff;
    margin:0;
}

h2{
    font-size:35px;
}

h3{
    font-size:25px;
    margin-bottom:10px;
}

p,
li{
    font-size:16px;
    line-height:1.6;
}


/* ==========================
   HEADER
========================== */

.header{

    background-image:url("images/hero.jpg");
    background-size:cover;
    background-position:center;

    padding:40px 20px;

}

.logo-col img{

    max-width:220px;

    margin:0 auto;

}

.title-col{

    text-align:center;

}

.title-col h1{

    text-shadow:0 0 7px rgba(0,0,0,.45);

}


/* ==========================
   BIO
========================== */

.bio-section{

    padding:50px 20px;

}

.bio-img{

    padding-right:30px;

}

.bio-text h2{

    margin-top:-5px;

}


/* ==========================
   SECTION ETE
========================== */

.section-ete{

    background-image:url("images/potager.jpg");

    background-size:cover;

    background-position:center;

    padding:40px 50px;

}

.green-box{

    background:rgba(62,112,12,.80);

    color:#ffffff;

    padding:20px;

}

.green-box h2{

    color:#ffffff;

}

.green-box p{

    color:#ffffff;

}

.green-box ul{

    padding-left:20px;

    margin:0;

}

.green-box li{

    color:#ffffff;

    margin-bottom:12px;

}

.tip{

    background:#ffffff;

    padding:20px;

    color:#3E700C;

    font-weight:bold;

}


/* ==========================
   RECETTE
========================== */

.recipe-section{

    padding:50px 20px;

}

.recipe-section h2{

    margin-top:0;

}

.recipe-left{

    padding-right:30px;

}

.ingredients{

    background:#D8E2CE;

    color: #000;

    padding:20px;

}

.ingredients h3{

    color:#3E700C;

}

.ingredients li{

    color:#000;

}

.preparation{

    padding-left:35px;

}

.preparation h3{

    color:#3E700C;

}

.preparation ol{

    padding-left:20px;

    color:#633E09;

    margin:0;

}


/* ==========================
   CREDITS
========================== */

.credits{

    background:#3E700C;

    padding:30px 20px;

}

.credits h2{

    color:#ffffff;

    margin-bottom:20px;

}

.credits li{

    color:#ffffff;

}


/* ==========================
   FOOTER
========================== */

.footer{

    background:#111D05;

    color:#ffffff;

    padding:20px;

    text-align:left;

}

.footer p{

    color:#ffffff;

    margin:0;

}

.footer a{

    color:#ffffff;

    text-decoration:underline;

}

.unsubscribe-text{

    font-size:14px;

}


/* ==========================
   RESPONSIVE
========================== */

@media only screen and (max-width:600px){

.container{

    width:100% !important;

}

h2{

    font-size:27px;

}

h3{

    font-size:22px;

}

p,
li{

    font-size:14px;

}

.header{

    padding:30px 15px;

}

.logo-col,
.title-col{

    display:block;
    width:100% !important;
    text-align:center;

}

.title-col h1{

    font-size:35px;
    margin-top:15px;

}

.logo-col img{

    max-width:180px;
    margin:0 auto;

}

.bio-section,
.recipe-section{

    padding:25px 15px;

}

.bio-img,
.bio-text{

    display:block;
    width:100% !important;

}

.bio-img{

    padding-right:0;
    padding-bottom:20px;
    text-align:center;

}

.section-ete{

    padding:25px 15px;

}

.green-box{

    padding:15px;

}

.recipe-left,
.preparation{

    display:block;
    width:100% !important;

}

.recipe-left{

    padding-right:0;
    margin-bottom:20px;

}

.preparation{

    padding-left:0;

}

.credits{

    padding:20px 15px;

}

.footer{

    padding:15px;

}

.unsubscribe-text{

    font-size:12px;

}

}