.hyperspan{
  position:absolute;
  width:100%;
  height:100%;
  left:0;
  top:0;
  z-index:1;
}

.section-spacer{
 position: relative; 
}

.jcc-page{
  background-color: white; 
}

.jcc-join{
    margin: 8rem auto auto auto;
    display: flex;
    width: 90%;
}

.jcc-descr-row{
  display: flex;
  justify-content: space-evenly;
  margin: 5rem auto;
  margin-bottom: 0px;
}

.jcc-descr-col1{
  width: 43%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-left: 4%;
  padding-top: 2%;
  z-index: 1;
}

.jcc-descr-col2{
  width: 35%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 1;
}

.jcc-right-img{
  width: 100%;
  height: 100%;
  position: relative;
  z-index: inherit;
}

.jcc-above-header{
 display: flex;
 flex-direction: row;
 justify-content: space-evenly;
 margin: 5% 0% 5% 0%; 
}

.jcc-above-header-left{
    width: 70%;
    display: flex;
    flex-direction: column;
    font-size: 3rem;
    font-family: 'Suisse Int Cond Semi';
    color: white;
}

.jcc-above-header-right{
 display: flex;
 flex-direction: column;
 width: 12%;
}

.jcc-header-text{
    height: auto;
    padding: 0px 5px 0px 5px;
    position: relative;
    text-align: -webkit-auto;
}
.jcc-header-text p{
 text-align: center;
 font-size: 2.25rem;
 font-family: "SuisseWorks", "serif";
 color: white;
 font-weight: 400;
 margin-top: 5%;
}
.jcc-header-text b{
  font-family: 'Suisse Int Cond Semi';
}
.jcc-whiteline{
    
}
.jcc-descr-header{
  font-size: 2.25rem;
  font-family: "BrandonGrotesque-Light", "serif";
  font-weight: bold;
  color: #717070;
}

.option1-paragraph{
    font-size: 2.25rem;
    font-family: "BrandonGrotesque-Light", "serif";
    font-weight: bold;
    color: #717070;
 
}
.join-text-paragraph1 {
    font-size: 3.25rem;
    font-family: "SuisseWorks", "serif";
    color: #124573;
    font-weight: 400;
    margin-top: 4%;
    margin-bottom: 3%;
}
.join-text-paragraph1 b{
    font-family: 'Suisse Int Cond Semi';
  	font-weight: 800;
}
.join-text-paragraph2
{
    font-size: 2.25rem;
    font-family: "BrandonGrotesque-Light", "serif";
    font-style: italic;
    color: #124573;
    font-weight: bold;
    
}

.jcc-image2{
  	height: auto;
    width: 85%;
    position: relative;
    left: 25%;
    margin-top: 15%;
}

.join-image-right{
 margin-top: 1.0rem; 
}

.join-image-right img{
 height: 100%;
 width: 100%; 
}

.jcc-option1-section,
.jcc-option2-section{
  position: relative;
}

.green-left{
    position: absolute;
    width: 32%;
    top: -7%;
    z-index: 0;
}

.green-right{
 position: absolute;
 width: 25%;
 z-index: 0;
 left: 75%;
 top: 8%;
 
}

.green3{
 position: absolute;
 width: 30%;
}

.blue-underline{
  color: #124573;
  font-weight: bold;
  text-decoration: underline;
}

.option-1-header-top{
 font-family: 'Suisse Int Cond Semi';
 color: #124573;
 margin: auto;
 font-size: 7rem; 
}

.option1-header{
 font-size: 9rem;
 font-family: "SuisseWorks", "serif";
 color: #124573;
 font-weight: 400; 
}

.jcc-option1-headtext{
 text-align: right;
 width: 85%;
 padding-bottom: 5%;
}

.jcc-option2-headtext{
 text-align: left;
 padding-left: 10%;
 padding-bottom: 5%;
}

.jcc-option1-offerings{
 position: relative;
 z-index: 1;
 padding-bottom: 5%;
 width: 85%;
 margin: 0 auto;
 display: flex;
 flex-flow: row wrap;
 justify-content: flex-start;
}

