@font-face {
  font-family: 'Quicksand';
  font-stretch: 100%; /* Note that font-stretch is a % of normal width */
  font-weight: 200 600;
  src: url(Quicksand-VariableFont_wght.ttf) format('truetype');
}
    body {
      font-size: 13px;
      font-family: 'Quicksand', sans-serif;;
      font-weight: 400;
      width: 100%;
      margin: auto;
      background-color: #fff;
      line-height: 1.5;
    }
    a {
      font-weight: 500;
      color: #004226;
    }
    .footer a {
      color: #fff;
      font-weight: 400;
    }
    .hero p {display: none;}
    h1 {
      text-transform:uppercase;
      color:#fcf8f3;
      font-weight: normal;
      font-size:60px;
      letter-spacing:15px;
      padding:65px;
      text-align:center;
      margin:0px;
      background-image: url(gradient.jpg);
    }
    .section h2 {
      font-size:46px;
      color: #004226;
      font-weight: 400;
      text-align: center;
      margin: 0px;
      padding: 40px 10px 10px;
      line-height: 1;
    }
    .header {
      background-color: #004226;
      text-align: center;
    }
    .wrapper {
      width: 1300px;
      margin-left: auto;
      margin-right: auto;
    }
    img {max-width: 100%;height: auto;}
    .col_wrapper {
      color: #7dc4a7;
      display: flex;
      padding: 35px 0px 50px 40px;
      flex-wrap: wrap;
      max-width: 100%;
    }
    .col_wrapper h2 {
      color: white;
      font-size: 15px;
      font-weight: 500
    }
    .col_wrapper p {
      font-size: 12px;
      margin: 0px 0px 2px;
    }
    .column {
      width: 118px;
      text-align: left;
      margin-right: 22px;
    }
    .section.cream {
      background-color: #eedfc0;
      padding: 40px 0px;
    }
    .section.lightcream {
      background-color: #fcf8f3;
    }
    .section {
      padding-bottom: 40px;
      background-color: #fff;
    }
    .section p {
      text-align: center;
      font-size: 16px;
      padding-left: 150px;
      padding-right: 150px;
    }
    .footer {
      background-color: #004226;
      text-align: center;
      padding: 35px;
      color: white;
      background-image: url(gradient.jpg);
    }
    .gift-wrapper {
      display: flex;
      padding: 10px;
      box-sizing: border-box;
      flex-flow: wrap;
    }
    .giftbox {
      background-color: #004226;
      text-align: center;
      color: white;
      background-image: url(gradient.jpg);
      background-size:cover;
      background-position: center;
      height: 420px;
      border-radius: 10px;
      box-shadow: 0px 0px 5px rgb(0 0 0 / 0.4);
      flex: 1 0 44%;
      margin: 20px;
      overflow: hidden;
      position: relative;
    }
    .giftbox h3 {
      font-size: 30px;
      line-height: 30px;
      font-weight: 400;
      margin:  30px 10px 20px;
    }
    .giftbox p {
      font-size: 14px;
      padding-left: 40px;
      padding-right: 40px;
    }
    .giftbox img {
      position: absolute;
      bottom: 0px;
      left: 0px;
    }
    #cookiescript_buttons {
      box-sizing: border-box;
    }
  /* styles for tablet devices */
  @media only screen and (min-width: 600px) and (max-width: 991px) {

  }
  
  /* styles for mobile devices */
  @media only screen and (max-width: 600px) {
    body {
      font-size: 12px;
      width: 100%;
      margin: 0;
    }
    .wrapper {width: 100%;} 
    .column {
      box-sizing: border-box;
      width:40%;
      margin-right: 10%;
    }
    .col_wrapper {padding: 35px;}
    .section h2 {font-size: 34px;}
    .section p {
      padding-left: 40px;
      padding-right: 40px;
    }
    h1 {
      font-size: 30px;
      letter-spacing: 5px;
      padding: 35px;
      background-size: cover;
    }
    .giftbox {
      height: 369px;
    }
    .giftbox p {
      padding-left: 20px;
      padding-right: 20px;
    }
    .footer {
      background-size: cover; 
    }
  }