/*--primary-color: #5FC9DC; /* skyblue */
/*--secondary-color: #EECB2B; /* yellow */
/*--accent1-color: #FFBFB7; /* pink */
/*--accent2-color: #1e1e24; /* black  */
/* mobile view */

body {
    background-color: #FFBFB7;
    font-family: 'Open Sans', sans-serif;
    font-size: 1.1em;
  }
  
  h2 {
    background-color: #5FC9DC;
    font-family: 'Cabin', sans-serif;
    font-size: 1.8em;
    font-weight: 400;
    margin-bottom: -18px;
  }
  
  main p {
    line-height:1.6em;
  }
  
  img{
    max-width: 100%;
  }
  
  header {
    align-items: center;
    display: grid;
    grid-template-columns: 110px auto;
  }
  
  nav a {
    color: #1e1e24;
    text-decoration: none;
  }
  
  nav a:hover{
    text-decoration: underline;
  }
  
  nav ul {
    list-style: none; /* removes the bullets! */
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(6em, 1fr));
  }
  
  nav ul li{
    text-align: center;
  }
  
  #content {
    max-width: 960px;
    margin: 0 auto;
  }
  
  .home-grid{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 1em;
  }
  
  .home-headline-1{
    grid-column: 1/4;
    grid-row: 1/2;
  }
  
  .home-paragraph-1{
    grid-column: 2/4;
    grid-row: 2/4;
  }
  
  .home-right-img {
    grid-column: 4/6;
    grid-row: 1/3;
  }
  
  .home-headline-2{
    grid-column: 3/6;
    grid-row: 4/5;
  }
  
  .home-paragraph-2{
    grid-column: 4/6;
    grid-row: 5/7;
  }
  
  .home-left-img{
    grid-column: 1/3;
    grid-row: 4/6;
  }
  
  .home-paragraph-3 {
    grid-column:1/6;
    grid-row:7/8;
    text-align: center;
    text-align: center;
  }
  
  #banner-image {
    width: 100%;
    height: auto;
  }
  
  .banner-box img{
    width: 100%;
  }
  
  footer{
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding:.5em;
    align-items: center;
  }
  
  .social{
    text-align: right;
  }
  
  header, footer{
    background-color:white;
    color: black;
  }
  
  .color1{
    background-color: #FFBFB7;
  }
  .color2{
    background-color: #5FC9DC;
  }
  .color3{
    background-color: white;
  }