@font-face {
    font-family: "BVietnam";
    font-style: normal;
    font-weight: 100;
    src: url("../fnt/static/Inter-Thin.ttf");
    font-display: swap;
}

@font-face {
    font-family: "BVietnam";
    font-style: normal;
    font-weight: normal;
    src: url("../fnt/static/Inter-Regular.woff2");
    font-display: swap;
}

@font-face {
    font-family: "BVietnam";
    font-style: normal;
    font-weight: 500;
    src: url("../fnt/static/Inter-Medium.woff2");
    font-display: swap;
}

@font-face {
    font-family: "BVietnam";
    font-style: normal;
    font-weight: 700;
    src: url("../fnt/static/Inter-Bold.woff2");
    font-display: swap;
}

@font-face {
    font-family: "BVietnam";
    font-style: normal;
    font-weight: 900;
    src: url("../fnt/static/Inter-Black.ttf");
    font-display: swap;
}


@font-face {
    font-family: "Outfit";
    font-style: normal;
    font-weight: 100;
    src: url("../fnt/outfit/woff/Outfit-Thin.woff") format("woff"), url("../fnt/outfit/woff2/Outfit-Thin.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "Outfit";
    font-style: normal;
    font-weight: normal;
    src: url("../fnt/outfit/woff/Outfit-Regular.woff") format("woff"), url("../fnt/outfit/woff2/Outfit-Regular.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "Outfit";
    font-style: normal;
    font-weight: 500;
    src: url("../fnt/outfit/woff/Outfit-Medium.woff") format("woff"), url("../fnt/outfit/woff2/Outfit-Medium.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "Outfit";
    font-style: normal;
    font-weight: 600;
    src: url("../fnt/outfit/woff/Outfit-SemiBold.woff") format("woff"), url("../fnt/outfit/woff2/Outfit-SemiBold.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "Outfit";
    font-style: normal;
    font-weight: bold;
    src: url("../fnt/outfit/woff/Outfit-Bold.woff") format("woff"), url("../fnt/outfit/woff2/Outfit-Bold.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "Outfit";
    font-style: normal;
    font-weight: 800;
    src: url("../fnt/outfit/woff/Outfit-ExtraBold.woff") format("woff"), url("../fnt/outfit/woff2/Outfit-ExtraBold.woff2") format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "Outfit";
    font-style: normal;
    font-weight: 900;
    src: url("../fnt/outfit/woff/Outfit-Black.woff") format("woff"), url("../fnt/outfit/woff2/Outfit-Black.woff2") format("woff2");
    font-display: swap;
}
/* 
@font-face {
    font-family: PeydaWeb;
    font-style: normal;
    font-weight: 100;
    src: url("../fnt/peyda/woff2/PeydaWeb-Thin.woff2") format("woff2"), url("../fnt/peyda/woff/PeydaWeb-Thin.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: PeydaWeb;
    font-style: normal;
    font-weight: 200;
    src: url("../fnt/peyda/woff2/PeydaWeb-ExtraLight.woff2") format("woff2"), url("../fnt/peyda/woff/PeydaWeb-ExtraLight.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: PeydaWeb;
    font-style: normal;
    font-weight: 300;
    src: url("../fnt/peyda/woff2/PeydaWeb-Light.woff2") format("woff2"), url("../fnt/peyda/woff/PeydaWeb-Light.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: PeydaWeb;
    font-style: normal;
    font-weight: 500;
    src: url("../fnt/peyda/woff2/PeydaWeb-Medium.woff2") format("woff2"), url("../fnt/peyda/woff/PeydaWeb-Medium.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: PeydaWeb;
    font-style: normal;
    font-weight: 600;
    src: url("../fnt/peyda/woff2/PeydaWeb-Semibold.woff2") format("woff2"), url("../fnt/peyda/woff/PeydaWeb-Semibold.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: PeydaWeb;
    font-style: normal;
    font-weight: 800;
    src: url("../fnt/peyda/woff2/PeydaWeb-ExtraBold.woff2") format("woff2"), url("../fnt/peyda/woff/PeydaWeb-ExtraBold.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: PeydaWeb;
    font-style: normal;
    font-weight: 900;
    src: url("../fnt/peyda/woff2/PeydaWeb-Black.woff2") format("woff2"), url("../fnt/peyda/woff/PeydaWeb-Black.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: PeydaWeb;
    font-style: normal;
    font-weight: bold;
    src: url("../fnt/peyda/woff2/PeydaWeb-Bold.woff2") format("woff2"), url("../fnt/peyda/woff/PeydaWeb-Bold.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: PeydaWeb;
    font-style: normal;
    font-weight: normal;
    src: url("../fnt/peyda/woff2/PeydaWeb-Regular.woff2") format("woff2"), url("../fnt/peyda/woff/PeydaWeb-Regular.woff") format("woff");
    font-display: swap;
} */

:root {
    --theme-color-1: #FFFFFF;
    --theme-color-2: #F7F6F9;
    --theme-color-3: #824DEB;
    --theme-color-4: #4CAF50;
    --theme-color-5: #F9A7B0;
    --theme-color-6: #7746d826;
    --theme-color-7: #9B969F;
    --theme-color-8: #484849;
    --theme-color-9: #40216D;
    --theme-color-10: #484849;
    --theme-font: "Outfit", "PeydaWeb";
    --header-height: 58px
}

@media (min-width: 768px) {
    :root {
        --header-height: 72px
    }
}

.no-js [data-aos^=zoom] {
    opacity: 1 !important;
}

body {
    font-family: BVietnam !important;
    font-size: 15px;
    padding: 0;
    margin: 0;
    color: #433F51 !important;
    min-height: 100vh
}

a,
a:hover {
    text-decoration: none;
    color: inherit
}

input,
textarea,
select,
button {
    font-family: BVietnam;
    font-size: 15px;
    color: var(--theme-color-10)
}

svg {
    vertical-align: middle
}

.btn-fill {
    background: var(--theme-color-3);
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    border-radius: 20px;
    padding: 16px;
    transition: all .2s;
    display: inline-block;
    text-align: center;
    border: none
}

.btn-fill.btn-small {
    font-size: 14px;
    font-weight: 400;
    border-radius: 7px;
    padding: 4px 24px
}

.btn-fill.btn-white {
    background: #fff;
    color: var(--theme-color-3)
}

.btn-fill.btn-white:hover {
    box-shadow: 8px 8px 35px rgba(0, 0, 0, .18);
    color: var(--theme-color-3)
}

.btn-fill.btn-gray {
    background: var(--theme-color-2);
    color: var(--theme-color-10)
}

.btn-fill.btn-small:hover,
.btn-fill.btn-gray:hover {
    /*box-shadow: 8px 8px 35px rgba(0, 0, 0, .18);*/
    /*background: var(--theme-color-3);*/
    /*color: #fff;*/
    animation: pulse-animation 2s infinite;
}

.btn-fill:hover {
    box-shadow: 8px 8px 35px rgba(0, 0, 0, .18);
    color: #fff
}

.btn-outline {
    border: 2px solid var(--theme-color-3);
    color: var(--theme-color-3);
    font-size: 16px;
    font-weight: 800;
    border-radius: 20px;
    padding: 14px;
    transition: all .2s;
    display: inline-block;
    text-align: center
}

.btn-outline.btn-small {
    font-size: 14px;
    font-weight: 400;
    border-radius: 15px;
    padding: 2px 22px
}

.btn-outline.btn-white {
    border: 2px solid #fff;
    color: #fff
}

.btn-outline.btn-white:hover {
    box-shadow: 8px 8px 35px rgba(0, 0, 0, .18);
    color: #fff;
    background: rgba(255, 255, 255, .05)
}

.btn-outline.btn-gray {
    background: #fff;
    border: 1px solid var(--theme-color-2);
    color: var(--theme-color-10)
}

.btn-outline.btn-gray:hover {
    box-shadow: 8px 8px 35px rgba(0, 0, 0, .18)
}

.btn-outline:hover {
    box-shadow: 8px 8px 35px rgba(0, 0, 0, .18);
    color: var(--theme-color-3);
    background: var(--theme-color-2)
}

@media (min-width: 768px) {
    .btn-fill {
        font-size: 22px;
        font-weight: 500;
        border-radius: 26px
    }

    .btn-fill.btn-small {
        font-weight: 400;
        font-size: 14px;
        cursor: pointer;
        margin: 0;
        padding: 10px 0;
        border-radius: 7px;
        /*box-shadow: 8px 8px 35px rgba(0, 0, 0, .18);*/
        background: var(--theme-color-3);
        color: #fff;
        width: 48%;
    }

    #LoadMore .btn-small,
    a#LoadMore {
        margin-left: auto;
        margin-right: auto;
        width: fit-content;
        padding: 10px 40px;
    }

    .btn-outline {
        font-size: 22px;
        font-weight: 500;
        border-radius: 26px
    }

    .btn-outline.btn-small {
        font-size: 16px;
        padding: 6px 32px;
        font-weight: bold
    }
}

.cd-words-wrapper {
    display: flex;
    justify-content: center;
    padding-left: 2rem;
    text-align: center;
    width: 700px !important;
}

.cd-words-wrapper>b {
    font-weight: 600 !important;
    font-size: 60px;
    letter-spacing: -0.027em;
}

#find-school-mh,
#main-header {
    height: var(--header-height);
    position: fixed;
    z-index: 100;
    width: 100%;
    transition: background-color 200ms ease-in-out, opacity 200ms ease-in-out, transform 200ms ease-in-out;
    opacity: 1;
    left: 0;
    top: 0;
}

div#find-school-mh {
    background: #EDEBF0;
    top: 0;
    z-index: 1000;
}

#main-header.hide-up {
    transform: translateY(-100%);
    opacity: 0;
}

#find-school-mh .header-menu,
#main-header.home-header .header-menu {
    color: #fff;
}

#main-header.home-header {
    background-color: transparent;
}

#main-header.fixed .header-menu {
    color: #000 !important;
}

#main-header.fixed {
    left: 0;
    right: 0;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
    color: #000 !important;
    background-color: white;
}

#main-header .container {
    position: relative
}

#find-school-mh .row,
#main-header .row {
    position: absolute;
    height: var(--header-height);
    width: 100%;
    z-index: 10
}

#find-school-mh .open-mobile-menu .open_mobile_menu_svg,
#main-header .open-mobile-menu .open_mobile_menu_svg {
    display: block
}
#find-school-mh .open-mobile-menu .close_mobile_menu,
#main-header .open-mobile-menu .close_mobile_menu {
    display: none;
}
#find-school-mh .open-mobile-menu.open .open_mobile_menu_svg,
#main-header .open-mobile-menu.open .open_mobile_menu_svg{
    display: none;
}
#find-school-mh .open-mobile-menu.open .close_mobile_menu,
#main-header .open-mobile-menu.open .close_mobile_menu{
    display: block;
}
#find-school-mh .logo,
#main-header .logo {
    margin: 0
}

#find-school-mh .logo a,
#find-school-mh .logo img,
#main-header .logo a,
#main-header .logo img {
    display: block;
    width: 110px
}

#find-school-mh .login,
#main-header .login {
    font-size: 14px;
    font-weight: 400;
    margin-right: 24px
}

#find-school-mh .account-area,
#main-header .account-area {
    position: relative;
    padding: 10px 0
}

.ham-menu-container .nkh_header-right-side .button span.name {
    color: black;
}

#find-school-mh .account-area .button,
.ham-menu-container .nkh_header-right-side .button,
#main-header .account-area .button {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    position: relative;
}

#find-school-mh .account-area .button .avatar img,
#main-header .account-area .button .avatar img {
    border-radius: 50%;
    display: block;
    width: 25px;
    height: 25px;
    object-fit: cover
}

#find-school-mh .account-area .button .name,
#main-header .account-area .button .name {
    font-size: 15px;
    font-weight: 500
}

#find-school-mh .account-area .button .arrow svg,
#main-header .account-area .button .arrow svg {
    display: block;
    width: 16px
}

#find-school-mh.account-area .menu,
#main-header .account-area .menu {
    position: absolute;
    width: 250px;
    padding: 24px 0;
    background: var(--theme-color-2);
    box-shadow: 2px 2px 23px rgba(0, 0, 0, .1);
    border-radius: 16px;
    flex-direction: column;
    gap: 1px;
    list-style: none;
    margin-top: 35px;
    right: 0;
    display: flex;
    visibility: hidden;
    opacity: 0;
    transition: all .2s
}

#find-school-mh .account-area .menu li a,
#main-header .account-area .menu li a {
    width: 100%;
    background: #fff;
    border: 1px solid #ece8ef;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 6px 24px;
    gap: 8px;
    font-weight: 400;
    font-size: 16px
}

#find-school-mh .account-area .menu::before,
#main-header .account-area .menu::before {
    content: "";
    display: block;
    position: absolute;
    border-style: solid;
    border-width: 15px 10px;
    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) var(--theme-color-2) rgba(0, 0, 0, 0);
    top: -30px;
    right: 30px
}

.ham-menu-container .nkh_header-right-side:hover .menu,
#find-school-mh .account-area:hover .menu,
#main-header .account-area:hover .menu {
    visibility: visible;
    opacity: 1;
    margin-top: 20px
}

#mobile-menu {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 500
}

#mobile-menu .wrapper {
    background: #fff;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    overflow-y: auto
}

#mobile-menu .wrapper .close-mobile-menu {
    margin: 24px
}

#mobile-menu .wrapper .menu {
    margin-top: auto;
    margin-bottom: auto;
    width: 100%
}

#mobile-menu .wrapper .menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 8px
}

#mobile-menu .wrapper .menu ul li a {
    display: block;
    font-size: 16px;
    font-weight: 500;
    padding: 12px 0
}

#mobile-menu .wrapper .menu ul li a:hover {
    box-shadow: inset 10px 0 var(--theme-color-3)
}

#mobile-menu .wrapper .menu ul li .arrow {
    display: none
}

#mobile-menu .wrapper .menu ul li.menu-item-has-children>a {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    justify-content: center
}

#mobile-menu .wrapper .menu ul li.menu-item-has-children>a>.arrow {
    display: block;
    flex: 0 0 auto;
    transition: all .2s
}

#mobile-menu .wrapper .menu ul li.menu-item-has-children>a>.arrow svg {
    display: block
}

#mobile-menu .wrapper .menu ul li.menu-item-has-children>a>.arrow.active {
    transform: rotate(180deg)
}

#mobile-menu .wrapper .menu .sub-menu {
    padding-top: 8px;
    display: none
}

#mobile-menu .wrapper .logo {
    margin: 50px 0;
    align-self: center;
    width: 80px
}

#apply-yourself-roadmap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    position: relative;
    background: #fff;
    gap: 8px;
    position: relative;
    background-color: #e0bef9
}

#apply-yourself-roadmap.fixed {
    position: fixed;
    z-index: 500;
    width: 100%;
    top: var(--header-height);
    left: 0;
    right: 0
}

#apply-yourself-roadmap .step {
    position: relative
}

#apply-yourself-roadmap .step>a {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    font-size: 15px;
    font-weight: 500
}

#apply-yourself-roadmap .step>a .icon svg {
    display: block;
    width: 24px;
    height: 24px
}

#apply-yourself-roadmap .step>a .number {
    font-size: 14px;
    opacity: .6
}

#apply-yourself-roadmap .step>a:hover {
    color: var(--theme-color-3);
    stroke: var(--theme-color-3)
}

#apply-yourself-roadmap .step>a .step-check {
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    background: var(--theme-color-3);
    color: #fff;
    left: calc(50% + 16px);
    top: 10px
}

#apply-yourself-roadmap .step>a .step-check svg {
    width: 20px;
    height: 20px;
    display: block
}

#apply-yourself-roadmap .step.current>a {
    background: var(--theme-color-3);
    color: #fff;
    font-weight: 700
}

