:root {
    --basecolor: #edebde;
    --bglight: #faf8f0;
    --transblack: #0000004d;
    --gray: #9d9d9d;
    --yellow: #fee12d;
    --light: #fff;
    --dark: #000;
    --para: #535353;
}
body {
    font-family: 'Inter', sans-serif;
    background-color: var(--basecolor)!important;
    color: #333333; /* Dark gray for general text */
}
/* Custom scrollbar for better aesthetics */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #E0E0DB; /* Lighter track */
}
::-webkit-scrollbar-thumb {
    background: #B0B0A7; /* Medium gray thumb */
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #8F8F85; /* Darker gray on hover */
}
.mt-50 {
    margin-top: 50px
}

.mt-75 {
    margin-top: 75px
}

.mt-100 {
    margin-top: 100px
}

.yellow_button {
    background-color: var(--yellow);
    padding: 12px 10px;
    color: var(--dark);
    font-family: var(--font-urb);
    text-align: center;
    width: 150px;
    position: relative
}

.yellow_button:after {
    content: "";
    width: 100%;
    height: 100%;
    border: 1px solid var(--dark);
    position: absolute;
    top: -3px;
    left: -3px;
    transition: .2s ease-in
}

.black_button {
    background-color: var(--dark);
    padding: 12px 10px;
    width: 150px;
    font-family: var(--font-urb);
    text-align: center;
    color: var(--light);
    position: relative
}

.black_button:after {
    content: "";
    width: 100%;
    height: 100%;
    border: 1px solid var(--gray);
    position: absolute;
    top: -3px;
    left: -3px;
    transition: .2s ease-in
}

.black_button:hover:after,.yellow_button:hover:after {
    left: 0;
    top: 0
}

.navigator {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #000;
    text-align: center;
    min-width: 60px;
    line-height: 33px;
    padding: 0 20px;
    border-radius: 30px;
    background: transparent;
    border: 1px solid var(--dark);
    margin-right: 10px
}

.navigator.active {
    color: var(--light);
    background: var(--dark)
}

.socialMediaLink {
    color: #000000a4
}

.about,.contact {
    color: #48494e
}

.about h1,.about h2,.contact h3 {
    color: var(--dark)
}

.list_menu button.active {
    background: var(--basecolor)
}
.slick-next,.slick-prev {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    transform: translateY(-50%);
    cursor: pointer;
    border: none
}

.slick-next,.slick-next:focus,.slick-next:hover,.slick-prev,.slick-prev:focus,.slick-prev:hover {
    color: transparent;
    outline: none;
    background: transparent
}

.slick-next:focus:before,.slick-next:hover:before,.slick-prev:focus:before,.slick-prev:hover:before {
    opacity: 1
}

.slick-next.slick-disabled:before,.slick-prev.slick-disabled:before {
    opacity: .25
}

