header {
  text-align:center;
}

body {
    background-color: black;
    color:red;
    font-size:1.35vw;
}

section {
    display: none;
  }
  section:target {
    display: block;
  }

ul {
  display: flex;
  flex-direction:row;
  justify-content: space-around;
}

main {
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;
}

#one {
  grid-column:1;
}

#two {
  grid-column:2;
}

#three {
  grid-column:3;
}

#four {
  grid-column:4;
}

#one, #two, #three, #four {
  @media screen and (max-width:599px){
    width:100%
  }
@media screen and (min-width:600px){
    width:90%
  }
@media screen and (min-width:1200px){
    width:80%
}
}

img {
@media screen and (max-width:599px){
    width:30%
  }
@media screen and (min-width:600px){
    width:20%
  }
@media screen and (min-width:1200px){
    width:10%
}
}


