/*Typical Device Breakpoints

    Pequenas telas: até 600px
    celular: de 600px até 768
    Tablet: 768px até 992px
    Desktop: 992px até 1200px
    Telas grandes: acima de 1200px

*/

@media screen and (min-width: 768px) and (max-width: 992px) {
  /*HOME*/
  .logo img {
    width: 250px;
  }

  .txt-titulo {
    font-size: 2.25em;
  }

  div.txt-animado {
    font-size: 2em;
  }

  .txt {
    font-size: 1.25em;
  }

  .btn-agenda {
    width: 300px;
    height: 80px;
    font-size: 1.5em;
  }

  .logo-marca {
    height: 100px;
  }

  /*MENU*/
  .menu-item {
    font-size: 2.25em;
  }

  /*SOBRE*/
  .sobre .txt-section {
    font-size: 1.5em;
  }

  .sobre .title-section {
    font-size: 2.25em;
  }

  .sobre .btn-saiba {
    width: 200px;
    height: 60px;
    font-size: 1.25em;
  }

  /*DETAQUES*/
  .projeto .title-section {
    font-size: 1.5em;
  }
  .embalagem .swiper-pagination-bullet {
    width: 20px;
    height: 20px;
  }

  /*SAIBA*/

  .saiba .title-section {
    font-size: 2.25em;
  }

  .saiba a {
    width: 250px;
    height: 80px;
    font-size: 1.5em;
  }

  /*MARCAS*/
  .sobre-marcas .title-section {
    font-size: 2.25em;
  }

  .sobre-marcas .logo-marca {
    width: 200px;
  }

  .sobre-marcas .btn-saiba {
    width: 200px;
    height: 60px;
    font-size: 1.25em;
  }

  /*CONTATO*/
  .contato {
    align-items: center;
  }
  .contato .title-section {
    font-size: 2.25em;
  }

  .contato .txt-section {
    font-size: 1.25em;
  }

  /*FORMULÁRIO*/
  .form {
    width: 70vw;
  }

  .title {
    font-size: 2em;
  }

  .form label .input + span {
    font-size: 1.25em;
  }

  .submit {
    font-size: 1.25em;
  }

  /*IFRAME*/
  iframe {
    width: 450px;
    height: 450px;
  }

  /*FOOTER*/
  footer img {
    width: 250px;
  }

  footer .title-section {
    font-size: 2em;
  }

  footer .linha-decorativa {
    width: 90vw;
  }

  footer p {
    font-size: 1.5em;
  }

  /* BOTÕES ANCORAS */
  .button {
    width: 70px;
    height: 70px;
  }

  .svgIcon {
    width: 20px;
  }

  .svgWhatsapp {
    width: 70px;
    height: 70px;
  }
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
  /*HOME*/
  .main-page {
    height: 100%;
  }

  .logo img {
    width: 250px;
  }

  .txt-titulo {
    font-size: 2.25em;
  }

  div.txt-animado {
    font-size: 2em;
  }

  .txt {
    font-size: 1.25em;
  }

  .btn-agenda {
    width: 300px;
    height: 80px;
    font-size: 1.5em;
  }

  .logo-marca {
    height: 100px;
  }

  /*MENU*/
  .menu-item {
    font-size: 2.25em;
  }

  /*SOBRE*/
  .sobre .txt-section {
    font-size: 1.5em;
  }

  .sobre .title-section {
    font-size: 2.25em;
  }

  .sobre .btn-saiba {
    width: 200px;
    height: 60px;
    font-size: 1.25em;
  }

  /*DETAQUES*/
  .projeto .title-section {
    font-size: 1.5em;
  }
  .embalagem .swiper-pagination-bullet {
    width: 20px;
    height: 20px;
  }

  /*SAIBA*/
  .saiba .title-section {
    font-size: 2.25em;
  }

  .saiba a {
    width: 250px;
    height: 80px;
    font-size: 1.5em;
  }

  /*MARCAS*/
  .sobre-marcas .title-section {
    font-size: 2.25em;
  }

  .sobre-marcas .logo-marca {
    width: 200px;
  }

  .sobre-marcas .btn-saiba {
    width: 200px;
    height: 60px;
    font-size: 1.25em;
  }

  /*CONTATO*/
  .contato {
    align-items: center;
  }
  .contato .title-section {
    font-size: 2.25em;
  }

  .contato .txt-section {
    font-size: 1.25em;
  }

  /*FORMULÁRIO*/
  .form {
    width: 70vw;
  }

  .title {
    font-size: 2em;
  }

  .form label .input + span {
    font-size: 1.25em;
  }

  .submit {
    font-size: 1.25em;
  }

  /*IFRAME*/
  iframe {
    width: 450px;
    height: 450px;
  }

  /*FOOTER*/
  footer img {
    width: 250px;
  }

  footer .title-section {
    font-size: 2em;
  }

  footer .linha-decorativa {
    width: 90vw;
  }

  footer p {
    font-size: 1.5em;
  }

  /* BOTÕES ANCORAS */
  .button {
    width: 70px;
    height: 70px;
  }

  .svgIcon {
    width: 20px;
  }

  .svgWhatsapp {
    width: 70px;
    height: 70px;
  }
}

