/*****************BELOW 2560 PX********************************/
@media (max-width: 160em) {
  h1 {
    margin-bottom: 3rem;
    margin-top: 5rem;
  }
  #firstContainer {
    display: flex;
    column-gap: 6rem;
    padding-top: 0rem;
    flex-direction: row;
  }
  .header-text {
    margin-bottom: 10rem;
  }
  .img-header {
    width: 100%;
    border-radius: 1rem;
  }
}

/*****************BELOW 1520 PX*********************************/
@media (max-width: 95em) {
  #header-logo {
    width: 15rem;
    position: relative;
    top: 450px;
    left: 660px;
  }
  h1 {
    margin-bottom: 3rem;
    margin-top: 5rem;
  }
  #firstContainer {
    display: flex;
    column-gap: 6rem;
    padding-top: 0rem;
    flex-direction: row;
  }
}
/*****************BELOW 1344 PX (for smaller desktops)***********/
@media (max-width: 84em) {
  #header-logo {
    width: 15rem;
    position: relative;
    top: 440px;
    left: 590px;
  }
  #firstContainer {
    display: flex;
    column-gap: 6rem;
    padding-top: 0rem;
    flex-direction: row;
  }
  h1 {
    margin-bottom: 3rem;
    margin-top: 1rem;
  }
  h2 {
    letter-spacing: 0.3rem;
  }

  .gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.6rem;
    padding: 1.6rem;
  }

  div.container {
    display: grid;
    justify-content: center;
    align-items: center;
    padding: 20px;
  }

  .footer-info {
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: center;
    align-items: center;
    gap: 4rem;
    font-size: 1.6rem;
    color: #767676;
  }
  .lorquianas-btn {
    text-align: center;
  }

  .btn:link .social-links {
    align-items: center;
    display: flex;
    align-items: center;
  }
}
/*************BELOW 1200 PX (for landscape tablets)************/
@media (max-width: 75em) {
  html {
    font-size: 56.25%;
  }
  #header-logo {
    display: none;
  }
  #firstContainer {
    display: flex;
    column-gap: 6rem;
    padding-top: 10rem;
    padding-bottom: 10rem;
    flex-direction: row;
  }

  main,
  footer {
    width: auto;
    display: flex;
    flex-direction: column;
    justify-items: center;
  }
  .gallery {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.6rem;
    padding: 1.6rem;
  }
  .section-testimonials {
    grid-template-columns: 1fr;
  }
  .btn--big {
    width: 20rem;
  }
  footer .container {
    display: grid;
    justify-content: center;
    align-items: center;
    padding: 20px;
  }
  .footer-info {
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: center;
    align-items: center;
    gap: 4rem;
    font-size: 1.6rem;
    color: #767676;
  }
}
/*****************TABLETS BELOW 1024 PX*****************/
@media (max-width: 64rem) {
  #header-logo {
    display: none;
  }
  header {
    padding-top: 4rem;
  }
  #firstContainer {
    display: flex;
    flex-direction: row;
    align-content: space-evenly;
    align-items: center;
    column-gap: 0rem;
    padding-top: 2rem;
    padding-bottom: 4rem;
  }

  .div-img-header {
    text-align: center;
  }
  .img-header {
    max-width: 80%;
    border-radius: 1rem;
  }
  #lorquianas {
    width: 100%;
    font-size: 7rem;
    margin-bottom: 4rem;
  }
  .header-text-box {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .header-text {
    width: 40rem;
    font-size: 2.6rem;
    margin-bottom: 4rem;
    line-height: 5rem;
    text-align: center;
  }
  h1 {
    font-size: 5.6rem;
    margin-bottom: 3rem;
  }
  #subtitle {
    font-size: 3.5rem;
    word-spacing: 1.8rem;
  }
  #shopFlowers {
    font-size: small;
    width: fit-content;
    justify-self: end;
  }
  .logos {
    gap: 5rem;
    width: 80rem;
  }

  .grid-cols {
    display: grid;
    grid-template-columns: 1fr 3fr 1fr;
    gap: 3rem;
  }

  .grid-flower-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5rem;
  }
  .section-testimonials {
    grid-template-columns: 1fr;
  }
  .grid-cols img {
    width: 100%;
    border-radius: 1rem;
  }
  .text-ED {
    font-size: 2.2rem;
    line-height: 5rem;
    align-self: center;
  }
  .section-cta {
    padding: 4.8rem 2rem 12.8rem;
  }
  .gallery {
    grid-template-columns: repeat(6, 1fr);
  }
  .btn--small {
    font-size: small;
    text-align: center;
  }
  .btn--big {
    width: 20rem;
  }
  footer .container {
    display: grid;
    justify-content: center;
    align-items: center;
    padding: 20px;
  }
  .footer-info {
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: center;
    align-items: center;
  }
}
/***************** PHONES BELOW 768 PX*****************/
@media all and (max-width: 48rem) {
  #header-logo {
    display: none;
  }
  header {
    width: 100%;
    padding-top: 0px;
  }
  #firstContainer {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    column-gap: 1rem;
    padding-bottom: 5rem;
    padding-top: 6rem;
  }

  .header-text-box {
    align-items: center;
  }
  .header-text {
    width: 100%;
    margin-bottom: 2rem;
    margin-top: 1rem;
    padding-top: 0;
    text-align: center;
  }
  #lorquianas {
    width: 100%;
    font-size: 10.5rem;
    margin-bottom: 3.5rem;
  }
  #subtitle {
    font-size: 3.6rem;
    letter-spacing: 2.2rem;
  }
  #shopFlowers {
    font-size: small;
    width: fit-content;
    margin-bottom: 3rem;
  }
  .img-header {
    width: 55%;
    border-radius: 1rem;
  }
  .div-img-header {
    text-align: center;
  }

  .logos {
    gap: 1rem;
    width: 100%;
    column-gap: 5rem;
  }

  h3 {
    font-size: 3rem;
  }
  .grid-3-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 4rem;
  }
  .self-intro {
    background-color: #f80874;
    padding: 1.5rem;
    border-radius: 1rem;
  }
  .grid-cols {
    display: grid;
    grid-template-columns: 3fr 1fr;
    align-items: center;
    justify-items: center;
    padding: 1rem 2rem;
  }
  .chair {
    display: none;
  }
  .text-ED {
    line-height: 3.5rem;
    font-weight: 200;
    width: 100%;
  }
  .grid-cols img {
    width: 100%;
    border-radius: 1rem;
  }
  .grid-flower-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 2rem;
    margin-bottom: 0;
  }
  .step-img-box:nth-child(1) {
    grid-row: 2;
  }
  .section-cta {
    width: 100%;
    padding: 0 3.2rem;
    margin: 0 auto;
  }
  .cta {
    grid-template-columns: 3fr 2fr;
  }
  .cta-img-box {
    background-image: linear-gradient(
        to right bottom,
        rgba(236, 124, 158, 0.35),
        rgba(245, 69, 136, 0.35)
      ),
      url("../form/DW160330-10847-Editar.jpg");
    background-size: cover;
    background-position: center;
  }
  .cta-text-box {
    padding: 4.8rem 3.4rem 6.4rem 3.4rem;
  }
  #heading-form {
    font-size: 3rem;
  }
  .cta-form {
    grid-template-columns: 1fr;
  }
  .available-products {
    font-size: 2rem;
  }
  .section-testimonials {
    margin-top: 24rem;
  }
  .testimonials-container {
    padding: 5.6rem;
  }
  .testimonials {
    grid-template-columns: 1fr 1fr;
  }
  .gallery {
    grid-template-columns: repeat(6, 1fr);
  }
  h4 .small-pieces {
    font-size: 4.2rem;
  }
  .btn--big {
    width: 20rem;
  }
  .heading-secondary {
    margin-bottom: 8rem;
    font-size: 3rem;
  }
  .footer-info {
    display: flex;
    flex-direction: column;
  }
}
/*****************PHONES UP TO 544 PX*********/

