@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');


@font-face {
    font-family: 'Ivy Mode';
    src: url("/fonts/IvyMode/regular.woff2") format("woff2"),
         url("/fonts/IvyMode/regular.woff") format("woff");
    font-weight: normal;
}

@font-face {
    font-family: 'Ivy Mode';
    src: url("/fonts/IvyMode/semibold.woff2") format("woff2"),
         url("/fonts/IvyMode/semibold.woff") format("woff");
    font-weight: bold;
}


:root {
    --color-primary: #4A233D;
    --color-primary-2: #CE9A81;
    --color-secondary: #B2A5A1;
    --color-success: #008698;
    --color-danger: #CE1C3C;
    --color-warning: #F4B456;
    --color-info: #1EB7C2;
    --color-light: #ECD8CE;
    --color-dark: #2E1527;

    --color-base: #474747;

    --color-gray: #929497;
    --color-gray-light: #58595b;
    --color-gray-lighter: #898a8d;
    --color-gray-lightest: #f3f5f7;
    --color-gray-dark: #404041;
    
    --color-blue-light: #ecf3f9;

    --color-card-bg: #EDE9EC;
    --card-border-color-base: #CE9A81;
    --color-t63-card-bg: #F4F2F3;
    --color-section-striped: #EDE9EC;

    --color-title: #000;
    --color-link: #008698;
    --color-link-hover: #005B67;
    --color-tooltip: #ed2224;
    --color-emphasis: #909090;
    --color-text-selection: #fff2a8;

    --color-form-label: #929497;
    --color-form-control: #404040;
    --color-form-control-bg: #F7F7F7;
    --color-form-control-border: #D8D8D8;
    --color-input-checked: var(--color-primary);
    --color-form-link: #008698;

    --color-form-error: #B61D22;
    --color-form-error-bg: #fff;
    --color-form-error-border: #f3ced3;

    --color-close-btn-bg: #7f7f6f;

    --color-badge-primary-bg: #4A233D;
    --color-badge-primary-text: #CE9A81;
    --color-badge-primary-light-bg: #C97CBA;
    --color-badge-primary-light-text: #2E1527;

    --color-badge-secondary-bg: #B2A5A1;
    --color-badge-secondary-text: #fff;
    --color-badge-secondary-light-bg: #D9D2D0;
    --color-badge-secondary-light-text: #2E1527;

    --color-badge-success-bg: #008698;
    --color-badge-success-text: #fff;
    --color-badge-success-light-bg: #DCFBFF;
    --color-badge-success-light-text: #008698;

    --color-badge-danger-bg: #CE1C3C;
    --color-badge-danger-text: #fff;
    --color-badge-danger-light-bg: #FFB2C3;
    --color-badge-danger-light-text: #410813;

    --color-badge-warning-bg: #F4B456;
    --color-badge-warning-text: #2E1527;
    --color-badge-warning-light-bg: #FCD8AE;
    --color-badge-warning-light-text: #5B3A09;

    --color-badge-info-bg: #1EB7C2;
    --color-badge-info-text: #fff;
    --color-badge-info-light-bg: #95E9EC;
    --color-badge-info-light-text: #0B5257;

    --color-badge-light-bg: #F8EFEC;
    --color-badge-light-text: #410813;

    --color-badge-dark-bg: #2E1527;
    --color-badge-dark-text: #fff;
    --color-badge-dark-light-bg: #877B83;
    --color-badge-dark-light-text: #410813;

    --color-badge-purple-bg: #b6259e;
    --color-badge-purple-text: #fff;

    --icon-wrap-circle-bg: var(--color-primary);
    --icon-wrap-circle-border-color: var(--color-primary-2);
    --icon-wrap-circle-border-radius: 50%;
    --icon-wrap-circle-text-color: var(--color-primary-2);

    --border-radius: 16px;
}




/* ----------- fonts ----------- */
body, input, textarea, button{
    font-family: 'Plus Jakarta Sans', sans-serif;
}

h1, h2, h3, h4, h5, h6,
.title,
.text-emphasis,
.learning-overview-item .num{
    font-family: 'Ivy Mode', serif;
}

