html {
    -webkit-tap-highlight-color: transparent;
}

a {
    cursor: pointer;
}

.no-scroll {
    overflow: hidden;
}

* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.footer-developer:hover {
    color: #224D77 !important;
    text-decoration: underline;
    -webkit-transition: all 200ms ease;
    transition: all 200ms ease;
}

.footer-developer:hover .developer {
    color: #224D77 !important;
    text-decoration: underline;
    -webkit-transition: all 200ms ease;
    transition: all 200ms ease;
}


.filterd-item-wrap,
.popular-item-wrap {
    box-shadow: 8px 4px 30px rgba(0, 0, 0, 0.08) !important;
    transition: all 200ms cubic-bezier(.455, .03, .515, .955);
}

.filterd-item-wrap:hover,
.popular-item-wrap:hover
{
    box-shadow: 2px 2px 25px 0 rgb(0 0 0 / 12%) !important;
    transition: all 200ms cubic-bezier(.455, .03, .515, .955);
}



.top-nav-link.cart:hover .cart-number {
    background-color: #01928F;
}


.input-field {
    width: 100%;
    color: #000;
    align-items: center;
    padding: 0.75rem 0.938rem;
    background-color: #FFFFFF;
    border: 1px solid #D0D5DD;
    box-shadow: 0px 1px 2px rgb(16 24 40 / 5%);
    border-radius: 4px;
    font-size: 0.875rem;
}

.input-secondary {
    border: none;
    border-bottom: 1px solid #D0D5DD;
    border-radius: unset;
    box-shadow: unset;
    padding: 0.625rem 0 !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}


.input-ternary {
    border: none;
    border-radius: unset;
    box-shadow: unset;
    padding: 0.625rem 0 !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
    border-bottom: 1px solid #ffffff;
    background-color: transparent;
    color: white;
}

.input-field.is-colored {
    background-color: #E8E8E8;
}



option:checked {
    color: #667085;
}

:focus-visible {
    outline: unset;
}

.input-secondary:focus {
    border-color: black;

}


    label.error{
      font-size: 0.75rem;
    color: #DA251C;
    margin-top: 0.5rem;
  }


  .input-field.error {
    border: 1px solid #DA251C;
}


select {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
    display: block;
    line-height: normal;
    padding: 0.75rem 2rem 0.75rem 0.75rem !important;
    background-size: 0.8rem;
    background-repeat: no-repeat;
    background-position: 95%;
    background-image: url(icons/icon3.svg);
}

select option {
    color: black;
}

.input-ternary {
    display: block;
    background-size: 0.8rem;
    background-repeat: no-repeat;
    background-position: 97%;
    background-image: url(icons/icon2.svg);
}

.select-small {
    background-position: 90%;
}

::placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #667085;
    font-weight: 400;
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #667085;
    font-weight: 400;
}

::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #667085;
    font-weight: 400;
}

.option-wrap {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem
}

label.check-option {

    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 24px;
    color: #344054;
    cursor: pointer;
}





.card__input,
.checkbox-hidden,
.radio-hidden {
    opacity: 0;
    padding: 0;
    height: initial;
    width: initial;
    display: none;
    cursor: pointer;
}


.input-check {
    opacity: 1 !important;
    padding: 0;
    height: initial;
    width: initial;
    display: block !important;
    cursor: pointer;
    border: 1px solid #D0D5DD;
    border-radius: 4px;
}

.input-check+label {
    margin-bottom: 0;
    margin-left: 8px;
}

.option-button-list {
  display: flex;
    flex-direction: column;
}

.option-button-list .option-wrap {
    width: 46%;
    min-width: 5rem;
    margin-right: 4%;
}

.option-wrap .checkbox-wrap {
    width: 100%;
    cursor: pointer;
    display: block;
}









.check-option {
    width: 100%;
}


.checkbox-group{margin-bottom:0.6875rem;}


.checkbox-group input {
  padding: 0;
  height: initial;
  width: initial;
  margin-bottom: 0;
  display: none;
  cursor: pointer;
}

.checkbox-group label {
  position: relative;
  cursor: pointer;
font-style: normal;
font-weight: 400;
font-size: 14px;
color: #344054;
  /* text-transform:uppercase; */
}

.checkbox-group label:before {
  content:'';
  -webkit-appearance: none;
  background-color: transparent;
border: 2px solid #01928F;
border-radius: 2px;
padding:7px;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  cursor: pointer;
  margin-right: 12px;
}

