body {
    margin: 0;
    background-color: #FFDFDB;
}

p {
    font-family: "Montserrat", sans-serif;
    font-weight: 300;
}

h2 {
    font: "Dela Gothic One";
    color: #CB5E75;
    font-size: 2.5rem; 
}

header {
    font: "Dela Gothic One";
    color: #CB5E75;
    text-align: center;
    font-size: 2.5rem;
}

.row {
     padding: 5vw;
     .col {
          img {
               width: 100%;
          }
     } 
}

@media screen and (min-width: 800px) {
     .row {
          display: flex;
          justify-content: space-between;

          .col {
               flex-basis: 47%;
               h2 {
                    margin-top: 0;
               }
          }
          &.two {
               flex-direction: row-reverse;
          }
     }
}

.accordion {
     border-bottom: 1px solid #bbb;
     .accordion-header {
          cursor: pointer;
          &:hover {
               color: #CB5E75;
          }
          h3:after {
               content: '\002b';
               float: right;
               font-size: 1.4em;
               font-weight: 100;
          }
     }
     .accordion-panel {
          height: 0;
          overflow: hidden;
          transition: all 300ms;
     }
     &.open {
          .accordion-header {
               color: #CB5E75;
               h3:after {
                    content: '\2013';
               }
          }
          .accordion-panel {
               height: auto;
               padding: 10px 0;
          }
     }
}