/*.app-header .sign-wrap a,
.app-header .user-wrap a,
.app-header .user-wrap button,
.app-header nav a,
.app-header nav button,
.app-header .search-wrap > div input,*/
.testimonial-title,
.page-account .page-head .user-container .name,
.notebook-course-sections-list .item .title{
    font-family: 'Plus Jakarta Sans', sans-serif;
}
/* ----------- /fonts ----------- */



/* -----------  ----------- */
a{
    color: var(--color-link);
}
a:hover {
    color: var(--color-link-hover);
}
}
/* ----------- / ----------- */




/* ==================== layout ==================== */


.app{
    --app-header-wrap-height: 66px;

    padding-top: var(--app-header-wrap-height);
}

@media (min-width: 768px){
    .app{
        --app-header-wrap-height: 72px;
    }
}
@media (min-width: 992px){
    .app{
        --app-header-wrap-height: 88px;
    }
}
@media (min-width: 1200px){
    .app{
        padding-top: var(--app-header-wrap-height);
    }
}


/* ---------- header ---------- */
.app-header{
    background-color: var(--color-primary);
}

.app-header > .container{
    max-width: 100%;
    padding: 0;
}

.app-header-wrap {
    min-height: var(--app-header-wrap-height);
    background-color: transparent;
    box-shadow: none;
    padding: 8px 15px;
}

.app-header-wrap .logo img {
    height: 34px;
}

.app-header .btn{
    width: auto;
    height: auto;
    min-width: 42px;
    min-height: 42px;
    background-color: var(--color-primary-2) !important;
    border-color: var(--color-primary-2) !important;
    border-radius: 50px;
    color: #fff !important;
}
.app-header .dashboard-btn{
    background-color: var(--color-primary-2) !important;
    border-color: var(--color-primary-2) !important;
    color: #fff !important;
}
.app-header .search-wrap .search-btn{
    background-color: var(--color-success) !important;
    border-color: var(--color-success) !important;
    color: #fff !important;
}
.app-header .i-search::before {
    background-image: url(/images/icons/search_white.svg);
}
.app-header .i-basket::before {
    background-image: url(/images/icons/cart_white.svg);
}
.app-header .dropdown .nav-link::after, .app-header [data-toggle="dropdown"]::after {
    background-image: url(/images/icons/chevron_gold.svg);
    background-size: 20px auto;
}

.app-header .search-btn,
.app-header .basket-btn,
.app-header .hamburger{
    padding: 0;
}

.app-header .hamburger span,
.app-header .hamburger span::before,
.app-header .hamburger span::after{
    background-color: #fff;
}

.app-header nav a,
.app-header nav button {
    color: var(--color-primary-2);
}

/*.app-header nav a:hover,
.app-header nav a.active,
.app-header nav button:hover {
    color: var(--color-primary-2);
}*/

.basket-btn > span span {
    background-color: var(--color-primary-2);
    color: #fff;
}

.app-header .search-wrap > div{
    border-radius: 6px;
}
.app-header .search-wrap > div input {
    background-color: #f5f5f5;
    border: 1px solid var(--color-primary-2);
    color: #000;
}
.app-header .search-wrap > div input,
.app-header .search-wrap > div > .search-btn{
    border-radius: 0;
}

.app-header .search-wrap > div input:focus {
    border-color: var(--color-primary-2);
}