@media screen and (min-width: 1200px) {
  /*HOME*/
  .main-page {
    
    height: 100%;
  
    background: black;
    background: url("../Imagens/Frame\ 1.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .logo img {
    width: 250px;
  }

  .txt-titulo {
    width: 500px;
    margin: auto;
    font-size: 2.5em;
    transform: translateY(-100px);
  }

  div.txt-animado {
    font-size: 2.25em;
    transform: translateY(-100px);
  }

  .txt {
    font-size: 1.5em;
    transform: translateY(-100px);
  }

  .btn-agenda {
    width: 350px;
    height: 80px;
    font-size: 1.5em;
    transform: translateY(-50px);
    margin-bottom: 30px;
  }

  .btn-agenda:hover {
    transform: translateY(-65px);
  }

  .logo-marca {
    height: 100px;
    padding-bottom: 10px;
  }

  /*MENU*/
  .menu-item {
    font-size: 2.5em;
  }

  /*SOBRE*/
  .sobre {
    margin-top: 100px;
    margin-bottom: 100px;

  }
  .sobre img {
    width: 50%;
    height: auto;
    margin: auto;
    margin-bottom: 50px;
    margin-right: 20px;
  }
  .sobre .txt-section {
    margin-top: 40px;
    font-size: 1.5em;
    width: 60%;
    margin: auto;
    text-align: center;
  }

  .sobre .title-section {
    font-size: 2.25em;
    text-align: center;
    margin-bottom: 50px;
  }

  .sobre .btn-saiba {
    width: 250px;
    height: 60px;
    font-size: 1.5em;
    margin-top: 50px;
  }

  /*DETAQUES*/

  .embalagem {
    margin-bottom: 200px;
  }

  .projeto .title-section {
    font-size: 1.75em;
    margin-bottom: 50px;
  }

  .embalagem .swiper-pagination-bullet {
    width: 30px;
    height: 30px;
  }

  /*SAIBA*/
  .saiba {
    margin-bottom: 50px;
  }

  .fonte {
  display: flex;
  flex-direction: row;
}
  .saiba img {
    height: 800px;
  }

  .sobre .fonte p {
    padding: 20px;
  }

  .saiba .title-section {
    font-size: 2.5em;
    margin-top: 600px;
  }

  .saiba a {
    width: 300px;
    height: 100px;
    font-size: 1.5em;
  }

  /*MARCAS*/
  .marcas {
    width: 60%;
    margin-bottom: 50px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

  .sobre-marcas {
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateY(200px);
    margin-bottom: 100px;
  }

  .sobre-marcas .title-section {
    font-size: 2.25em;
  }

  .sobre-marcas .logo-marca {
    width: 250px;
  }

  .sobre-marcas .btn-saiba {
    width: 250px;
    height: 60px;
    font-size: 1.5em;
  }

  /*CONTATO*/
  .contato {
    transform: translateY(200px);
    align-items: center;
  }
  .contato .title-section {
    font-size: 2.25em;
  }

  .contato .txt-section {
    font-size: 1.25em;
  }

  /*FORMULÁRIO*/
  .form {
    transform: translateY(20px);
    width: 50vw;
  }

  .title {
    font-size: 2em;
  }

  .form label .input + span {
    font-size: 1.25em;
  }

  .submit {
    font-size: 1.25em;
  }

  .iframe {
    margin-top: 260px;
  }

  /*FOOTER*/
  .footer {
    margin-top: 50px;
    transform: translateY(-1250px);
  }
  
  footer img {
    width: 250px;
  }

  footer .title-section {
    font-size: 2em;
  }

  footer .linha-decorativa {
    width: 90vw;
  }

  footer p {
    font-size: 1.5em;
  }

  /* BOTÕES ANCORAS */
  .button {
    width: 70px;
    height: 70px;
  }

  .svgIcon {
    width: 20px;
  }

  .svgWhatsapp {
    width: 70px;
    height: 70px;
  }
}
