@font-face {
    font-family: 'LucidaHandwritingItalic';
    src: url('../fonts/LucidaHandwriting-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
body {
    margin: 0;
    font: normal 1em / 1.5em sans-serif;
} 
#container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
#container div{
    width: 50%;
    background-size: cover;
    background-repeat: no-repeat;
}
h1, #container h2 {
    font-weight: normal;
    text-align: center;
}
#container h2 {
    font: normal 1.8em 'LucidaHandwritingItalic',cursive,sans serif;
    color: #f2e2d5;
}
#container div:nth-of-type(1),
#container div:nth-of-type(4),
#container div:nth-of-type(5){
    padding-top: 33.37%;
}
#container div:nth-of-type(1){
    background-image: url(../images/section1-lc.jpg);
}
#container div:nth-of-type(4){
    background-image: url(..//images/section2-lc.jpg);
}
#container div:nth-of-type(5){
    background-image: url(../images/section3-lc.jpg);
}

#container div:nth-of-type(2),
#container div:nth-of-type(3),
#container div:nth-of-type(6){
    box-sizing: border-box;
    padding: 1em;
    background-color: #3e285e;
    color: #fff;
}
#container p {
   width: 90%;
   padding: 1em 0;
   margin: 1em auto;
}
@media ( max-width:  48em ) {
#container {
    flex-direction: column;
 }
#container div {
    width: 100%;
 }
#container div:nth-of-type(1),
#container div:nth-of-type(4),
#container div:nth-of-type(5){
    padding-top: 66.75%
}
#container div:nth-child(1) { order: 1; }
#container div:nth-child(2) { order: 2; }
#container div:nth-child(3) { order: 4; }
#container div:nth-child(4) { order: 3; }
#container div:nth-child(5) { order: 5; }
#container div:nth-child(6) { order: 6; }
}