@media (min-width: 576px){
    .app-header .dashboard-btn{
        padding-left: 16px;
        padding-right: 16px;
    }
}
@media (min-width: 768px) {
    .app-header-wrap {
        padding: 10px 20px;
    }

    .app-header-wrap .logo img {
        height: 34px;
    }

    .app-header .btn{
        min-width: 45px;
        min-height: 45px;
    }

    .app-header .dashboard-btn{
        padding-left: 20px;
        padding-right: 20px;
    }
}
@media (min-width: 992px) {
    .app-header-wrap {
        padding: 14px 32px;
    }

    .app-header-wrap .logo img {
        height: 60px;
    }

    .app-header .sign-wrap a,
    .app-header .user-wrap [data-toggle="dropdown"] {
        color: var(--color-primary-2);
    }

    .app-header .user-wrap > button svg path {
        fill: var(--color-primary-2);
    }
}
@media (min-width: 1280px) {
    .app-header:not(.mobile-header) .sign-wrap a{
        display: flex;
        align-items: center;
        width: auto;
        height: auto;
        min-width: 46px;
        min-height: 46px;
        background-color: var(--color-primary-2) !important;
        border: 0 !important;
        border-radius: 50px;
        padding: 0 20px;
        color: #fff !important;
    }
    .app-header:not(.mobile-header) .sign-wrap a:hover {
        opacity: 0.85;
    }

    .app-header:not(.mobile-header) .user-wrap .dropdown-menu {
        min-width: 200px;
        top: 100% !important;
        left: auto !important;
        right: 0 !important;
        transform: none !important;
        text-align: right;
    }

    .app-header .dropdown-menu a{
        color: var(--color-primary);
    }

    .app-header.mobile-header nav{
        background-color: #030923;
    }
}


@media (max-width: 1279px) {
    .app-header nav {
        background-color: var(--color-primary);
        top: var(--app-header-wrap-height);
    }

    .app-header nav .dropdown-menu{
        position: relative !important;
    }
    .app-header nav .sign-wrap,
    .app-header nav .user-wrap{
        border-bottom-color: var(--color-primary-2);
    }
}
@media (max-width: 374px) {
    .app-header .search-wrap > div input {
        height: 45px;
    }
}
@media (max-width: 359px) {
    .app-header-wrap .logo img {
        max-width: 120px;
    }
}
/* ---------- /header ---------- */


/* ---------- breadcrumbs ---------- */
.breadcrumbs li {
    color: #808080;
}
.breadcrumbs li a {
    color: #4d5c61;
}
/* ---------- /breadcrumbs ---------- */


/* ---------- page ---------- */
.page-head,
.app-page .t63-page-head:first-child,
.section-striped .section:nth-child(even){
    background-color: var(--color-section-striped);
}
.page-content-head {
    color: var(--color-gray-light);
}

.t63-page::before {
    content: "";
    width: 100%;
    height: 100%;
    background: url(/images/bg_infinity.svg) center -150px no-repeat;
    background-size: 100% auto;
    position: absolute;
    top: calc(var(--app-header-wrap-height) * -1);
    left: 0;
    z-index: -1;
}
.card-sticky {
    top: calc(var(--app-header-wrap-height) + 15px);
}
/* ---------- /page ---------- */


/* ---------- footer ---------- */
.app-footer {
    background-color: var(--color-primary-2);
    color: #fff;
}

.app-footer .logo {
    max-width: 150px;
}
.app-footer .logo img{
    width: 150px;
}

.app-footer .links-wrap-title {
    color: #fff;
}
.app-footer .links-wrap-title img{
    filter: brightness(0) invert(1);
}
/* ---------- /footer ---------- */


/* ---------- chat ---------- */
.chat-63 {
    --chat-primary-color: var(--color-primary);
}
/* ---------- /chat ---------- */



/* ==================== components ==================== */


/* ---------- buttons ---------- */

/* primary */
.btn-primary,
.btn-primary:focus,
.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled):active {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-primary-2);
}

/* secondary */
.btn-secondary,
.btn-secondary:focus,
.btn-secondary:hover,
.btn-secondary:not(:disabled):not(.disabled):active {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
    color: #fff;
}

/* success */
.btn-success,
.btn-success:focus,
.btn-success:hover,
.btn-success:not(:disabled):not(.disabled):active {
    background-color: var(--color-success);
    border-color: var(--color-success);
    color: #fff;
}

/* danger */
.btn-danger,
.btn-danger:focus,
.btn-danger:hover,
.btn-danger:not(:disabled):not(.disabled):active {
    background-color: var(--color-danger);
    border-color: var(--color-danger);
    color: #fff;
}

/* warning */
.btn-warning,
.btn-warning:focus,
.btn-warning:hover,
.btn-warning:not(:disabled):not(.disabled):active {
    background-color: var(--color-warning);
    border-color: var(--color-warning);
    color: #2E1527;
}

