div.membership{border:1px solid #c0c0c0; color:rgba(38,38,38,0.8); text-align:center; padding:30px; border-radius:7px; height:100%; position:relative; padding-bottom:90px; margin-top:30px; margin-bottom:20px; text-align:center;}
div.membership.primary{}
div.membership.hover{background-color:#00b5f9; color:#fff;}

div.membership div.title{font-family: MontserratSemiBold, sans-serif; font-size:40px; color:#000; margin-bottom:30px;}
div.membership div.subtitle{font-size:11px; text-transform: uppercase; margin-bottom:30px; display:none;}
div.membership div.price{font-family: MontserratSemiBold, sans-serif; font-size:50px; color:#00b5f9;}
div.membership div.interval{font-size:21px; font-weight:bold; margin-bottom:30px;}
div.membership div.line{border:1px solid #c0c0c0; border-width:1px 0 0 0; margin-bottom:30px; display:none;}
div.membership div.copy{font-size:14px; margin-bottom:30px; display: none;}
div.membership div.join{display:block;}
div.membership div.join a.btn{width:180px; position: absolute; bottom:30px; left:50%; margin-left:-90px;}
div.membership ul.features{list-style:none; text-align:left; margin:0 0 20px 0; padding:0; display:inline-block;}
div.membership ul.features li {
  margin: 0 0 4px 0;
  padding: 0;
  list-style: none;
  line-height: 24px;
  text-align:center;
}

img.chatgpt-logo{display:block;  max-height:90px; margin:0 0 20px 0;}

div.relative{position:relative;}
a.sign-up{position:relative; top:0; right:auto; margin:0 0 15px 0;}

ul.like{margin:0;}
ul.like.btm{margin:0 0 15px 0;}

div.membership div.halo{position:absolute; top:-30px; left:-1px; width:calc(100% + 2px); height:46px; line-height:46px; background-color:#9f32b2; color:#ffffff; border-radius:6px 6px 0 0;}
div.membership div.regular-price{position:absolute; top:90px; left:0; width:100%; text-align:center; text-decoration: line-through;}
h2.packages{margin-bottom:45px;}

img.hero{margin:0 0 15px 0;}

/* xs */
@media only screen and (max-width: 575px) {
  a.sign-up{position:relative; top:0; right:auto; margin:15px 0 15px 0;}
}
/* sm */
@media only screen and (min-width: 567px) {
  div.indicator{ background-color: orange; }
}
/* md */
@media only screen and (min-width: 768px) {
  div.indicator{ background-color: red; }
}
/* lg */
@media only screen and (min-width: 992px) {
  div.indicator{ background-color: yellow; }
}
/* xl */
@media only screen and (min-width: 1200px) {
  div.indicator{ background-color: green; }
}
/* xxl */
@media only screen and (min-width: 1400px) {
  div.indicator{ background-color: purple; }
}