#apply-yourself-roadmap .step.current>a svg {
    stroke-width: 2.5
}

#apply-yourself-roadmap .step.current>a .step-check {
    color: var(--theme-color-3);
    background: #fff
}

#apply-yourself-roadmap .step .application-list-msg,
#apply-yourself-roadmap .step .send-email-msg {
    position: fixed;
    background: #fff;
    border-radius: 8px;
    box-shadow: 2px 2px 23px rgba(0, 0, 0, .4);
    border: 2px solid #989699;
    display: none;
    margin-top: 24px;
    z-index: 500
}

#apply-yourself-roadmap .step .application-list-msg::before,
#apply-yourself-roadmap .step .send-email-msg::before {
    content: "";
    position: absolute;
    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #989699 rgba(0, 0, 0, 0);
    border-width: 16px;
    border-style: solid;
    top: -32px;
    left: 42px
}

#apply-yourself-roadmap .step .application-list-msg::after,
#apply-yourself-roadmap .step .send-email-msg::after {
    content: "";
    position: absolute;
    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #fff rgba(0, 0, 0, 0);
    border-width: 16px;
    border-style: solid;
    top: -29px;
    left: 42px
}

#apply-yourself-roadmap .step .application-list-msg .text,
#apply-yourself-roadmap .step .send-email-msg .text {
    margin: 8px 16px;
    max-width: 300px;
    font-size: 16px;
    line-height: 1.618
}

#apply-yourself-roadmap .step .application-list-msg .text .highlight,
#apply-yourself-roadmap .step .send-email-msg .text .highlight {
    color: var(--theme-color-3)
}

#apply-yourself-roadmap::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 30px;
    height: 85px;
    background: url(../img/svg/roadmap-bg.svg) no-repeat left
}

#apply-yourself-roadmap::after {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 30px;
    height: 85px;
    background: url(../img/svg/roadmap-bg2.svg) no-repeat right
}

#header-note {
    background: var(--theme-color-3);
    color: #fff;
    font-size: 17px;
    padding: 8px 0;
    line-height: 1.618
}

#header-note .close {
    cursor: pointer
}

#main-footer {
    background: #0b0327;
    color: #000;
    padding: 96px 0 20px 0
}

#main-footer .phones a {
    color: #fff;
    font-size: 14px;
}

#main-footer .footer_cta a {
    display: block;
    padding: 14px 0;
    border-radius: 7px;
    margin-bottom: 10px;
    background: var(--theme-color-3);
    color: #fff;
    text-align: center;
}

#main-footer .footer_cta a.help {
    background: #fff;
    color: var(--theme-color-3);
    transition: all ease 300ms;
}

#main-footer .footer_cta a.help:hover {
    background: var(--theme-color-3);
    color: #fff;
}


#main-footer .contact {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

#main-footer .contact .email a {
    margin-left: 10px;
    font-size: 16px;
    font-weight: 500px
}

#main-footer .socials {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
    justify-content: end;
}

#main-footer .copyright {
    font-size: 14px;
    font-weight: 400;
    color: #fff;
}

#main-footer .end_footer {
    border-top: 1px solid #3c3b3b;
    padding-top: 12px;
    margin-top: 12px;
}

#main-footer .footer-menu {
    font-size: 16px
}

#main-footer .footer-menu .title {
    margin-top: 0;
    margin-bottom: 20px;
    font-weight: 600;
    color: #fff;
    font-size: 18px;
}

#main-footer .footer-menu .title i {
    display: none;
}

#main-footer .footer-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-weight: normal
}

#main-footer .footer-menu ul li a {
    color: #fff;
}

#main-footer .footer-menu ul li a:hover {
    color: #824deb;
}

.have-sidebar-filter {
    width: 100%;
    /*max-width: 1360px;*/
    margin-right: auto;
    margin-left: auto
}

.have-sidebar-filter .mobile-filter-nav {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    padding: 8px 16px
}

.have-sidebar-filter .mobile-filter-nav .action-links {
    display: none;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto
}

.have-sidebar-filter .mobile-filter-nav .action-links .btn-fill {
    padding: 8px;
    flex: 0 0 auto;
    width: calc(50% - 4px);
    font-weight: 400;
    font-size: 14px
}

.have-sidebar-filter .mobile-filter-nav .action-links .btn-outline {
    border-width: 1px;
    padding: 7px 8px;
    flex: 0 0 auto;
    width: calc(50% - 4px);
    font-weight: 400;
    font-size: 14px
}

.have-sidebar-filter #open-side-filter {
    background: #fff;
    z-index: 100;
    border-radius: 12px;
    padding: 5px 10px;
    box-shadow: 2px 2px 23px rgba(0, 0, 0, .1);
    border: 1px solid var(--theme-color-2);
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    transition: all .2s;
    margin-bottom: 10px;
    width: 92%;
    display: none;
}

.have-sidebar-filter #open-side-filter>div {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px
}

.have-sidebar-filter #open-side-filter:hover {
    border: 1px solid var(--theme-color-3)
}

.have-sidebar-filter .side-filter {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding-left: 16px;
    padding-right: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    visibility: hidden;
    background: #fff;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 500;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
    border-radius: 7px;
    padding: 10px;
}

.have-sidebar-filter .side-filter::-webkit-scrollbar {
    width: 4px
}

.have-sidebar-filter .side-filter::-webkit-scrollbar-track {
    background: var(--theme-color-2);
    border-radius: 4px
}

.have-sidebar-filter .side-filter::-webkit-scrollbar-thumb {
    background: var(--theme-color-7);
    border-radius: 4px
}

.have-sidebar-filter .side-filter .close-mobile-filter {
    margin-top: 16px
}

.have-sidebar-filter .side-filter .action-links {
    display: none
}

.have-sidebar-filter .side-filter>header {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 16px 8px 16px 0;
    gap: 8px
}

.have-sidebar-filter .side-filter>header h4 {
    font-weight: 800;
    font-size: 16px;
    margin: 0
}

.have-sidebar-filter .side-filter>header .refresh {
    flex: 0 0 auto;
    cursor: pointer
}

.have-sidebar-filter .side-filter>header .toggle {
    flex: 0 0 auto;
    margin-left: auto;
    padding: 4px;
    cursor: pointer;
    display: none
}

.have-sidebar-filter .side-filter>header svg {
    display: block
}

.have-sidebar-filter .side-filter .entry {
    padding: 0 0 8px 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px
}

.have-sidebar-filter .side-filter .entry>.filter-item {
    border-bottom: 1px solid var(--theme-color-2)
}

.have-sidebar-filter .side-filter .entry>.filter-item>.header,
.have-sidebar-filter .side-filter .entry>.filter-item>.select-box {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 8px 8px 8px 0px;
    gap: 8px;
    cursor: pointer
}

.have-sidebar-filter .side-filter .entry>.filter-item>.header .logo,
.have-sidebar-filter .side-filter .entry>.filter-item>.select-box .logo {
    flex: 0 0 auto
}

.have-sidebar-filter .side-filter .entry>.filter-item>.header .logo svg,
.have-sidebar-filter .side-filter .entry>.filter-item>.select-box .logo svg {
    display: block
}