.offering-arrow{
 	width: 15%;
    display: flex;
    flex-direction: column;
    padding-top: 5%;
}

.arrow-price{
 display: flex;
 flex-direction: row;
 width: 85%;
 margin-top: auto;
}

.jcc-offerings-col{
    width: 33.3%;
    height: auto;
    flex-direction: column;
    padding-left: 3%;
    position: relative;
    display: flex;
    flex-flow: column nowrap;
}

.jcc-offerings-mid{
    width: 33.3%;
    border-left: 3px solid #c9d8b9;
    border-right: 3px solid #c9d8b9;
    height: auto;
    flex-direction: column;
    padding-left: 3%;
    position: relative;
    display: flex;
    flex-flow: column nowrap;
}

.jcc-main-head{
  font-family: 'Suisse Int Cond Semi';
  font-size: 7rem;
}

.jcc-sub-head{
 font-family: 'Suisse Int Cond Semi';
 color: #124573;
 font-size: 7rem;
}

.jcc-select{
  text-align: center;
  border: 3px solid #124573;
  width: 75%;
  font-size: 2.5rem;
  font-family: 'Suisse Int Cond Semi';
  color: #124573;
  padding: 5% 10% 5% 10%;
  position: relative;
  margin-top: auto;
}

.jcc-disclaimer{
 font-family: "BrandonGrotesque-Light", "serif"; 
 text-align: center;
 font-style: italic;
 color: #717070;
 font-weight: bolder;
 font-size: 1.5rem;
}

.chill-perks-section{
 position: relative; 
 display: flex;
 flex-direction: column;
 width: 100%;
}

.chill-perks-top{
  position: relative;
  display: flex;
  flex-direction: row;
  width: 85%;
  top: 5vh;
}

.chill-perks-bottom{
 position: relative;
 display: flex;
 flex-direction: row;
 padding-bottom: 10vh;
}

.perks-panel-container{
    height: auto;
    width: 88%;
}

.perks-img-1,
.perks-img-2{
 position: relative;
 width: 100%;
}

.perks-img-1 img{
 height: 100%;
 width: 100%;
}

.perks-img-2 img{
 height: 100%;
 width: 75%;
 float: right;
}

.chill-perks-left-col-top{
 position: relative; 
 display: flex;
 flex-direction: column;
 width: 45%;
}

.chill-perks-left-col-bottom{
 position: relative; 
 display: flex;
 flex-direction: column;
 width: 55%;
}

.chill-perks-right-col-top{
 text-align: right;
 width: 55%;
 height: 85%;
 position: relative; 
 display: flex;
 flex-direction: column;
}

.chill-perks-right-col-bottom{
 text-align: right;
 padding-left: 10%;
 padding-right: 13%;
 width: 45%;
 position: relative; 
 display: flex;
 flex-direction: column;
}


.chill-perks-right-col-bottom p{
  font-size: 2.25vw;
  font-family: "BrandonGrotesque-Light", "serif";
  color: #717070;
  font-weight: bold;
  padding-bottom: 45px;
}

.perk-callout{
 color: #124573;
 font-weight: bolder;
}

.perks-header-container{
 position: relative;
 width: 100%;
}

.chill-perks-header1{
 color: #c9d8b9;
 font-family: "SuisseWorks", "serif";
 font-weight: 400;
 font-size: 4rem;
 margin-bottom: 5%;
}

.chill-perks-header1 b{
  font-family: 'Suisse Int Cond Semi';
  font-weight: 800;
}

.chill-perks-header2{
  font-family: 'Suisse Int Cond Semi';
  font-size: 7rem;
}

.chill-perks-header3,
.chill-perks-header4{
    font-family: 'Suisse Int Cond Semi';
    color: #124573;
    font-size: 7rem;
}

.offering-descr{
  font-size: 1.5rem;
  font-family: "BrandonGrotesque-Light", "serif";
  color: #717070;
  font-weight: bold;
  width: 75%;
}

.offering-price{
    font-family: 'SuisseWorks';
    color: #124573;
    font-size: 3.0rem;
    display: flex;
    flex-direction: column;
    padding: 16% 0% 5% 8%;
    text-align: right;
}

