/* 1156px */
@media (max-width: 83.3125rem) {
  .footer-content-grid-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}

@media all and (max-width: 72.25em) {
  .product-wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media all and (max-width: 68.125rem) {
  /* product.html */
  .product-item-grid {
    grid-template-columns: 1fr;
  }

  .right-product-info {
    border-left: none;
    border-top: 2px solid black;
  }
}

@media all and (max-width: 66.875rem) {
  /* checkout.html */
  .checkout-grid {
    grid-template-columns: 1fr;
  }

  .right-checkout-grid {
    border-left: none;
    border-right: none;
    border-top: 2px solid black;
  }
}

@media all and (max-width: 72rem) {
  /* aboutus.html */
  .centered-content {
    position: absolute;
    padding: 2rem;
    top: 20%;
    left: 30%;
    transform: translate(-20%, -20%);
  }
}

@media all and (max-width: 51.8125rem) {
  /* aboutus.html */
  .centered-content {
    position: relative;
    top: 0%;
    left: 0%;
    transform: translate(0%, 0%);
  }

  .centered-content h1 {
    position: absolute;
    padding: 2rem;
    top: -50%;
    left: 30%;
    transform: translate(-20%, -80%);
  }
}

@media all and (max-width: 40.625rem) {
  /* aboutus.html */
  .centered-content h1 {
    top: -20%;
    left: 30%;
    transform: translate(-20%, -80%);
  }

  .centered-content h1 {
    font-size: 2.25rem;
  }
}

@media all and (max-width: 33.75rem) {
  /* aboutus.html */
  .centered-content h1 {
    font-size: 2rem;
  }
}

@media all and (max-width: 30rem) {
  /* aboutus.html */
  .centered-content h1 {
    top: -0%;
    left: 20%;
    transform: translate(-10%, -75%);
  }

  .centered-content h1 {
    font-size: 1.75rem;
  }

  .centered-content h2 {
    margin-top: 3rem;
  }
}

@media all and (max-width: 23.375rem) {
  /* aboutus.html */
  .centered-content h1 {
    position: static;
    padding: 0;
    top: 0%;
    left: 0%;
    transform: translate(0%, 0%);
  }

  .centered-content {
    position: static;
    top: 0%;
    left: 0%;
    transform: translate(0%, 0%);
  }
}

@media only screen and (min-width: 55.75rem) {
  /* product-listing.html */
  .left-quarter.categories {
    display: block;
    position: relative;
    transform: translateX(0);
    box-shadow: 0rem 0rem rgb(0 0 0 / 0%);
  }
}

@media all and (max-width: 55.75rem) {
  /* product-listing.html */

  .left-quarter.categories {
    grid-column: 1/13;
    border-bottom: 2px solid black;
    z-index: 50;
  }

  .right-content {
    grid-column: 1/13;
    height: auto;
  }

  .left-quarter.categories {
    position: fixed;
    bottom: 0rem;
    top: 10%;
    left: 0rem;
    transform: translateX(-100%);
    background-color: #e3e0d7;
    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1);
  }

  .left-quarter.categories.categories-slide-in {
    transform: translateX(0%);
    box-shadow: 0rem 0rem 200vw 200vw rgb(0 0 0 / 60%);
  }

  #categories-button-wrapper {
    display: block;
    padding: 1.5rem 2rem;
    border-bottom: 2px solid black;
  }

  .see-products-button {
    display: block;
  }
}

.categories-slide-in {
  transform: translateX(0%);
  box-shadow: 0rem 0rem 100vw 100vw rgb(0 0 0 / 50%);
}

@media (max-width: 64em) {
  h1 {
    font-size: 3rem;
  }
  h2 {
    font-size: 1.65rem;
  }
  h3 {
    font-size: 1.35rem;
  }

  #fonts-styling h4 {
    font-size: 1.15rem;
  }
  
  p {
    font-size: 1rem;
  }

  .product-listing-grid {
    padding: 2rem;
  }
}

@media all and (max-width: 64em) {
  /* product.html */
  .right-product-info {
    border-top: none;
    padding-top: 0;
  }

  .color_and_quantity {
    display: grid;
    grid-template-columns: 3fr 1fr;
  }
}

@media all and (max-width: 57.625rem) {
  /* product.html */
  .faq-shipping-grid {
    grid-template-columns: 1fr;
  }

  .shipping-info {
    border-left: none;
    border-top: 2px solid black;
  }
}

