@media (max-width: 1500px){
  #wholepageDiv{
    margin:4%;
    margin-top: 2%;
  }

  #logo img {
    max-width: 25%;
  }
}


@media (max-width: 1200px){

  .projectgalleryWrapper {
    max-width: 65%;
  }
  #aboutMe{
    width:75%;
  }
  .galleryWrapper{
    max-width: none;
  }

  #smaller img{
    max-width: 84%;
  }
  .mediaButtons button{
    width: 10%;
  }
  #contentWrapper {
    flex-direction: column;
  }

  #contentWrapper img{
      margin-top:7%;
    }

  .centeredVideo video {
      max-width: 90%;
  }
  .centeredImg img {
    max-width: 90%;
  }
  #aboutMe {
    margin-top: 280px;
  }
}

@media (max-width: 880px){
  #aboutMe p{
    font-size:2em;
  }
  h1{
    font-size:3.5em;
  }
  h2{
    font-size:2.5em;
  }

  .mediaButtons button{
    width: 12%;
  }

  .projectgalleryWrapper {
    max-width: 90%;
  }
  #footer p{
    font-size:1.4em;
  }
  
  .pageNavigation{
    margin-top:15%;
  }
  
  #navTitle h1{
    font-size:2.8em;
  }

}

@media (max-width: 780px){
  #aboutMe p{
    font-size:1.8em;
  }
  #logo img {
    max-width: 35%;
  }

  #contentWrapper{
    margin-top:16%;
  }

  #footer{
    padding-top:3%;
    padding-bottom:3%
  }
}

@media (max-width: 730px){
  #aboutMe{
    margin-top:400px;
  }

  .mediaButtons button{
    width: 15%;
  }
  #wholepageDiv{
    margin:3%;
  }
  #footer p{
    padding-left: 15%;
    padding-right: 15%;
  }

} 

@media (max-width: 570px){
  .mediaButtons button{
    width: 18%;
  }
  #navTitle h1{
    font-size:2.5em;
  }
}

@media (max-width:500px){
  #logo img {
    max-width: 60%;
  }

  .centeredText{
    margin-left: 8%;
    margin-right: 8%;
  }

  #aboutMe p{
    font-size:1.7em;
  }

  .sectionWrapper h1{
    font-size:1.3em;
  }

  h1{
    font-size:3.7em;
  }
  h2{
    font-size:1.8em;
  }

  p{
    font-size:1.7em;
  }

  #footer p{
    font-size:1.2em;
  }

}

@media (max-width: 400px){
  #aboutMe{
    margin-top:300px;
  }
  #navTitle h1{
    font-size:2em;
  }
}