.price-sub{
  display: block;
  text-align: right;
  font-size: 2rem;
  font-style: italic;
}

.jcc-aside-letter{
 font-family: "Suisse Int Cond Semi";
 color: #c9d8b9;
 font-size: 4.78rem;
 text-transform: uppercase;
 transform: rotate(25deg);
 margin: auto auto 1rem auto; 
}

.community-text{
 text-align: center; 
 color: white;
 padding: 2%;
}

.community-header{
  font-family: "SuisseWorks";
  font-size: 5vw;
}

.community-header b{
  font-family: 'Suisse Int Cond Semi'; 
}

.community-descr{
  font-size: 2.25rem;
  font-family: "BrandonGrotesque-Light", "serif";
  font-weight: bold;
  padding: 0% 10% 0% 10%;
}

.jcc-billing-block-paragraph{
  font-family: "BrandonGrotesque-Light";
  color: #717070;
  font-weight: bold;
  font-size: 2.25rem;
  width: 80%;
  margin-bottom: 2rem;
}

.jcc-option2-section{
  margin-top: 5%;
}

.jcc-option2-headtext{
  display: flex;
  flex-direction: column;
  width: 85%
}

.chill-bill-top-right{
  display: flex;
  flex-direction: column;
  width: 15%;
}

.option2-header-container{
 display: flex;
 flex-direction: row;
 position: relative;
}

.money1{
   position: absolute;
   width: 15%;
   top: -5%;
   left: 75%;
}

.money2{
  position: absolute;
  width: 15%;
  top: 40%;
  left: 80%;
}

.money3{
  position: absolute;
  width: 15%;
  top: 60%;
  left: 75%;
}

.single-bill{
  position: absolute;
  width: 15%;
  left: 2%;
  top: -40%;
 
}

.option-2-header-top{
 font-family: 'Suisse Int Cond Semi';
 color: #124573;
 font-size: 8rem; 
}

.option2-paragraph{
  font-size: 3rem;
  font-family: 'Suisse Int Cond Semi';
  color: #124573;
  text-transform: uppercase;
  margin-top: 2%;
}

.underline{
 text-decoration: underline;
 text-transform: uppercase;
 font-family: 'Suisse Int Cond Semi'; 
}

.members-only-callout{
  color: white;
  background-color: #124573;
  font-size: 3.5rem;
  text-align: center;
  margin-top: 5%;
  position: relative;
}

.members-only-callout p{
 padding: 5% 3% 5% 3%; 
}

.members-only-callout a{
 color: inherit;
 text-decoration: none;
}

.super-head{
   font-family: 'Suisse Int Cond Semi';
   color: #124573;
   font-size: 3rem;
   text-transform: uppercase;
   font-style: italic;
}

.price-sub2{
  display: block;
  text-align: right;
  font-size: 1.5vw;
  font-style: italic;
  color: gray;
}

.club-chill-signup{
  background-color: #124573;
  text-align: center;
}

.club-chill-join-header{
  padding: 5% 0% 2% 0%;
  color: #c9d8b9;
  font-family: "SuisseWorks";
  font-size: 7vw;
}

.upper-format{
  font-family: 'Suisse Int Cond Semi'; 
  text-transform: uppercase;
}

.form-container{
  display: block;
  text-align: center;
}

.jcc-form{
   display: inline-block;
   margin: 0 auto 4% auto;

   width: 350px;
   max-width: 90%;
}

#jcc-form-options{
  color: #ff7a6b;
  margin-top: 2%;
}

.picklist-label{
 color: #c9d8b9;
 font-family: "SuisseWorks";
 font-size: 1.5rem; 
 float: left;
}