.have-sidebar-filter .side-filter .entry>.filter-item>.header .text,
.have-sidebar-filter .side-filter .entry>.filter-item>.header .heading,
.have-sidebar-filter .side-filter .entry>.filter-item>.select-box .text,
.have-sidebar-filter .side-filter .entry>.filter-item>.select-box .heading {
    flex: 1 1 auto;
    font-weight: 500;
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.have-sidebar-filter .side-filter .entry>.filter-item>.header .clear-filter,
.have-sidebar-filter .side-filter .entry>.filter-item>.select-box .clear-filter {
    flex: 0 0 auto;
    display: none
}

.have-sidebar-filter .side-filter .entry>.filter-item>.header .number,
.have-sidebar-filter .side-filter .entry>.filter-item>.select-box .number {
    flex: 0 0 auto;
    display: none;
    background: var(--theme-color-3);
    color: #fff;
    width: 20px;
    height: 20px;
    line-height: 20px;
    border-radius: 50%;
    text-align: center;
    font-size: 12px;
    font-weight: 600
}

.have-sidebar-filter .side-filter .entry>.filter-item>.header .toggle-entry,
.have-sidebar-filter .side-filter .entry>.filter-item>.select-box .toggle-entry {
    flex: 0 0 auto
}

.have-sidebar-filter .side-filter .entry>.filter-item>.header .toggle-entry svg,
.have-sidebar-filter .side-filter .entry>.filter-item>.select-box .toggle-entry svg {
    display: block
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-box {
    background: #fff;
    box-shadow: 2px 2px 35px rgba(0, 0, 0, .16);
    border-radius: 15px;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 8px 12px;
    gap: 16px;
    width: 100%
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-box input {
    flex: 1 1 auto;
    font-weight: 400;
    font-size: 14px;
    color: #9b969f;
    border: unset;
    width: calc(100% - 18px);
    padding: 0;
    outline: none
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-box input::placeholder {
    color: #9b969f
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-box .logo {
    flex: 0 0 auto
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-box .logo svg {
    display: block
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result {
    max-height: 230px;
    overflow-y: auto;
    display: none;
    margin-bottom: 8px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result::-webkit-scrollbar {
    width: 4px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result::-webkit-scrollbar-track {
    background: var(--theme-color-2);
    border-radius: 4px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result::-webkit-scrollbar-thumb {
    background: var(--theme-color-7);
    border-radius: 4px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result>span {
    font-weight: 400;
    font-size: 12px;
    color: #9b969f
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul {
    list-style: none;
    padding: 0 8px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li {
    display: flex;
    flex-direction: row;
    gap: 4px;
    font-weight: 400;
    font-size: 15px;
    width: 100%;
    cursor: pointer;
    padding: 2px;
    border-radius: 8px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item.master-has-sub-item,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li.master-has-sub-item {
    display: none
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .checkbox,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .checkbox {
    margin-top: 2px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .checkbox input,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .checkbox input {
    display: none
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .checkbox input~.checkmark .uncheck,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .checkbox input~.checkmark .uncheck {
    display: block
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .checkbox input~.checkmark .check,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .checkbox input~.checkmark .check {
    display: none
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .checkbox input:checked~.checkmark .uncheck,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .checkbox input:checked~.checkmark .uncheck {
    display: none
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .checkbox input:checked~.checkmark .check,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .checkbox input:checked~.checkmark .check {
    display: block
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .checkbox svg,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .checkbox svg {
    display: block
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .logo,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .logo {
    width: 12px;
    height: 12px;
    flex: 0 0 auto;
    margin-top: 4px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .logo img,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .logo img {
    display: block
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .icon,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .icon {
    flex: 0 0 auto;
    margin-top: 4px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .icon i,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .icon i {
    display: block;
    font-size: 12px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .icon img,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .icon img {
    display: block;
    width: 15px;
    height: auto
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item .radio-select,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li .radio-select {
    flex: 0 0 auto;
    width: 6px;
    height: 6px;
    background: #bbb;
    border-radius: 50%;
    margin-right: 4px
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item:hover,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li:hover {
    background: var(--theme-color-2)
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul .list-item.disabled,
.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul>li.disabled {
    opacity: .5
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result ul.conditions {
    padding: 4px 0 0 0;
    margin: 4px 8px 0 8px;
    border-top: 1px solid #eee
}

.have-sidebar-filter .side-filter .entry>.filter-item .search-result .clear-filter {
    padding: 0 16px;
    margin-bottom: 8px;
    font-weight: 400;
    font-size: 14px;
    cursor: pointer
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control {
    display: none;
    flex-direction: row;
    width: 100;
    align-items: center;
    padding: 4px 16px 16px 0
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control.show {
    display: flex
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control .min,
.have-sidebar-filter .side-filter .entry>.filter-item .volume-control .max {
    width: 22px;
    padding: 0;
    margin: 0;
    line-height: 1;
    text-align: center;
    border: none;
    outline: none;
    font-size: 14px
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control .max {
    width: 30px
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control .sep {
    margin: 0 3px;
    font-size: 14px
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control .slider-range {
    flex: 1 1 auto;
    margin-left: 8px;
    height: 7px
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control .slider-range .ui-slider-range {
    background: #ddd
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control .slider-range .ui-slider-handle {
    outline: none;
    width: 14px;
    height: 14px;
    border-radius: 7px;
    background: var(--theme-color-3);
    border: none !important;
    top: -100%
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control.deadline-volume {
    flex-direction: column;
    padding-left: 22px
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control.deadline-volume .min,
.have-sidebar-filter .side-filter .entry>.filter-item .volume-control.deadline-volume .max {
    display: none
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control.deadline-volume .text {
    font-size: 14px;
    margin-bottom: 8px
}

.have-sidebar-filter .side-filter .entry>.filter-item .volume-control.deadline-volume .slider-range {
    width: 100%;
    margin-left: 0
}

.have-sidebar-filter .side-filter .entry>.filter-item .selected-english>ul,
.have-sidebar-filter .side-filter .entry>.filter-item .selected-deadline>ul {
    padding: 0 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    list-style: none
}

.have-sidebar-filter .side-filter .entry>.filter-item .selected-english>ul>li,
.have-sidebar-filter .side-filter .entry>.filter-item .selected-deadline>ul>li {
    display: flex;
    flex-direction: row;
    gap: 20px;
    align-items: center;
    position: relative
}

.have-sidebar-filter .side-filter .entry>.filter-item .selected-english>ul>li img,
.have-sidebar-filter .side-filter .entry>.filter-item .selected-deadline>ul>li img {
    width: 30px;
    height: auto;
    flex: 0 0 auto
}

.have-sidebar-filter .side-filter .entry>.filter-item .selected-english>ul>li>div,
.have-sidebar-filter .side-filter .entry>.filter-item .selected-deadline>ul>li>div {
    flex: 1 1 auto
}

.have-sidebar-filter .side-filter .entry>.filter-item .selected-english>ul>li .label,
.have-sidebar-filter .side-filter .entry>.filter-item .selected-deadline>ul>li .label {
    position: absolute;
    z-index: 10;
    top: 5px;
    right: calc(50% - 50px)
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-search {
    border-bottom: unset
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-search .search-box {
    background: #fff;
    box-shadow: 2px 2px 35px rgba(0, 0, 0, .16);
    border-radius: 15px;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 8px 12px;
    gap: 8px;
    width: 100%
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-search .search-box input {
    flex: 1 1 auto;
    font-weight: 500;
    font-size: 16px;
    color: #9b969f;
    border: unset;
    width: calc(100% - 18px);
    padding: 0;
    outline: none
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-search .search-box input::placeholder {
    color: #9b969f
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-search .search-box .logo svg {
    display: block;
    cursor: pointer
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-search .search-box .clear-filter {
    flex: 0 0 auto;
    display: none;
    cursor: pointer
}

.have-sidebar-filter .side-filter .entry>.filter-item.open>.header .toggle-entry svg,
.have-sidebar-filter .side-filter .entry>.filter-item.open>.select-box .toggle-entry svg {
    transform: rotate(180deg)
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-orderby .header .order {
    display: none;
    cursor: pointer
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-orderby .header .order input {
    display: none
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-orderby .header .order input~.checkmark .uncheck {
    display: block
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-orderby .header .order input~.checkmark .check {
    display: none
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-orderby .header .order input:checked~.checkmark .uncheck {
    display: none
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-orderby .header .order input:checked~.checkmark .check {
    display: block
}

.have-sidebar-filter .side-filter .entry>.filter-item.filter-item-orderby .search-result .list-item.disabled {
    opacity: .6
}

.have-sidebar-filter .side-filter .mobile-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px 0;
    margin-top: auto;
    margin-bottom: auto
}

.have-sidebar-filter .side-filter .mobile-logo img {
    display: block
}

.have-sidebar-filter .main-content {
    width: 100%;
    padding: 16px 0;
    position: relative;
}

.have-sidebar-filter .main-content .help_center_box {
    position: absolute;
    right: 0;
    top: 8px;
}

.have-sidebar-filter .main-content .faculty_lists {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin-left: -8px;
    margin-right: -8px;
    gap: 25px 0;
    justify-content: center;
}

.have-sidebar-filter .main-content .faculty_lists>* {
    padding-right: 8px;
    padding-left: 8px
}

.have-sidebar-filter .main-content .loading {
    background: rgba(0, 0, 0, 0);
    height: calc(100vh - var(--header-height) - 40px);
    position: relative;
    display: none
}

.have-sidebar-filter .main-content .loading .spiner {
    border: 8px solid #ddd;
    border-top-color: var(--theme-color-3);
    display: block;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    animation: spiner 1.2s infinite;
    animation-timing-function: ease-in-out;
    position: absolute;
    top: calc(50% - 23px);
    left: calc(50% - 23px)
}

@keyframes spiner {
    to {
        transform: rotate(360deg)
    }
}

.have-sidebar-filter.filter-is-close .main-content {
    margin-right: auto;
    margin-left: auto
}

@media (max-width:1440px) {
    #page.page-pricing .tabs::after {
        top: -16px !important;
    }

    #page.page-pricing .tabs::before {
        top: 0 !important;
    }
}

@media (min-width: 992px) {
    .enable-roadmap .have-sidebar-filter .side-filter {
        height: auto;
    }

    #page.page-pricing .tabs::after {
        top: 4px !important;
    }

    #page.page-pricing .tabs::before {
        top: 20px !important;
    }

    .have-sidebar-filter .mobile-filter-nav {
        display: none
    }

    .have-sidebar-filter .side-filter {
        /*position: sticky;*/
        /*top: .5rem;*/
        /*width: 300px;*/
        visibility: visible;
        height: auto;
        margin-top: 16px;
        /*background: rgba(0, 0, 0, 0);*/
        /*padding-left: 30px;*/
        /*padding-right: 4px;*/
        bottom: unset;
        right: unset;
        left: unset
    }

    .nkh_top-55 {
        top: 7.5rem !important;
    }

    .have-sidebar-filter .side-filter .close-mobile-filter {
        display: none
    }

    .have-sidebar-filter .side-filter .action-links {
        display: flex;
        flex-direction: column;
        gap: 8px
    }

    .have-sidebar-filter .side-filter .action-links a {
        padding-left: 5px;
        padding-right: 5px;
        display: flex;
        flex-direction: row;
        gap: 5px;
        align-items: center;
        justify-content: center
    }

    .have-sidebar-filter .side-filter .action-links a svg {
        flex: 0 0 auto
    }

    .have-sidebar-filter .side-filter .action-links a.btn-outline {
        font-weight: 500;
        color: #484849
    }

    .have-sidebar-filter .side-filter header .toggle {
        display: block
    }

    .have-sidebar-filter .side-filter .mobile-logo {
        display: none
    }

    .have-sidebar-filter .main-content {
        /*width: calc(100% - 320px);*/
        margin-left: auto;
        /*padding: 20px;*/

    }

    /*.rank-table{*/
    /*    margin-top:50px;*/
    /*}*/
}

#searchform input {
    border: 0;
    background: #f5f5f5;
    padding: 10px;
    border-radius: 7px;
}

#searchform button {
    padding: 10px;
    border-radius: 7px;
    border: 0;
    background: #7746d8;
    cursor: pointer;
    color: #fff;
}

#searchform input:focus,
#searchform button:focus {
    outline: 0;
}

.blr_image .faculty_card > div:nth-child(1) {
    filter: blur(7px);
    -webkit-filter: blur(7px);
    cursor: not-allowed;
    pointer-events: none;
}

#close-add-to-compare {
    font-size: 30px;
    cursor: pointer
}

#add-compare-school,
#add-compare-program {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1500;
    overflow-y: auto;
    background: #333;
    display: none
}

#add-compare-school .dark-layer,
#add-compare-program .dark-layer {
    display: none
}

#add-compare-school .wrapper,
#add-compare-program .wrapper {
    position: relative;
    transform: translateX(-50%);
    left: 50%;
    width: 100%;
    max-width: 620px;
    padding: 10px 30px;
    color: #fff
}

#add-compare-school .wrapper h3.heading,
#add-compare-program .wrapper h3.heading {
    text-align: center;
    font-size: 22px;
    margin-top: 0;
    margin-bottom: 10px
}

#add-compare-school .wrapper .description,
#add-compare-program .wrapper .description {
    text-align: center;
    font-size: 14px;
    margin: 0
}

#add-compare-school .wrapper .search-box,
#add-compare-program .wrapper .search-box {
    background: #fff;
    display: flex;
    width: 100%;
    color: #444;
    height: 40px;
    border-radius: 5px;
    margin-top: 20px;
    align-items: center
}

#add-compare-school .wrapper .search-box i,
#add-compare-program .wrapper .search-box i {
    width: 40px;
    height: 40px;
    font-size: 20px;
    text-align: center;
    line-height: 40px;
    border-right: 1px solid #eee
}

#add-compare-school .wrapper .search-box input,
#add-compare-program .wrapper .search-box input {
    width: calc(100% - 40px);
    height: 40px;
    padding: 0 10px;
    font-size: 15px;
    background: rgba(0, 0, 0, 0);
    border: 0;
    outline: none;
    color: #666
}

#add-compare-program .wrapper .search-box.loading i {
    -webkit-animation-name: fa-spin;
    animation-name: fa-spin;
    -webkit-animation-delay: 0;
    animation-delay: 0;
    -webkit-animation-delay: var(--fa-animation-delay, 0);
    animation-delay: var(--fa-animation-delay, 0);
    -webkit-animation-direction: normal;
    animation-direction: normal;
    -webkit-animation-direction: var(--fa-animation-direction, normal);
    animation-direction: var(--fa-animation-direction, normal);
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-duration: var(--fa-animation-duration, 2s);
    animation-duration: var(--fa-animation-duration, 2s);
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: var(--fa-animation-iteration-count, infinite);
    animation-iteration-count: var(--fa-animation-iteration-count, infinite);
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-timing-function: var(--fa-animation-timing, linear);
    animation-timing-function: var(--fa-animation-timing, linear);
    border-color: transparent;
}

#add-compare-program .wrapper .search-box.loading i::before {
    content: "\f110";
}

#add-compare-school .wrapper .search-box input::placeholder,
#add-compare-program .wrapper .search-box input::placeholder {
    color: #888
}

#add-compare-school button.compare-action,
#add-compare-program button.compare-action {
    display: block;
    width: 100%;
    background: #2bc56d;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    border: none;
    border-radius: 10px;
    padding: 15px 0;
    margin-top: 20px;
    cursor: pointer;
    display: none
}

#add-compare-school .search-result,
#add-compare-program .search-result {
    max-height: 320px;
    overflow-y: auto;
    margin-top: 20px
}

#add-compare-school .search-result ul,
#add-compare-program .search-result ul {
    list-style: none;
    margin: 0;
    padding: 0
}

#add-compare-school .search-result li,
#add-compare-program .search-result li {
    display: flex;
    background: #fff;
    border-radius: 10px;
    color: #555;
    overflow: hidden;
    padding: 10px 30px;
    align-items: center
}

#add-compare-school .search-result li:not(:last-child),
#add-compare-program .search-result li:not(:last-child) {
    margin-bottom: 10px
}

#add-compare-school .search-result li .logo img,
#add-compare-program .search-result li .logo img {
    display: block;
    width: 60px;
    height: 60px;
    object-fit: contain
}

#add-compare-school .search-result li .heading,
#add-compare-program .search-result li .heading {
    padding-left: 30px
}

#add-compare-school .search-result li .heading .name,
#add-compare-program .search-result li .heading .name {
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 8px
}

#add-compare-program .search-result li .heading .name {
    margin-bottom: 0;
}

#add-compare-school .search-result li .heading .place,
#add-compare-program .search-result li .heading .place {
    font-size: 12px;
    color: #888
}

#add-compare-school .search-result li .checkbox,
#add-compare-program .search-result li .checkbox {
    margin-left: auto;
    position: relative;
    width: 40px;
    height: 40px
}

#add-compare-school .search-result li .checkbox input,
#add-compare-program .search-result li .checkbox input {
    width: 0;
    height: 0
}

#add-compare-school .search-result li .checkbox input::before,
#add-compare-program .search-result li .checkbox input::before {
    content: "+";
    width: 40px;
    height: 40px;
    background: #999;
    border-radius: 50%;
    position: absolute;
    top: 0;
    right: 0;
    font-weight: 300;
    font-size: 34px;
    text-align: center;
    line-height: 40px;
    color: #fff;
    display: flex;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    padding-bottom: 5px;
}

#add-compare-school .search-result li .checkbox input:checked::before,
#add-compare-program .search-result li .checkbox input:checked::before {
    font-family: "Font Awesome 6 Pro";
    background: #2bc56d;
    content: "";
    font-size: 22px
}

#add-compare-school .select-school-list,
#add-compare-program .select-program-list {
    list-style: none;
    margin: 10px -8px 0 -8px;
    padding: 0;
    display: flex;
    flex-wrap: wrap
}

#add-compare-school .select-school-list li,
#add-compare-program .select-program-list li {
    margin: 8px;
    background: #fff;
    width: 60px;
    height: 60px;
    border-radius: 50%
}

#add-compare-program .select-program-list li {
    width: auto;
    height: auto;
    background: none;
    display: flex;
    flex-direction: column-reverse;
    font-weight: bold;
    font-size: 17px;
    width: 45%;
}

#add-compare-program .select-program-list li .uni_name {
    font-weight: 400;
    font-size: 14px;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

#add-compare-school .select-school-list li img,
#add-compare-program .select-program-list li img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: contain
}

body.page-template-background-page .bg-single-page {
    padding: 50px 0
}

#page {
    padding: 54px 0
}

#page .container {
    max-width: 80%;
    font-size: 17px;
    line-height: 1.618;
}

#page .container .content p a {
    color: var(--theme-color-3)
}

#page .container .content p a:hover {
    text-decoration: underline
}

#page.page-apply-yourself {
    margin-bottom: 50px
}

#page.page-apply-yourself .container {
    max-width: 800px
}

#page.page-apply-yourself .get-started {
    margin-top: 24px;
    padding: 8px 32px
}

#page.page-favorite-list .container {
    max-width: 1200px
}

#page.page-pricing .tabs {
    display: flex;
    flex-direction: row;
    position: relative;
    padding-top: 24px
}

#page.page-pricing .tabs a {
    flex: 0 0 auto;
    width: 50%;
    padding: 24px 8px;
    text-align: center;
    font-size: 20px;
    border-bottom: 4px solid var(--theme-color-2)
}

#page.page-pricing .tabs a.active {
    border-color: var(--theme-color-3);
    font-weight: 800;
    color: var(--theme-color-3)
}

#page.page-pricing .tabs::before {
    content: "";
    display: block;
    position: absolute;
    width: 50%;
    height: 24px;
    border: 1px solid #ddd;
    border-bottom: 0;
    left: 25%;
    top: 0;
    border-radius: 8px 8px 0 0
}

#page.page-pricing .tabs::after {
    content: "";
    display: block;
    position: absolute;
    width: 1px;
    height: 16px;
    background: #ddd;
    left: 50%;
    top: -16px
}

#page.page-pricing .apply-yourself .ays-price-table {
    overflow-x: auto;
    width: 100%;
    padding-bottom: 30px
}

#page.page-pricing .apply-yourself .ays-price-table table {
    width: 100%;
    border-spacing: 4px;
    white-space: nowrap
}

#page.page-pricing .apply-yourself .ays-price-table table thead th {
    background: var(--theme-color-9);
    color: #fff;
    padding: 8px;
    border-radius: 8px;
    font-size: 18px;
    width: 33.333%
}

#page.page-pricing .apply-yourself .ays-price-table table thead th:first-child {
    background: var(--theme-color-3)
}

#page.page-pricing .apply-yourself .ays-price-table table thead .plan {
    min-width: 120px
}

#page.page-pricing .apply-yourself .ays-price-table table tbody.options tr:nth-child(odd) {
    background: #f8efff
}

#page.page-pricing .apply-yourself .ays-price-table table tbody.options tr:nth-child(even) {
    background: #f1ddff
}

#page.page-pricing .apply-yourself .ays-price-table table tbody.options td,
#page.page-pricing .apply-yourself .ays-price-table table tbody.options th {
    padding: 8px;
    border-radius: 8px;
    font-size: 16px;
    width: 33.333%
}

#page.page-pricing .apply-yourself .ays-price-table table tbody.price td,
#page.page-pricing .apply-yourself .ays-price-table table tbody.price th {
    background: var(--theme-color-9);
    color: #fff;
    padding: 8px;
    border-radius: 8px;
    font-size: 18px
}

#page.page-pricing .apply-yourself .ays-price-table table tbody.price th {
    background: var(--theme-color-3)
}

#page.page-pricing .apply-yourself .ays-price-table table tbody.price del {
    display: block;
    font-size: .7em
}

#page.page-pricing .apply-yourself .ays-price-table table tbody.price ins {
    display: block;
    text-decoration: none
}

#page.page-pricing .apply-yourself .ays-price-table table tbody.payment a,
#page.page-pricing .apply-yourself .ays-price-table table tbody.payment .wspsc_add_cart_submit {
    padding: 8px;
    border-radius: 8px;
    font-size: 18px;
    width: 100% !important;
    transition: all .2s;
    display: inline-block;
    text-align: center;
    border: 2px solid var(--theme-color-3);
    color: var(--theme-color-3);
    font-weight: bold;
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0);
    height: 50px
}

#page.page-pricing .apply-width-us {
    display: none;
    line-height: 1.618
}

#page.page-pricing .apply-width-us p {
    margin: 24px 0
}

#page.page-pricing .apply-width-us .payment a {
    padding: 12px 40px;
    font-size: 20px
}

#page.page-pricing .action-link {
    width: 550px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 8px;
    margin: 40px auto
}

#page.page-pricing .action-link>a {
    flex: 0 0 auto;
    width: calc(50% - 4px)
}

#page.our-service .container {
    max-width: 1360px
}

#page.our-service .container .note {
    margin: 30px 0;
    background: #faecd2;
    border-radius: 16px;
    padding: 16px;
    color: #b07d1f;
    font-size: 16px
}

#page.our-service .container .note svg {
    margin-right: 5px
}

#page.our-service .container .service-cart {
    border: 1px solid #aaa;
    border-radius: 16px;
    padding: 16px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    height: 100%
}

#page.our-service .container .service-cart .title {
    margin: 0;
    font-size: 22px
}

#page.our-service .container .service-cart p {
    margin: 0 0 16px 0;
    text-align: left
}

#page.our-service .container .service-cart svg {
    stroke: var(--theme-color-3)
}

#page.our-service .container .service-cart a {
    width: 100%;
    margin: auto 0 0 0
}

#page.our-service .container .service-cart .wp_cart_button_wrapper {
    width: 100%;
    margin: auto 0 0 0
}

#page.our-service .container .service-cart .wp_cart_button_wrapper .wspsc_add_cart_submit {
    width: 100% !important;
    margin: auto 0 0 0;
    font-size: 16px;
    padding: 8px 32px;
    font-weight: bold;
    border-radius: 15px;
    background: var(--theme-color-3);
    color: #fff;
    display: block;
    text-align: center;
    border: none;
    cursor: pointer
}

#page.payment-page .payment-item {
    height: 100%;
    border: 1px solid #ddd;
    border-radius: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 16px
}

#page.payment-page .payment-item.active {
    background-color: var(--theme-color-2)
}

