.card-border-top {border-top: 10px solid !important; position: absolute; width: 100%; top: -10px; left: 0;}
.card-border-top-white {border-top-color: var(--white)!important;}
.card-border-top-main-blue {border-top-color: var(--main-blue)!important;}
.card-border-top-bs-yellow {border-top-color: var(--bs-yellow)!important;}
.card-border-top-strong-violet {border-top-color: var(--strong-violet)!important;}
.card-border-top-vivid-orange {border-top-color: var(--vivid-orange)!important;}
.card-border-top-main-green {border-top-color: var(--main-green)!important;}
@media only screen and (max-width: 991px) {
  .card-border-top {top: 0px;}
}
.price-unit {font-size: 22px !important; font-weight: 700; line-height: 1;}
.pricing-price {display: flex; justify-content: center;}
.saving-badge {font-size: 0.75em; border-color: var(--main-blue)!important;}

.table.features-prices {overflow: auto;height: 100px;}
.table.features-prices>:not(:first-child) {border-top-width: 0px!important;}
.table.features-prices tbody td {padding: 1em!important; border-left-width: 1px;vertical-align: middle;}
.table.features-prices th, .table.features-prices td { border-right-width: 1px;}
.table.features-prices tbody td .fa-check {color: var(--main-blue); font-size: 1.25em;display: block;}
.table.features-prices.table-hover>tbody>tr:hover>* {--bs-table-accent-bg: var(--light-blue-1);}
.table.features-prices.table-hover>tbody>tr.not-hover:hover>* {--bs-table-accent-bg: transparent;}
.table.features-prices td.features {font-size: 0.85em;}
.table.features-prices thead tr:first-child > th {padding-top: 1.5em!important;padding-bottom: 1.5em!important;}
.table.features-prices thead tr th {position: sticky!important;top: 100px;z-index: 1;background: #FFFFFF;vertical-align: middle;}
.table.features-prices thead tr th.features {max-width: 130px;}

.ribbon {
  background: var(--main-green);
  width: 100%;
  display: block;
  left: 0;
  text-align: center;
  height: 3em;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  position: absolute;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 0.85em;
}

@media only screen and (min-width: 991px){
  .ribbon { top: -3em; }
}

table tr td.starter,
table tr td.basic,
table tr td.plus,
table tr td.pro,
table tr td.premium,
table tr td.advanced {text-align: center}

.table.features-prices-mobile tbody td {padding: 0.875em!important; }
.table.features-prices-mobile tbody tr td.features { border-right-width: 1px;}
.table.features-prices-mobile tbody tr:hover>* {--bs-table-accent-bg: var(--light-blue-1);}

.plan-box_header {position: relative;}

.accordion-button {text-decoration: none; -webkit-appearance: none;}

.extra-plan_header {
  min-height: 65px;
}

.bg-light-2 {
  background-color: #E8F1FC;
}

.price span.price-tenure{
  line-height: 1;
  font-size: .9rem;
  font-weight: 100;
}

.bg-waves-bottom {
  background-image: url('/images/common/bg-waves.svg');
  background-position: bottom;
  background-size: contain;
  background-repeat: no-repeat;
}

.plans-filter {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.plans-filter .btn {
  padding: 1em;
  font-size: 1em;
  text-transform: none;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
}

.plans-filter .btn .plan-discount {
  border: 1px solid white;
  border-radius: 3px;
  padding: 3px 5px;
  margin-left: 5px;
  font-size: .8em;
}

.plans-filter .btn:not(.active) .plan-discount {
  border-color: var(--main-blue);
}

.plans-filter .btn:hover:not(.active) .plan-discount {
  border-color: white;
}

@media only screen and (max-width: 350px) {
  .plans-filter .btn {
    font-size: .625em;
  }
}

/* Version 2 Sign-up-v2 */

/* Select plan-filter */
main[data-version="v2"] #plans-filter {
  position: sticky;
  top: 90px;
  z-index: 10;
  background: white;
  padding-bottom: 5px;
}

main[data-version="v2"] #plans-filter:is(.opacity-0) {
  z-index: -3;
}

main[data-version="v2"] .plans-filter {
  margin: 0;
  gap: 3px;
}

main[data-version="v2"] .plans-filter .btn {
  padding: 1em .85em;
  font-size: .75em;
  text-transform: none;
  border-radius: 3px !important;
  line-height: 1.325;
  width: 49%;
  max-width: 190px;
}