/* Responsive START*/
/* Tablets, Landscape */
@media (min-width: 1024px) and (max-width: 1399px) and (-webkit-min-device-pixel-ratio: 2){
  .jcc-main-head{
   font-size: 6rem;
  }
  
  .jcc-sub-head{
   font-size: 6rem; 
  }
  
  .offering-descr{
   font-size: 1.75rem; 
  
  }
  
  .offering-price{
   padding: 10% 0% 5% 5%;
   font-size: 1.75rem; 
  }
  
  .super-head{
    font-size: 4rem; 
  }
  
  .jcc-select{
   font-size: 2.5rem; 
   position: relative;
  }
  
  .chill-perks-bottom{
   padding-bottom: 5%; 
  }
  
  .chill-perks-header1,
  .chill-perks-header2,
  .chill-perks-header3,
  .chill-perks-header4{
   font-size: 3rem; 
  }
  
  .marketing-jumbotron{
   height: 90vh; 
  }
  
  .jumbotron-main{
    height: 100vh;
  }
  
  .option1-paragraph{
   font-size: 1.75rem; 
  }
  
  .option1-header{
   font-size: 5.5rem; 
  }
  
}


@media (min-width: 768px) and (max-width: 1023px) and (-webkit-min-device-pixel-ratio: 2){
  .green-left,
  .green-right,
  .green3,
  .money1,
  .money2,
  .money3,
  .single-bill{
   display: none; 
  }
  
   .main{
    padding-top: 10px; 
   }
  
   .jumbotron-main{
     height: 110vw;
   }
  
   .jcc-above-header{
     margin: 0% 0% 5% 0%; 
   }
  
   .jcc-above-header-left{
     font-size: 3.5rem;
   }
  
  .jcc-header-text p{
    font-size: 3.5rem;
  }
  
  .jcc-descr-row{
    margin: 1rem auto;
  }
  
  .jcc-descr-header{
   font-size: 1.75rem; 
  }
  
  .jcc-descr-col1{
    width: 100%;
  }
  
  .jcc-descr-col2{
    display: none;
  }
  
  .join-text-paragraph1{
   font-size: 4rem; 
  }
  
  .join-text-paragraph2{
    font-size: 1.75rem;
  }
  
  .jcc-image2{
   left: 5%;
   margin-top: 4%;
  }
  
  .option-1-header-top,
  .option-2-header-top{
   font-size: 7rem;
  }
  
  .option1-header{
   font-size: 4.5rem; 
  }
  
  .option1-paragraph{
   font-size: 1.75rem;
    padding-left: 0%;
  }
  
  /*column adjustments */
  
  .jcc-sub-head{
   font-size: 5rem; 
  }
  
  .jcc-main-head{
   font-size: 5rem; 
  }
  
  .offering-descr{
   font-size: 1.5rem;
   width: 100%;
  }
  
  .offering-price{
   font-size: 1.5rem; 
  }
  
  .price-sub,
  .price-sub2{
   font-size: 1.5rem; 
  }
  
  .jcc-select{
   font-size: 2rem;
   position: relative;
  }
  
  /* column adjustments end */
  
  .form-row-jcc{
    width: 90% !important;
    margin: auto;
  }
  
  .jcc-form .form-row{
   width: 100% !important; 
  }
  
  .jcc-form .form-actions{
   width: 100% !important; 
  }
  
  .jcc-disclaimer{
   font-size: 1.5rem; 
  }
  
  .jcc-option2-headtext{
   width: 90%; 
   position: relative;
  }
  
  .option2-paragraph{
   font-size: 4.5rem; 
  }
  
  .members-only-callout{
   font-size: 2.5rem; 
  }
  
  .chill-perks-top{
   flex-direction: row-reverse;
   display: block;
   top: 5vh;
   position: relative;
   margin: auto;
  }
  
  .chill-perks-left-col-top {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  
  .community-text{
   padding: 4%; 
  }
  
  .perks-img-1, .perks-img-2 {
    position: relative;
    width: 100%;
  }
  
  .chill-perks-right-col-top {
    padding-right: 5%;
    padding-left: 5%;
    width: 100%;
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: column;
  }
  
  .perks-header-container {
    position: relative;
    width: 100%;
  }
  
  .perks-panel-container {
    height: auto;
    width: 100%;
  }
  
  .chill-perks-header1,
  .chill-perks-header2,
  .chill-perks-header3,
  .chill-perks-header4{
   font-size: 4rem; 
  }
  
  
  
  .chill-perks-bottom {
    position: relative;
    display: flex;
    flex-direction: row;
    margin-top: 8vh;
    padding-bottom: 4vh;
  }
  
  .chill-perks-left-col-bottom {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 0%;
  }
  
  .perks-img-1, .perks-img-2 {
    position: relative;
    width: 100%;
   }
  
  .chill-perks-right-col-bottom {
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: row;
  }
  
  .chill-perks-right-col-bottom p {
   font-size: 1.5rem;
   padding-bottom: 4%;
  }
  
  .community-header{
    font-size: 4rem;
  }
  
  
  .community-descr{
   font-size: 1.75rem; 
  }
  
  .club-chill-join-header {
    font-size: 3.25rem;
  }
 
  
  #shopify-section-club-chill-howitworks .billing-block-header{
   font-size: 1.75rem; 
   line-height: normal;
  }
  
  #shopify-section-club-chill-howitworks .billing-block-column{
   padding-right: 2%; 
  }
  
  #shopify-section-club-chill-howitworks .jcc-billing-block-paragraph{
   font-size: 1.75rem;
   width: 95%; 
  }
  
  .form-row-jcc{
    width: 90% !important;
    margin: auto;
  }
  
  .jcc-form .form-row{
   width: 100% !important; 
  }
  
  .jcc-form .form-actions{
   width: 100% !important; 
  }
}