#page.payment-page .section {
    border-radius: 16px;
    padding: 32px;
    background: var(--theme-color-2);
    font-size: 18px
}

#page.payment-page .section:not(:first-child) {
    display: none
}

#page.payment-page .section .note,
#page.payment-page .section .whatsapp {
    text-align: center;
    font-size: 20px;
    font-weight: bold
}

#website-alert {
    position: fixed;
    left: 20px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 2px 2px 23px rgba(0, 0, 0, .4);
    border: 2px solid #989699;
    display: none;
    z-index: 1000000;
}

#website-alert::before {
    /*content: "";*/
    position: absolute;
    border-color: #989699 #989699 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    border-width: 10px 15px;
    border-style: solid;
    bottom: -20px;
    right: 15px
}

#website-alert::after {
    /*content: "";*/
    position: absolute;
    border-color: #fff #fff rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    border-width: 10px 15px;
    border-style: solid;
    bottom: -16px;
    right: 17px
}

#website-alert .text {
    margin: 15px 20px;
    max-width: 300px;
    font-size: 16px;
    line-height: 1.618
}

#website-alert .text .highlight {
    color: var(--theme-color-3)
}

.ays-roadmap {
    background: #fff;
    padding: 50px 0;
    border-bottom: 1px solid #ddd
}

.ays-roadmap .container {
    max-width: 1000px;
    position: relative
}

.ays-roadmap .link-map {
    display: flex;
    flex-direction: row;
    position: absolute;
    top: 20%;
    left: 15px;
    width: calc(100% - 30px);
    height: 60%;
    list-style: none;
    padding: 0;
    margin: 0
}

.ays-roadmap .link-map>li {
    flex: 0 0 auto;
    width: 16.6666666667%
}

.ays-roadmap .link-map>li>a {
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    position: relative
}

.ays-roadmap .link-map>li>a .fa-check {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--theme-color-3);
    color: #fff;
    position: absolute;
    top: 20%;
    left: 20%
}

#popup-product,
#faculty-popup {
    position: fixed;
    width: 100%;
    height: 100%;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 1000;
    overflow-y: auto;
    background: rgba(0, 0, 0, .7);
    display: none
}

#popup-product>.wrapper,
#faculty-popup>.wrapper {
    position: relative;
    background: #fff;
    width: 94vw;
    height: 94vh;
    margin: 3vh auto 0 auto;
    border-radius: 20px;
    overflow: hidden
}

#popup-product>.wrapper>.close-popup-product>.fa-close,
#faculty-popup>.wrapper>.close-popup-product>.fa-close {
    position: absolute;
    z-index: 2;
    width: 40px;
    height: 40px;
    right: 15px;
    top: 15px;
    background: rgba(0, 0, 0, .7);
    color: #fff;
    line-height: 40px;
    text-align: center;
    border-radius: 20px;
    cursor: pointer
}

#popup-product>.wrapper iframe,
#faculty-popup>.wrapper iframe {
    width: 100%;
    height: 100%;
    border: 0
}

@media (min-width: 768px) {

    #find-school-mh.home-header,
    #main-header.home-header {
        width: 100%;
        top: 0;
    }

    #find-school-mh .logo a,
    #find-school-mh .logo img,
    #main-header .logo a,
    #main-header .logo img {
        width: 170px
    }

    #find-school-mh .header-menu,
    #main-header .header-menu {
        position: relative;
        display: flex;
        gap: 22px;
        align-items: center
    }

    #find-school-mh .header-menu>div>.menu,
    #main-header .header-menu>div>.menu {
        list-style: none;
        display: flex;
        gap: 32px;
        padding: 0;
        margin: 0
    }

    #find-school-mh .header-menu>div>.menu>li,
    #main-header .header-menu>div>.menu>li {
        position: relative
    }

    #find-school-mh .header-menu>div>.menu>li>a,
    #main-header .header-menu>div>.menu>li>a {
        display: block;
        font-size: 16px;
        font-weight: 500;
        padding: 15px 0;
        position: relative
    }

    #find-school-mh .header-menu a span {
        display: block;
        font-size: 14px;
        font-weight: 400;
        padding: 15px 0;
        position: relative;
        color: black;
    }

    #main-header .header-menu a span {
        display: block;
        font-size: 14px;
        font-weight: 400;
        padding: 15px 0;
        position: relative;
    }

    #main-header .header-menu a span::after,
    #find-school-mh .header-menu a span::after {
        content: " ";
        width: 0;
        height: 1px;
        background: #824deb;
        position: absolute;
        left: auto;
        right: 0;
        bottom: 6px;
        transition: all ease 400ms;
    }

    #main-header .header-menu a:hover span::after,
    #find-school-mh .header-menu a:hover span::after {
        width: 100%;
        right: auto;
        left: 0;
    }

    .log:hover {
        color: #fff;
    }

    #find-school-mh .header-menu a:hover span {
        color: #824deb;
    }

    #find-school-mh .header-menu>div>.menu>li>a .badge,
    #main-header .header-menu>div>.menu>li>a .badge {
        position: relative;
        bottom: 2px;
        font-size: 12px;
        font-weight: 400;
        color: #d6d6d6;
        background-color: var(--theme-color-3);
        border-radius: 4px;
        padding: 2px 4px;
        white-space: nowrap;
        line-height: 1;
        margin-left: 4px;
        display: inline-block
    }

    #find-school-mh .header-menu>div>.menu>li .sub-menu,
    #main-header .header-menu>div>.menu>li .sub-menu {
        position: absolute;
        background: #fff;
        box-shadow: 2px 2px 23px rgba(0, 0, 0, .1);
        border-radius: 16px;
        list-style: none;
        padding: 20px 25px;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
        margin-left: -25px;
        visibility: hidden;
        opacity: 0;
        margin-top: 15px;
        transition: all .2s
    }

    #find-school-mh .header-menu>div>.menu>li .sub-menu>li>a,
    #main-header .header-menu>div>.menu>li .sub-menu>li>a {
        white-space: nowrap
    }

    #find-school-mh .header-menu>div>.menu>li:hover .sub-menu,
    #main-header .header-menu>div>.menu>li:hover .sub-menu {
        visibility: visible;
        opacity: 1;
        margin-top: 0px
    }

    #find-school-mh .header-menu>div>.menu>li:hover>a,
    #main-header .header-menu>div>.menu>li:hover>a {
        color: var(--theme-color-3)
    }

    #find-school-mh .header-menu>div>.menu>li .arrow,
    #main-header .header-menu>div>.menu>li .arrow {
        display: none
    }

    #find-school-mh .header-menu>div>.menu>li.menu-item-has-children>a,
    #main-header .header-menu>div>.menu>li.menu-item-has-children>a {
        display: flex;
        flex-direction: row;
        gap: 8px;
        align-items: center
    }

    #find-school-mh .header-menu>div>.menu>li.menu-item-has-children>a>.arrow,
    #main-header .header-menu>div>.menu>li.menu-item-has-children>a>.arrow {
        display: block;
        flex: 0 0 auto
    }

    #find-school-mh .header-menu>div>.menu>li.menu-item-has-children>a>.arrow svg,
    #main-header .header-menu>div>.menu>li.menu-item-has-children>a>.arrow svg {
        display: block
    }

    #find-school-mh .header-menu>div>.menu>li.current-menu-item>a,
    #main-header .header-menu>div>.menu>li.current-menu-item>a {
        font-weight: 800
    }

    #find-school-mh .header-menu .blog>a,
    #main-header .header-menu .blog>a {
        font-size: 16px;
        font-weight: 500;
        padding: 15px 0;
        display: flex;
        flex-direction: row;
        gap: 8px;
        align-items: center
    }

    #find-school-mh .header-menu .blog>a {
        padding: 0;
    }

    #find-school-mh .header-menu .blog>a>.arrow,
    #main-header .header-menu .blog>a>.arrow {
        display: block;
        flex: 0 0 auto
    }

    #find-school-mh .header-menu .blog>a>.arrow svg,
    #main-header .header-menu .blog>a>.arrow svg {
        display: block
    }

    #find-school-mh .header-menu .blog>.sub-menu,
    #main-header .header-menu .blog>.sub-menu {
        background: #fff;
        box-shadow: 2px 2px 23px rgba(0, 0, 0, .1);
        border-radius: 16px;
        padding: 25px;
        position: absolute;
        visibility: hidden;
        opacity: 0;
        margin-top: 15px;
        transition: all .2s;
        width: 200px;
        right: 0%;
    }

    #find-school-mh .header-menu .blog>.sub-menu>div>.menu,
    #main-header .header-menu .blog>.sub-menu>div>.menu {
        display: flex;
        flex-direction: column;
        gap: 5px;
        padding: 0;
        margin: 0;
        list-style: none
    }

    #find-school-mh .header-menu .blog>.sub-menu>div>.menu>li,
    #main-header .header-menu .blog>.sub-menu>div>.menu>li {
        flex: 1 1 auto;
        color: black
    }

    #find-school-mh .header-menu .blog>.sub-menu>div>.menu>li>a,
    #main-header .header-menu .blog>.sub-menu>div>.menu>li>a {
        display: block;
        font-weight: 400;
        margin-bottom: 10px;
        color: var(--theme-color-9);
        font-size: 14px;
    }

    #main-header .header-menu .blog>.sub-menu>div>.menu>li:last-child>a {
        margin-bottom: 0;
    }

    #find-school-mh .header-menu .blog>.sub-menu>div>.menu>li>.sub-menu,
    #main-header .header-menu .blog>.sub-menu>div>.menu>li>.sub-menu {
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 0;
        margin: 0;
        list-style: none
    }

    #find-school-mh .header-menu .blog>.sub-menu>div>.menu>li>.sub-menu a,
    #main-header .header-menu .blog>.sub-menu>div>.menu>li>.sub-menu a {
        display: block
    }

    #find-school-mh .header-menu .blog>.sub-menu>div>.menu>li>.sub-menu a:hover,
    #main-header .header-menu .blog>.sub-menu>div>.menu>li>.sub-menu a:hover {
        color: var(--theme-color-3)
    }

    #find-school-mh .header-menu .blog:hover .sub-menu,
    #main-header .header-menu .blog:hover .sub-menu {
        visibility: visible;
        opacity: 1;
        margin-top: 0px
    }

    #find-school-mh .header-menu .blog:hover>a,
    #main-header .header-menu .blog:hover>a {
        color: var(--theme-color-3)
    }

    #find-school-mh .login,
    #main-header .login {
        font-size: 16px;
        font-weight: 500;
        margin-right: 32px
    }

    #find-school-mh .account-area,
    #main-header .account-area {
        padding: 20px 0
    }

    #find-school-mh .account-area .button .avatar img,
    #main-header .account-area .button .avatar img {
        width: 32px;
        height: 32px;
        object-fit: cover
    }

    #find-school-mh .account-area .button .name,
    #main-header .account-area .button .name {
        font-size: 16px
    }

    #find-school-mh .account-area .button .arrow svg,
    #main-header .account-area .button .arrow svg {
        width: unset
    }

    #find-school-mh .account-area .menu,
    #main-header .account-area .menu {
        width: 330px
    }
}

.contact-us-columns>* {
    border: 1px solid #ddd;
    border-radius: 16px
}

#user-capability {
    background: rgba(0, 0, 0, .5);
    width: 100%;
    min-height: 100vh;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 800;
    display: none
}

#user-capability .wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 100vh
}

#user-capability .wrapper .content {
    background-color: #fff;
    border-radius: 16px;
    width: 100%;
    max-width: 1000px
}

#user-capability .wrapper .content header {
    display: flex;
    flex-direction: row;
    gap: 16px;
    justify-content: space-between;
    border-bottom: 1px solid #ddd;
    align-items: center;
    padding: 24px
}

#user-capability .wrapper .content header h3 {
    margin: 0;
    font-size: 36px
}

#user-capability .wrapper .content .entry {
    display: flex;
    flex-direction: column;
    padding: 32px;
    text-align: left;
    align-items: center;
    font-size: 24px
}

#user-capability .wrapper .content .entry p {
    margin: 0;
    line-height: 2.2;
    padding-left: 30px;
    position: relative
}

#user-capability .wrapper .content .entry p:before {
    content: "";
    display: block;
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #444;
    left: 0;
    top: 24px
}

#user-capability .wrapper .content .entry p strong {
    color: var(--theme-color-3)
}

#user-capability .wrapper .content .entry a {
    background: var(--theme-color-3);
    color: #fff;
    border-radius: 30px;
    padding: 12px 32px;
    font-weight: 700;
    font-size: 24px;
    margin-top: 32px
}

#video-popup {
    background: rgba(0, 0, 0, .5);
    width: 100%;
    min-height: 100vh;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 800;
    display: none
}

#video-popup .wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 100vh
}

#video-popup .wrapper .content {
    background-color: #fff;
    border-radius: 16px;
    width: 100%;
    max-width: 1200px
}

#video-popup .wrapper .content header {
    display: flex;
    flex-direction: row;
    gap: 16px;
    justify-content: space-between;
    border-bottom: 1px solid #ddd;
    align-items: center;
    padding: 24px
}

#video-popup .wrapper .content header h3 {
    margin: 0;
    font-size: 24px
}

#video-popup .wrapper .content .entry {
    display: flex;
    flex-direction: column;
    padding: 16px;
    text-align: left;
    align-items: center;
    font-size: 18px
}

#video-popup .wrapper .content .entry video {
    width: 100%;
    height: auto
}

#open-video-popup {
    position: fixed;
    bottom: 16px;
    right: 16px;
    border-radius: 50px;
    background: var(--theme-color-3);
    color: #fff;
    padding: 12px;
    display: flex;
    align-items: center;
    cursor: pointer;
    z-index: 710;
    border: 1px solid #fff;
    box-shadow: 0 8px 16px rgba(0, 0, 0, .2)
}


#open-video-popup .text {
    white-space: nowrap;
    width: 0;
    overflow: hidden;
    transition: all .3s
}

#open-video-popup:hover .text {
    width: 115px;
    padding-left: 8px
}

#whatsapp-support-btn {
    position: fixed;
    bottom: 16px;
    right: 16px;
    border-radius: 50px;
    background: #4db93f;
    color: #fff;
    padding: 12px;
    display: flex;
    align-items: center;
    cursor: pointer;
    z-index: 700;
    border: 1px solid #fff;
    box-shadow: 0 8px 16px rgba(0, 0, 0, .2)
}

#whatsapp-support-btn.roadmap-page {
    right: auto;
    left: 16px;
}

#whatsapp-support-btn .text {
    white-space: nowrap;
    width: 0;
    overflow: hidden;
    transition: all .3s
}

#whatsapp-support-btn:hover .text {
    width: 140px;
    padding-left: 8px
}

.roadmap-next-step-btn {
    position: fixed;
    bottom: 16px;
    right: 16px;
    border-radius: 50px;
    background: var(--theme-color-3);
    color: #fff;
    padding: 0 20px;
    display: flex;
    align-items: center;
    cursor: pointer;
    z-index: 700;
    border: 1px solid #fff;
    box-shadow: 0 8px 16px rgba(0, 0, 0, .2);
    height: 54px;
    font-size: 16px;
    font-weight: 600
}

.roadmap-next-step-btn .text {
    white-space: nowrap;
    width: 0;
    overflow: hidden;
    transition: all .3s
}

.roadmap-next-step-btn:hover {
    color: #fff
}

.text-alert {
    padding: 16px;
    font-size: 18px;
    background: var(--theme-color-2);
    border-radius: 8px;
    border: 1px solid var(--theme-color-3)
}

.text-alert a {
    color: var(--theme-color-3)
}

.text-alert svg {
    vertical-align: middle;
    margin-right: 4px
}