/* info */
.btn-info,
.btn-info:focus,
.btn-info:hover,
.btn-info:not(:disabled):not(.disabled):active {
    background-color: var(--color-info);
    border-color: var(--color-info);
    color: #fff;
}

/* light */
.btn-light,
.btn-light:focus,
.btn-light:hover,
.btn-light:not(:disabled):not(.disabled).active,
.btn-light:not(:disabled):not(.disabled):active,
.show>.btn-light.dropdown-toggle{
    background-color: var(--color-light);
    border-color: var(--color-light);
    color: #2E1527;
}
.btn-light:not(:disabled):not(.disabled).active,
.btn-light:not(:disabled):not(.disabled):active,
.show>.btn-light.dropdown-toggle {
    opacity: 0.5 !important;
}

/* dark */
.btn-dark,
.btn-dark:focus,
.btn-dark:hover,
.btn-dark:not(:disabled):not(.disabled):active {
    background-color: var(--color-dark);
    border-color: var(--color-dark);
    color: #fff;
}
/* ---------- /buttons ---------- */


/* ---------- pagination ---------- */
.page-link {
    color: var(--color-link);
}
/* ---------- pagination ---------- */


/* ---------- form ---------- */
.form-control,
.form-control:focus{
    background-color: var(--color-form-control-bg);
    border-width: 1px;
}

.card .coupons-section .input-group{
    background-color: var(--color-form-control-bg);
}
.coupons-section .input-group-append .btn {
    align-self: center;
    min-height: unset;
}
/* ---------- /form ---------- */


/* ---------- card ---------- */
.card {
    background-color: var(--color-card-bg);
}
.card-section {
    border-bottom: 1px solid rgba(0,0,0,.125);
}

.card-bg-light{
    background-color: var(--color-t63-card-bg);
}
.card-bg-light .card-header{
    background-color: transparent;
}

.card .no-data{
    background-color: transparent !important;
}
/* ---------- /card ---------- */


/* ---------- tabs ---------- */
.tab-nav {
    border-bottom: 2px solid var(--color-secondary);
}

.tab-nav a {
    border: 1px solid var(--color-secondary);
    color: #000;
}

.tab-nav a.active {
    background-color: var(--color-secondary);
    color: #fff;
}

.nav-tabs {
    border-bottom-color: var(--color-secondary);
}
.nav-tabs .nav-item .nav-link{
    color: var(--color-secondary);
}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
    border-color: transparent;
    color: var(--color-primary);
}
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color: var(--color-primary);
    background-color: #fff;
    border-color: var(--color-secondary) var(--color-secondary) #fff;
}
/* ---------- /tabs ---------- */


/* ---------- accordion ---------- */
/*.accordion-item{
    background-color: var(--color-t63-card-bg);
}*/
.accordion-item-head::after{
    background-image: url("/images/icons/chevron_gold.svg");
    background-size: 30px auto;
}
.accordion-item-head .t63-icon-wrap i,
.accordion-item-head .title,
.accordion-item-head .title *{
    --color-title: var(--color-primary);
}
/* ---------- /accordion ---------- */


/* ---------- text-with-img ---------- */
.item-text-with-img .embed-responsive::before {
    background: linear-gradient(to top, rgba(22,63,107,0.8) 0%,rgba(22,63,107,0) 100%);
}
/* ---------- /text-with-img ---------- */


/* ---------- Pricing toggler ---------- */
.pricing-toggler {
    border-color: #e5ebf1;
    background-color: var(--color-card-bg);
}
.pricing-toggler .bg-wrap {
    background-color: #293a4b;
}
.pricing-toggler .text-1.active,
.pricing-toggler .text-2.active {
    color: #fff;
}
.pricing-toggler-wrap p{
    color: #1B6B44;
}
/* ---------- /Pricing toggler ---------- */


/* ---------- box badge ---------- */
.box-badge {
    color: #FFF;
    background: var(--color-primary);
    box-shadow: 0 2px 10px -5px rgba(0, 0, 0, 1);
}

.box-badge-green{
    background: var(--color-success);
}