main[data-version="v2"] .plans-filter .btn:not(.active) {
  background-color: transparent;
  color: var(--main-blue);
}

main[data-version="v2"] .plans-filter .btn:not(.active):hover {
  background-color: var(--main-blue);
}

main[data-version="v2"] .plans-filter .btn span {
  font-size: .7rem;
}

main[data-version="v2"] .plans-filter .btn small strong,
main[data-version="v2"] .plans-filter .btn strong,
main[data-version="v2"] .plans-filter .btn strong span {
  font-size: .85rem !important;
}

main[data-version="v2"] .plan-badge {
  border:1px solid var(--main-blue);
  color: var(--main-blue);
  width: fit-content;
  padding: 1px 3px;
  margin: auto;
  border-radius: 3px;
}

main[data-version="v2"] a:hover .plan-badge {
  color: var(--white);
  border-color: var(--white);
}

main[data-version="v2"] .active .plan-badge {
  border:1px solid #dee2e9;
  color: #dee2e9;
  margin-left: 5px;
}

main[data-version="v2"] .owl-carousel .item {
  height: 100%;
}

main[data-version="v2"] .owl-carousel .owl-stage-outer {
  display: flex;
}

main[data-version="v2"] .owl-carousel .owl-stage {
  display: flex;
  align-content: stretch;
}

/* Plans */
.text-line-through {
  text-decoration: line-through;
}

main[data-version="v2"] .plan {
  padding: 1rem;
  background: #F8FBFD;
  border: 1px solid #E6E7E9;
  border-radius: 5px;
  height: 100%;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

main[data-version="v2"] .plan-box {
  height: calc(100% - 44px)
}

main[data-version="v2"] .plan-box a {
  text-decoration: none;
}

main[data-version="v2"] .plan-box a:hover {
  text-decoration: underline;
}

main[data-version="v2"] .plan.highlight {
  border: 1px solid var(--main-green);
  background-color: white;
}

main[data-version="v2"] .plan h3 {
  font-size: 1rem;
  font-weight: 500;
}

main[data-version="v2"] .plan p {
  font-size: .85rem;
  font-weight: 600;
  margin-top: 1rem;
}

main[data-version="v2"] .plan .most-popular {
  background-color: #f3f3f3;
  border-radius: 3px;
  text-align: center;
  color: var(--black);
  position: absolute;
  right: 1rem;
  top: 1rem;
  font-size: 12px;
  font-family: 'poppins';
  font-weight: 300;
  padding: 3px 10px;
}

main[data-version="v2"] .plan .price-unit {
  font-size: 22px !important;
  font-weight: 700;
  line-height: 1;
}

main[data-version="v2"] .nav-plans .price-unit {
  font-size: 16px !important;
}

main[data-version="v2"] .plan .pricing-price {
  display: flex;
  justify-content: start;
}

main[data-version="v2"] .plan .saving-badge {
  font-size: 0.75em;
  border-color: var(--main-blue) !important;
  color: green !important;
}

main[data-version="v2"] .plan .price span.price-tenure {
  display: flex;
  align-content: end;
  flex-wrap: wrap;
  font-family: 'poppins';
  font-weight: 300;
}

main[data-version="v2"] .plan ul {
  padding: 0;
  list-style: none;
  font-size: 12px;
}

main[data-version="v2"] .plan ul li {
  padding: 3px 0;
}

/*
main[data-version="v2"] .plan button.btn {
  border-radius: 5px;
  background-color: var(--white);
  box-shadow: 0 2px 10px 0px rgb(19 68 113 / 25%);
  border: 0;
  color: var(--main-blue);
  font-size: 14px;
  font-weight: 600;
  text-transform: math-auto;
}

main[data-version="v2"] .plan button.btn:hover {
  background-color: var(--main-blue) !important;
  color: var(--white) !important;
}
*/

main[data-version="v2"] .plan button.btn {
  font-size: .8rem;
  height: 44px;
}

main[data-version="v2"] .plan-advanced,
main[data-version="v2"] .plan-enterprise {
  border-radius: 5px;
  padding: 1.5rem;
  position: relative;
  overflow: hidden;
  height: 100%;
}

main[data-version="v2"] .plan-advanced,
main[data-version="v2"] .plan-enterprise {
  background-color: #F8FBFD;
  border: 1px solid #E6E7E9;
}

main[data-version="v2"] .plan-contain {
  position: relative;
}

main[data-version="v2"] .plan-contain h3 {
  font-size: 1.3rem;
}

main[data-version="v2"] .plan-contain div {
  font-size: .85rem;
}

main[data-version="v2"] .plan-contain .pricing-price {
  display: flex;
  justify-content: flex-start;
  align-items: end;
}

main[data-version="v2"] .plan-contain ul {
  padding: 0;
  list-style: none;
  margin-top: 1rem;
  font-size: 14px;
}

main[data-version="v2"] .plan-contain .btn-outline-secondary i {
  transition: all .3s;
}

main[data-version="v2"] .plan-contain .btn-outline-secondary:hover i {
  margin-left: 0.25em;
}

main[data-version="v2"] .plan-enterprise .plan-contain h3 {
  font-size: 1.3rem;
}

main[data-version="v2"] .btn-compare-plans {
  border-radius: 3px;
  border: 1px solid var(--main-blue);
  padding: .825rem 1.5rem;
  text-transform: inherit;
  font-weight: bold;
}

main[data-version="v2"] .btn-compare-plans:hover {
  background-color: var(--main-blue);
  color: var(--white);
}

@media only screen and (max-width:1199px) {
  main[data-version="v2"] .plan-image {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
  }
  main[data-version="v2"] .plan-image img {
    height: 40%;
    width: 100%;
  }
  main[data-version="v2"] .plan-contain {
    width: 100%;
  }
}

@media only screen and (max-width:991px) {
  main[data-version="v2"] #plans-slider .owl-stage {
    margin-bottom: 15px;
  }
}