.alert {
    padding: 20px;
    border: 1px solid #aaa;
    font-size: 18px;
    min-width: 90%;
    margin: 24px 0;
    border-radius: 12px
}

.alert-danger {
    color: #da3737;
    border: 1px solid #da3737
}

.alert-danger a {
    color: #11bd5c
}

.alert-danger a:hover {
    text-decoration: underline
}

.alert-success {
    color: #11bd5c;
    border: 1px solid #11bd5c
}

/*# sourceMappingURL=general.css.map */
.bg-black {
    background-color: #0c0227 !important
}

.log {
    display: flex;
    align-items: center;
    justify-content: center;
}

header.home-header .log {
    color: #ffffff;
}

header .log {
    color: #433F51;
}

header.fixed .log {
    color: #333;
}

.log svg {
    fill: #ffffff;
    width: 30px;
    height: 30px;
}

#login-signup-page .login-wrapper,
#login-signup-page .signup-wrapper {
    margin-top: 130px !important;
}

.page-template-page-find-school #main-header {
    /*padding-top: 72px;*/
}

.hide-on-desktop {
    display: none;
}

.open-media-uploader>input {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.media-uploader-icon {
    position: relative;
    z-index: 100;
}

.media-uploader-icon>svg:nth-child(2) {
    margin-top: -.5rem;
}

.nkh_drag-container {
    transition: background-color 0.3s;
}

.nkh_drag-container.nkh_dragging {
    background-color: #a5faec;
}

.nkh_tabs-2 {
    display: grid;
    width: 100%;
    margin-top: 2rem;
}

.nkh_tabs-2>div {
    grid-area: 1/ 1;
    position: absolute;
    z-index: -1;
    opacity: 0;
    transform: translateX(-1rem);
    transition: z-index 0s linear, transform 250ms ease-in-out, opacity 200ms ease-in-out;
    transition-delay: 200ms, 0s, 0s;
}

.nkh_tabs-2>div.nkh_show {
    grid-area: 1/ 1;
    position: relative;
    z-index: 2;
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0ms, 0s, 0s;
}


::-webkit-scrollbar {
    width: 9px;
    height: 6px;
}

::-webkit-scrollbar-button {
    width: 0;
    height: 0;
}

::-webkit-scrollbar-thumb {
    background: #824deb;
    border: 1px solid #404b62;
    border-radius: 50px;
}

::-webkit-scrollbar-thumb:hover {
    background: #ffffff;
}

::-webkit-scrollbar-thumb:active {
    background: #000000;
}

::-webkit-scrollbar-track {
    background: #f7f6f9;
    border: 0 none #f7f6f9;
    border-radius: 0;
}

::-webkit-scrollbar-track:hover {
    background: #666666;
}

::-webkit-scrollbar-track:active {
    background: #333333;
}

::-webkit-scrollbar-corner {
    background: #f7f6f9;
}

div#popup-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    display: flex;
    align-content: center;
    justify-content: center;
    z-index: 10000;
    width: 50%;
    height: 60%;
    transform: translate(-50%, -50%);
}

.close-popup-modal {
    background: white;
    height: fit-content;
    padding: 0.5rem;
    position: absolute;
    left: -8px;
    top: -8px;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
}

.white-no-wrap {
    white-space: nowrap;
}

.blur-content {
    filter: blur(8px);
    opacity: .75;
    pointer-events: none;
}

.pys {
    font-size: 40px;
    font-weight: 700;
    line-height: 47px;
    text-align: center;
    margin-top: 2.5rem;
}

.nkh-style-upload-doc .links a {
    display: flex !important;
    position: relative;
    padding-left: 2rem !important;
    white-space: nowrap;
    line-height: 24px;
}

.docs-icons-container.text {
    line-height: 24px;
}

.nkh-style-upload-doc .links a::before {
    content: "";
    position: absolute;
    left: -4px;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip0_109_7428%29%22%3E%0A%3Cpath%20d%3D%22M16.125%208.36671C15.5583%205.49171%2013.0333%203.33337%2010%203.33337C7.59167%203.33337%205.5%204.70004%204.45833%206.70004C1.95%206.96671%200%209.09171%200%2011.6667C0%2014.425%202.24167%2016.6667%205%2016.6667H15.8333C18.1333%2016.6667%2020%2014.8%2020%2012.5C20%2010.3%2018.2917%208.51671%2016.125%208.36671ZM15.8333%2015H5C3.15833%2015%201.66667%2013.5084%201.66667%2011.6667C1.66667%209.95837%202.94167%208.53337%204.63333%208.35837L5.525%208.26671L5.94167%207.47504C6.73333%205.95004%208.28333%205.00004%2010%205.00004C12.1833%205.00004%2014.0667%206.55004%2014.4917%208.69171L14.7417%209.94171L16.0167%2010.0334C17.3167%2010.1167%2018.3333%2011.2084%2018.3333%2012.5C18.3333%2013.875%2017.2083%2015%2015.8333%2015ZM6.66667%2010.8334H8.79167V13.3334H11.2083V10.8334H13.3333L10%207.50004L6.66667%2010.8334Z%22%20fill%3D%22%230A0226%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_109_7428%22%3E%0A%3Crect%20width%3D%2220%22%20height%3D%2220%22%20fill%3D%22white%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E');
    display: flex;
    background-repeat: no-repeat;
    background-position: center;
}

.nkh-style-upload-doc>span.text,
.nkh-style-upload-doc>i {
    display: none;
}

.nkh-style-upload-doc {
    display: grid !important;
    position: unset !important;
    background: transparent !important;
    border: none !important;
}

.docs-icons-container,
.nkh-style-upload-doc .links {
    display: grid !important;
    position: unset !important;
    background: transparent !important;
    border: none !important;
    visibility: visible !important;
    text-align: start !important;
    width: fit-content !important;
    gap: 1rem;
}

table.pya-table {
    width: 100%;

}

.nkh_primary-btn {
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    text-align: center;
    padding: .75rem 2.5rem;
    border-radius: 56px;
    border: 1px solid #824DEB;
    color: white;
    background-color: #824DEB;
}

.nkh_secondary-btn {
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    text-align: center;
    padding: .75rem .5rem;
    border-radius: 56px;
    border: 1px solid #824DEB;
    color: #824DEB;
}

table.pya-table {
    margin-top: 2.5rem;
}

table.pya-table thead>tr {
    border-bottom: 1px solid #B3ADC2;
}

.fee-holder {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fee-holder .wspsc_add_cart_submit,
.fee-holder .checkout-button {
    cursor: pointer;
    background: #824deb !important;
    color: #fff;
    padding: 10px 20px;
    border-radius: 25px;
    text-align: center;
}

.fee-holder .wspsc_add_cart_submit:hover,
.fee-holder .checkout-button:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}

table.pya-table thead th {
    text-align: left;
}

table.pya-table tbody td {
    text-align: left;
    vertical-align: top;
}

table.pya-table tbody td img {
    width: 64px;
    margin: auto;
}

.nkh-style-upload-doc .links input {
    opacity: 0;
    width: 10px;
}

table.pya-table thead th:last-child {
    text-align: center;
}

.go-back-to-questapply>a:first-child {
    width: 2rem;
    background: black;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: .5rem;
    color: red;
    font-weight: bold;
}

.go-back-to-questapply {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background: white;
    z-index: 10000000;
    padding: 1rem;
    display: flex;
    justify-content: space-between;
    box-shadow: 0 0 3rem 0 #00000033;
}

button.nkh_deficiency {
    border: 1px solid #824DEB;
    padding: 8px 12px 8px 12px;
    border-radius: 56px;
    color: #824DEB;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    text-align: center;
}

.pt-35-td>td {
    padding-top: 35px;
}

.nkh_payment-btn {
    background-color: #824DEB;
    border: 1px solid #824DEB;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    text-align: center;
    color: #FEFEFE;
    padding: .5rem;
    border-radius: 56px;
    width: fit-content;
}

.half-popup-choose,
.full-popup-choose {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
    justify-content: center;
    align-items: center;
    opacity: 0;
    z-index: -1;
    background: transparent;
    transition: opacity 200ms ease-in-out, z-index 0s linear;
    transition-delay: 0s, 200ms;
}


.half-popup-choose.show,
.full-popup-choose.show {
    transition-delay: 0s, 0ms;
    opacity: 1;
    z-index: 10000;
    display: flex;
}

.email-popup .create_ai_email {
    position: absolute;
    width: 92%;
    height: auto;
    background: #fff;
    padding: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    border-radius: 15px;
    z-index: 9999;
    display: none;
}

.email-popup .create_ai_email label {
    display: block;
    font-size: 14px;
}

.email-popup .create_ai_email .form-group {
    margin-bottom: 10px;
}

.email-popup .create_ai_email input[type=text] {
    background: #fff;
    padding: 10px 16px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 14px;
    width: 100%;
    display: block;
    outline: none;
    color: #555;
    resize: none;
}

.email-popup .create_ai_email input[type=text].error {
    border-color: red;
}

.email-popup .create_ai_email input[type=text]::placeholder {
    font-size: 12px;
}

.email-popup .create_ai_email button[type=submit],
.email-popup .create_ai_email .close_ai {
    color: #fff;
    padding: 7px 15px;
    border-radius: 6px;
    background: #7746d8;
}

.email-popup .create_ai_email .close_ai {
    cursor: pointer;
    background: #ccc;
    color: #333;
}

.fpc-content {
    width: 95%;
    height: 85%;
    background: white;
    border-radius: 1rem;
    padding: 2rem 20px;
    box-shadow: 0 0 20px 0 #0000005c;
    position: relative;
    overflow: hidden;
}

.fpc-content iframe {
    height: 330px !important;
}

.fpc-close {
    width: 100%;
    display: flex;
    border-bottom: 1px solid;
    cursor: pointer;
    position: absolute;
    top: 23px;
    left: 0;
    box-shadow: 0 20px 20px 0 #0000000f;
}

.fpc-close>svg {
    transform: scale(2) translate(8px, -5px);
}

html:has(.full-popup-choose.show) {
    overflow: hidden;
}

div#fpc-main {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    margin-top: 1rem;
    padding-top: 1rem;
    padding-left: 3rem;
    padding-right: 3rem;
}

.flex-column-reverse {
    flex-direction: column-reverse;
}

.roadmap-active {
    background-color: #7746d8 !important;
    color: #fff !important;
    animation: pulse-animation 2s infinite;
}

.nkh_tab-items-container {
    display: grid;
    width: 100%;
    margin-top: 1.5rem;
    grid-template-columns: 100%;
}

.nkh_tab-header {
    cursor: pointer;
}

.nkh_tab-items-container .nkh_tab-items {
    grid-area: 1 / 1;
    opacity: 0;
    z-index: -1;
    position: relative;
    transform: translateX(40px);
    transition: opacity 200ms ease-in-out, transform 250ms ease-in-out, z-index 0s linear;
    transition-delay: 0s, 0s, 200ms;
    width: 0;
    display: none;
}


.nkh_tab-items-container .nkh_tab-items.active {
    opacity: 1;
    z-index: 1;
    transform: translateX(0);
    transition-delay: 0s, 0s, 0ms;
    width: auto;
    display: block;
}

.paf-holder {
    display: flex;
    justify-content: center;
    padding-top: 2.5rem;
}

.pas-icon {
    display: flex;
    width: 24px;
    height: 24px;
    align-items: center;
}

.pa-holder {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    padding: 0 1rem 4rem;
}

.pa-holder .notice_payment {
    background: #FFE5B4;
    padding: 15px;
    border-radius: 7px;
    margin-bottom: 10px;
    color: #8A4500;
}

.pa-holder .notice_payment a {
    color: #7746d8;
    text-decoration: underline;
}

.pah-document {
    display: flex;
    width: 100%;
    align-items: start;
    justify-content: flex-start;
    gap: 0 20px;
    box-shadow: 0 0 20px 0 #00000017;
    margin-bottom: 10px;
    border-radius: 7px;
    overflow: hidden;
    height: 87px;
    transition: all ease 300ms;
}

.pah-document.active {
    height: 172px;
}

.pah-document .ext_doc {
    display: none;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    padding: 0 10px;
}

.pah-document .pad-title {
    width: 70%;
}

.pah-document .pad-more a {
    background: #7746d8;
    color: #fff;
    padding: 5px;
    border-radius: 7px;
    font-size: 14px;
    line-height: 22px;
}

.pah-document .pad-more a:hover {
    background: orange;
}

.pah-document.active .pad-more a i::before {
    content: "\f106";
}

.pah-document>.optional,
.pah-document>.pad-required {
    writing-mode: vertical-lr;
    transform: rotateZ(180deg);
    padding: .75rem .75rem .75rem 0;
    height: 100%;
    text-align: center;
}

.pah-document .pah-right {
    width: calc(100% - 32px);
    padding: 0 10px 0 0;
}

.pah-document .pah-right .pah-right-top {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 0 20px;
    padding-top: 17px;
}

.pah-document .pah-right .ext_doc {
    display: flex;
    border-top: 1px dashed #ccc;
    margin-top: 22px;
    padding: 10px;
    width: 100%;
    align-items: start;
    justify-content: space-between;
    position: relative;
}

.pah-document .pah-right .ext_doc .choose_file {
    min-width: 360px;
}

.pah-document .pah-right .ext_doc small {
    color: #636363;
    margin-bottom: 5px;
}

.pad-required {
    background-color: #7746d8;
    color: white;
}

.pah-document>.optional {
    background-color: #ad88ff;
    color: white;
}

.pad-status {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    width: 100px;
}

.pas-missing {
    color: #FF4D4D;
}

.pas-pending {
    color: #FF9800;
}

.pas-complete {
    color: #4CAF50;
}

.pad-title h2 {
    font-weight: bold;
    margin-bottom: 10px;
}

.pad-title .pad-explanation {
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
    text-align: left;
    color: #636363;
}

input.pad-upload-file {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    z-index: -1;
    width: 28%;
    cursor: pointer;
}

input.pad-upload-file.active {
    z-index: 1;
}

.pad-download {
    position: relative;
    display: flex;
    gap: 0 10px;
    align-items: center;
}

.pad-download svg {
    display: flex;
    width: 24px;
}

.pad-download span:nth-child(2) {
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    line-height: 19px;
}

a.pad-download-icon {
    display: flex;
    align-items: center;
    height: 24px;
}

a.pad-download-icon path {
    fill: #433F51;
}

.pad-download>button {
    display: flex;
    gap: 0.25rem;
    align-items: center;
    padding: 5px;
    cursor: pointer;
    border-radius: 6px;
}

.nkh_tab-header.not-allowed {
    opacity: .5;
    pointer-events: none;
}


.pah-header {
    padding-left: 47px;
    display: flex;
    gap: .75rem;
    font-family: Roboto, serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    align-items: center;
}


.pah-header>span:nth-child(1) {
    min-width: 220px;
    text-align: left;
}

.pah-header>span:nth-child(2) {
    min-width: 150px;
    text-align: center;
}

.pah-header>span:nth-child(3) {
    min-width: 300px;
}

.pah-header>span:nth-child(4) {
    min-width: 150px;
}

.pah-header>span:nth-child(6) {
    text-align: center;
    min-width: 124px;
}