.box-badge-red{
    background: var(--color-danger);
}
/* ---------- /box badge ---------- */


/* ---------- slider ---------- */
.slick-arrow{
    opacity: 0.9;
}
.slick-arrow:hover{
    opacity: 1;
}
/* ---------- /slider ---------- */



/* ==================== 5. content by pages ==================== */

.testimonial-item,
.catalog-section > .head,
.page-cart .basket-container tbody td,
.credit-cards-container tbody td{
    background-color: var(--color-section-striped);
}

.catalog-item-features-list li .icon {
    background-color: var(--color-primary);
}


/* ---------- course ---------- */
.chapter .head {
    background-color: var(--color-primary);
}
.chapter .head .title {
    color: #fff;
}

.chapter .body li {
    background-color: #f1f1f2;
    border-top-color: #d4d4d4;
    border-right-color: #d4d4d4;
}

.chapter .body li::before {
    background-color: #ddd;
    color: #666;
}

.chapter .body li .progress-wrap::before {
    background-color: #d4d4d4;
}

.chapter .body li .progress-wrap i {
    background-color: #d4d4d4;
    border-color: #d4d4d4;
    color: #fff;
}

.chapter .body li.active .progress-wrap::before,
.chapter .body li.active .progress-wrap i {
    background-color: var(--color-primary-2);
}

.chapter .body li.active .progress-wrap i {
    background-color: var(--color-primary-2);
}

.chapter .body li:hover {
    background-color: #fff;
    border-top-color: #eee;
}

.chapter .body li:hover + li {
    border-top-color: #eee;
}

.chapter .body li.current:before,
.chapter .body li:hover::before {
    background-color: var(--color-primary-2);
    color: #fff;
}

.chapter .body li:not(.active):hover .progress-wrap i {
    background-color: #fff;
}
/* ---------- /course ---------- */


/* ---------- account ---------- */
.page-account .page-head .user-container .name {
    color: var(--color-primary);
}
/* ---------- /account ---------- */



/* ==================== t63 components ==================== */


/* ----------- t63 icons ----------- */
.has-circled-icon .t63-icon-wrap{
    background-color: var(--color-primary);
    border-color: #b0bfc7;
}
.has-circled-icon  .t63-icon-wrap i{
    color: #fff;
}
/* ----------- /t63 icons ----------- */


/* ---------- scrollTo nav section ---------- */
.t63-scrollto-nav ul{
    background-color: var(--color-card-bg) !important;
}
.t63-scrollto-nav a{
    color: #666;
}
/* ---------- /scrollTo nav section ---------- */


/* ---------- img & slider sections ---------- */
.t63-section.img-section .bg-img::before,
.t63-section.slider-section .bg-img::before{
    background: url(/plugins/63bits-pageBuilder/images/intro_slide_gradient.png) bottom repeat-x;
}

.slider-section .slick-slider .slick-dots button{
    background-color: #c1c3c6;
    border-color: #c1c3c6;
}
.slider-section .t63-multimedia-container .embed-responsive::after {
    background: url(/plugins/63bits-pageBuilder/images/intro_slide_gradient.png) bottom repeat-x;
}
/* ---------- /img & slider sections ---------- */


/* ---------- images grid ---------- */
.t63-img-grid-section .grid-item .bg-img::before{
    background: url(/plugins/63bits-pageBuilder/images/grid_item_overlay_bg.png) bottom repeat-x;
}
.t63-img-grid-section .grid-item-title,
.t63-section .grid-item-text{
    color: #fff;
}
.t63-img-grid-section .grid-item .overlay{
    background-color: rgba(61,0,180,0.6);
}
/* ---------- /images grid ---------- */


/* ---------- accordion ---------- */
.t63-section .accordion-item{
    background-color: var(--color-t63-card-bg);
}
.t63-section[data-background-color="true"] .accordion-item{
    background-color: #fff;
}
/*.t63-section .accordion-item-head::after{
    background-image: url("/images/icons/chevron_blue.svg");
}*/
/*.t63-section .accordion-item-head .t63-icon-wrap i,
.t63-section .accordion-item-head .title,
.t63-section .accordion-item-head .title *{
    --color-title: var(--color-primary);
}*/
/* ---------- /accordion ---------- */


