html {
  scroll-behavior: smooth;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  display: flex;
  justify-content: center;
  background: url(./img/products/desktop-bg-blurred.jpg);
  background-size: cover;
}
  .parent-container-mobile {  /* doesn't show up on desktop */
    display: none;
  }
  .parent-container-tablet {
    display: none;
  }
  .parent-container-desktop {
    display: flex;
    flex-direction: column;
    align-items: center;
    /*width: 72.92vmax;*/
    /*border: 1px solid red; /* debug */
  }
    .upper-container-desktop {
      display: flex;
      position: fixed;
      justify-content: center;
      align-items: flex-end;
      padding-top: 2.5vmin;
      padding-bottom: 2.5vmin;
      width: 100vmax;
      /*border: 1px solid blue; /* debug */
    }
      .desktop-logo {
        display: inline-block;
        max-width: 200px;      
      }
      .nav-container {
        display: flex;
        margin-left: 20vmin;
        justify-content: space-around;
         /*border: 1px solid green; /* debug */
      }
        .nav-link {
          font-family: 'Fira Sans', sans-serif;
          font-size: 25px;
          color: white;
          background: #F77777;
          text-decoration: none;
          padding: 1.25vmin 2.75vmin;
          border-radius: 1.25vmax;
          margin-left: 30px;
          box-shadow: 5px 2px 2px rgba(0,0,0,.25);
        }
        .nav-link:hover {
          font-family: 'Fira Sans', sans-serif;
          font-size: 25px;
          color: #F77777;
          background: white;
          text-decoration: none;
          margin-left: 30px;
          transition: .2s;
        }
    .mid-container-desktop {
      display: flex;
      flex-direction: column;
      align-items: center;
      /*width: 72.92vmax;*/
      padding: 1.25vmax;
      border-radius: 3.25vmax;
      background: rgb(250,250,250);
      width: 100vmax;
      max-width: 95vmax;
      box-shadow: .75vmax -.75vmax .5vmax rgba(0,0,0,.375);
      /*border: 1px solid red; /* debug */
    }
      /* about starts */
      .about-container {
        display: flex; 
        justify-content: center;
        align-items: center;
      }
        .about-images-container {
          display: flex;
          flex-direction: column;
          align-items: center;
          /*border: 1px solid green; /* debug */
        }
        .about-paragraph-container {
          margin-left: 5vmax;
          margin-bottom: 5vmax;
          max-width: 25vmax;
          max-height: 250px;
          /*box-shadow: 5px 2px 2px rgba(0,0,0,.25);*/
          padding: .125vmax;
          /*border: 1px solid blue; /* debug */
        }
          .about-paragraph {
            font-family: 'Martel', serif;
            font-size: 16px;
            line-height: 1.8;
          }
      /* about ends */
      /* shop starts */
      .shop-container {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;        
        margin-top: 2.5vmax;
        margin-bottom: -7.5vmax;
        max-width: 80vmax;
        flex-wrap: wrap;
        /*border: 1px solid red; /* debug */
      }
        .shop-item-container {
          display: flex;
          width: 70vmax;
          justify-content: space-around;
          align-items: center;
          margin: 3.75vmax 0;
          /*box-shadow: 5px 2px 2px rgba(0,0,0,.25);*/
          /*border: 1px solid green; /* debug */
        }
          .product-pic-desktop {
            max-width: 20vmax;
            border-radius: 2.5vmax;
            border: .25vmax #f77777 solid;
          }
          .item-name-large {
            font-family: 'Fira Sans', sans-serif;
            font-size: 40px;
            font-weight: lighter;

            margin-bottom: .5vmax;
          }
          .item-name-medium {
            font-family: 'Raleway', serif;
            margin: .75vmax 0;
            
          }
          .container-align {
            display: flex;
            margin: 1.25vmax;
            flex-direction: column;
            align-items: center;
            /*border: 1px solid blue; /* debug */
          }
            .item-description {
              font-family: 'Martel', serif;
              line-height: 2.1;
              font-size: 16px;
              margin-top: 2.5vmax;
              margin-bottom: 1.25vmax;
            }
            .instructions-button {
              display: flex;
              align-items: center;
              justify-content: center;
              width: 125px;
              height: 35px;
              background: #71D7FF;
              border-radius: 20px;
              box-shadow: 2px 5px 5px rgba(0,0,0,.5);
            }
              .instructions-button:hover {
              background: white;
              }
                .instructions-button:hover .instructions-link {
                  color: #71D7FF;
                }
              .instructions-link {
                color: white;
                font-weight: 500;
                font-family: 'Fira Sans', sans-serif;
                font-size: 14px;
                text-decoration: none;
              }
            .buy-button {
              display: flex;
              align-items: center;
              justify-content: center;
              margin-top: 16px;
              width: 200px;
              height: 50px;
              background: #F77777;
              border-radius: 30px;
              box-shadow: 2px 5px 5px rgba(0,0,0,.5);
            }
              .buy-button:hover {
                background: white;
              }
              .buy-button:hover .buy-link {
                color: #F77777;
              }
              .buy-link {
                color: white;
                font-weight: 500;
                font-family: 'Fira Sans', sans-serif;
                font-size: 22px;
                text-decoration: none;
              }
      /* shop end */
      /* instructions and contact start */
      .instructions-contact-parent-container {
        display: flex;
        justify-content: center;
        margin-top: 10vmax;
        margin-bottom: 2.5vmax;
      }
        .instructions-container {
          display: flex;
          flex-direction: column;
          max-width: 50%;
          /*border: 1px solid blue; /* debug */
        }
        .heading {
          font-family: 'Fira Sans', sans-serif;
          font-weight: 800;
          font-size: 22px;
        }
        /* instructions start */
        .for-use-container-parent {
          display: flex;
          margin-top: 1.25vmax;
          /*border: 1px solid red; /* debug */
        }
        .for-use-container {
          display: flex;
          flex-direction: column;
          flex-wrap: wrap;
          /*border: 1px solid green; /* debug */
          margin: 1.25vmax 1.25vmax;
        }
        .for-use-image-container {
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          /*border: 1px solid blue; /* debug */
          margin: .75vmax .25vmax;
        }
        .where-use-icon {
          max-width: 80px;
        }
        /* instructions end */
        /* contact start */
        .contact-container {margin-left: 2.75vmax;}
        .social-link-container {
          display: flex;
          flex-direction: column;
          margin: .5vmax;

        }
          .social-link {
            max-width: 400px;
            max-height: 100px;
            padding: .5vmax;
            border-radius: 50px;
            display: flex;
            background: white;
            flex-direction: row;
            align-items: center;
            text-decoration: none;
            color: black;
            box-shadow: 12px 5px 5px rgba(0,0,0,.25);
            margin-top: 1.75vmax;
          }
          .social-link-inactive {

            max-width: 400px;
            max-height: 100px;
            padding: .5vmax;
            border-radius: 50px;
            display: flex;
            margin-bottom: -1.5vmax;
            flex-direction: row;
            align-items: center;
            text-decoration: none;
            color: black;

            margin-top: 1.75vmax;
          }
          .social-icon {
            max-width: 42px;
            margin: 0 2.5vmax;
          }
            .social-name {
              font-family: 'Fira Sans', sans-serif;
              font-weight: 800;
            }
              .phone-num {
                min-width: 200px;
                margin-left: .25vmax;
                margin-top: .5vmax;
                list-style-type: none;
              }

        /* contact end */
      /* instructions and contact end */