.member-plans {
  max-width: 1300px;
  margin: 40px auto;
  display: flex;
  gap: 47px;
}
.member-plans .plan-top {
  min-height: 360px;
  padding: 36px 43px;
  border: 1px solid rgba(0, 161, 198, 0.07);
  background: rgba(0, 161, 198, 0.09);
  border-radius:15px;
}

.member-plans .plan-top p {
  font-family: Manrope;
  font-weight: 700;
  font-size: 20px;
  line-height: 22px;
  letter-spacing: -1%;
}
.member-plans .plan-top .plan-price {
  display: flex;
  vertical-align: baseline;
}
.member-plans .plan-top .plan-price h3 {
  font-family: Manrope;
  font-weight: 600;
  font-size: 40px;
  line-height: 22px;
  letter-spacing: 0%;
  color: rgba(38, 59, 50, 1);
}
.member-plans .plan-top .plan-price b {
  font-family: Manrope;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  letter-spacing: 0%;
  padding: 8px 10px;
  max-width: 150px;
}
.member-plans .plan-top .plan-price + p {
  font-family: Manrope;
  font-weight: 400;
  font-size: 15px;
  line-height: 24px;
  letter-spacing: 0%;
  margin-top: 60px;
}

.member-plans .plan-top a.button {
    font-family: 'Manrope';
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    background: transparent;
    color: #000;
    border: 1px solid #000;
    text-decoration: none;
    border-radius: 100px;
    padding: 6px 32px;
    height: 37px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}
.member-plans .plan-top a.button:hover {
    background: #00A1C6;
    border-color: #00A1C6;
    color: #fff;
}
.member-plans .plan-top a.button::after {
    content: "";
    background-image: url('data:image/svg+xml,<svg width="10" height="15" viewBox="0 0 10 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.7897 7.39179L1 12.235L2.68153 13.8L9 7.39177L2.68153 1L1 2.56501L5.7897 7.39179Z" fill="black" stroke="%23127D85" stroke-width="0.5"></path></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 8px 13px;
    width: 8px;
    height: 13px;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}
.member-plans .plan-top a.button:hover::after {
    background-image: url('data:image/svg+xml,<svg width="10" height="15" viewBox="0 0 10 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.7897 7.39179L1 12.235L2.68153 13.8L9 7.39177L2.68153 1L1 2.56501L5.7897 7.39179Z" fill="white" stroke="%23127D85" stroke-width="0.5"></path></svg>');
}
.member-plans .plan-bottom{
  margin: 20px 30px 20px 20px;
}
.member-plans .plan-bottom p{
    font-family: Manrope;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0%;
    padding: 0 0 0 20px;
    position: relative;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    padding-bottom: 20px;
}
.member-plans .plan-bottom p:last-child{
  border-bottom:0
}
.member-plans .plan-bottom p::before {
    content: "";
    background-image: url('data:image/svg+xml,<svg width="11" height="9" viewBox="0 0 11 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.27433 0.350109L3.95699 6.50007L1.7197 4.29009C1.53078 4.10178 1.27455 3.996 1.00738 3.996C0.740203 3.996 0.483973 4.10178 0.295054 4.29009C0.106134 4.47839 0 4.73378 0 5.00008C0 5.13194 0.0260568 5.26251 0.0766822 5.38433C0.127308 5.50615 0.20151 5.61684 0.295054 5.71008L3.30487 8.71006C3.49713 8.89279 3.75155 8.99638 4.01719 9.00006C4.15529 8.99446 4.29073 8.96048 4.41504 8.90026C4.53934 8.84003 4.64982 8.75485 4.73954 8.65006L10.7592 1.6501C10.8448 1.5503 10.9099 1.43466 10.9507 1.30979C10.9915 1.18491 11.0072 1.05325 10.997 0.922324C10.9867 0.791395 10.9507 0.663758 10.891 0.546704C10.8312 0.429649 10.7489 0.325468 10.6488 0.24011C10.5487 0.154751 10.4327 0.0898863 10.3074 0.0492185C10.1821 0.00855066 10.05 -0.00712391 9.91864 0.00309048C9.78728 0.0133049 9.65923 0.0492078 9.54179 0.108749C9.42435 0.168291 9.31983 0.250305 9.23419 0.350109H9.27433Z" fill="%2300ADD6"></path></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 13px 29px;
    width: 15px;
    height: 15px;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    position: absolute;
    left: -5px;
    top: 5px;
}



.member-plans>*:hover .plan-top {
  border: 1px solid rgba(0, 7, 45, 1);
  background: rgba(0, 7, 45, 1);
}

.member-plans>*:hover .plan-top a.button {
    background: rgba(0, 173, 213, 1);
    color: #fff;
    border: 1px solid rgba(0, 173, 213, 1);
}
.member-plans>*:hover .plan-top a.button:hover {
    background: #fff;
    border-color: #fff;
    color: #000;
}
.member-plans>*:hover .plan-top a.button::after {
    background-image: url('data:image/svg+xml,<svg width="10" height="15" viewBox="0 0 10 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.7897 7.39179L1 12.235L2.68153 13.8L9 7.39177L2.68153 1L1 2.56501L5.7897 7.39179Z" fill="white" stroke="%23127D85" stroke-width="0.5"></path></svg>');
}
.member-plans>*:hover .plan-top a.button:hover::after {
    background-image: url('data:image/svg+xml,<svg width="10" height="15" viewBox="0 0 10 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.7897 7.39179L1 12.235L2.68153 13.8L9 7.39177L2.68153 1L1 2.56501L5.7897 7.39179Z" fill="black" stroke="%23127D85" stroke-width="0.5"></path></svg>');
}
.member-plans>*:hover .plan-top .plan-price h3, .member-plans>*:hover .plan-top p {
  color: rgba(4, 208, 255, 1);
}
.member-plans>*:hover .plan-top .plan-price b {
  color: rgba(255, 255, 255, 1);
}
.member-plans>*:hover .plan-top .plan-price + p {
color: #fff;
}
@media (max-width:1200px) {
 .member-plans {
   padding: 0 15px;
  gap: 17px;
}
  .member-plans .plan-top .plan-price h3{
    margin:10px 0
  }
  .member-plans .plan-top .plan-price{
    flex-direction: column;
  }
  .member-plans .plan-top .plan-price{
    height: 60px;
  }
  .member-plans .plan-top {
    padding: 30px 25px;
  }
  .member-plans .plan-top .plan-price h3 {
    font-size: 36px;
}
.member-plans .plan-top p {
    font-size: 17px;
  }
}

@media (max-width:992px) {
.member-plans .plan-top .plan-price + p {
  margin-top: 40px;
}
.member-plans .plan-top a.button {
    font-size: 14px;
    padding: 6px 20px;
    gap: 5px;
}
.member-plans .plan-top {
  min-height: 340px;
}
}
@media (max-width: 767px) {
  .membership-plans{
    overflow: scroll;
    padding:0;
  }
  .member-plans {
  width: 900px;
  margin: 20px auto;
  gap:20px;
}
}