:root {
    --scrollbarBG: transparent;
    --thumbBG: #e4e4e4;
    --thumbBG-hover: #90a4ae;

    --bg-main: #fff;
    --bg-sidebar: linear-gradient(180deg, #09736A 0%, #76D9B9 100%);
    --color-main: #09736A;
    --color-main-50: rgba(9, 115, 106, .5);
    --color-main-two: #15AB89;
    --color-main-two-50: rgba(21, 171, 137, .5);
    --color-main-two-80: rgba(21, 171, 137, 0.8);
    --color-grey: #f5f5f7;
    --color-grey-80: rgba(209, 209, 209, 0.8);
    --color-grey-50: rgba(5, 5, 7, 0.5);
    --color-soft-grey: rgb(134, 134, 134);
    --color-black: #202020;
    --color-black-50: rgba(0, 0, 0, 0.5);
    --color-white: #ffffff;
    --color-white-50: rgba(255, 255, 255, 0.5);

    --category-color-main: #fff;
    --category-color-black: rgb(44, 44, 44);

    --category-bg-main: #f5f5f7;
    --category-bg-games: #d65658;
    --category-bg-songs: #7d6da1;
    --category-bg-lets-learn: #F29F05;
    --category-bg-worksheets: #0f8aa6;
    --category-bg-interactives: #6ec64d;
    --category-bg-book-presentations: #69a1ec;
    --category-bg-materials: #d99b66;
    --category-bg-teaching-tips: #8c5946;
    --category-bg-crafts: #4ad9d9;
    --category-bg-flashcards: #f18e1c;

    --color-mobile-menu-logo: #fdfdfd;
    --color-mobile-menu-toggler-border: #6682a1;
    --color-mobile-menu-toggler-bg: #e3e3e3;
    --color-mobile-menu-icon: #fdfdfd;
    --color-mobile-menu-text: #fdfdfd;
    --color-mobile-menu-dropdown-bg: #fff;
    --color-mobile-top-border: #fdfdfd;

    --color-widescreen-menu-logo: #fdfdfd;
    --color-widescreen-menu-icon: #fdfdfd;
    --color-widescreen-menu-icon-80: rgba(253, 253, 253, .8);
    --color-widescreen-menu-dropdown-bg: #efefef;
    --color-widescreen-menu-dropdown-text: #09736A;
    --color-widescreen-menu-copyright: rgba(253, 253, 253, 1);
    --color-widescreen-menu-copyright-50: rgba(253, 253, 253, .5);

    --color-sidebar-border: #76D9B9;
    --color-loading-bar: #09736A;
}

/* button color */
.btn-bg-main {
    background: var(--color-main);
}

.btn-bg-orange {
    background: #ff6d00;
}

.btn-bg-soft-orange {
    background: #ef9021;
}

.btn-bg-blue {
    background: #15AB89;
}

.btn-bg-soft-blue {
    background: #ef7066;
}

.btn-bg-green {
    background: #1bb08a;
}

.instagram-color-gradient-text {
    -webkit-text-fill-color: white !important;
}

body {
    background-color: #d2e1e2 !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    background-attachment: fixed;
}

@media (min-width: 992px) {
    body {
        background-position: 170px bottom;
    }

    #sideNav {
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: left top !important;
    }
}

.home--content .content--welcome-message,
.right--sidebar .box--ataturk,
.home--content .content--announcement,
.home--content .select--your-selection,
.courses--list .courses--box,
.right--sidebar .box--random-and-statistics .box--random,
.right--sidebar .box--random-and-statistics .box--statistics,
.category--content .category--header,
.category--detail-content .category--detail-header,
.unit--content .unit--header,
.unit--content .unit--box {
    background-image: url("../../images/background/wrapper/ramadan-bg.png") !important;
    background-color: #ffffff;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

.page--title.title--color-main-50,
.home--content .select--your-selection .select--your-box-content .select--box a,
.right--sidebar .box--random-and-statistics .title {
    color: var(--color-main) !important;
}

.courses--list .courses--box .text .breadcrumbs-link a {
    opacity: .5;
    transition: 300ms all !important;
}

.courses--list .courses--box .text .breadcrumbs-link a:hover {
    opacity: 1;
}

.courses--list .courses--box .text .breadcrumbs-link a {
    color: #686868 !important;
}

.home--content .select--your-selection .select--your-box-content .select--box {
    background: #efefef !important;
    transition: 300ms all !important;
}

.right--sidebar .box--random-and-statistics .box--random .random-grade .random-grade-detail a.active,
.home--content .select--your-selection .select--your-box-content .select--box:hover {
    background: var(--color-main) !important;
}

.home--content .select--your-selection .select--your-box-content .select--box:hover a {
    color: #ffffff !important;
}

.category--content .category--box:hover {
    background: var(--color-main) !important;
    transition: all 300ms !important;
}

.category--content .category--box {
    background: var(--color-main-two) !important;
}

.category--content .category--box .category--total {
    color: var(--color-main-two) !important;
}

.theme-switch-wrapper-mobile label span {
    color: var(--color-main) !important;
}

.cookie-banner>div .actions {
    background: var(--color-main) !important;
}