.slick-next:before,.slick-prev:before {
    font-family: slick;
    font-size: 20px;
    line-height: 1;
    opacity: .75;
    color: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.slick-prev {
    left: -25px
}

[dir=rtl] .slick-prev {
    right: -25px;
    left: auto
}

.slick-prev:before {
    content: "←"
}

[dir=rtl] .slick-prev:before {
    content: "→"
}

.slick-next {
    right: -25px
}

[dir=rtl] .slick-next {
    right: auto;
    left: -25px
}

.slick-next:before {
    content: "→"
}

[dir=rtl] .slick-next:before {
    content: "←"
}

.slick-dotted.slick-slider {
    margin-bottom: 30px
}

.slick-dots {
    position: absolute;
    bottom: -25px;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center
}

.slick-dots li {
    position: relative;
    display: inline-block;
    margin: 0 5px;
    padding: 0
}

.slick-dots li,.slick-dots li button {
    width: 20px;
    height: 20px;
    cursor: pointer
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    padding: 5px;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent
}

.slick-dots li button:focus,.slick-dots li button:hover {
    outline: none
}

.slick-dots li button:focus:before,.slick-dots li button:hover:before {
    opacity: 1
}

.slick-dots li button:before {
    font-family: slick;
    font-size: 6px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    content: "•";
    text-align: center;
    opacity: .25;
    color: #000;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.slick-dots li.slick-active button:before {
    opacity: .75;
    color: #000
}

.footer_footer__lRhj9 {
    background-color: var(--dark);
    color: var(--light);
    font-family: var(--font-urb)
}

.footer_footer__lRhj9 h4 {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 700
}

.footer_footer__lRhj9 a {
    text-decoration: none;
    text-transform: capitalize;
    color: var(--light);
    font-size: 16px
}

.footer_footer__lRhj9 ul li {
    padding: 10px 0
}

.footer_newsletter__FoHk9 form {
    background-color: var(--light);
    padding: 5px;
    border-radius: 10px
}

.footer_newsletter__FoHk9 span {
    text-transform: capitalize;
    letter-spacing: 3px;
    font-size: 20px;
    font-weight: 300;
    color: #ffffff71
}

.footer_newsletter__FoHk9 form input {
    outline: none;
    border: none;
    padding: 17px 10px
}

.footer_newsletter__FoHk9 form button {
    padding: 17px 38px;
    background-color: var(--dark);
    border: none;
    color: var(--light);
    border-radius: 10px
}

@media (max-width: 576px) {
    .footer_footer__lRhj9 {
        text-align:center
    }

    .footer_footer__lRhj9 h4 {
        font-size: 14px;
        margin-bottom: 0
    }

    .footer_footer__lRhj9 a,.footer_newsletter__FoHk9 span {
        font-size: 12px
    }

    .footer_footer__lRhj9 img {
        width: 50%
    }

    .footer_footer__lRhj9 ul li {
        padding: 5px 0
    }

    .footer_footer__lRhj9 p {
        font-size: 10px
    }
}

@media (max-width: 400px) {
    .footer_newsletter__FoHk9 form button {
        width:100px
    }

    .footer_newsletter__FoHk9 form button,.footer_newsletter__FoHk9 form input {
        padding: 10px
    }
}

/** end of global **/


.person_top_div__70ao5 {
    margin-bottom: -5rem;
    font-family: var(--font-urb)
}

.person_top_div__70ao5 img {
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, .35)
}

.person_top_div__70ao5 h1 {
    font-size: 2rem;
    font-weight: 600
}

.person_action_con1__cq_sW svg {
    width: 25px;
    height: 25px
}

.person_share__DkwNz>div {
    padding: 1.5rem;
    background-color: var(--basecolor);
    box-shadow: 0 0 70px 0 #04040430
}

.person_share__DkwNz {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 222
}

.person_share__DkwNz>div>button {
    width: 120px;
    margin: 10px auto auto;
    height: 35px;
    display: block;
    border: 1px solid var(--dark)
}

.person_top_div__70ao5 .person_action__IL_EU {
    border-bottom: 1px solid var(--basecolor);
    margin-bottom: -2rem
}

.person_action_con2__bT6UM button {
    background: var(--basecolor);
    width: 40px;
    height: 40px;
    border-radius: 50px
}

.person_bottom_div__ogKTj {
    padding: 9rem 2rem 2rem;
    background-color: var(--bglight);
    font-family: var(--font-urb)
}

.person_subtitle__hmVqF {
    font-family: var(--font-urb);
    font-size: 25px
}

.person_list_menu__w5dgK {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    max-height: calc(100vh - 4rem);
    overflow-y: scroll;
    direction: rtl
}

.person_list_menu__w5dgK ul {
    background: var(--bglight)
}

.person_list_menu__w5dgK::-webkit-scrollbar {
    background-color: transparent;
    width: 6px
}

.person_list_menu__w5dgK::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--dark)
}

.person_list_menu__w5dgK button {
    background: transparent;
    border-radius: 50px
}

@media (max-width:767px) {
    .person_top_div__70ao5 {
        margin-bottom: 0;
        align-items: center
    }

    .person_top_div__70ao5 img {
        margin-bottom: -4rem;
        z-index: 3
    }

    .person_title_div__f2sUa {
        background-color: var(--bglight);
        padding-top: 5rem;
        width: 100%
    }

    .person_bottom_div__ogKTj {
        padding: 0 2rem 2rem
    }
}

@media (max-width:400px) {
    .person_top_div__70ao5 img {
        width: 122px
    }

    .person_title_div__f2sUa h1 {
        font-size: 18px
    }

    .person_bottom_div__ogKTj p,
    .person_title_div__f2sUa p {
        font-size: 12px
    }

    .person_action_con1__cq_sW svg,
    .person_action_con2__bT6UM button svg {
        width: 16px;
        height: 16px
    }

    .person_action_con2__bT6UM button {
        width: 30px;
        height: 30px
    }

    .person_bottom_div__ogKTj {
        padding: 0 1rem 1rem
    }
}