/* ----------- testimonials section ----------- */
.t63-testimonial-item .author-wrap .text,
.t63-testimonial-item .author-wrap .plain-text-input{
    color: #231f20;
}
.t63-testimonial-item .description-wrap .text,
.t63-testimonial-item .description-wrap .plain-text-input{
    color: #414042;
}
/* ----------- /testimonials section ----------- */


/* ----------- services section ----------- */
.t63-services-section .grid-item{
    background-color: #fff;
    box-shadow: 0 4px 10px 0 rgba(0,0,0,0.2);
}
.t63-services-section .grid-item .img-container{
    background-color: #f9f8fb;
}
.t63-services-section .grid-item .content .text,
.t63-services-section .grid-item .content .plain-text-input{
    color: var(--color-gray-light);
}
/* ----------- /services section ----------- */


/* ----------- card ----------- */
.t63-card-section article{
    background-color: var(--color-t63-card-bg);
}
.t63-card-section[data-background-color="true"] article{
    background-color: #fff;
}
/* ----------- /card ----------- */


/* ----------- flip card ----------- */
.t63-flip-cards-section .flip-card-item .flip-front {
    background-color: var(--color-t63-card-bg);
}
.t63-flip-cards-section[data-background-color="true"] .flip-card-item .flip-front{
    background-color: #fff;
}

.t63-flip-cards-section .flip-card-item .flip-back {
    background-color: var(--color-primary);
}
.t63-flip-cards-section .flip-card-item .title{
    color: #4d5c61;
}
.t63-flip-cards-section .flip-card-item [data-media-type="image"] + .title-container .title,
.t63-flip-cards-section .flip-card-item [data-media-type="image"] + .title-container .title *,
.t63-flip-cards-section .flip-card-item .text-wrap{
    color: #fff;
}
.flip-card-item[data-clickable="true"] .flip-front::before{
    background-image: url(/plugins/63bits-pageBuilder/images/icons/rotate.svg);
    background-color: #ebebeb;
    border-color: #cbcbcb;
}
/* ----------- /flip card ----------- */


/* ----------- packages ----------- */
.t63-packages-grid-section .packages-grid-item{
    background-color: var(--color-t63-card-bg);
}
.t63-packages-grid-section[data-background-color="true"] .packages-grid-item{
    background-color: #fff;
}
.t63-packages-grid-section .packages-grid-item .title,
.t63-packages-grid-section .packages-grid-item .text-wrap{
    color: var(--color-gray-light);
}
/* ----------- /packages ----------- */


/* ----------- quote ----------- */
.t63-quote-section article{
    background-color: var(--color-t63-card-bg);
}
.t63-quote-section[data-background-color="true"] article{
    background-color: #fff;
}
.t63-quote-section .fontawesome-icon-container .t63-icon-wrap i{
    color: var(--color-primary);
}

.t63-quote-section .text-wrap{
    color: var(--color-gray-light);
}
/* ----------- /quote ----------- */


/* ----------- evocalendar ----------- */
.t63-section .calendar-sidebar,
.t63-section #eventListToggler,
.t63-section .calendar-sidebar>span#sidebarToggler{
    background-color: var(--color-primary);
    -webkit-box-shadow: 5px 0 18px -3px var(--color-primary);
    box-shadow: 5px 0 18px -3px var(--color-primary);
}

.t63-section .calendar-sidebar>.month-list>.calendar-months>li:hover{
    background-color: #163557;
}
.t63-section .calendar-sidebar>.month-list>.calendar-months>li.active-month {
    background-color: #112b47;
}

.t63-section th[colspan="7"]{
    color: var(--color-primary);
}
.t63-section th[colspan="7"]::after{
    background-color: rgba(22,63,107,.25);
}
.t63-section .event-list>.event-empty{
    background-color: rgba(22,63,107,.25);
    border-color: var(--color-primary);
}
.t63-section .event-list>.event-empty>p{
    color: var(--color-primary);
}
/* ----------- /evocalendar ----------- */