@media (max-width: 58em) {
  .left-quarter .side-menu {
    display: none;
  }
  .right-content {
    height: auto;
  }
  .color-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-content-grid-list {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
  }
}
@media screen and (max-width: 60rem) {
  .code-snippet {
    grid-template-columns: 1fr;
  }

  .hamburger-menu {
    visibility: visible;
    display: block;
  }

  .main-nav .pages-nav {
    display: none;
  }

  .main-nav .logo {
    float: none;
    position: static;
    top: 0%;
    left: 0%;
    transform: translate(0%, 0%);
  }

  .left-quarter .side-menu {
    display: none;
  }

  .left-quarter.side-menu {
    visibility: hidden;
    display: none;
  }

  .right-content.pattern-right-content {
    grid-column: 1/13;
    height: auto;
  }

  .right-content.citation-right-content {
    grid-column: 1/13;
    height: auto;
  }

  .right-content.citation-right-content h4 {
    font-size: 1rem;
  }

  .right-content.wireframe-right-content {
    grid-column: 1/13;
    height: auto;
  }

  .main-nav .cart a {
    font-size: 1.75rem;
  }
}

/* 776px */
@media screen and (max-width: 46.875rem) {
  h1 {
    font-size: 2.75rem;
  }

  .product-wrapper {
    grid-template-columns: 1fr 1fr;
  }

  .footer-content-grid-list {
    padding: 0;
  }

  .footer-input-grid input {
    width: 80%;
  }

  .footer-copyright {
    padding-left: 0;
    padding-right: 0;
  }
}

@media all and (max-width: 40rem) {
  /* checkout.html */
  .digital-wallet-pay {
    grid-template-columns: 1fr;
    row-gap: 1.25rem;
  }

  .summary-wrapper h4 {
    font-size: 1.25rem;
  }

  .summary-product {
    padding: 1.5rem;
  }

  .two-column-form-grid {
    grid-template-columns: 1fr;
  }
}

@media screen and (max-width: 33.125rem) {
  .product-wrapper {
    grid-template-columns: 1fr;
  }

  .bottom-div-line {
    border-bottom: 2px solid black;
  }

  .product {
    border-right: none;
  }

  .pattern-product-wrapper .vase {
    border-bottom: 2px solid black;
  }
}

@media all and (max-width: 100rem) {
  /* confirmation.html */
  .right-checkout-grid.confirm-right-products {
    border-right: none;
  }
}

@media all and (max-width: 66.875rem) {
  /* confirmation.html */
  .right-checkout-grid.confirm-right-products {
    border-left: 2px solid black;
    border-top: none;
  }
}

@media all and (max-width: 50rem) {
  /* confirmation.html */
  .confirmation-grid {
    grid-template-columns: 1fr;
  }

  .left-confirmation-grid {
    padding: 2rem;
  }

  .right-checkout-grid.confirm-right-products {
    border-top: 2px solid black;
    border-left: none;
  }
}

@media all and (max-width: 85.375rem) {
  /* index.html */
  .welcome h3 {
    font-size: 2.75rem;
  }
}

@media all and (max-width: 79.375rem) {
  /* index.html */
  .welcome h3 {
    font-size: 2.5rem;
  }

  .white-box p {
    font-size: 0.9rem;
    padding: 1.75rem;
  }

  .intro-button-wrapper {
    width: 300px;
  }
}

@media all and (max-width: 78rem) {
  /* index.html */
  .welcome h3 {
    font-size: 2.35rem;
  }
}

@media all and (max-width: 68.75rem) {
  /* index.html */
  .welcome h3 {
    font-size: 2.25rem;
  }

  .white-box p {
    font-size: 0.8rem;
  }

  .intro-button-wrapper {
    width: 290px;
    /* top: 5.5rem; */
  }
}

@media all and (max-width: 66.5625rem) {
  /* index.html */
  .welcome h3 {
    font-size: 2.15rem;
  }

  .intro-button-wrapper {
    top: 0.5rem;
  }
}

@media all and (max-width: 64.0625rem) {
  /* index.html */

  .intro-button-wrapper {
    position: static;
    margin: auto;
    width: 650px;
  }

  .white-box p {
    font-size: 1rem;
    padding: 2rem;
  }

  .img-background {
    margin-bottom: 6rem;
  }

  .img-background img {
    width: 60%;
  }

  .yellow-box.top {
    top: 43%;
    left: 22%;
  }

  .yellow-box.bottom {
    top: 50%;
    left: 35%;
  }

  .welcome h3 {
    font-size: 2.5rem;
  }

  .three-feedback-grid,
  .three-product-grid {
    grid-template-columns: 1fr;
    row-gap: 3rem;
    padding-right: 9rem;
    padding-left: 9rem;
  }

  .shop-all-button .product-cta-button {
    width: 50%;
  }
}

@media all and (max-width: 61.875rem) {
  /* index.html */
  .yellow-box.bottom {
    top: 50%;
    left: 35%;
  }
}

@media all and (max-width: 61.875rem) {
  /* index.html */
  .welcome h3 {
    font-size: 2.35rem;
  }
}

@media all and (max-width: 57.8125rem) {
  /* index.html */
  .yellow-box.top {
    top: 40%;
  }

  .yellow-box.bottom {
    top: 47%;
  }

  .intro-button-wrapper {
    width: 550px;
  }
}

@media all and (max-width: 55.625rem) {
  /* index.html */
  .welcome h3 {
    font-size: 2.15rem;
  }

  .yellow-box.top {
    top: 39%;
  }

  .yellow-box.bottom {
    top: 46%;
  }

  .feedback-title h3,
  .product-title h3 {
    font-size: 2.15rem;
  }
}