.book_top_div__fEiZR {
    margin-bottom: -5rem;
    font-family: var(--font-urb)
}

.book_top_div__fEiZR img {
    box-shadow: 8px 8px 10px 0 rgba(0, 0, 0, .4);
    border: 2px solid var(--dark);
    border-radius: 0 10px 10px 0;
    width: 30vw
}

.book_top_div__fEiZR h1 {
    font-size: 2rem
}

.book_action_con1__aniQh a {
    color: var(--light);
    background: var(--dark);
    text-decoration: none;
    padding: 7px 5px;
    width: 170px;
    text-align: center;
    border-radius: 50px;
    font-size: 14px
}

.book_top_div__fEiZR .book_action__25VR7 {
    border-bottom: 1px solid var(--basecolor);
    margin-bottom: -3.5rem
}

.book_action_con2__SkCl4 button {
    background: var(--basecolor);
    width: 40px;
    height: 40px;
    border-radius: 50px
}

.book_bottom_div__9aiCl {
    padding: 6rem 2rem 2rem;
    background-color: var(--bglight);
    font-family: var(--font-urb)
}

.book_bottom_div__9aiCl h3 {
    font-size: 18px
}

.book_bottom_div__9aiCl p {
    opacity: .8
}

.book_recomdiv__enunM img,
.book_recomdiv__enunM span {
    width: 40px;
    height: 40px;
    border-radius: 50px;
    margin-left: -5px
}

.book_recomdiv__enunM span {
    background-color: var(--light)
}

.book_subtitle__RLqjj {
    font-family: var(--font-urb);
    font-size: 25px
}

@media (max-width:991px) {
    .book_top_div__fEiZR img {
        width: 40%
    }

    .book_action_con1__aniQh a {
        width: 140px
    }
}

@media (max-width:767px) {
    .book_top_div__fEiZR {
        align-items: center
    }

    .book_top_div__fEiZR h1 {
        font-size: 1.5rem
    }

    .book_top_div__fEiZR p {
        font-size: 12px
    }

    .book_action_con2__SkCl4 {
        top: 20px;
        right: 20px;
        position: absolute
    }

    .book_top_div__fEiZR img {
        margin-bottom: -5rem;
        z-index: 2
    }

    .book_titlediv__o2rqz {
        padding: 6.5rem 1rem 0;
        background-color: var(--bglight)
    }

    .book_bottom_div__9aiCl p {
        font-size: 12px
    }

    .book_top_div__fEiZR .book_action__25VR7 {
        margin-bottom: 0
    }
}

@media (max-width:575px) {
    .book_top_div__fEiZR {
        margin-bottom: 0
    }

    .book_top_div__fEiZR img {
        margin-bottom: -3rem
    }

    .book_bottom_div__9aiCl {
        margin: 0;
        padding: 1rem
    }

    .book_bottom_div__9aiCl h3,
    .book_top_div__fEiZR h1 {
        font-size: 16px
    }

    .book_titlediv__o2rqz {
        padding: 4rem 0 0
    }

    .book_action_con1__aniQh a {
        font-size: 10px;
        width: 102px
    }

    .book_action_con2__SkCl4 {
        top: 10px;
        right: 10px
    }

    .book_action_con2__SkCl4 button {
        width: 25px;
        height: 25px
    }

    .book_action_con2__SkCl4 button svg {
        width: 15px;
        height: 15px
    }
}

.list_list_menu__J2EYC {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    max-height: calc(100vh - 4rem);
    overflow-y: scroll;
    direction: rtl
}

.list_list_menu__J2EYC ul {
    background: var(--bglight)
}

.list_list_menu__J2EYC::-webkit-scrollbar {
    background-color: transparent;
    width: 6px
}

.list_list_menu__J2EYC::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--dark)
}

.list_list_menu__J2EYC button {
    background: transparent;
    border-radius: 50px
}

.list_listCard__cvKPt {
    background-color: var(--bglight);
    border: 1px solid var(--transblack)
}

.list_listCard__cvKPt:hover {
    border-color: var(--dark)
}