.submission-holder {
    display: flex;
    gap: 1.5rem;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.submission-holder .option.applying {
    text-align: center;
}


button.roadmap-next-step-btn.nkh_modification {
    position: absolute;
}

button.pad-upload-icon.active,
a.pad-download-icon,
button.pad-download-remove {
    /*display: none;*/
}

a.pad-download-icon.active,
button.pad-download-remove.active {
    display: inline-block;
    gap: .25rem;
    align-items: center;
}

.nkh_results-p {
    padding: 8px 1.5rem;
    background: #824DEB;
    margin: 2px 0;
    color: #fff;
    cursor: pointer;
    border-radius: 1rem;
}

.nkh_results-p.gray {
    background: #625C74;
}

.submission-holder .select,
.submission-holder .option-list {
    width: fit-content !important;
    min-height: 50px;
}

.hpc-content {
    width: 80%;
    background: white;
    height: 80%;
    max-height: 95vh;
    border-radius: 10px;
}

.hpc-back {
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    background-color: #00000054;
    z-index: -1;
}

.hpc-close {
    display: flex;
    justify-content: flex-end;
    cursor: pointer;
}

.hpc-close svg {
    transform: scale(2) translateX(6px);
}

.hpc-first {
    display: flex;
    justify-content: space-between;
    gap: 30px;
}

.hpc-professor-info {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    width: 240px;
}

.pi-image {
    display: flex;
    justify-content: center;
}

.pi-image>img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
}

.hps-title,
ul.hps-grid-3>li,
span.pis-name,
p.pi-name {
    margin: 0;
    font-family: Roboto, serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    text-align: center;
}

.pi-school {
    display: flex;
    align-items: center;
    gap: .5rem;
}

span.pis-image>img {
    width: 20px;
    height: 20px;
}

span.pis-name {
    max-width: 186px;
    /*text-align: left;*/
}


.hpc-send-response {
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: space-between;
    width: calc(100% - 240px);
}

.hpc-send-response>textarea {
    border-radius: 1rem;
    width: 100%;
    padding: 0.625rem;
    height: 100%;
    border: 1px solid;
}

.hpc-second {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin-top: 30px;
}

.hps-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.hps-title::after {
    content: "";
    width: calc(100% - 160px);
    background: black;
    height: 1px;
}

.hps-grid-3 {
    padding-left: 26px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    list-style: disc;
    gap: .75rem 0.5rem;
    text-align: left;
}

.hps-grid-3>li {
    text-align: left !important;
}

.hps-grid-3.program {
    list-style: none;
    padding-left: 0;
}

div#hpc-main {
    display: flex;
    flex-direction: column;
    height: 90%;
    width: 100%;
    padding: 8px 2rem 2rem;
    overflow-y: scroll;
}

.hps-program-holder {
    display: flex;
    text-align: left;
    align-items: flex-start;
    cursor: pointer;
    margin: .75rem 0;
}

span.hph-name {
    line-height: 1.5rem;
}

.hpc-last>button,
.hpc-last>svg {
    display: flex;
    align-items: center;
}

.hpc-last {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid;
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: space-evenly;
}

.hpc-last>button {
    padding: 12px;
}

span.hph-name {
    align-self: center;
}

.remove-pfu+span {
    /* color: #FF4D4D; */
}

.email-popup {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #00000073;
    justify-content: center;
    align-items: center;
    opacity: 0;
    z-index: -1;
    transition: opacity 200ms ease-in-out, z-index 0s linear;
    transition-delay: 0s, 200ms;
    display: none;
}

.email-popup.show {
    transition-delay: 0s, 0ms;
    z-index: 10000000;
    opacity: 1;
    display: flex;
}

.ep-back {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.ep-content::-webkit-scrollbar-track {
    background: transparent;
    border: 0 none transparent;
    border-radius: 0;
}

.ep-content {
    width: 80%;
    height: 80%;
    background-color: white;
    border-radius: 1rem;
    padding: 1rem;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
}

.ep-close {
    display: flex;
    position: absolute;
    right: -12px;
    top: -4px;
}

.ep-close svg {
    transform: scale(2.5);
}

.ep-close svg path {
    stroke: #ffffff73;
    stroke-width: 1px;
}

.ep-buttons {
    display: flex;
    margin-top: auto;
    gap: 1.5rem;
    align-items: center;
    justify-content: flex-end;
    padding: 20px 20px;
}

.ep-buttons button {
    align-items: center;
    padding: 10px;
    border-radius: 5px;
}

.wspsc_checkout_form_standard {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}

.wp_cart_checkout_button {
    padding: 1rem 5rem;
    border-radius: 4rem;
    box-shadow: 0 0 5px 0 #824deb;
}

div.shopping_cart tr th {
    font-size: 1.5rem;
}

div.shopping_cart tr td,
span.wp_cart_item_name {
    font-size: 1.25rem;
}

.wspsc_cart_item_qty {
    pointer-events: none;
}

.wspsc_cart_item_qty {
    pointer-events: none;
    border: none;
    font-size: 1rem;
    font-weight: 700;
}

.submit-row.pro>a,
.submit-row.free>button {
    display: none;
}

.panel_form_radio,
.panel_form_doc_upload {
    width: 100%;
}

.panel_form_radio {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.75rem;
}

.panel_form_radio>h3 {
    width: 100%;
}

.panel_form_radio>*:nth-child(n+2) {
    min-width: 175px;
}

.nkh_drag-container,
.nkh_drag-container input {
    cursor: pointer;
}

.open-media-uploader:hover svg {
    fill: #824deb;
}

.open-media-uploader:hover path {
    fill: white;
}


.syt-items-holder {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    flex-wrap: wrap;
}

.syt-items-holder>label>input {
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;

}

.syt-items-holder label {
    position: relative;
    padding: .5rem;
    border-radius: 1rem;
    overflow: hidden;
    cursor: pointer;
}

.syt-items-holder label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: var(--theme-color-3);
    opacity: 0;
    transition: opacity 200ms ease-in-out;
    cursor: pointer;
}

.syt-items-holder label:has(input:checked)::before {
    opacity: 1;
}

.syt-items-holder label>span {
    position: relative;
    z-index: 1;
    transition: color 200ms ease-in-out;
}

.syt-items-holder label:has(input:checked)>span,
.syt-items-holder label:has(input:checked) {
    color: white !important;
}

.section-item button:disabled {
    opacity: 0.5;
    /* Adjust the value as needed */
    cursor: not-allowed;
    /* Change cursor to indicate disabled state */
    background-color: lightgray;
}

.nkh_exa-holder {
    margin: .5rem 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.active .text {
    color: white;
}

.cv-menu .text {
    white-space: nowrap;
}

label.syt-item>img {
    position: relative;
    width: 100%;
}

.nkh_bot-space {
    padding-bottom: 5rem !important;
}

.hide-s2-placeholder span.select2-selection__placeholder {
    display: none;
}

.ticket-submission-form {
    margin: 0 auto;
    padding: 20px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    background: #fff;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}

.ticket-submission-form .form-group {
    margin-bottom: 15px;
}

.ticket-submission-form .form-label {
    display: block;
    font-weight: bold;
    margin-bottom: 5px;
    color: #333;
}

.ticket-submission-form .form-input,
.ticket-submission-form .form-textarea,
.ticket-submission-form .form-select {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 7px;
    box-sizing: border-box;
    background: #fff;
}

.ticket-submission-form .form-input:focus,
.ticket-submission-form .form-textarea:focus,
.ticket-submission-form .form-select:focus {
    border-color: #007cba;
    outline: none;
}

.ticket-submission-form .form-textarea {
    min-height: 100px;
    resize: vertical;
}

.ticket-submission-form .form-submit {
    background-color: #824deb;
    color: #fff;
    border: 1px solid #824deb;
    padding: 10px 15px;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.3s ease, color .3s ease-in-out;
    margin-left: auto;
}

.ticket-submission-form .form-submit:hover {
    color: #824deb;
    background-color: transparent;
}

.faculty_card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 16px;
    gap: 19px;
    background: #fff;
    box-shadow: 0 0 8px rgba(0, 0, 0, .2);
    border-radius: 7px;
    height: 100%
}

.nkh_fc-col {
    flex-direction: row;
    gap: .75rem;
    padding: 24px;
}

.fc-col {
    display: flex;
    flex-wrap: wrap;
}

.fc-col:nth-child(1) {
    width: 300px;
}

.fc-col:nth-child(2) {
    width: 180px;
}

.fc-col:nth-child(3) {
    width: 300px;
    /*max-height: 180px;*/
    overflow: hidden;
}

.fc-col:nth-child(4) {
    width: 120px;
    gap: 0.75rem;
    height: 100%;
    max-height: 180px;
}

.fcc-right .list_status .select .selected {
    width: 100%;
}

/*.fcc-left .title {*/
/*    font-size: 12px;*/
/*}*/

.fcc-left a.nkh_professor-link {
    /*font-size: 12px;*/
    font-weight: bold;
}

.fcc-right {
    margin-left: auto;
}

.fcc-full-w {
    width: 100%;
    margin-top: 18px;
}

.fc-col .action-link {
    display: flex;
    gap: 1rem;
    margin-top: 2rem;
}

.fc-lcc .add-to-application {
    display: flex;
    gap: .75rem;
}

.fc-col .program {
    /*max-height: 300px;*/
    /* cursor: pointer; */
}

.fc-col .program li {
    cursor: pointer;
}

.fc-col .program li:first-child {
    cursor: auto;
}

.fc-lcc>*>svg {
    min-width: 1.5rem;
}

.fc-lcc>* {
    white-space: nowrap;
    background: transparent;
    align-items: center;
    gap: .75rem;
    font-weight: 700;
}

.fcc-left {
    display: flex;
    gap: .5rem;
    align-items: center;
}

.fcc-left img {
    width: 64px;
    height: 64px;
    border-radius: 50%;
}

.fcc-full-w a {
    font-weight: 400;
    font-size: 14px;
    text-decoration-line: underline;
    color: #7746D8;
}

.fc-col .items {
    margin-top: .75rem !important;
    gap: 1rem !important;
}


html:has(.nkh_att_left_side-bar) {
    overflow: hidden;
    height: 100vh;
}

html:has(.nkh_att_left_side-bar) main {
    overflow-y: scroll;
    height: calc(100vh - 156px);
}

.nkh_roadmap-container::-webkit-scrollbar,
html:has(.nkh_att_left_side-bar) main::-webkit-scrollbar {
    width: 0;
    height: 0;
}


.nkh_roadmap-container svg,
.nkh_roadmap-container a i {
    width: 100%;
    margin-bottom: 8px;
}
.nkh_roadmap-container a i{
    font-size: 20px;
    color:#7746d8;
}
.find-school .find-school i, .find-program .find-program i,
.create-cv .create-cv i, .create-email .create-email i,
.find-your-professor .find-your-professor i, .send-email .send-email i,
.sop .sop i, .default-one .in_roadmap > *:nth-child(1) i, 
.recommendation .recommendation i, .choose-your-programs .choose-your-programs i,
.apply-now .apply-now i{
    color: #fff;
}

.fast-pulse {
    background-color: #7746d8 !important;
    color: #fff !important;
    animation: pulse-animation 250ms infinite reverse;
}

ul.nkh_same-menu {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    /*margin-top: 1.5rem;*/

}

/* #sop-page ul.nkh_same-menu {
    position: sticky;
    top: 0;
} */

ul.nkh_same-menu>li {
    padding: .75rem 0 .75rem 1rem;
    border-radius: 7px;
    display: flex;
    gap: .75rem;
    align-items: center;
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

ul.nkh_same-menu>li>* {
    display: flex;
    gap: .75rem;
    align-items: center;
}

ul.nkh_same-menu>li a {
    width: -webkit-fill-available;
}

ul.nkh_same-menu>li:hover,
ul.nkh_same-menu>li:has(.active),
ul.nkh_same-menu>li.current-tab {
    background: #824deb;
}

ul.nkh_same-menu>li:hover a,
ul.nkh_same-menu>li:hover span,
ul.nkh_same-menu>li:has(.active) a,
ul.nkh_same-menu>li:has(.active) span,
ul.nkh_same-menu>li:hover i,
ul.nkh_same-menu>li:has(.active) i,
ul.nkh_same-menu>li.current-tab a,
ul.nkh_same-menu>li.current-tab i {
    color: #fff !important;
}

.height-content {
    height: fit-content;
}

.school,
.country {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.school img,
.country img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.nkh_roadmap-container {
    /*overflow-x: scroll;*/
    /*overflow-y: visible;*/
    /*padding: 1rem 0;*/
    user-select: none;
}

.border.bgcolorii.rounded.px-4.py-4>.d-flex {
    flex-direction: row;
    justify-content: start;
    align-items: center;
    text-align: left;
}

.border.bgcolorii.rounded.px-4.py-4>h4.titlts {
    text-align: left;

}

.nkh_roadmap-container.active {
    cursor: grabbing;
    cursor: -webkit-grabbing;
}

div#sec-apply-width-us main.bg-white.mx-auto.w-3\/4.pt-4.mt-4 {
    width: 100%;
}

.page-pricing .container .content>.text-center {
    margin-top: 2.5rem;
}

#find_school_page {
    display: flex;
    padding-top: 5.5rem;
}



.tolt,
.tolti {
    align-items: center;
}

.shopping_cart table {
    border: 1px solid #eee !important;
    padding: 10px;
}

.shopping_cart table tr.wspsc_cart_item_thumb {
    background: #f5f5f5;
}

.shopping_cart table .wp_cart_remove_item_form {
    text-align: center;
}

.shopping_cart table .wpspsc_checkout_form {
    text-align: right;
    margin-top: 10px;
}

header.fixed .my_notif svg,
header.fixed .mini_cart_icon svg {
    fill: #333;
}

.ip_change {
    background: #f1aeb5;
    padding: 10px;
    margin-bottom: 15px;
    border-radius: 7px;
    color: #58151c;
    height: 55.8px;
    display: flex;
    align-items: center;
}

.other_way {
    background: #fff3cd;
    padding: 10px;
    border-radius: 7px;
    color: #664d03;
    margin-bottom: 15px;
}

#program_rel_page,
#faculty_page {
    background-color: var(--theme-color-2);
}

.show_resume.active i.fa-angle-down::before,
.show_lor.active i.fa-angle-down::before,
.show_sop.active i.fa-angle-down::before {
    content: "\f106";
}

/* Mini notif list styles */
.my_notif {
    position: relative;
}

.my_notif .count {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: orange;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 11px;
    position: absolute;
    top: -9px;
    left: -3px;
    letter-spacing: -1px;
}

.my_notif.has-unread .count.animate {
    animation: pulse-animation-2 2s infinite;
}

@keyframes pulse-animation-2 {
    0% {
        box-shadow: 0 0 0 0 rgb(255 165 0);
    }

    100% {
        box-shadow: 0 0 0 20px rgba(0, 0, 0, 0);
    }
}

.mini_notif {
    position: absolute;
    right: 0;
    top: 40px;
    background: #fff;
    width: 350px;
    border-radius: 7px;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
    border: 2px solid #ccc;
    display: none;
    z-index: 999999;
    cursor: auto;
}

.my_notif.open svg {
    fill: #7746d8;
}

.mini_notif .head {
    font-weight: 500;
}

.mini_notif .head .read_all {
    color: #824deb;
    font-size: 13px;
    cursor: pointer;
}

.mini_notif .head .read_all:hover {
    color: orange;
}

.mini_notif .date {
    background: #f3f4f7;
    color: #878484;
    font-weight: 500;
    box-shadow: 0 0px 4px inset rgba(0, 0, 0, 0.2);
}

.mini_notif .list .notif {
    margin-bottom: 5px;
    position: relative;
    border-radius: 7px;
}

.mini_notif .list .notif:hover {
    background: #e5f4ef;
}

.mini_notif .list .notif:last-child {
    margin-bottom: 0;
}

.mini_notif .list .notif .notif_date {
    position: absolute;
    top: 3px;
    right: 5px;
    font-size: 12px;
    color: #b9b7b7;
}

.mini_notif .list .notif i {
    font-size: 17px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    border: 2px solid #e5e9ec;
    border-radius: 50%;
    margin-right: 15px;
    color: #6a7885;
    background: #fff;
}

.mini_notif .list .notif .details {
    padding-top: 4px;
    width: calc(100% - 60px);
    white-space: nowrap;
}

