html {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    font-family: 'Petit Formal Script', cursive;
    background: url("img/background.png") repeat fixed;
    color: black;
  }

  * {
    font-size: 20px;
    font-family: 'Open Sans', sans-serif;
    text-decoration: none;
  }
    h1, h2, h3 {
        font-family: 'Petit Formal Script', cursive;
    }

    h1 {
        color: #fff;
        font-size: 2.2pc;
        padding: 20px 0 20px 40px;
        position: absolute;
        bottom: 0;
        text-shadow: 1px 1px #111;

    }

    #homepage, header, main, article, footer { 
        margin: 0 auto;
        max-width: 1080px;
    }

    header {
        background: url("img/handmade-in-chiltern-cover-photo2.jpg") no-repeat center;
        background-size: cover;
        box-shadow: 0 0 10px 10px #fdebcc inset;
        height: 400px;
        display: block;
        position: relative;
    }

    article {  padding: 20px 0;}
    .background-img {
        height: 300px; 
        border-radius: 15px; 
    }
    .freshly-blossomed {
        background:url(img/handmade-in-chiltern-elderflowers.jpg) center;
        background-size: cover;
    }
    .elderflower-waffles{
        background:url(img/handmade-in-chiltern-elderflower-waffles.jpg) 0 80%;
        background-size: cover;
    }
    
    .elderflower-cordial {
        background:url(img/handmade-in-chiltern-product-250ml.jpg) center;
        background-size: cover;
    }

    #instafeed-container {
        display: flex;
        overflow: auto;
        margin: 0 0 30px 0;
    }

    #instafeed-container img {
        border-radius: 10px;
        display: inline-block;
        height:220px; 
        margin: 0 10px 10px 0; 
        width: auto; 
    }


    table {width: 50%;}

    footer#social-media {
        padding: 0 0 20px 0;
        text-align: center;
        left: 0;
    }
    footer#social-media p {font-size: 1pc;}

    footer#social-media img {margin: 0 1% 0 0;} 

    .add-indent {
    text-indent: 20px;
}
  
@media screen and (max-width: 600px) {
    html { background-size: 280px; width: 94%;padding: 0 3%;}
    h1 {font-size:1.7pc;}
    h2 {font-size:1.4pc;}
    p, a {font-size: 1.1pc;}

    #instafeed-container img { height: 200px; width:auto;}
    
    table {width:100%;}
    tr, td{ font-size: 1pc;}

    footer#social-media p { font-size: 0.9pc;}
}