@media all and (max-width: 51rem) {
  /* index.html */
  .welcome h3 {
    font-size: 2rem;
  }

  .intro-button-wrapper {
    width: 500px;
  }

  .feedback-title h3,
  .product-title h3 {
    font-size: 1.75rem;
  }
}

@media all and (max-width: 48.75rem) {
  /* index.html */
  .welcome h3 {
    font-size: 1.75rem;
  }

  .intro-button-wrapper {
    width: 500px;
  }

  .yellow-box.top {
    top: 38%;
  }

  .yellow-box.bottom {
    top: 45%;
  }

  .img-background img {
    width: 65%;
  }
}

@media all and (max-width: 44.375rem) {
  /* index.html */

  .welcome h3 {
    font-size: 1.65rem;
  }

  .intro-button-wrapper {
    width: 460px;
  }

  .yellow-box.top {
    top: 35%;
  }

  .yellow-box.bottom {
    top: 42%;
  }
}

@media all and (max-width: 38.75rem) {
  /* index.html */

  .welcome h3 {
    font-size: 1.5rem;
  }

  .intro-button-wrapper {
    width: 430px;
  }

  .yellow-box.top {
    top: 33%;
    left: 20%;
  }

  .yellow-box.bottom {
    top: 40%;
    left: 33%;
  }
}

@media all and (max-width: 37.1875rem) {
  /* index.html */
  .feedback-title h3,
  .product-title h3 {
    font-size: 1.5rem;
  }

  .three-feedback-grid,
  .three-product-grid {
    padding-right: 6rem;
    padding-left: 6rem;
  }

  .white-box p {
    padding: 1.5rem;
  }
}

@media all and (max-width: 35rem) {
  /* index.html */
  .intro-button-wrapper {
    width: 410px;
  }

  .yellow-box.top {
    top: 31%;
    left: 19%;
  }

  .yellow-box.bottom {
    top: 38%;
    left: 32%;
  }
}

@media all and (max-width: 34rem) {
  /* index.html */
  .welcome h3 {
    font-size: 1.25rem;
  }

  .intro-button-wrapper {
    width: 380px;
  }

  .yellow-box.top {
    top: 29%;
    left: 21%;
  }

  .yellow-box.bottom {
    top: 36%;
    left: 34%;
  }

  .img-background {
    margin-bottom: 4rem;
  }
}

@media all and (max-width: 31.25rem) {
  /* index.html */
  .welcome h3 {
    font-size: 1.15rem;
  }

  .intro-button-wrapper {
    width: 360px;
  }

  .yellow-box.top {
    top: 26%;
    left: 20%;
  }

  .yellow-box.bottom {
    top: 33%;
    left: 33%;
  }

  .feedback-title h3,
  .product-title h3 {
    font-size: 1.15rem;
  }

  .three-feedback-grid,
  .three-product-grid {
    padding-right: 4rem;
    padding-left: 4rem;
    padding-top: 2rem;
    row-gap: 2rem;
  }
}

@media all and (max-width: 28.4375rem) {
  /* index.html */

  .intro-button-wrapper {
    width: 330px;
    padding-bottom: 3rem;
  }

  .yellow-box.bottom {
    top: 32%;
    left: 35%;
  }

  .three-feedback-grid,
  .three-product-grid {
    padding-right: 3rem;
    padding-left: 3rem;
    padding-bottom: 3rem;
  }

  .yellow-box {
    padding: 1rem;
  }

  .img-background img {
    width: 70%;
  }

  .feedback-title,
  .product-title {
    padding-top: 3rem;
  }

  .shop-all-button .product-cta-button {
    margin-bottom: 3rem;
  }
}

@media all and (max-width: 25.625rem) {
  /* index.html */
  .welcome h3 {
    font-size: 1.1rem;
  }

  .intro-button-wrapper {
    width: 290px;
    padding-bottom: 5rem;
  }

  .yellow-box.top {
    top: 23%;
    left: 18%;
  }

  .yellow-box.bottom {
    top: 29%;
    left: 33%;
  }

  .feedback-title h3,
  .product-title h3 {
    font-size: 1rem;
  }

  .three-feedback-grid,
  .three-product-grid {
    padding-right: 2rem;
    padding-left: 2rem;
  }
}

@media all and (max-width: 55.3125rem) {
  /* contact.html */
  .contact-grid {
    grid-template-columns: 1fr;
  }

  .left-contact {
    border-right: none;
    border-bottom: 2px solid black;
  }

  .left-contact,
  .right-contact {
    padding: 2rem;
  }
}

@media all and (max-width: 29.75rem) {
  /* contact.html */
  .send-button .product-cta-button {
    width: 100%;
  }
}

@media all and (max-width: 30.25rem) {
  /* error.html */
  .text-wrapper {
    padding: 5em 2em 5em 2em;
  }
}