@media (min-width: 768px) and (max-width: 1023px) and (orientation: landscape){
  .marketing-jumbotron{
     height: 105vw;
   }
}

/* Landscape, Big Mobile */
@media (min-width: 425px) and (max-width: 767px){
 .green-left,
  .green-right,
  .green3,
  .money1,
  .money2,
  .money3,
  .single-bill{
   display: none; 
  }
  
   .main{
    padding-top: 10px; 
   }
  
   .marketing-jumbotron{
     height: 105vh;
   }
  
   .jcc-above-header{
     margin: 0% 0% 5% 0%; 
   }
  
   .jcc-above-header-left{
     font-size: 2.5rem;
   }
  
  .jcc-header-text p{
    font-size: 2.5rem;
  }
  
  .jcc-descr-row{
    margin: 1rem auto;
  }
  
  .jcc-descr-header{
   font-size: 2.75rem; 
  }
  
  .jcc-descr-col1{
    width: 100%;
  }
  
  .jcc-descr-col2{
    display: none;
  }
  
  .join-text-paragraph1{
   font-size: 4.25rem; 
  }
  
  .join-text-paragraph2{
   font-size: 3rem; 
  }
  
  .jcc-image2{
   left: 5%;
   margin-top: 4%;
  }
  
  .option-1-header-top,
  .option-2-header-top{
   font-size: 6rem;
  }
  
  .option1-header{
   font-size: 3.5rem; 
  }
  
  .option1-paragraph{
   font-size: 2.5rem;
    padding-left: 0%;
  }
  
  .price-sub{
   font-size: 2.75rem; 
  }
  
  .price-sub2{
   font-size: 2.5rem; 
  }
  
  .jcc-option1-offerings{
   display: block; 
  }
  
  .jcc-offerings-col{
   height: auto;
   text-align: -webkit-center;
   width: 85%;
   border: 3px solid #c9d8b9;
   padding: 5%;
   align-items: center;
   margin: auto auto 5% auto;
  }
  
  .jcc-offerings-mid{
   height: auto;
   text-align: -webkit-center;
   width: 85%;
   border: 3px solid #c9d8b9;
   padding: 5%;
   align-items: center;
   margin: auto auto 5% auto;
  }
  
  .jcc-main-head{
   font-size: 6rem;
  }
  
  .jcc-sub-head{
   font-size: 6rem; 
  }
  
  .offering-descr{
   font-size: 2.75rem; 
  
  }
  
  .offering-price{
   padding: 10% 0% 5% 5%;
   font-size: 3.25rem; 
  }
  
  .offering-arrow{
   width: 0%; 
  }
  
  .arrow-price{
   margin-bottom: 5%; 
  }
  
  .super-head{
    font-size: 4rem; 
  }
  
  .jcc-select{
   font-size: 3.5rem; 
   position: relative;
  }
  
  .jcc-disclaimer{
   font-size: 1.5rem; 
  }
  
  .jcc-option2-headtext{
   width: 90%; 
  }
  
  .option2-paragraph{
   font-size: 3.75rem; 
  }
  
  .members-only-callout{
   font-size: 4rem; 
  }
  
  .chill-perks-top{
   flex-direction: row-reverse;
   display: block;
   top: 5vh;
  }
  
  .chill-perks-left-col-top {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 85%;
    margin-left: 7%;
  }
  
  .perks-img-1, .perks-img-2 {
    position: relative;
    width: 100%;
  }
  
  .chill-perks-right-col-top {
    padding-right: 5%;
    padding-left: 5%;
    width: 100%;
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: column;
  }
  
  .perks-header-container {
    position: relative;
    width: 100%;
    font-size: 3rem;
  }
  
  .perks-panel-container {
    height: auto;
    width: 100%;
  }
  
  .chill-perks-header1{
   font-size: 4rem; 
  }
  
  .chill-perks-bottom {
    position: relative;
    display: flex;
    flex-direction: row;
    margin-top: 8vh;
    padding-bottom: 4vh;
  }
  
  .chill-perks-left-col-bottom {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 0%;
  }
  
  .perks-img-1, .perks-img-2 {
    position: relative;
    width: 100%;
   }
  
  .chill-perks-right-col-bottom {
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: row;
  }
  
  .chill-perks-right-col-bottom p {
   font-size: 3.25rem;
   padding-bottom: 4%;
  }
  
  .community-header{
    font-size: 3.5rem;
  }
  
  
  .community-descr{
   font-size: 1.75rem; 
  }
  
  .club-chill-join-header {
    font-size: 4.25rem;
  }
 
  
  #shopify-section-club-chill-howitworks .billing-block-header{
   font-size: 2.75rem; 
   line-height: normal;
  }
  
  #shopify-section-club-chill-howitworks .billing-block-column{
   padding-right: 2%; 
  }
  
  #shopify-section-club-chill-howitworks .jcc-billing-block-paragraph{
   font-size: 2.75rem;
   width: 95%; 
  }
  
  .form-row-jcc{
    width: 90% !important;
    margin: auto;
  }
  
  .jcc-form .form-row{
   width: 100% !important; 
  }
  
  .jcc-form .form-actions{
   width: 100% !important; 
  }
  
}