@media only screen and (max-width:768px) {
  main[data-version="v2"] .plan-advanced,
  main[data-version="v2"] .plan-enterprise {
    height: auto;
  }

  main[data-version="v2"] #plans-slider {
    min-height: 340px;
  }
}

@media only screen and (max-width:575px) {
  main[data-version="v2"] .plan-image {
    display: none;
  }
  main[data-version="v2"] .plans-filter .btn span {
    font-size: .6rem;
  }
}

/* Compare plans table */
main[data-version="v2"] .features-prices .price-unit {
  font-size: 16px !important;
}

main[data-version="v2"] .features-prices .price span.price-tenure {
  font-size: .6rem;
  padding-top: 6px;
  padding-left: 4px !important;
}

main[data-version="v2"] .table.features-prices thead .h5,
main[data-version="v2"] .table.features-prices .thead .h5 {
  margin-bottom: .125rem !important;
}

main[data-version="v2"] .table.features-prices thead .pro .most-popular-table,
main[data-version="v2"] .table.features-prices .thead .pro .most-popular-table {
  background-color: var(--main-green);
  border-radius: 4px;
  text-align: center;
  color: var(--white);
  position: absolute;
  bottom: -11px;
  font-size: 11px;
  font-family: 'poppins';
  font-weight: 300;
  padding: 3px 10px;
  box-shadow: 0 3px 5px 0 rgb(110 131 170 / 25%);
  z-index: 1;
  width: 100px;
}

main[data-version="v2"] .table.features-prices thead tr th {
  top: 90px !important;
}

main[data-version="v2"] .table.features-prices thead tr:first-child > th,
main[data-version="v2"] .table.features-prices .thead tr:first-child > th {
  padding: 0 5px 6px 0 !important;
  background-color: white;
}

main[data-version="v2"] .table.features-prices thead tr th.features {
  max-width: 320px !important;
  width: 320px;
}

main[data-version="v2"] .table.features-prices .row {
  border-bottom: 1px solid #dee2e6;
}

main[data-version="v2"] .table.features-prices .row:last-child {
  border-bottom: 0;
}

main[data-version="v2"] .table .card-border-top {
  border-top: 1px solid #dee2e6 !important;
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0;
}

main[data-version="v2"] .table .card-border-bottom {
  border-bottom: 1px solid #dee2e6 !important;
  position: absolute;
  width: 100%;
  bottom: 0px;
  left: 0;
}

main[data-version="v2"] .table.features-prices {overflow: initial;height: auto;}

main[data-version="v2"] .table .thead {
  position: sticky;
  top: 90px;
  background-color: white;
  padding-top: 2px;
  z-index: 1;
}

main[data-version="v2"] .thead .row > div:nth-child(1) {
  border-bottom: 0;
}

main[data-version="v2"] .thead .row > div:nth-child(2) {
  border-top: 1px solid #dee2e6;
  border-left: 1px solid #dee2e6;
  border-radius: 8px 0 0 0;
}