.checkbox-group input:checked + label:before {
  background-color:#01928F;
}

.checkbox-group input:checked + label:after {
content: '';
    display: block;
    position: absolute;
    top: 4px;
    left: 7px;
    width: 4px;
    height: 10px;
    border: solid white;
    border-width: 0 1px 1px 0;
    transform: rotate(45deg);

}






.otp-wrap .pinlogin {
    display: flex;
    justify-content: space-between;
}

.otp-wrap .pinlogin .pinlogin-field {
    padding: 0.625rem 0.875rem;
    width: 3rem;
    height: 3rem;
    background: #fff;
    border: 1px solid #d0d5dd;
    box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
    border-radius: 0.5rem;
    font-family: Inter;
    font-weight: 400;
    font-size: 1.375rem;
    line-height: 1.5;
    color: #667085;
    text-align: center;
}


.otp-wrap .pinlogin .pinlogin-field.invalid {
    border: 1px solid red;
}


.table-wrap.table-style {
    box-shadow: 0px 4px 8px -2px rgba(16, 24, 40, 0.1), 0px 2px 4px -2px rgba(16, 24, 40, 0.06);
}

.my-account-link-wrap .my-account-link {
    min-width: fit-content;
}

  .table-container{
      width: 100%;
    display: grid;
  }


