
/* css for the dailyt leaf website */

/* Large screens */

    body {
    margin: 0;
    font-family: Georgia, serif;
    font-size: 1.1rem;
    line-height: 1.6;
    background: #f4f8ee;
    color: #2b2b2b;
}

    #wrapper {
    max-width: 900px;
    margin: auto;
    padding: 2rem;
    background: white;
}

    header {
    border-bottom: 10px solid #2f6b3a;
    padding-bottom: 1rem;
}

    header h1 {
    color: #2f6b3a;
    font-size: 3rem;
    margin: 0;
}

    header img {
    float: right;

}

    header p {
    color: #6b4a32;
}

    article {
    padding: 1rem 0;
    border-bottom: 1px solid #cfe3c8;
}

    article h2 {
    color: #2f6b3a;
    font-size: 1.6rem;
}

    article img {
    float: left;
    width: 38%;
    height: auto;
    margin: 0 1rem 1rem 0;
}

    footer {
    padding-top: 1rem;
    color: #6b4a32;
}

/* Medium screens: tablets (400px to 800px) */

    @media (max-width: 800px) {
    #wrapper {
        padding: 1rem;
 }

    header h1 {
        font-size: 2.2rem;
}

    header img {
        width: 80px;
        height: 80px;
  }

    article h2 {
        font-size: 1.35rem;
  }

  article img {
    width: 32%;
  }
}

/* Small screens: phones (less than 400px) */

@media (max-width: 399px) {
    body {
        font-size: 1rem;
        line-height: 1.4;
  }

  #wrapper {
    padding: 0.5rem;
 }

    header img,
    article img,
    .extra {
    display: none;
 }

    header h1 {
    font-size: 1.6rem;
 }

    article h2 {
    font-size: 1.15rem;
 }
    
    article {
    padding: 0.5rem 0;
 }

    footer {
    font-size: 0.8rem;
 }
}