main[data-version="v2"] .thead .row > div:nth-child(3),
main[data-version="v2"] .thead .row > div:nth-child(4) {
  border-top: 1px solid #dee2e6;
}

main[data-version="v2"] .thead .row > div:last-child {
  border-top: 1px solid #dee2e6;
  border-right: 1px solid #dee2e6;
  border-radius: 0 8px 0 0;
}

main[data-version="v2"] .thead .row {
  padding-right: 12px;
  padding-left: 4px;
}

.table-line-top {
  width: calc(100% - 14px);
  display: block;
  height: 8px;
  border-radius: 8px 0 0 0;
  border: 1px solid #dee2e6;
  border-bottom: 0;
  border-left-color: #dee2e6;
  border-right-color: #dee2e6;
  position: absolute;
}

@media only screen and (min-width:767px) {
  main[data-version="v2"] .tbody {
    padding: 1rem;
    border: 1px solid #dee2e6;
    border-radius: 8px 0 8px 8px;
  }
}

main[data-version="v2"] .table .features,
main[data-version="v2"] .table .col-md {
  font-size: 0.85em;
}

main[data-version="v2"] .table.features-prices  >:not(:first-child) {
  border-top-width: 1px!important;
}

main[data-version="v2"] .table-hover > .tbody > div:has(.col-md-2):hover > * {
  background-color: #e9edf0;
}

main[data-version="v2"] .table .align-head {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  height: 80px;
}

main[data-version="v2"] .table .align-head h5 {
  margin-bottom: .25rem;
}

main[data-version="v2"] #pricing-table.pricing-table .plans-filter {
  border: 0 !important;
  width: 100%;
}

@media screen and (min-width: 768px) {
  main[data-version="v2"] .table .pro {
    background-color: #f0f8ff;
  }  
}

@media only screen and (max-width:991px) {
  main[data-version="v2"] .table.features-prices thead .h5 {
    font-size: 1rem !important;
  }
  main[data-version="v2"] .features-prices .price-unit {
    font-size: 12px !important;
  }
  main[data-version="v2"] .features-prices .price span.price-tenure {
    padding-top: 3px;
  }
  main[data-version="v2"] .pricing-table .container {
    max-width: 100% !important;
  }
  main[data-version="v2"] #plans-filter,
  main[data-version="v2"] .table.features-prices thead tr th {
    top: 70px !important;
  }
  main[data-version="v2"] .table.features-prices thead .pro .most-popular-table {
    font-size: 10px;
  }
  main[data-version="v2"] .table.features-prices thead tr th.features {
    width: 300px;
  }
  main[data-version="v2"] .plans-filter {
    gap: 5px 3px;
  }
  main[data-version="v2"] .plans-filter .btn {
    padding: 1em .5em;
  }
  main[data-version="v2"] .features-prices h5 {
    font-size: 1rem !important;
  }
  main[data-version="v2"] .table .thead {
    top: 70px;
  }
}

@media only screen and (max-width:768px){
  main[data-version="v2"] .plans-filter {
    border: 0;
    border-radius: 0;
  }
  main[data-version="v2"] #plans-filter {
    padding-bottom: 0;
  }

  main[data-version="v2"] .nav-plans .price-unit {
    font-size: 16px !important;
    padding: 4px 0;
  }

  .pricing-price {
    flex-direction: column;
  }
}

@media only screen and (max-width:380px){
  main[data-version="v2"] .plans-filter .btn {
    border-radius: 5px !important;
    padding: 1em .3em;
  }
}

/* Table V3 */
main[data-version="v2"] div[data-version-table="v3"] .table .align-head {
  height: auto !important;
}

main[data-version="v2"] div[data-version-table="v3"] .table .align-head {
  padding-top: 26px !important;
  padding-bottom: 16px;
}

main[data-version="v2"] div[data-version-table="v3"] .table .features,
main[data-version="v2"] div[data-version-table="v3"] .table .col-md {
  font-size: 1em !important;
  position: relative;
}

main[data-version="v2"] div[data-version-table="v3"] .table .col-md h5 {
  font-size: 1.35rem !important;
}

main[data-version="v2"] div[data-version-table="v3"] .table .col-md.basic,
main[data-version="v2"] div[data-version-table="v3"] .table .col-md.plus,
main[data-version="v2"] div[data-version-table="v3"] .table .col-md.pro,
main[data-version="v2"] div[data-version-table="v3"] .table .col-md.premium,
main[data-version="v2"] div[data-version-table="v3"] .table .col-md.advanced {
  border-left: 1px solid #dee2e6;
  display: flex;
  justify-content: center;
  align-items: center;
}