table {
    width: 100%;
}

 table thead {background-color:#F9FAFB;}

table td {
    white-space: nowrap;
}

.table-data.table-item {
    display: inline-block;
}

  .table-data.is-title.is-white{
  background-color:white;
    padding: 1rem 2rem;
  }


.my-account-link-wrap {
    -ms-overflow-style: none;
    /* Internet Explorer 10+ */
    scrollbar-width: none;
    /* Firefox */
}

.my-account-link-wrap::-webkit-scrollbar {
    display: none;
    /* Safari and Chrome */
}


.cart-item-grid:last-child {
    border-bottom: unset;
    padding-bottom: 0;
}


.accordion-title-wrap:last-child {
    border-bottom: unset;
    padding-bottom: 0;
}

@media screen and (max-width: 991px) {
    .otp-wrap .pinlogin .pinlogin-field {
        padding: 0.5rem;
        width: 3.5rem;
        height: 3.5rem;
        border-radius: 0.3rem;
        font-size: 1rem;
    }
}

.category-filter-left {
    height: 100% !important;
}

  tag{
  line-height: normal;
  }


@media screen and (max-width: 468px) {
    .otp-wrap .pinlogin .pinlogin-field {
        padding: 0.5rem;
        width: 2.5rem;
        height: 2.5rem;
        border-radius: 0.3rem;
        font-size: 1rem;
    }
}

  .popular-item-wrap img {
    transform: scale(1);
    transition: all ease-out 0.5s;
}

  .popular-item-wrap:hover img {
	transform: scale(1.05);
    transition: all ease-out 0.5s;
}



@media screen and (max-width: 600px) {
    .responsive-table .table-tr {
        display: flex;
        flex-direction: column;
        padding: 1.5rem 1.5rem 1.5rem 1.5rem;
        width: 100%;
    }

    .responsive-table .table-tr td {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        white-space: unset !important;
        width: 100% !important;
        font-size: 12px;
    }

    .responsive-table .table-data {
        padding: 0.5rem 0 0.5rem 0 !important;
    }

  .responsive-table .table-data.title {
    padding: 0.5rem 0 1.5rem 0 !important;
}

    .responsive-table .table-data.table-item-small {
        padding: 0 0 0.8rem 0 !important;
    }

    .responsive-table .table-tr td:last-child .table-data {
        padding: 0 !important;
    }

    .responsive-table thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    .responsive-table td::before {
        content: attr(data-label);
        float: left;
        font-weight: bold;
        text-transform: uppercase;
    }

    .responsive-table td:last-child {
        border-bottom: 0;
    }

    .responsive-table .product-img {
        width: 6.1875rem;
        height: 5.3125rem;
    }

    .table-action {
        justify-content: flex-start !important;
    }


  .tag.is-draft,  .tag.is-completed,  .tag.is-pending , .tag.is-expired {
    margin-bottom: 1rem;
}


  .mcq-choises-wrap label.radio-card .card-content-wrapper {

    width: 40px !important;
    height: 40px !important;
    margin-right: 1rem !important;
}


}


  .text-limit-2{
      overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }




@media screen and (min-width: 1990px) {
    .my-account-grid {
        max-width: 113rem;
        margin: auto;
        background-color: white;
    }

    .max-width-full.is-screen-large {
        background-color: #f9fafb;
    }
}




/* end of css head */







 /*  */
 .swiper-button-next,
 .swiper-button-prev {
     display: none;
 }

 .arrow-next:focus,
 .arrow-previous:focus {
     outline: none;
 }

 .swiper-slide {
    height: auto !important;
}


 .swiper-slide.swiper-slide-active .card {
     opacity: 100%;
 }

 .accordion {
     margin: 0;
     list-style: none;
     padding-left: 0;
 }

 .accordion li {
     border-bottom: 1px solid #d0d5dd;
     position: relative;
     margin-bottom: 1.5rem;
 }

 .accordion li:last-child {
     border-bottom: none;
 }

 .accordion li .desc-p {
     display: none;
     padding: 0;
     padding-bottom: 1.5rem;
     padding-right: 2rem;
     padding-left: 3.2rem;
 }

 .accordion a {
     position: relative;
     width: 100%;
     display: flex;
     justify-content: flex-start;
     align-items: center;
     cursor: pointer;
     font-family: "Inter";
     font-style: normal;
     font-weight: 500;
     font-size: 34px;
     padding-bottom: 1.5rem;
     color: #101828;
     padding-right: 2rem;
     user-select: none;
     line-height: 1.2;
 }

 .accordion .faq-icon {
     margin-right: 1rem;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 .accordion a:after {
     position: absolute;
     content: '';
     right: 3px;
     top: 0px;
     width: 36px;
     height: 36px;
     display: block;
     background-size: contain;
     background-repeat: no-repeat;
     background-position: center;
     background-image: url(icons/carousel_2.png);
     border: none;
     transform: rotate(0deg);
     transition: all 0.2s ease-in-out;
 }

 .accordion .desc-p {

     font-style: normal;
     font-weight: 400;
     font-size: 14px;
     color: #667085;
     padding: 10px;
 }

 .accordion a.active:after {
     background-image: url(icons/arrow_1.png);
     transform: rotate(-180deg);
     transition: all 0.2s ease-in-out;
 }

 @media screen and (max-width: 600px) {
     .accordion .faq-icon {
         width: 24px;
         height: 24px;
     }

     .accordion a {
         font-size: 24px;
     }

     .accordion a:after {
         width: 24px;
         height: 24px;
     }

     .accordion li .desc-p {
         padding-left: 2.5rem;
     }
 }

 .swiper-pagination-bullet {
     width: 12px;
     height: 12px;
     display: inline-block;
     border-radius: 50%;
     background: transparent;
     opacity: 1;
     border: 1px solid #858797;
 }

 .swiper-pagination-bullet-active {
     opacity: 1;
     background: #1C1733;
     border: 1px solid #1C1733;
 }

 .slider__pagination {
     display: flex;
     justify-content: flex-start;
 }

 .swiper-pagination-bullet {
     margin-left: 0.75rem;
 }

 .slider-pagination.slider__pagination {
     width: auto !important;
 }

 /* bottom */

 /* Snippet gets rid of top margin on first element in any rich text*/
 .w-richtext>:first-child {
     margin-top: 0;
 }

 /* Snippet gets rid of bottom margin on last element in any rich text*/
 .w-richtext>:last-child,
 .w-richtext ol li:last-child,
 .w-richtext ul li:last-child {
     margin-bottom: 0;
 }

 /* Snippet makes all link elements listed below to inherit color from their parent */
 a,
 .w-tab-link,
 .w-nav-link,
 .w-dropdown-btn,
 .w-dropdown-toggle,
 .w-dropdown-link {
     color: inherit;
 }

 /* Snippet prevents all click and hover interaction with an element */
 .clickable-off {
     pointer-events: none;
 }

 /* Snippet enables all click and hover interaction with an element */
 .clickable-on {
     pointer-events: auto;
 }

 /* Snippet enables you to add class of div-square which creates and maintains a 1:1 dimension of a div.*/
 .div-square::after {
     content: "";
     display: block;
     padding-bottom: 100%;
 }

 /*Hide focus outline for main content element*/
 main:focus-visible {
     outline: -webkit-focus-ring-color auto 0px;
 }

 /* Make sure containers never lose their center alignment*/
 .container-medium,
 .container-small,
 .container-large {
     margin-right: auto !important;
     margin-left: auto !important;
 }

 /*Reset selects, buttons, and links styles*/
 .w-input,
 .w-select,
 a {
     color: inherit;
     text-decoration: inherit;
     font-size: inherit;
 }

 /*Apply "..." after 3 lines of text */
 .text-style-3lines {
     display: -webkit-box;
     overflow: hidden;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
 }

 /* Apply "..." after 2 lines of text */
 .text-style-2lines {
     display: -webkit-box;
     overflow: hidden;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
 }

 /* Apply "..." at 100% width */
 .truncate-width {
     width: 100%;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }

 /* Removes native scrollbar */
 .no-scrollbar {
     -ms-overflow-style: none;
     overflow: -moz-scrollbars-none;
 }

 .no-scrollbar::-webkit-scrollbar {
     display: none;
 }


 /* course program */
 .purchase-contents {
     box-shadow: 1px 8px 17px rgb(0 0 0 / 8%);
     background-color: white;
 }

 .purchase-contents.not-available {
     opacity: 0.4;
 }

 .purchase-contents.current-month {
     background: rgba(1, 146, 143, 0.3);
 }

 .purchase-contents.current-month .content-top {
     border-bottom: 1px solid #fff;
 }

 .purchase-contents.current-month .content-bottom {
     border-top: 1px solid #fff;
 }

 .purchase-contents.current-month .content-bottom .card-price {
     color: black !important;
 }

 .purchase-contents.not-available .content-bottom .card-price {
     color: black !important;
 }

 .purchase-contents .content-bottom .card-price {
     color: #224d77 !important;
 }

 .nav-arrow.testimo-next {
     transform: translate(0%, -50%);
 }

 .nav-arrow.testimo-previous {
     transform: translate(0%, -50%);
 }

 .purchase-slide .swiper-slide {
     height: auto;
 }

 .materials-wrap .material-item:last-child {
     border-bottom: none;
     padding-bottom: 0;
 }

 .package-card-wrap {
     box-shadow: 1px 8px 84px 0px rgba(0, 0, 0, 0.08);
 }

 .package-middle .package-item-wrap:last-child {
     border-bottom: none;
 }

 /* mcq sheet making */


 .mfp-figure {
     background-color: white;
     border-radius: 10px;
 }

 .mfp-image-holder .mfp-close,
 .mfp-iframe-holder .mfp-close {
     color: #000 !important;
     top: 6px!important;
     right: 16px !important;
     text-align: right !important;
     padding-right: 6px !important;
     width: 100% !important;
 }

 .mcq-choises-wrap {
     display: flex;
     flex-direction: row;
 }

 .mcq-choises-wrap label.radio-card {
     cursor: pointer;
     display: flex;
     margin-bottom: 0;
 }

 .mcq-choises-wrap label.radio-card .card-content-wrapper {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 50px;
     height: 50px;
     border: 2px solid #8e8e8e;
     border-radius: 5px;
     transition: 200ms linear;
     margin-right: 1.5rem;
 }

 .mcq-choises-wrap label.radio-card .card-content-wrapper h4 {
     font-weight: 700;
     font-size: 16px;
     color: #8e8e8e;
 }

 .mcq-choises-wrap label.radio-card input[type='radio'] {
     appearance: none;
     -webkit-appearance: none;
     -moz-appearance: none;
 }

 .mcq-choises-wrap label.radio-card input[type='radio']:checked+.card-content-wrapper {
     background: #224d77;
     border: 2px solid #224d77;
 }

 .mcq-choises-wrap label.radio-card input[type='radio']:checked+.card-content-wrapper h4 {
     color: #fff;
 }

 .buttonAnswer {
     border: none;
     outline: none;
     padding: 10px 16px;
     background-color: #f1f1f1;
     cursor: pointer;
     font-size: 18px;
 }

 /* Style the active class, and buttons on mouse-over */
 .buttonAnswer.active,
 .buttonAnswer:hover {
     background-color: #666;
     color: white;
 }

 .buttonAnswer:active,
 .buttonAnswer:hover {
     background-color: #666;
     color: white;
 }