@media only screen and (max-width: 1600px) {
  .title h3 {
    font-size: 3rem;
  }

  .title h5 {
    font-size: 2rem;
  }

  .my-button {
    font-size: 28px;
    padding: 15px;
    width: 200px;
  }

  .my-nav ul li a {
    font-size: 1.2rem;
  }
}

@media only screen and (max-width: 1200px) {
  .project-text {
    margin-bottom: 3rem;
  }
}

@media only screen and (max-width: 768px) {
  .title h3 {
    font-size: 2rem;
    margin-bottom: 0.8rem;
  }

  .title h5 {
    font-size: 1.5rem;
  }

  .my-button {
    font-size: 20px;
    padding: 10px;
    width: 130px;
  }

  .my-nav ul li a {
    font-size: 0.8rem;
  }

  #roy-pic {
    margin-bottom: 3rem;
  }
}

@media only screen and (max-width: 480px) {
  .title h3 {
    font-size: 1rem;
    margin-bottom: 0.4rem;
  }

  .title h5 {
    font-size: 0.8rem;
  }
}

@media only screen and (max-width: 380px) {
  .my-nav ul li a {
    font-size: 0.6rem;
  }

  .my-nav ul li {
    padding-right: 0.5rem;
  }
}