@media all and (max-width: 34em) {
  body {
    overflow-x: hidden;
  }
  #header-logo {
    display: none;
  }
  header {
    width: 100%;
    padding-top: 4rem;
    padding-bottom: 6rem;
    margin-top: 0rem;
  }
  #firstContainer {
    box-sizing: border-box;
    width: 100%;
    padding-top: 0px;
    padding-bottom: 10px;
    margin-top: 0rem;
  }
  .header-text-box {
    margin-top: 10px;
    max-width: 100%;
    align-items: center;
    justify-content: center;
  }
  #lorquianas {
    width: 100%;
    font-size: 3.7rem;
    letter-spacing: 0.7rem;
    margin-bottom: 2.2rem;
    margin-top: -10px;
    text-align: center;
  }
  #subtitle {
    font-size: 2.1rem;
    word-spacing: 1rem;
    text-align: center;
    line-height: 3rem;
    letter-spacing: 1.6rem;
    padding-bottom: 2rem;
  }
  .header-text {
    margin-top: 3rem;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    font-size: 2rem;
    line-height: 3rem;
    color: #ffffff;
    width: 100%;
    font-weight: 400;
    text-align: center;
  }
  #shopFlowers {
    font-size: small;
    width: fit-content;
    text-align: center;
    margin-bottom: 4.5rem;
  }
  .img-header {
    width: 100%;
    border-radius: 1rem;
  }
  .section-featured {
    width: 100%;
    margin-bottom: 0;
    padding-bottom: 8rem;
  }
  .logos {
    gap: 2rem;
  }
  .logos img {
    width: 30%;
  }
  .section-features {
    width: 100%;
  }
  .grid-3-cols {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    row-gap: 4rem;
  }
  .section-self-intro {
    width: 100%;
  }
  .grid-cols {
    padding: 3rem 0rem;
  }
  .grid-cols img {
    width: 100%;
    border-radius: 1rem;
  }
  .eugenia {
    width: 100%;
  }

  .img-logo {
    width: 100%;
  }
  .text-ED {
    line-height: 1.7;
    font-weight: 300;
  }
  .grid-cols {
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    justify-items: center;
  }
  .section-products {
    width: 100%;
  }
  .grid-flower-cols {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    row-gap: 6rem;
  }
  .small {
    margin-top: 0;
  }
  h4 {
    margin-top: 6rem;
  }
  .section-upon-request {
    width: 100%;
    margin-bottom: 0;
  }

  .grid-upon-request {
    display: grid;
    row-gap: 9.6rem;
    column-gap: 6.4rem;
    grid-template-columns: repeat(1, 1fr);
    align-items: center;
    margin-bottom: 10rem;
  }
  #step-text-2 {
    grid-row: 3 / span 4;
  }
  .section-cta {
    width: 100%;
    padding: 4.8rem 3.25rem 0rem;
  }
  .cta {
    grid-template-columns: 1fr;
  }
  .cta-img-box {
    height: 32rem;
    grid-row: 1;
  }
  .cta-text-box {
    padding: 3.2rem;
  }
  #heading-form {
    font-size: 3rem;
  }
  .cta-form {
    grid-template-columns: 1fr;
  }
  #select-where {
    font-size: 1.8rem;
  }
  .section-testimonials {
    width: 100%;
  }
  .testimonials-container {
    padding: 4rem;
  }
  .testimonials {
    grid-template-columns: 1fr;
    width: 100%;
  }
  .gallery {
    grid-template-columns: repeat(3, 1fr);
  }
  .footer {
    width: 100%;
  }
  .grid-footer {
    grid-template-columns: repeat(6, 1fr);
    padding: 0 3rem;
  }
  .logo-col,
  .address-col {
    grid-column: span 3;
  }
  .footer-info {
    display: flex;
    flex-direction: column;
  }
  .footer-logo {
    display: block;
    margin-bottom: 3.2rem;
  }
  .social-links {
    list-style: none;
    display: flex;
    gap: 2.4rem;
  }
  .nav-col {
    grid-row: 1;
    grid-column: span 2;
  }
}