.mini_notif .list .notif .details .notif_title {
    color: #364c50;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    width: 100%;
    display: block;
    text-overflow: ellipsis;
}

.mini_notif .list .notif .details .notif_title .circle {
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    margin-right: 3px;
}

.mini_notif .list .notif .details .notif_content {
    color: #636363;
    max-height: 46px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mini_notif .show_all {
    border-top: 2px solid #ccc;
}

.mini_notif .show_all a {
    color: #333;
    font-weight: 500;
}

.mini_notif .show_all a:hover {
    color: #7746d8;
}

/* help and support page styles */
#ticket_submission_form {
    padding-top: 20px;
    background: var(--theme-color-2);
}

#ticket_submission_form .left_ticket {
    position: relative;
}

#ticket_submission_form .left_ticket::after {
    content: " ";
    width: 1px;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    background: #ccc;
}

#ticket_submission_form .left_ticket .title,
#ticket_submission_form .right_ticket .title {
    margin-bottom: 10px;
    font-size: 1.1rem;
    font-weight: 500;
}

#ticket_submission_form .left_ticket .tickets_list .ticket {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
    border-radius: 7px;
    padding: 10px;
    margin-bottom: 35px;
    cursor: pointer;
    background: #fff;
    position: relative;
    border: 2px solid transparent;
}

#ticket_submission_form .left_ticket .tickets_list .ticket:hover {
    border-color: #7746d8;
}

#ticket_submission_form .left_ticket .tickets_list .ticket svg {
    border-radius: 50%;
    background: #7746d8;
    padding: 7px;
}

#ticket_submission_form .left_ticket .tickets_list .ticket .details {
    width: 73%;
    padding-left: 10px;
}

#ticket_submission_form .left_ticket .tickets_list .ticket .details .ticket_title {
    font-weight: 600;
    color: #636363;
}

#ticket_submission_form .left_ticket .tickets_list .ticket .details .ticket_status {
    font-size: 12px;
    font-weight: 400;
    color: #636363;
}

#ticket_submission_form .left_ticket .tickets_list .ticket .ticket_date {
    font-size: 13px;
    color: #636363;
}

#ticket_submission_form .left_ticket .tickets_list .ticket .ticket_department {
    position: absolute;
    top: -28px;
    right: 15px;
    background: #ebe3f9;
    z-index: 2;
    padding: 3px 11px;
    border-radius: 4px 4px 0 0;
    color: #ffffff;
}

#ticket_submission_form .left_ticket .tickets_list .ticket .ticket_priority {
    padding: 0 10px;
    border-radius: 5px;
    color: #fff;
    border: 1px solid #ccc;
}

#ticket_submission_form .left_ticket .tickets_list .ticket a {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

#ticket_submission_form .right_ticket .ticket_details li {
    background: #ffffff;
    padding: 10px;
    border-radius: 7px;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
    width: 24%;
    display: flex;
    flex-direction: column;
}

#ticket_submission_form .right_ticket .ticket_answers {
    background: #ffffff;
    padding: 10px;
    border-radius: 7px;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
    margin-top: 15px;
}

#ticket_submission_form .right_ticket .ticket_answers .main_text {
    margin-top: 10px;
    padding: 10px;
    position: relative;
    background: #f5f5f5;
    border-radius: 7px;
}

#ticket_submission_form .right_ticket .ticket_answers .main_text .main_text_title {
    color: #333333;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
    font-weight: 600;
}

#ticket_submission_form .right_ticket .ticket_answers .ticket-message {
    padding: 10px 0;
    border-radius: 7px;
    margin-bottom: 20px;
}

#ticket_submission_form .right_ticket .ticket_answers .ticket-message .text {
    padding: 10px;
    border-radius: 7px;
    width: fit-content;
}

#ticket_submission_form .right_ticket .ticket_answers .ticket-message .sender_name {
    color: #9E9E9E;
    font-size: 14px;
}

#ticket_submission_form .right_ticket .ticket_answers .ticket-message .sender {
    margin-bottom: 10px;
}

#ticket_submission_form .right_ticket .ticket_answers .user_reply_ticket input {
    width: 79%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 7px;
    box-sizing: border-box;
    background: #f5f5f5;
}

#ticket_submission_form .right_ticket .ticket_answers .user_reply_ticket input:focus {
    border-color: #007cba;
    outline: none;
}

#ticket_submission_form .right_ticket .ticket_answers .user_reply_ticket .form-submit {
    background-color: #824deb;
    color: #fff;
    border: 1px solid #824deb;
    padding: 10px 15px;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.3s ease, color .3s ease-in-out;
    margin-left: auto;
    width: 20%;
}

#ticket_submission_form .right_ticket .ticket_answers .user_reply_ticket .form-submit:hover {
    color: #824deb;
    background-color: transparent;
}

#ticket_submission_form .right_ticket .ticket_answers .ticket-message.admin .text {
    margin-left: 32px;
}

#ticket_submission_form .right_ticket .ticket_answers .ticket-message.admin .date {
    font-size: 10px;
    margin-left: 9px;
    margin-top: 2px;
}

#ticket_submission_form .right_ticket .ticket_answers .ticket-message.user .text {
    margin-left: auto;
    margin-right: 32px;
}

#ticket_submission_form .right_ticket .ticket_answers .ticket-message.user .date {
    font-size: 10px;
    margin-right: 9px;
    margin-top: 4px;
}

#ticket_submission_form .right_ticket .ticket_answers .ticket-message.user .user_icon {
    background: #7746d8;
    border-radius: 50%;
    padding: 3px;
    color: #fff;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: bold;
    margin-left: 0.5rem
}

.account-area.main .avatar {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #7746d8;
    border-radius: 50%;
    font-weight: bold;
    color: #fff;
    border: 1px solid #7746d8;
}

.account-area.main .avatar.open {
    background: #ffa500;
    border: 1px solid #ffa500;
}

.account-area.main .button .avatar:hover {
    background: #ffa500;
    border: 1px solid #ffa500;
}

.account-area.main .logout-menu {
    position: absolute;
    top: 57px;
    right: 0;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    z-index: 100;
    padding: 15px;
    border-radius: 5px;
    width: 285px;
    display: none;
    cursor: auto;
    line-height: 1.5;
    font-size: 15px;
}

.account-area.main .logout-menu .header_mini_menu {
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
    padding-bottom: 3px;
}

.account-area.main .logout-menu .header_mini_menu .info {
    width: calc(100% - 40px);
}

.account-area.main .logout-menu .header_mini_menu .info p {
    margin-top: 3px;
    color: #636363;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 0;
}

.account-area.main .logout-menu .header_mini_menu .info p a {
    font-weight: 500;
    color: #7746d8;
}

.account-area.main .logout-menu .apply_with_us {
    display: none;
}

.account-area.main .logout-menu .apply_with_us a,
.account-area.main .logout-menu .upgrade_now a {
    background: #7746d8;
    display: block;
    color: #fff;
    padding: 10px 0;
    text-align: center;
    border-radius: 7px;
    font-weight: 500;
    transition: all ease 300ms;
    margin-bottom: 10px;
}
.account-area.main .logout-menu .mini_list_menu{
    padding: 0;
}
.account-area.main .logout-menu .mini_list_menu li {
    list-style-type: none;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    position: relative;
}
.account-area.main .logout-menu .mini_list_menu li p{
    margin-bottom: 0;
    margin-top: 0;
}

.account-area.main .logout-menu .mini_list_menu li a {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

/* Mini Cart style */
.mini_cart_icon {
    position: relative;
}

.mini_cart_icon .total_count {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #7746d8;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 11px;
    position: absolute;
    top: -9px;
    left: -8px;
}

.mini_cart {
    position: absolute;
    right: 72px;
    top: 40px;
    background: #fff;
    width: 300px;
    border-radius: 7px;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
    display: none;
    z-index: 999999;
    cursor: auto;
    padding: 15px;
}

.mini_cart_icon:hover svg,
.mini_cart_icon.open svg {
    fill: #7746d8;
}

.mini_cart h3 {
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 18px;
    color: #7746d8;
}

.mini_cart .mini-cart-item {
    margin-bottom: 10px;
    border-bottom: 1px dashed #ccc;
    padding-bottom: 10px;
}

.mini_cart .mini-cart-item:last-child {
    border-bottom: 0;
}

.mini_cart .mini-cart-item .left_item {
    font-size: 14px;
    max-width: 88%;
}

.mini_cart .mini-cart-item .left_item .price {
    margin-top: 5px;
    font-size: 16px;
    color: #636363;
}

.mini_cart .mini-cart-item .left_item strong {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.mini_cart .mini-cart-item .right_item {
    color: #636363;
}

.mini_cart .mini-cart-item .right_item i {
    cursor: pointer;
}

.mini_cart .mini-cart-item .right_item i:hover {
    color: #ffa500;
}

.mini_cart .subtotal {
    padding: 10px;
    background: #ffa500;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 500;
    border-radius: 7px;
    margin-bottom: 10px;
}

.mini_cart .checkout {
    padding: 10px;
    background: #7746d8;
    color: #fff;
    display: block;
    text-align: center;
    font-weight: 500;
    border-radius: 7px;
}

.mini_cart .checkout:hover {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
}

.help_ways {
    margin-top: 30px;
}

.help_ways .way {
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.2);
    padding: 0 20px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: start;
    background: #fff;
}

.help_ways .way i {
    margin-right: 10px;
    font-size: 30px;
    color: #7746d8;
}

.help_ways .way a {
    font-weight: bold;
    font-size: 18px;
    width: 100%;
    padding: 20px 0;
}

.help_ways .way:hover {
    background: #7746d8;
}

.help_ways .way:hover a,
.help_ways .way:hover i {
    color: #ffffff;
}

.help_center_box {
    position: relative;
}

.help_center_box .show_help_center {
    font-size: 14px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #7746d8;
    color: #ffffff;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
}

.help_center_box .help_center {
    display: none;
    flex-direction: column;
    position: absolute;
    font-size: 14px;
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.2);
    padding: 10px 20px;
    background: #fff;
    right: 0;
    border-radius: 7px;
    width: 200px;
    z-index: 999;
    top: 36px;
    gap: 10px;
}

.help_center_box .help_center.show {
    display: flex;
}

.help_center_box .help_center a {
    font-weight: normal;
    text-align: left;
}

.help_center_box .help_center a:hover {
    color: #7746d8;
}

.content-col .help_center_box {
    display: flex;
    justify-content: end;
    margin-bottom: 10px;
}

.my-referral .section_ref {
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.2);
    border-radius: 7px;
    padding: 15px;
}

.my-referral .section_ref .sec_title,
.title_ref_route .sec_title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #7746d8;
    margin-bottom: 10px;
}

.ref_route_plan {
    width: 50%;
    text-align: center;
}

.ref_route_plan th,
.ref_route_plan td {
    border: 1px solid #ccc;
    padding: 10px;
}

.ref_route_history {
    width: 100%;
    text-align: left;
    border-collapse: separate;
    border-spacing: 0 13px;
}

.history_ref {
    max-height: 400px;
    overflow: hidden;
    overflow-y: auto;
    padding: 20px;
}

.ref_route_history tr {
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.1);
}

.ref_route_history th,
.ref_route_history td {
    text-align: left;
    padding: 10px;

}

.my-referral .section_ref .sec_value,
.my-referral .section_ref .sec_value_point {
    font-size: 1rem;
    font-weight: bold;
}

.my-referral .total_ref {
    height: 100%;
}

.my-referral .total_ref .sec_value {
    background: #ebe3f9;
    border-radius: 50%;
    width: 82px;
    height: 82px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #824deb;
}

.my-referral .section_ref .sec_value input {
    width: 100%;
    padding: 10px;
    background: #f5f5f5;
    border-radius: 7px;
    border: 2px solid transparent;
    cursor: pointer;
    font-size: 16px;
    font-weight: normal;
    margin-bottom: 10px;
}

.my-referral .section_ref .sec_value input:focus {
    outline: 0;
    border-color: #7746d8;
}

.my-referral .section_ref .copy_ref {
    display: block;
    width: 50%;
    padding: 10px;
    background: #834feb;
    border: 0;
    border-radius: 7px;
    color: #fff;
    cursor: pointer;
}

.my-referral .ref_avatar {
    border-radius: 50%;
    padding: 5px;
    background: #fff;
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.2);
    margin-bottom: 10px;
    display: block;
    margin: 0 auto;
}

.my-referral .ref_point_title {
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    color: #333;
}

.my-referral .ref_point_title span {
    display: block;
    font-size: 14px;
}

.my-referral .ref_point_road .point .number {
    width: 110px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-bottom: 5px;
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.2);
    border: 5px solid #fff;
    font-weight: bold;
    background: #a7a3a3;
    color: #fff;
}

.my-referral .ref_point_road .point .number svg {
    margin-bottom: 5px;
}

.my-referral .ref_point_road .point .name {
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    color: #333;
}

.my-referral .ref_point_road .point .status {
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 7px;
    font-weight: 500;
    background: #a7a3a3;
    margin-top: 5px;
}

.my-referral .ref_point_road .point .status.got {
    background: #824deb;
    color: #fff;
}

.faq_cat .cat_faq {
    width: 19%;
    display: block;
    text-align: center;
}

.faq_cat .cat_faq a {
    padding: 10px;
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.2);
    display: block;
    border-radius: 7px;
    margin-bottom: 15px;
}

.faq_cat .cat_faq a:hover {
    background: #7746d826;
}

.faq_cat .cat_faq a svg {
    margin: 10px auto;
}

.cat_sec {
    background: #f5f5f5;
    padding: 10px;
    border-radius: 7px;
    margin-bottom: 20px;
}

.cat_sec:last-child {
    margin-bottom: 0;
}

.cat_sec .cat_sec_title {
    cursor: pointer;
    font-weight: 700;
    font-size: 18px;
}

.cat_sec .cat_sec_content {
    display: none;
    padding-top: 10px;
}

.cat_question {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 7px;
    margin-bottom: 10px;
    background: #fff;
}

.cat_question:last-child {
    margin-bottom: 0
}

.cat_question .q_title {
    cursor: pointer;
    font-weight: 600;
    font-size: 16px;
}

.cat_question .q_content {
    display: none;
    padding-top: 10px;
}

.back_faq {
    font-size: 14px;
    color: #7746d8;
    text-decoration: underline;
}

/* Notifications page styles */
.notif_table {
    width: 100%;
    text-align: center;
    border-collapse: separate;
    border-spacing: 0 15px;
}

.notif_table tr {
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.1);
    border-radius: 7px;
}

.notif_table th,
.notif_table td {
    padding: 15px;
}

.notif_table td.subject {
    text-align: left;
}

.notif_table td {
    color: #636363;
    font-weight: normal;
    font-size: 14px;
}

.notif_table tr.unread td {
    color: #000000;
    font-weight: 500;
}

.notif_table td.status svg {
    margin: 0 auto;
}

.notif_table td.cta a {
    background: #7746d8;
    color: #fff;
    padding: 7px 10px;
    border-radius: 7px;
}

.notif_sec {
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.1);
    padding: 10px;
    border-radius: 7px;
    background: #ebe3f9;
    margin-bottom: 15px;
}

.notif_sec .notif_sec_value {
    font-weight: bold;
}

.notif_page .notif_content {
    padding: 10px;
    border-radius: 7px;
    background: #ebe3f9;
}

.notif_page .notif_content a {
    color: #7746d8;
    font-weight: 700;
}

.password-recovery-form,
.reset-password-form {
    padding: 20px;
    background: #fff;
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.1);
    border-radius: 7px;
}

.password-recovery-form label,
.reset-password-form label {
    display: block;
    font-size: 16px;
    color: #636363;
}