main[data-version="v2"] div[data-version-table="v3"] .tbody .features {
  padding-left: 1rem;
  padding-right: 1.5rem;
}

main[data-version="v2"] div[data-version-table="v3"] .tbody .features span {
    position: absolute;
    top: 8px;
    right: 6px;
}

main[data-version="v2"] div[data-version-table="v3"] .features-prices .price-unit {
  font-size: 20px !important;
}

main[data-version="v2"] div[data-version-table="v3"] .features-prices .price span.price-tenure {
  font-size: 14px;
  padding-top: 4px;
}

main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .pro .most-popular-table {
  background-color: var(--main-green) !important;
  bottom: initial;
  top: -26px;
  width: 100%;
  border-radius: 0;
  text-transform: uppercase;
  font-weight: 500;
  height: 40px;
  font-size: 16px;
  border-radius: 4px 4px 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

main[data-version="v2"] div[data-version-table="v3"] .thead.text-center.border-bottom .pro .most-popular-table {
  align-items: flex-start;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .pro .most-popular-table {
    font-size: 13px;
  } 
}

main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .pro,
main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .basic,
main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .advanced,
main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .plus,
main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .premium {
  position: relative;
  min-height: 121px;
}

main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .basic .card-border-top-main-blue,
main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .advanced .card-border-top-main-blue,
main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .plus .card-border-top-main-yellow,
main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .premium .card-border-top-main-violet  {
  border-radius: 0;
  position: absolute;
  height: 17px;
  z-index: 1;
  width: 100%;
  top: -3px;
}

main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .basic .card-border-top-main-blue,
main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .advanced .card-border-top-main-blue {
  background-color: var(--main-blue) !important;
}

main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .plus .card-border-top-main-yellow {
    background-color: var(--bs-yellow)!important;
}

main[data-version="v2"] div[data-version-table="v3"] .table.features-prices .thead .premium .card-border-top-main-violet {
    background-color: var(--strong-violet)!important;
}

main[data-version="v2"] div[data-version-table="v3"] .thead .row > div:nth-child(3), 
main[data-version="v2"] div[data-version-table="v3"] .thead .row > div:nth-child(4) {
  border-left: 1px solid #dee2e6;
}

main[data-version="v2"] div[data-version-table="v3"] .thead .row > div:last-child {
  border-left: 1px solid #dee2e6;
}

@media only screen and (min-width:767px) {
  main[data-version="v2"] div[data-version-table="v3"] .tbody {
    padding: .7rem;
    border: 1px solid #dee2e6;
    border-radius: 8px 0 8px 8px;
  }
}

/* FAQ */
.accordion-faq .accordion-item {margin-bottom: 1rem; border: 1px solid var(--light-blue-2); background-color: #FCFEFF; border-radius: .25rem!important;}
.accordion-faq .accordion-button {background-color: #FCFEFF; color: #323232; font-size: 1rem; font-weight: 600; padding: 1.25em 1.5em;}
.accordion-faq .accordion-body {padding: 1.25em 1.5em;}
.accordion-faq .accordion-button:not(.collapsed)::after {background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");}
.accordion-faq .accordion-button:not(.collapsed) {background-color: var(--light-blue-2); color: var(--text-color);box-shadow:none}
.accordion-faq .accordion-body a {color: #333333; text-decoration: underline;}
.accordion-faq .accordion-body a:hover {color: #111111;}
.accordion-faq .accordion-button:focus {border-color: transparent;box-shadow: none;}

/* Mobile plan table */
.nav-plans {
  position: sticky;
  top: 70px;
  display: flex;
  flex-wrap: wrap;
  background-color: #F8FBFD;
  padding: 8px;
  border-bottom: 1px solid #dee2e6;
}

.nav-plans .nav-item {
  width: 25%;
}

.nav-plans .nav-item button {
  width: 100%;
  padding: 10px 0;
  color: var(--main-blue);
  font-weight: 600;
  border-radius: 5px;
}

.nav-plans .nav-item button.active {
  background-color: var(--main-blue);
}

.basic-mobile,
.plus-mobile,
.pro-mobile,
.premium-mobile,
.advanced-mobile {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 36px;
}

@media only screen and (max-width: 420px) {
  .nav-plans {
    padding: 6px 2px;
  }

  .nav-plans .nav-item button {
    font-size: .8rem;
  }

  .price span.price-tenure {
    font-size: .65rem;
  }
}