@media screen and  (max-width: 1023px){
  body {
    margin: 0 10px;
    font-size: 120%;
    background-color: hwb(241 50% 0%);
  }

  section {
    border:  hwb(219 20% 0%) 5px solid;
    margin: 10px;
    background-color: hwb(241 50% 0%);
  }

  article {
    border: hwb(239 0% 0%) 5px solid;
    margin: 20px 10px;
     background-color: hwb(184 20% 0%);
  }
  main {
  display: block;
  padding: 10px;
  background-color: white;
}
body {
  background-color: hwb(241 50% 0%);
  font-family: sans-serif;
}
h2 {
  margin: 0;
  background-color: hwb(263 20% 0%);
}

h3 {
  margin: 0;
  padding-left: 5px;
  background-color: hwb(234 0% 0%);
  color: white;
}
}
@media screen and (max-width: 800px){
  body {
    margin: 0 10px;
    font-size: 120%;
    background-color: hwb(290 50% 0%);
  }

  section {
    border:  hwb(345 20% 0%) 5px solid;
    margin: 10px;
    background-color: hwb(0 50% 0%);
  }

  article {
    border: hwb(288 0% 0%) 5px solid;
    margin: 20px 10px;
     background-color: hwb(320 20% 0%);
  }
  main {
  display: block;
  padding: 10px;
  background-color: white;
}
body {
  background-color: hwb(332 50% 0%);
  font-family: sans-serif;
}
h2 {
  margin: 0;
  background-color: hwb(345 20% 0%);
}

h3 {
  margin: 0;
  padding-left: 5px;
  background-color: hwb(0 0% 0%);
  color: white;
}

}

@media screen and (min-width: 1024px){
  body {
    margin: 0 20%;
    font-size: 200%;
    background-color: hwb(46 50% 0%);
  }

  section {
    border:  hwb(0 20% 0%) 5px solid;
    overflow: auto;
    margin: 10px 10px 20px;
     background-color: hwb(19 50% 0%);
  }

  article {
    float: left;
    width: 40%;
    margin: 10px 4%;
  }
  main {
  display: block;
  padding: 10px;
  background-color: white;
}
body {
  background-color: hwb(32 50% 0%);
  font-family: sans-serif;
}
h2 {
  margin: 0;
  background-color: hwb(22 20% 0%);
}

h3 {
  margin: 0;
  padding-left: 5px;
  background-color: hwb(7 0% 0%);
  color: white;
}
}

/*global*/
h1 {
  margin: 0;
  text-align: center;
}

p {
  margin: 5px;
}

footer p {
  margin: 10px 0;
  font-size: 0.75rem;
}