@media (min-width: 425px) and (max-width: 767px) and (orientation: landscape){
  .main{
    padding-top: 10px; 
   }
  
  .marketing-jumbotron{
     height: 105vw;
   }
  
  .chill-perks-top{
   top: 5vw;
  }
  
  .chill-perks-bottom {
    margin-top: 8vw;
    padding-bottom: 4vw;
  }
  
}


/* Mobile */
@media (min-width: 320px) and (max-width: 424px) and (-webkit-min-device-pixel-ratio: 2){
  .green-left,
  .green-right,
  .green3,
  .money1,
  .money2,
  .money3,
  .single-bill{
   display: none; 
  }
  
   .main{
    padding-top: 10px; 
   }
  
   .marketing-jumbotron{
     height: 90vh;
   }
  
   .jcc-above-header{
     margin: 9% 0% 5% 0%; 
   }
  
   .jcc-above-header-left{
     font-size: 2.5rem;
   }
  
  .jcc-header-text p{
    font-size: 2.5rem;
  }
  
  .jcc-descr-row{
    margin: 1rem auto;
  }
  
  .jcc-descr-header{
   font-size: 1.75rem; 
  }
  
  .jcc-descr-col1{
    width: 100%;
  }
  
  .jcc-descr-col2{
    display: none;
  }
  
  .join-text-paragraph1{
   font-size: 2.25rem; 
  }
  
  .join-text-paragraph2{
   font-size: 1.75rem; 
  }
  
  .jcc-image2{
   left: 5%;
   margin-top: 4%;
  }
  
  .option-1-header-top,
  .option-2-header-top{
   font-size: 5rem;
  }
  
  .option1-header{
   font-size: 2.5rem; 
  }
  
  .option1-paragraph{
   font-size: 1.5rem;
    padding-left: 0%;
  }
  
  .price-sub{
   font-size: 1.75rem; 
  }
  
  .price-sub2{
   font-size: 1.5rem; 
  }
  
  .jcc-option1-offerings{
   display: block; 
  }
  
  .jcc-offerings-col{
   height: auto;
   text-align: -webkit-center;
   width: 85%;
   border: 3px solid #c9d8b9;
   padding: 5%;
   align-items: center;
   margin: auto auto 5% auto;
  }
  
  .jcc-offerings-mid{
   height: auto;
   text-align: -webkit-center;
   width: 85%;
   border: 3px solid #c9d8b9;
   padding: 5%;
   align-items: center;
   margin: auto auto 5% auto;
  }
  
  .offering-container{
    width: 85%;
    border: 3px solid #c9d8b9;
    padding: 5%;
  }
  
  .jcc-main-head{
   font-size: 5rem;
  }
  
  .jcc-sub-head{
   font-size: 5rem; 
  }
  
  .offering-descr{
   font-size: 1.75rem; 
  
  }
  
  .offering-price{
   padding: 10% 0% 5% 5%;
   font-size: 2.25rem; 
  }
  
  .offering-arrow{
   width: 0%; 
  }
  
  .arrow-price{
   margin-bottom: 5%; 
  }
  
  .super-head{
    font-size: 3rem; 
  }
  
  .jcc-select{
   font-size: 2.5rem; 
   position: relative;
  }
  
  .jcc-disclaimer{
   font-size: 1.5rem; 
  }
  
  .jcc-option1-headtext{
   text-align: center;
   margin: auto;
   padding-bottom: 5%; 
  }
  
  .jcc-option2-headtext{
   width: 100%;
   margin: auto;
   text-align: center;
   padding: 5%;
  }
  
  .option2-paragraph{
   font-size: 2.75rem; 
  }
  
  .members-only-callout{
   font-size: 3rem; 
  }
  
  .chill-perks-top{
   flex-direction: row-reverse;
   display: block;
   top: 5vh;
   margin: auto;
  }
  
  .chill-perks-left-col-top {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  
  .community-text{
   padding: 4%; 
  }
  
  .perks-img-1, .perks-img-2 {
    position: relative;
    width: 100%;
  }
  
  .chill-perks-right-col-top {
    padding-right: 5%;
    padding-left: 5%;
    width: 100%;
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: column;
  }
  
  .perks-header-container {
    position: relative;
    width: 100%;
    font-size: 2rem;
  }
  
  .perks-panel-container {
    height: auto;
    width: 100%;
  }
  
  .chill-perks-header1{
   font-size: 3rem;  
  }
  
  .chill-perks-header2,
  .chill-perks-header3,
  .chill-perks-header4{
   font-size: 4rem; 
  }
  
  
  
  .chill-perks-bottom {
    position: relative;
    display: flex;
    flex-direction: row;
    margin-top: 8vh;
    padding-bottom: 4vh;
  }
  
  .chill-perks-left-col-bottom {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 0%;
  }
  
  .perks-img-1, .perks-img-2 {
    position: relative;
    width: 100%;
   }
  
  .chill-perks-right-col-bottom {
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: row;
  }
  
  .chill-perks-right-col-bottom p {
   font-size: 1.5rem;
   padding-bottom: 4%;
  }
  
  .community-header{
    font-size: 2.5rem;
  }
  
  
  .community-descr{
   font-size: 1.5rem; 
  }
  
  .club-chill-join-header {
    font-size: 3.25rem;
  }
 
  
  #shopify-section-club-chill-howitworks .billing-block-header{
   font-size: 1.75rem; 
   line-height: normal;
  }
  
  #shopify-section-club-chill-howitworks .billing-block-column{
   padding-right: 2%; 
  }
  
  #shopify-section-club-chill-howitworks .jcc-billing-block-paragraph{
   font-size: 1.75rem;
   width: 95%; 
  }
  
  .form-row-jcc{
    width: 90% !important;
    margin: auto;
  }
  
  .jcc-form .form-row{
   width: 100% !important; 
  }
  
  .jcc-form .form-actions{
   width: 100% !important; 
  }
}

/* End Responsive */