.password-recovery-form input,
.reset-password-form input {
    display: block;
    width: 100%;
    padding: 5px 15px;
    margin-bottom: 10px;
    border: 0;
    background: #f5f5f5;
    height: 40px;
    border-radius: 7px;
}

.password-recovery-form input:focus,
.reset-password-form input:focus {
    outline: 0;
}

.password-recovery-form button,
.reset-password-form button {
    background: #824deb;
    color: #fff;
    border: 0;
    padding: 10px;
    border-radius: 7px;
    cursor: pointer;
}

.password-recovery-form button:hover,
.reset-password-form button:hover {
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.1);
}

.password-recovery-form .message,
.reset-password-form .message {
    margin-top: 10px;
    border: 1px solid #ccc;
    border-radius: 7px;
    padding: 10px;
}

.referral_menu .ref_link {
    display: flex;
    padding: 15px;
    width: 100%;
    margin-bottom: 10px;
    background: #fff;
    border-radius: 7px;
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.2);
}

.referral_menu .ref_link:hover,
.referral_menu .ref_link.active {
    background: #824deb;
    color: #fff;
}

@media (max-width:768px) {
    .have-sidebar-filter .mobile-filter-nav{
        display: block;
    }
    .notif_table {
        display: flow;
        white-space: nowrap;
        max-width: 100%;
        overflow: hidden;
        overflow-x: auto;
    }

    .iran_gateway button {
        margin: 10px 0 !important;
        width: 100% !important;
    }

    #intro {
        height: auto !important;
    }

    .form_index_login {
        flex-wrap: wrap;
        max-width: 90%;
        row-gap: 5px;
    }

    .form_index_login button {
        height: 50px;
        margin-top: 3px;
        width: 100%;
    }
    .counter_index{
        flex-wrap: nowrap;
        justify-content: space-between;
        max-width: 90%;
        margin: 35px auto;
    }
    .counter_index h3{
        width: 30%;
        margin: 0;
    }
    /* #main-header .open-mobile-menu svg path{
        fill: #ffffff;
    } */
    #intro video{
        height: auto !important;
    }

    #login-signup-page {
        padding: 16px 15px;
    }

    #login-signup-page .login-wrapper,
    #login-signup-page .signup-wrapper {
        flex-wrap: wrap;
    }

    #login-signup-page .login-wrapper .banner,
    #login-signup-page .signup-wrapper .banner,
    #login-signup-page .login-wrapper .form,
    #login-signup-page .signup-wrapper .form {
        width: 100%;
    }

    .mini_cart {
        right: 0 !important;
    }

    .mini_notif {
        right: 0 !important;
    }

    #main-footer {
        position: static !important;
    }

    footer>.container>.row {
        flex-direction: column-reverse;
    }

    .faq_cat .cat_faq {
        width: 47%;
    }

    .help_ways .way {
        margin-bottom: 10px;
    }

    .bread_application {
        flex-wrap: wrap;
    }

    .psu-roadmap {
        width: 100% !important;
        flex-wrap: nowrap;
        white-space: nowrap;
        overflow: hidden;
        overflow-x: auto;
        padding-bottom: 10px;
    }

    .psu-roadmap .title-psu {
        position: static !important;
    }

    .psu-roadmap .line_submit_width_us {
        margin-top: -19px !important;
        min-width: 68px !important;
    }

    #program-apply-yourself .nkh_tab-items-container {
        display: block;
    }

    .program_psu_info {
        margin-bottom: 15px;
    }

    .pa-holder {
        padding: 0;
    }

    .pah-document {
        gap: 0 12px;
        height: auto;
    }

    .pah-document .pah-right {
        width: calc(100% - 47px);
    }

    .pah-document .pah-right .pah-right-top {
        flex-wrap: wrap;
    }

    .pad-status {
        width: 100%;
    }

    .pah-document .pad-title {
        width: 100%;
        margin-top: 10px;
    }

    .pad-title h2 {
        margin-bottom: 0;
    }

    .pah-document .pad-more {
        display: none;
    }

    .pah-document .pah-right .ext_doc {
        flex-wrap: wrap;
        gap: 15px 0;
    }

    .pah-document .pah-right .ext_doc .allow_format,
    .pah-document .pah-right .ext_doc .max_size,
    .pah-document .pah-right .ext_doc .choose_file {
        width: 100%;
    }

    .upload-progress {
        left: 0;
        bottom: -3px;
        width: 100%;
    }

    .pad-title .pad-explanation {
        line-height: 24px;
    }

    .pah-document>.optional,
    .pah-document>.pad-required {
        height: auto;
    }
}

#questionnaire-popup {
    line-height: 22px;
}

#questionnaire-popup h2 {
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 1.7rem;
}

#questionnaire-popup .info {
    margin-bottom: 10px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
    color: #636363;
}

#questionnaire-popup .adds {
    color: #7746d8;
    font-weight: 500;
}

#questionnaire-popup ul {
    list-style-position: inside;
    background: #f5f5f5;
    padding: 10px;
    border-radius: 10px;
    margin-top: 10px;
    list-style-type: disclosure-closed;
}

#questionnaire-popup .close_p {
    cursor: pointer;
    position: absolute;
    right: 20px;
    top: 10px;
    font-size: 16px;
}

.popup_q,
.questionnaire_popup {
    position: fixed;
    width: 700px;
    padding: 20px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    height: fit-content;
    background: #fff;
    z-index: 999999;
    border-radius: 15px;
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, 0.2);
    display: none;
    max-width: 95%;
    max-height: 500px;
    overflow: hidden;
    overflow-y: auto;
}

.popup_q h3,
.questionnaire_popup h3 {
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 10px;
}

.popup_q>p {
    margin-bottom: 10px;
    color: #636363;
    font-weight: 400;
}

.popup_q .popup_q_details {
    background: #ebe3f9;
    padding: 10px;
    border-radius: 15px;
    line-height: 1.7;
    margin-bottom: 10px;
}

.popup_q .popup_q_cta {
    margin: 20px 0 0 0;
}

.popup_q .popup_q_cta a,
.questionnaire_popup a.close_survey {
    color: #fff;
    padding: 10px;
    background: #7746d8;
    border-radius: 7px;
    width: 30%;
    text-align: center;
}

.popup_q .popup_q_cta a:hover {
    background: orange;
}

.popup_q .popup_q_cta a.popup_q_close,
.questionnaire_popup a.close_survey {
    background: #555;
    color: #fff;
}

.questionnaire_popup .q_item_popup {
    margin-bottom: 10px;
    background: #ebe3f9;
    padding: 10px;
    border-radius: 7px;
}

.questionnaire_popup .q_item_popup>label {
    display: block;
    margin-bottom: 5px;
}

.questionnaire_popup .q_item_popup .q_item_radio {
    margin-bottom: 15px;
}

.questionnaire_popup .q_item_popup .q_item_radio label {
    display: flex;
    align-items: start;
    justify-content: start;
}

.questionnaire_popup .q_item_popup .q_item_radio input {
    height: 22px;
    margin-right: 10px;
    transform: scale(1.3);
}

.questionnaire_popup .q_item_popup>select,
.questionnaire_popup .q_item_popup>input {
    width: 100%;
    background: #fff;
    padding: 10px;
    border-radius: 7px;
    border: 1px solid #ccc;
    margin-bottom: 5px;
}

.questionnaire_popup .q_item_popup .q_other_input {
    display: none;
}

.questionnaire_popup .q_item_popup select:focus,
.questionnaire_popup .q_item_popup input:focus {
    outline: 0;
    border-color: #824deb;
}

.questionnaire_popup button {
    padding: 10px;
    border-radius: 7px;
    min-width: 30%;
    text-align: center;
    background: #824deb;
    color: #fff;
    font-weight: 500;
}

.questionnaire_popup button:hover {
    background: orange;
}

.questionnaire_popup button:focus {
    outline: 0;
}

.select2-container--open {
    z-index: 99999999;
}

.select2-container {
    width: 100% !important;
}

@media (max-width:768px) {
    .popup_q .popup_q_cta {
        flex-wrap: wrap;
    }

    .popup_q .popup_q_cta a,
    .questionnaire_popup a.close_survey {
        width: auto;
        min-width: 30%;
        margin-bottom: 10px;
    }

    #progress-bar-container {
        display: none;
    }

    #main-footer {
        padding-top: 20px !important;
    }

    #main-footer .footer-menu {
        font-size: 16px;
        border: 1px solid #824deb;
        padding: 15px;
        border-radius: 7px;
    }

    #main-footer .footer-menu div {
        display: none;
        padding-top: 20px;
    }

    #main-footer .footer-menu .title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 0;
    }

    #main-footer .footer-menu .title i {
        display: block;
    }

    #main-footer .col-auto {
        width: 100% !important;
        margin-bottom: 0 !important;
    }

    #main-footer .socials {
        justify-content: space-evenly;
        margin-bottom: 12px;
    }

    #main-footer .copyright {
        text-align: center;
    }

    .have-sidebar-filter .main-content .help_center_box {
        top: -43px !important;
    }

    .section_more {
        flex-direction: column;
        align-items: flex-start;
        row-gap: 13px;
    }

    .program_details {
        flex-wrap: wrap;
        row-gap: 7px;
        border-bottom: 1px solid #ccc;
        padding-bottom: 10px;
    }

    .p_cta {
        position: static !important;
        width: 100% !important;
        flex-direction: column !important;
    }

    .p_cta .program-details {
        width: 100% !important;
        margin-bottom: 10px !important;
    }

    .p_cta .btn-small {
        width: 100% !important;
        padding: 10px !important;
    }

    .program-card header .action-links {
        width: 100%;
        margin: 17px 0 10px 0;
        justify-content: space-between;
    }

    .program-card .content {
        gap: 15px 0;
    }

    .program_info .requirement {
        border-bottom: 1px solid #ccc;
        padding-bottom: 10px;
    }

    .school-card .content .items_rank {
        width: 100%;
    }

    .school-card .content .items_rank .rank_item .value {
        width: 20%;
    }

    .cost_states,
    .chart_acc {
        justify-content: center;
    }
}

.upgrade-box {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    margin-top: 20px;
    box-shadow: 0 0 8px rgba(0, 0, 0, .2);
    margin-bottom: 20px;
}

.upgrade-message {
    font-size: 16px;
    color: #333;
    margin-bottom: 25px;
    font-weight: 500;
}

.upgrade-btn {
    background-color: #7746d8;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 16px;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.3s ease;
}

.upgrade-btn:hover {
    background-color: #432581;
    color: #fff;
}

.upgrade-box .right_u_box {
    text-align: left;
    padding-left: 20px;
}

.upgrade-box .right_u_box h2 {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 17px;
}

#main-header a.signup {
    width: 100px;
}

.psu-roadmap {
    width: 80%;
    margin: 30px auto;
}

.psu-roadmap .line_submit_width_us {
    height: 4px;
    background: #dddddd;
    border-radius: 10px;
    position: relative;
    margin-top: 0;
    flex-grow: 1;
    min-width: 10px;
}

.psu-roadmap .step-psu {
    width: 20px;
    height: 20px;
    display: block;
    border-radius: 50%;
    border: 2px solid #ddd;
    transition: all ease 400ms;
}

.psu-roadmap .item-psu {
    position: relative;
    text-align: center;
    background: #fff !important;
    animation: none !important;
    color: #636363 !important;
    cursor: pointer;
}

.psu-roadmap .title-psu {
    position: absolute;
    top: 24px;
    color: #636363;
    white-space: nowrap;
}

.psu-roadmap .roadmap-active .step-psu,
.psu-roadmap .item-psu:hover .step-psu {
    border-color: #7746d8;
}

#program-apply-yourself .nkh_tab-items-container {
    padding-top: 40px;
}

.bread_application {
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

.program_psu_info {
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 7px;
}

.program_psu_info .psu_info_avatar .avatar {
    border-radius: 50%;
}

.psu_info_pname {
    width: calc(100% - 72px);
}

.psu_info_school {
    font-weight: bold;
    color: #7746d8;
    margin-bottom: 8px;
}

.psu_info_school .img-fluid {
    border: 2px solid #ffa500;
    border-radius: 7px;
}

.psu_info_pname .app_title a {
    font-size: 14px;
    color: #7746d8;
}

.psu_info_pname .app_title i {
    color: var(--theme-color-7);
}

.psu_app_items .psu_app_attr .name {
    font-weight: 600;
    color: #636363;
}

.psu_app_items .psu_app_attr .value.method {
    background: var(--theme-color-3);
    color: #fff;
    padding: 2px 5px;
    border-radius: 7px;
}

.psu_app_payment {
    padding: 15px;
    background: #f5f5f5;
    border-radius: 7px;
    margin-top: 20px;
}

.psu_app_payment .psu_app_payment--title {
    font-weight: 600;
    color: #7746d8;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.psu_app_payment .switch {
    display: none;
}

.psu_app_payment .review_option .slider {
    position: relative;
    width: 34px;
    height: 20px;
    background-color: #ccc;
    border-radius: 50px;
    transition: 0.4s;
    display: block;
    cursor: pointer;
}

.psu_app_payment .review_option .slider::before {
    content: "";
    position: absolute;
    height: 16px;
    width: 16px;
    background-color: white;
    border-radius: 50%;
    top: 2px;
    left: 2px;
    transition: 0.4s;
}

.psu_app_payment .switch:checked +.slider {
    background-color: #2196F3;
}

.psu_app_payment .switch:checked +.slider::before {
    transform: translateX(14px);
}

.psu_app_payment #review-cost {
    display: none;
    margin-top: 10px;
    padding: 8px;
    background-color: #f8f9fa;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 14px;
    color: #333;
    margin-bottom:10px;
}
.psu_app_payment .wspsc_add_cart_submit .wp-cart-button-form{
    display: block;
    width: 100%;
}
.psu_app_payment .wspsc_add_cart_submit{
    cursor: pointer;
    background: #824deb !important;
    color: #fff;
    padding: 10px 20px;
    border-radius: 7px;
    text-align: center;
    width: 100% !important;
    transition: all ease 300ms;
}
.psu_app_payment .wspsc_add_cart_submit:hover{
    box-shadow: 0 0 30px -7px rgba(0, 0, 0, .15);
}
.psu_app_payment .wspsc_add_cart_submit.animate{
    animation: pulse-animation 250ms infinite reverse;
}
.docs_title .add_doc {
    font-size: 14px;
    padding: 5px 10px;
    background: #7746d8;
    color: #fff;
    border-radius: 7px;
    transition: all ease 300ms;
}

.docs_title .add_doc:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.add_new_document .select2-container--default .select2-selection--single {
    height: 41px;
}

.add_new_document .select2-selection__rendered {
    line-height: 39px !important;
}

.add_new_document .select2-selection__arrow {
    height: 41px !important;
}

.add_new_document #new_doc_file {
    height: 40px;
    border: 1px solid #aaa;
    padding: 5px;
    border-radius: 7px;
    cursor: pointer;
}

.add_new_document .close_new_doc {
    color: #fff;
    position: absolute;
    right: 8px;
    top: auto;
    background: #ffa500;
    padding: 10px;
    border-radius: 7px;
    height: 76%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.add_new_document {
    display: none;
}

.new_doc_item button {
    background: #7746d8;
    height: 40px;
    border-radius: 7px;
    padding: 0 10px;
    color: #fff;
    cursor: pointer;
}

/* Search engine styles */
.form_index_login{
    position: relative;
    z-index: 2;
    width: 100%;
    margin: 0 auto;
    /* bottom: 0; */
    width: 620px;
    
}
.form_index_login .select2-selection{
    border: 1px solid #ccc !important;
    border-right: 0;
    height: 40px !important;
    border-radius: 0 !important;
}
.form_index_login .select2-selection__rendered{
    line-height: 40px !important;
    font-size: 15px;
}
.form_index_login .select2-selection__arrow{
    height: 39px !important;
}