.list_listCard__cvKPt:hover .list_list_card_arrow__f7QW_ {
    background-color: var(--dark)
}

.list_list_card_arrow__f7QW_ {
    font-size: 2rem;
    background: var(--transblack);
    color: var(--light);
    width: 95px;
    padding: 0 2rem 2rem 0;
    height: 95px;
    bottom: -3.65rem;
    right: -3rem;
    border-radius: 50px
}

.list_listCard__cvKPt img {
    width: 35%;
    height: 100%
}

.list_list_banner__LJ8_K {
    gap: 7rem;
    margin-bottom: -4rem
}

.list_list_banner__LJ8_K img {
    width: 200px;
    height: 300px;
    border-radius: 0 10px 10px 0;
    border: 1px solid var(--dark);
    box-shadow: 10px 10px 15px 0 rgba(0, 0, 0, .35)
}

.list_list_banner__LJ8_K .list_main_img__DPRgf {
    width: 230px;
    height: 340px;
    position: absolute
}

.list_list_details__0ej0n {
    padding: 8rem 5rem 2rem;
    background: var(--bglight);
    font-family: var(--font-urb)
}

.list_list_details__0ej0n h1 {
    font-size: 2rem;
    font-weight: 600
}

.list_list_details__0ej0n button {
    width: 50px;
    height: 50px;
    background-color: var(--basecolor);
    border-radius: 50px
}

.list_subtitle__vuBK5 {
    font-family: var(--font-urb);
    font-size: 25px
}

@media (max-width:767px) {
    .list_list_details__0ej0n {
        padding: 8rem 2rem 2rem
    }
}

@media (max-width:576px) {
    .list_list_banner__LJ8_K {
        gap: 3rem
    }

    .list_list_details__0ej0n h1 {
        font-size: 1.5rem
    }

    .list_list_details__0ej0n p {
        font-size: 14px
    }

    .list_list_banner__LJ8_K img {
        width: 35vw
    }

    .list_list_banner__LJ8_K .list_main_img__DPRgf {
        width: 40vw
    }

    .list_list_details__0ej0n {
        padding: 8rem 1rem 2rem
    }
}

@media (max-width:400px) {
    .list_list_details__0ej0n h1 {
        font-size: 1.3rem
    }

    .list_list_details__0ej0n {
        padding: 6rem 1rem 2rem
    }

    .list_list_details__0ej0n p {
        font-size: 12px
    }
}

.page_homehero {
    height: 600px;
    background-image: url(../img/Vector.svg);
    background-repeat: no-repeat;
    background-position: 0 100%;
    display: flex;
    background-size: contain;
    align-items: center
}

.page_homehero div.page_container__aoG4z {
    height: 100%
}

.hompage_left_box h1 {
    font-weight: 700;
    font-family: var(--font-urb);
    color: var(--dark)
}

.page_right {
    background-image: url(../img/study.png);
    background-repeat: no-repeat;
    background-position: 0 100%;
    background-size: 90%
}

.page_details {
    top: 10%;
    right: 15%
}

.page_data__0KoIv {
    width: 80px;
    font-size: 14px;
    text-align: center;
    font-family: var(--font-urb);
    font-weight: 500
}

.page_number__EaU82 {
    border-bottom: 2px solid #2657d6
}

.page_search {
    border: 1px solid var(--dark);
    border-radius: 50px;
    padding: 5px;
    background-color: var(--light)
}

.page_search input {
    border: none;
    outline: none;
    background-color: transparent;
    padding: 5px 20px
}

.page_search button {
    background-color: var(--yellow);
    padding: 5px;
    border-radius: 50%;
    border: none
}

.page_searchResulte__genLw {
    z-index: 2;
    background: var(--light);
    border: 1px solid #000;
    border-radius: 10px;
    width: 100%;
    max-height: 250px;
    padding: 20px 10px 10px;
    left: 0;
    top: 120%
}

.page_searchResulte__genLw a {
    color: var(--dark);
    text-decoration: none
}

.page_featured {
    background-color: #0f0f0f;
    background-image: url(../img/bg-13.png);
    background-repeat: no-repeat;
    background-size: cover
}

.page_featured .page_sape1 {
    left: 0;
    bottom: -5px
}

.page_featured .page_sape2 {
    left: 5%;
    top: 15%;
    animation: page_jumpTwo 3.5s linear infinite
}

