/* media queries for different screen sizes

- cellphone: 600px
- tablet or small laptop: 768px
- full hd: 1024
*/

.content {
    width: 100%;
}

/* cellphone */
@media (max-width: 600px) {
  body {
    width: 100%;
  }
  .container h1 {
    font-size: 1.5rem;
  }
  .container p {
    font-size: 1rem;
  }
  .container img {
    width: 100%;
  }
}

/* tablet or small laptop */
@media screen and (min-width: 600px) {
  body{
    width: 80%;
  }
  .container h1 {
    font-size: 2rem;
  }
  .container p {
    font-size: 1.5rem;
  }
  .container img {
    width: 100%;
  }
}

/* full hd */
@media screen and (min-width: 1024px) {
  body {
    width: 80%;
  }
  .container h1 {
    font-size: 3rem;
  }
  .container p {
    font-size: 2rem;
  }
  .container img {
    width: 100%;
  }
}