.page_featured .page_sape3 {
    top: 0;
    right: 0
}

.page_featured .page_sape4 {
    right: 5%;
    bottom: 15%;
    animation: page_jumpThree__SMQN9 3.5s linear infinite
}

@keyframes page_jumpTwo {
    0% {
        transform: translateZ(0)
    }

    40% {
        transform: translate3d(0, 20px, 0)
    }

    to {
        transform: translateZ(0)
    }
}

@keyframes page_jumpThree__SMQN9 {
    0% {
        transform: translateZ(0)
    }

    40% {
        transform: translate3d(0, -20px, 0)
    }

    to {
        transform: translateZ(0)
    }
}

.page_heading {
    font-family: var(--font-urb);
    color: var(--dark)
}

.page_people {
    background-image: url(../img/bg-14.svg)
}

.page_para__Iv0_Z {
    font-family: var(--font-urb);
    color: var(--para);
    font-size: 18px
}

.page_series div a {
    background-color: #faf8f0;
    z-index: 2;
    width: 48%;
    height: 210px;
    border: 1px solid var(--dark);
    border-radius: 10px
}

.page_series div a img {
    width: 85px;
    box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, .25);
    border-radius: 10px
}

.page_filtercon__UYL8K {
    background-color: #faf8f0
}

.page_crousel_container__10v4e {
    background: url(../img/bg-15.svg);
    background-repeat: repeat-x
}

.page_crouselwidth__WPDVJ {
    max-width: 1200px;
    width: 1200px
}

.page_bookcard {
    border: 1px solid var(--dark);
    background-color: var(--basecolor);
    box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, .25);
    border-radius: 10px
}

@media (max-width:1300px) {
    .page_crouselwidth__WPDVJ {
        width: 100%
    }
}

@media (max-width:1200px) {
    .page_details {
        right: 18%
    }

    .page_right {
        background-position: 50px 100%
    }

    .page_series div a {
        height: 190px
    }

    .page_series div a img {
        width: 70px
    }
}

@media (max-width:992px) {
    .hompage_left_box span:last-child svg {
        width: 150px
    }

    .page_right {
        background-position: 0 100%
    }

    .page_details {
        right: 25%
    }

    .page_details img {
        width: 150px
    }

    .page_series div a {
        width: 47%;
        height: 17vw
    }

    .page_series div a span {
        font-size: 12px
    }

    .page_series div a img {
        width: 35%
    }
}

@media (max-width:767px) {
    .page_right {
        height: 300px;
        background-size: contain
    }

    .page_series div a {
        height: 28vw
    }

    .page_details {
        top: 20%
    }

    .hompage_left_box span:last-child {
        right: 0 !important
    }
}

@media (max-width:576px) {
    .page_homehero {
        height: -moz-fit-content;
        height: fit-content
    }

    .page_series div a {
        height: 34vw
    }

    .page_series div a span {
        font-size: 10px
    }

    .page_right {
        height: 500px
    }

    .page_details {
        right: 110px
    }
}

@media (max-width:400px) {
    .page_data__0KoIv {
        width: 70px;
        font-size: 12px
    }

    .page_details {
        right: 100px
    }

    .page_details div:nth-child(3) {
        left: -100px !important
    }

    .page_details img {
        width: 130px
    }
}

.common_personCard {
    border: .5px solid var(--dark);
    padding: 10px;
    width: 180px;
    border-radius: 10px;
    font-family: var(--font-urb);
    background-color: var(--basecolor);
    box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, .25);
    transition: .5s
}

.common_personCard:hover {
    transform: translateY(-5px) scale(1.05)
}

.common_personCard img {
    border: 1px solid var(--dark);
    border-radius: 5px
}

.common_personCard a {
    font-size: 15px;
    line-height: 22px;
    color: var(--dark);
    font-weight: 400
}

.common_personCard p {
    font-size: 12px;
    font-style: normal
}

.common_personCard div span {
    font-size: 12px;
    padding: 3px 5px;
    border-radius: 5px
}

.common_personCard div span.common_author {
    background: #c5b3da
}

.common_personCard div span.common_layer__uXLKx {
    color: var(--light);
    background-color: #006400
}

.common_moreLink__SQ0Ov {
    width: 230px;
    height: 200px;
    font-size: 25px;
    background-color: var(--yellow);
    color: var(--dark);
    font-family: var(--font-urb);
    border-radius: 10px;
    position: relative
}

.common_moreLink__SQ0Ov:after {
    content: "";
    width: 100%;
    height: 100%;
    border: 1px solid var(--dark);
    border-radius: 10px;
    position: absolute;
    top: -5px;
    left: -5px;
    transition: .2s ease-in
}

.common_moreLink__SQ0Ov:hover:after {
    left: 0;
    top: 0
}

.common_book_container__KSBFT .common_main_img__DEVOm {
    width: 147px;
    height: 100%;
    height: 262px;
    max-height: 262px;
    box-shadow: 5px 5px 7px 0 rgba(0, 0, 0, .4);
    border: 1px solid var(--dark);
    border-radius: 0 5px 5px 0
}

.common_book_left__7Jpwz {
    font-family: var(--font-urb)
}

.common_book_left__7Jpwz h3 {
    font-size: 20px
}

.common_book_left__7Jpwz img,
.common_recom_tab__4Hbie img {
    border-radius: 50px;
    width: 30px;
    height: 30px;
    border: 1px solid var(--dark)
}

.common_book_left__7Jpwz .common_sort_desc__wBNkL {
    height: 94px;
    overflow-y: auto
}

.common_book_left__7Jpwz .common_sort_desc__wBNkL::-webkit-scrollbar {
    width: 5px
}

.common_book_left__7Jpwz .common_sort_desc__wBNkL::-webkit-scrollbar-track {
    background-color: beige
}

.common_book_left__7Jpwz .common_sort_desc__wBNkL::-webkit-scrollbar-thumb {
    background-color: #000000c4;
    border-radius: 5px
}

.common_book_right___Uv43 p {
    font-size: 14px;
    font-family: var(--font-urb);
    font-weight: 400
}

.common_recom_tab__4Hbie {
    border: 1px solid var(--dark);
    border-radius: 15px;
    font-size: 12px
}

.common_recom_tab__4Hbie button {
    border-radius: 10px;
    border: none;
    font-size: 14px;
    font-family: var(--font-urb);
    font-weight: 400
}

.common_recom_tab__4Hbie img:not(:first-child) {
    margin-left: -7px
}

.common_recom_tab__4Hbie span {
    width: 30px;
    height: 30px;
    font-size: 10px;
    border-radius: 50px;
    border: 1px solid var(--dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--light);
    margin-left: -7px
}

.common_faq__nhMa2 {
    border: 1px solid var(--dark);
    border-radius: 10px;
    font-family: var(--font-urb)
}

.common_faq__nhMa2 p {
    opacity: .8;
    transition: .2s ease
}

.common_common_hero__osS9Z {
    font-family: var(--font-urb)
}

@media (max-width:575px) {
    .common_book_container__KSBFT .common_main_img__DEVOm {
        height: -moz-fit-content;
        height: fit-content
    }
}

@media (max-width:400px) {
    .common_book_left__7Jpwz {
        font-size: 12px
    }

    .common_book_left__7Jpwz h3 {
        font-size: 16px
    }
}

.header_nav {
    padding: 10px 20px;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 999;
    background-color: var(--basecolor)
}

.nav_logo img {
    width: 110px
}

.nav_menu {
    gap: 30px
}

.nav_menu a {
    color: var(--dark);
    font-family: var(--font-outfit);
    font-size: 16px;
    font-weight: 300;
    text-decoration: none;
    position: relative
}

.nav_menu a:after {
    content: "";
    width: 0;
    height: 2px;
    background-color: var(--dark);
    position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    transition: .2s ease
}

.nav_menu a.active::after,
.nav_menu a:hover::after {
    width: 100%;
}

.nav_user__5zzxp div {
    display: none
}

.nav_user__5zzxp:hover div {
    display: block
}

@media (max-width:962px) {
    .header_nav {
        padding: 15px
    }

    .nav_logo img {
        width: 100%
    }
}

@media (max-width:768px) {
    .nav_logo img {
        width: 100px
    }

    .nav_mobile {
        position: fixed;
        top: 0;
        right: -300px;
        width: 300px;
        height: 100vh;
        z-index: 999;
        background-color: var(--bglight);
        padding: 20px 10px
    }

    .nav_mobile ul li {
        padding: 5px 0
    }

    .nav_mobile div {
        border-top: 1px solid gray
    }
}