:root {
    --color-primary: #2f57ef;
    --color-secondary: #b966e7;
    --color-coral: #F2827A;
    --color-violet: #800080;
    --color-pink: #DB7093;
    --color-darker: #192335;
    --color-white-dark: #D9D9D9;
    --gradient-dark: linear-gradient(90deg, #2f57efbf 0%, #c586eeab 100%);
    --gradient-dark-2: linear-gradient(90deg, #2f57ef7d 0%, #c586ee52 100%);
    --color-primary-100: #323F92;
    --color-heading: #192335;
    --color-body: #6b7385;
    --color-white: #ffffff;
    --color-white-off: #FFFFFFAB;
    --color-bodyest: #273041;
    --color-bodyest-2: #324059b3;
    --color-bodyest-opacity: #2730415e;
    --color-dark: #27272E;
    --color-darkest: #232d40;
    --color-black: #111113;
    --color-grey: rgba(207, 207, 207, .24);
    --color-grey2: #f4f5f7;
    --color-gray: #A1A9AC;
    --color-gray-light: #F6F6F6;
    --color-gray-lighter: #ebebeb;
    --color-light: #F5F7FA;
    --color-lighter: #F2F5F9;
    --primary-opacity: #2f57ef21;
    --secondary-opacity: #b966e721;
    --coral-opacity: #F2827A21;
    --violet-opacity: #80008021;
    --pink-opacity: #DB709321;
    --white-opacity: #ffffff21;
    --danger-opacity: #FF000310;
    --warning-opacity: #FF8F3C10;
    --success-opacity: #3EB75E10;
    --black-opacity: rgba(0, 0, 0, 0.04);
    --heading-opacity: #19233550;
    --color-card-1: #fffccf;
    --color-card-2: #ffedff;
    --color-card-3: #ffe8eb;
    --color-card-4: #e9f6ff;
    --color-card-5: #5024D1;
    --color-card-6: #3B3B46;
    --color-success: #3EB75E;
    --color-danger: #FF0003;
    --color-warning: #FF8F3C;
    --color-info: #1BA2DB;
    --color-primary-alt: #D1EBE6;
    --color-primary-light: #f1f7ff;
    --color-primary-lighter: #EEEEFF;
    --color-secondary-alt: #fef4f4;
    --dark-color-border: #ffffff1a;
    --dark-color-border-2: #474F5D;
    --color-extra: rgb(249, 249, 255);
    --color-extra2: #F9F9FF;
    --color-border: #e6e3f1;
    --color-border-2: #e6e3f14f;
    --bs-border-color: #dee2e6;
    --color-badge-1: #303F5B;
    --color-badge-2: #F2C94C;
    --color-facebook: #3B5997;
    --color-twitter: #1BA1F2;
    --color-youtube: #ED4141;
    --color-linkedin: #0077B5;
    --color-pinterest: #E60022;
    --color-instagram: #C231A1;
    --color-vimeo: #00ADEF;
    --color-twitch: #6441A3;
    --color-discord: #7289da;
    --radius-10: 10px;
    --radius-big: 16px;
    --radius-small: 6px;
    --border-width: 2px;
    --radius: 6px;
    --f-light: 300;
    --f-regular: 400;
    --f-medium: 500;
    --f-semi-bold: 600;
    --f-bold: 700;
    --f-extra-bold: 800;
    --f-black: 900;
    --dark-shadow-1: 0px 4px 26px 0px rgba(2, 5, 17, 0.14);
    --dark-shadow-2: 0px 4px 52px 0px rgba(2, 5, 17, 0.15);
    --dark-shadow-3: 0px 4px 52px 0px rgba(2, 5, 17, 0.20);
    --dark-shadow-4: 0px 4px 52px rgba(2, 5, 17, 0.20);
    --dark-shadow-5: 0px 4px 27.9px rgba(47, 87, 239, 0.15);
    --shadow-primary: 0px 4px 10px rgba(37, 47, 63, 0.1);
    --shadow-light: 0 2px 6px 0 rgba(0, 0, 0, 0.05);
    --shadow-dark: 0 2px 6px 0 rgba(0, 0, 0, 0.2);
    --shadow-1: 0px 6px 34px rgba(215, 216, 222, 0.41);
    --shadow-slide-item: 0px 0 10px 0 rgba(215, 216, 222, 0.20);
    --shadow-2: 0 15px 34px 0 rgba(175, 181, 204, 0.32);
    --shadow-3: 0 5px 15px 0 rgba(85, 74, 101, 0.37);
    --shadow-5: 0px 20px 70px 0px rgba(0, 0, 0, 0.1);
    --shadow-7: 0px 15px 30px -2px rgba(0, 0, 0, 0.1);
    --shadow-8: -5px 18px 60px 0 rgba(210, 210, 234, 0.4);
    --shadow-9: 0 13px 48px 0 rgba(215, 216, 222, 0.44);
    --shadow-10: 0 13px 14px 0 rgba(129, 104, 145, 0.05);
    --shadow-11: 0 0 10px 0 rgba(0, 0, 0, 0.06);
    --transition: 0.3s;
    --transition-2: 256ms ease-in-out;
    --transition-3: transform .85s cubic-bezier(.23, 1, .32, 1), background .3s, border .3s, border-radius .3s, box-shadow .3s;
    --transition-4: all .25s cubic-bezier(.645, .045, .355, 1);
    --font-primary: "Noto Sans";
    --font-secondary: "Noto Sans";
    --font-alt: "Source Serif Pro", serif;
    --font-size-b1: 24px;
    --font-size-b2: 18px;
    --font-size-b3: 16px;
    --font-size-b4: 12px;
    --line-height-b1: 1.5;
    --line-height-b2: 1.67;
    --line-height-b3: 1.67;
    --line-height-b4: 1;
    --h1: 52px;
    --h2: 44px;
    --h3: 34px;
    --h4: 30px;
    --h5: 20px;
    --h6: 16px;
    --div-gap-1: 10px;
    --gradient-1: linear-gradient(rgb(255, 255, 255) 0%, rgb(239, 241, 255) 100%);
    --gradient-4: linear-gradient(180deg, #fff, #f6f9ff);
    --gradient-2: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(240, 242, 255) 100%);
    --gradient-3: linear-gradient(90deg, #8DA9FC 0%, #B48DD5 100%);
    --gradient-4: linear-gradient(180deg, #EFF1FF 0%, #FFFFFF 100%);
    --gradient-5: linear-gradient(rgb(239, 241, 255) 0%, rgb(239, 241, 255) 100%);
    --gradient-6: linear-gradient(to right, rgba(255, 255, 255, 0.15), rgba(251, 199, 226, 0.15), rgba(220, 217, 254, 0.15));
    --gradient-7: linear-gradient(218.15deg, var(--color-secondary) 0%, var(--color-primary) 100%);
    --gradient-8: linear-gradient(270deg, #9e77ff 0%, #4460ff 100%);
    --gradient-9: linear-gradient(180deg, #6827FF 0%, #E3F0FF 100%);
    --gradient-10: linear-gradient(180deg, #353e54d9 0%, #27304117 100%);
}
.course-box {
    box-shadow: rgba(6, 24, 44, 0.4) 0px 0px 0px 2px, rgba(6, 24, 44, 0.65) 0px 4px 6px -1px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset;
    border-radius: 6px;
    width: 100%;
    height: 100%;
}
.course-box .session-num {
    width: 24px;
    height: 24px;
    border: solid 1px rgba(6, 24, 44, 0.4);
    border-radius: 12px;
    display: inline-block;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.breadcrumb-container {
    background-image: linear-gradient(to bottom,#F6F6F6, #e7ecee);
    height: 3rem;
    padding-top: 0.7rem;
}
/*------------------------------
    Rbt Theme Gradient
-------------------------------*/
.theme-gradient {
    background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.001);
}

.rbt-accordion-style .card .card-header button[aria-expanded=true]::before {
    background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.001);
    white-space: nowrap;
}

.theme-gradient.new-big-heading-gradient {
    background: linear-gradient(180deg, rgb(228, 226, 250) 0%, rgba(57, 78, 244, 0.03) 80%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.001);
    white-space: nowrap;
}

.rbt-gradient-border {
    background: linear-gradient(-145deg, #CFA2E8, #637FEA) !important;
    z-index: 10;
}
.rbt-gradient-border::before {
    content: "";
    z-index: -1;
    top: 3px;
    left: 3px;
    position: absolute;
    background: #fff;
    width: calc(100% - 6px);
    height: calc(100% - 6px);
    border-radius: var(--radius);
}
/*---------------------------------------
    One Page Navigation Inner Section
------------------------------------------*/
.rbt-inner-onepage-navigation {
    border-radius: 500px;
    background: var(--color-white);
    overflow: hidden;
    box-shadow: var(--shadow-1);
    padding: 7px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-inner-onepage-navigation {
        padding: 0;
        border-radius: 10px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-inner-onepage-navigation {
        padding: 0;
        border-radius: 10px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-inner-onepage-navigation {
        padding: 0;
        border-radius: 10px;
    }
}
@media only screen and (max-width: 575px) {
    .rbt-inner-onepage-navigation {
        position: static;
    }
}
.rbt-inner-onepage-navigation .mainmenu-nav .mainmenu {
    display: flex;
    padding: 0;
    justify-content: space-between;
    margin: -3px;
    flex-wrap: wrap;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-inner-onepage-navigation .mainmenu-nav .mainmenu {
        padding: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-inner-onepage-navigation .mainmenu-nav .mainmenu {
        padding: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-inner-onepage-navigation .mainmenu-nav .mainmenu {
        padding: 17px;
    }
}
.rbt-inner-onepage-navigation .mainmenu-nav .mainmenu li {
    margin-top: 0;
    margin-bottom: 0;
    position: relative;
    margin: 3px;
    flex-grow: 1;
    text-align: center;
}
.rbt-inner-onepage-navigation .mainmenu-nav .mainmenu li a {
    margin: 0;
    position: relative;
    display: block;
    color: var(--color-heading);
    z-index: 2;
    padding: 10px 25px;
    border-radius: 500px;
}
.rbt-inner-onepage-navigation .mainmenu-nav .mainmenu li a::after {
    position: absolute;
    content: "";
    left: 0;
    background: var(--black-opacity);
    width: 100%;
    height: 100%;
    bottom: 0;
    opacity: 1;
    transition: 0.4s;
    z-index: -1;
    border-radius: 500px;
}
.rbt-inner-onepage-navigation .mainmenu-nav .mainmenu li.current a, .rbt-inner-onepage-navigation .mainmenu-nav .mainmenu li:hover a {
    color: var(--color-white);
}
.rbt-inner-onepage-navigation .mainmenu-nav .mainmenu li.current a::after, .rbt-inner-onepage-navigation .mainmenu-nav .mainmenu li:hover a::after {
    width: 100%;
    opacity: 1;
    background: var(--color-primary);
}
.rbt-inner-onepage-navigation.version-02 {
    z-index: 11;
}
.rbt-inner-onepage-navigation.version-02 .mainmenu-nav .mainmenu li {
    flex-grow: 0;
}
/**************************************
	Elements Styles
***************************************/
/*===================
Button Area
====================*/
.rbt-button-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin: -10px;
}
.rbt-button-group a,
.rbt-button-group button {
    margin: 10px;
}

.disabled,
.rbt-btn:disabled,
fieldset:disabled {
    pointer-events: none !important;
    opacity: 0.65 !important;
}

.rbt-btn {
    padding: 0 26px;
    background: var(--color-primary);
    height: 60px;
    line-height: 60px;
    color: var(--color-white);
    font-size: 16px;
    letter-spacing: 0.5px;
    font-weight: 500;
    display: inline-block;
    position: relative;
    z-index: 1;
    transition: all 0.4s ease-in-out;
    border-radius: 6px;
    border: 0 none;
    outline: none;
    text-decoration: none;
}
@media only screen and (max-width: 575px) {
    .rbt-btn {
        padding: 0 20px;
        height: 52px;
        line-height: 52px;
    }
}
.rbt-btn.btn-secondary {
    background: var(--color-secondary);
}
.rbt-btn.btn-secondary:hover {
    background: var(--color-primary);
}
.rbt-btn.btn-coral {
    background: var(--color-coral);
}
.rbt-btn.btn-coral:hover {
    background: var(--color-primary);
}
.rbt-btn.btn-violet {
    background: var(--color-violet);
}
.rbt-btn.btn-violet:hover {
    background: var(--color-primary);
}
.rbt-btn.btn-pink {
    background: var(--color-pink);
}
.rbt-btn.btn-pink:hover {
    background: var(--color-primary);
}
.rbt-btn.btn-white {
    box-shadow: var(--shadow-1);
    background: var(--color-white);
    color: var(--color-heading);
}
.rbt-btn.btn-white:hover {
    background: var(--color-primary);
    color: var(--color-white);
}
.rbt-btn.btn-border {
    background: transparent;
    border: 2px solid var(--color-border);
    color: var(--color-heading);
    line-height: 57px;
}
@media only screen and (max-width: 575px) {
    .rbt-btn.btn-border {
        line-height: 48px;
    }
}
.rbt-btn.btn-border:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}
.rbt-btn.btn-border.color-white-off {
    border-color: var(--color-border-2);
    color: var(--color-white-off);
}
.rbt-btn.btn-border.color-white-off:hover {
    border-color: var(--color-primary);
    color: var(--color-white);
}
.rbt-btn.btn-active {
    background: var(--color-primary);
    border: 2px solid transparent;
    color: var(--color-white);
}
.rbt-btn.btn-gradient {
    color: var(--color-white);
    background-size: 300% 100%;
    background-image: linear-gradient(to right, var(--color-primary), var(--color-secondary), var(--color-secondary), var(--color-primary));
}
.rbt-btn.btn-gradient.btn-gradient-2 {
    background-image: linear-gradient(to right, var(--color-pink), var(--color-violet), var(--color-violet), var(--color-pink));
}
.rbt-btn.btn-gradient.btn-gradient-3 {
    background-image: linear-gradient(to right, var(--color-secondary), var(--color-primary), var(--color-primary), var(--color-secondary));
}
.rbt-btn.btn-gradient:hover {
    background-color: inherit;
    background-position: 102% 0;
    transition: all 0.4s ease-in-out;
}
.rbt-btn.rbt-marquee-btn {
    overflow: hidden;
}
.rbt-btn.rbt-marquee-btn span {
    display: inline-flex;
    position: relative;
    z-index: 3;
    line-height: 1.2;
}
.rbt-btn.rbt-marquee-btn span::after {
    content: attr(data-text);
    position: absolute;
    white-space: nowrap;
    top: 50%;
    left: 100%;
    transform: translate(100%, -50%);
}
.rbt-btn.rbt-marquee-btn.marquee-text-y span::after {
    top: 100%;
    left: 50%;
    transform: translate(-50%, 100%);
}
.rbt-btn.rbt-marquee-btn.marquee-auto span {
    animation: btnTxtMarqueeX 2s linear infinite;
}
.rbt-btn.rbt-switch-btn {
    overflow: hidden;
}
.rbt-btn.rbt-switch-btn span {
    display: inline-flex;
    position: relative;
    z-index: 3;
    transition: opacity 0.65s, transform 0.85s;
    transition-timing-function: cubic-bezier(0.15, 0.85, 0.31, 1);
}
.rbt-btn.rbt-switch-btn span::after {
    content: attr(data-text);
    display: inline-block;
    position: absolute;
    white-space: nowrap;
    top: 50%;
    opacity: 0;
    transition: inherit;
    left: 100%;
    transform: translate(50%, -50%);
}
.rbt-btn.rbt-switch-btn.rbt-switch-y span::after {
    left: 50%;
    transform: translate(-50%, 100%);
}
.rbt-btn.icon-hover .btn-text {
    transition-timing-function: cubic-bezier(0, 0.71, 0.4, 1);
    display: inline-block;
    transition: transform 0.5s;
    transform: translateX(7px);
}
.rbt-btn.icon-hover .btn-icon {
    margin-inline-start: -7px;
    display: inline-block;
}
.rbt-btn.icon-hover .btn-icon i {
    transition-timing-function: cubic-bezier(0, 0.71, 0.4, 1);
    display: inline-block;
    opacity: 0;
    transform: translateX(-7px);
    transition: opacity 0.25s, transform 0.5s;
    padding-left: 0;
}
.rbt-btn.icon-hover.icon-hover-left .btn-text {
    transform: translateX(-7px);
}
.rbt-btn.icon-hover.icon-hover-left .btn-icon {
    margin-inline-start: 0;
    margin-inline-end: -7px;
}
.rbt-btn.icon-hover.icon-hover-left .btn-icon i {
    transform: translateX(7px);
}
.rbt-btn.icon-hover.icon-hover-left:hover .btn-icon i {
    transform: translateX(-7px);
}
.rbt-btn.icon-hover.icon-hover-left:hover .btn-text {
    transform: translateX(7px);
}
.rbt-btn.hover-icon-reverse .icon-reverse-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}
.rbt-btn.hover-icon-reverse .btn-text {
    display: inline-block;
    transition: transform 0.6s 0.125s cubic-bezier(0.1, 0.75, 0.25, 1);
    margin-inline-start: -23px;
}
.rbt-btn.hover-icon-reverse .btn-icon {
    display: inline-block;
    transition: opacity 0.4s 0.25s, transform 0.6s 0.25s;
    transition-timing-function: cubic-bezier(0.1, 0.75, 0.25, 1);
}
.rbt-btn.hover-icon-reverse .btn-icon + .btn-icon {
    margin-inline-end: 0;
    margin-inline-start: 8px;
    display: inline-block;
    margin-inline-start: 0;
    margin-inline-end: 0;
    opacity: 0;
    transform: translateX(-10px);
    transition-delay: 0s;
    order: -2;
}
.rbt-btn.hover-icon-reverse .btn-icon + .btn-icon i {
    padding-left: 0;
    padding-right: 6px;
}
.rbt-btn.rounded-player {
    border-radius: 100%;
    width: 100px;
    height: 100px;
    padding: 0;
    line-height: 100px;
    display: inline-block;
    position: relative;
}
@media only screen and (max-width: 767px) {
    .rbt-btn.rounded-player {
        width: 70px;
        height: 70px;
        line-height: 70px;
    }
}
.rbt-btn.rounded-player span {
    display: inline-block;
}
.rbt-btn.rounded-player span i {
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 30px;
}
.rbt-btn.rounded-player.border {
    background-image: inherit;
    border-color: var(--color-white) !important;
    border-width: 2px !important;
}
.rbt-btn.rounded-player.border:hover {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary) !important;
}
.rbt-btn.rounded-player.sm-size {
    width: 70px;
    height: 70px;
    line-height: 70px;
}
.rbt-btn.rounded-player:focus {
    outline: none;
    color: var(--color-white);
}
.rbt-btn.rounded-player:hover {
    transform: scale(1.1);
    background: var(--color-primary);
}
.rbt-btn.border-rounded {
    border: 2px solid var(--color-white);
}
.rbt-btn.rounded-player-2 {
    border: 0;
    width: 80px;
    height: 80px;
    margin-left: -40px;
    margin-top: -40px;
    transition: all 1s cubic-bezier(0, 0, 0.2, 1);
    position: relative;
    border-radius: 100%;
    background: var(--color-white);
    margin: 0 auto;
    display: inline-block;
    padding: 0;
}
@media only screen and (max-width: 767px) {
    .rbt-btn.rounded-player-2 {
        width: 50px;
        height: 50px;
    }
}
@media only screen and (max-width: 575px) {
    .rbt-btn.rounded-player-2 {
        width: 40px;
        height: 40px;
        line-height: 40px;
    }
}
.rbt-btn.rounded-player-2 .play-icon {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.rbt-btn.rounded-player-2 .play-icon::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    transform: translate(-6px, -9px);
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-left: 15px solid var(--color-primary);
}
.rbt-btn.rounded-player-2.btn-large {
    width: 60px;
    height: 60px;
    margin-left: 0;
    margin-top: 0;
}
.rbt-btn.rounded-player-2.sm-size {
    width: 70px;
    height: 70px;
    line-height: 70px;
}
@media only screen and (max-width: 767px) {
    .rbt-btn.rounded-player-2.sm-size {
        width: 50px;
        height: 50px;
        line-height: 50px;
    }
}
.rbt-btn.rounded-player-2.btn-theme-color {
    background: var(--color-primary);
}
.rbt-btn.rounded-player-2.btn-theme-color::after {
    border-color: var(--color-primary);
}
.rbt-btn.rounded-player-2.btn-theme-color::before {
    border-color: var(--color-primary);
}
.rbt-btn.rounded-player-2.btn-theme-color .play-icon::before {
    border-left: 15px solid var(--color-white);
}
.rbt-btn.rounded-player-2.btn-theme-color:hover {
    color: inherit;
    background: var(--color-primary);
}
.rbt-btn.rounded-player-2:hover {
    color: inherit;
    background: var(--color-white);
}
.rbt-btn.rounded-player-2.bounced-btn {
    width: 100px;
    height: 100px;
    border: none !important;
}
.rbt-btn.rounded-player-2.bounced-btn::after {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    border-radius: 50%;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    border: 2px solid var(--color-white);
    transition: all 0.4s ease;
}
.rbt-btn.rounded-player-2.bounced-btn:hover::after {
    animation: roading-falgs 10s linear infinite;
    border: 2px dotted var(--color-primary);
}
.rbt-btn.with-animation::after, .rbt-btn.with-animation::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
    bottom: 0;
    left: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    border-radius: 50%;
    border: 1.5px solid var(--color-white);
}
.rbt-btn.with-animation::before {
    -webkit-animation: ripple 2s linear infinite;
    animation: ripple 2s linear infinite;
}
.rbt-btn.with-animation::after {
    -webkit-animation: ripple 2s linear 1s infinite;
    animation: ripple 2s linear 1s infinite;
}
.rbt-btn:hover {
    background-color: var(--color-secondary);
    color: var(--color-white);
    transform: translate3d(0, -2px, 0);
    box-shadow: var(--shadow-7);
}
.rbt-btn:hover.icon-hover .btn-text {
    transform: translateX(-7px);
}
.rbt-btn:hover.icon-hover .btn-icon i {
    opacity: 1;
    transform: translateX(7px);
}
.rbt-btn:hover.hover-icon-reverse .btn-text {
    transition-delay: 0.1s;
    transform: translateX(23px);
}
.rbt-btn:hover.hover-icon-reverse .btn-icon {
    opacity: 0;
    transition-delay: 0s;
    transform: translateX(10px);
}
.rbt-btn:hover.hover-icon-reverse .btn-icon + .btn-icon {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.225s;
}
.rbt-btn:hover.rbt-switch-btn span {
    transform: translateX(-200%);
}
.rbt-btn:hover.rbt-switch-btn span::after {
    opacity: 1;
    transform: translate(100%, -50%);
}
.rbt-btn:hover.rbt-switch-btn.rbt-switch-y span {
    transform: translateY(-200%);
}
.rbt-btn:hover.rbt-switch-btn.rbt-switch-y span::after {
    transform: translate(-50%, 150%);
}
.rbt-btn:hover.rbt-marquee-btn span {
    animation: btnTxtMarqueeX 2s linear infinite;
}
.rbt-btn:hover.rbt-marquee-btn.marquee-text-y span {
    animation: btnTxtMarqueeY 0.5s linear infinite;
}
.rbt-btn.btn-xs {
    padding: 0 14px;
    font-size: var(--font-size-b3);
    height: 30px;
    line-height: 29px;
    font-size: 14px;
}
.rbt-btn.btn-sm {
    padding: 0 22px;
    font-size: var(--font-size-b3);
    height: 45px;
    line-height: 43px;
}
@media only screen and (max-width: 767px) {
    .rbt-btn.btn-sm {
        padding: 0 10px;
    }
}
.rbt-btn.btn-md {
    padding: 0 25px;
    font-size: var(--font-size-b3);
    height: 50px;
    line-height: 48px;
}
@media only screen and (max-width: 767px) {
    .rbt-btn.btn-md {
        padding: 0 15px;
    }
}
.rbt-btn.btn-lg {
    height: 70px;
    line-height: 70px;
    padding: 0 35px;
    font-size: 18px;
}
@media only screen and (max-width: 767px) {
    .rbt-btn.btn-lg {
        padding: 0 17px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-btn.btn-lg.btn-mobile {
        height: 52px;
        line-height: 52px;
        font-size: 16px;
    }
}
.rbt-btn.btn-xl {
    padding: 0 45px;
    font-size: 20px;
    height: 75px;
    line-height: 75px;
}
@media only screen and (max-width: 767px) {
    .rbt-btn.btn-xl {
        padding: 0 20px;
        font-size: 16px;
        height: 55px;
        line-height: 55px;
    }
}
.rbt-btn.btn-xxl {
    padding: 0 60px;
    font-size: 22px;
    height: 100px;
    line-height: 100px;
}
@media only screen and (max-width: 767px) {
    .rbt-btn.btn-xxl {
        padding: 0 20px;
        font-size: 18px;
        height: 70px;
        line-height: 70px;
    }
}
.rbt-btn i {
    padding-left: 6px;
    display: inline-block;
    top: 2px;
    position: relative;
    font-size: 17px;
}
.rbt-btn i.image-icon {
    top: inherit;
    transition: 0.4s;
}
.rbt-btn.btn-border-gradient {
    background: linear-gradient(90deg, #CFA2E8, #637FEA);
    border: none;
    outline: none;
    cursor: pointer;
    position: relative;
    z-index: 10;
    color: var(--color-heading);
    box-shadow: 0 10px 13px 0 rgba(209, 211, 237, 0.39);
    border-radius: 0;
}
.rbt-btn.btn-border-gradient::before {
    content: "";
    z-index: -1;
    top: 3px;
    left: 3px;
    position: absolute;
    background: #fff;
    width: calc(100% - 6px);
    height: calc(100% - 6px);
}
.rbt-btn.btn-border-gradient.radius-round {
    border-radius: 500px;
}
.rbt-btn.btn-border-gradient.radius-round::before {
    border-radius: 500px;
}
.rbt-btn.hover-transform-none:hover {
    transform: none;
}

/*-------------------------------
    Button Bg Color Variation
--------------------------------*/
a.bg-primary-opacity:hover,
button.bg-primary-opacity:hover {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
}
a.bg-secondary-opacity:hover,
button.bg-secondary-opacity:hover {
    background: var(--color-secondary) !important;
    color: var(--color-white) !important;
}
a.bg-coral-opacity:hover,
button.bg-coral-opacity:hover {
    background: var(--color-coral) !important;
    color: var(--color-white) !important;
}
a.bg-violet-opacity:hover,
button.bg-violet-opacity:hover {
    background: var(--color-violet) !important;
    color: var(--color-white) !important;
}
a.bg-pink-opacity:hover,
button.bg-pink-opacity:hover {
    background: var(--color-pink) !important;
    color: var(--color-white) !important;
}

.bg-color-primary .rbt-btn:hover {
    background: var(--color-white);
    color: var(--color-primary);
}

@keyframes btnTxtMarqueeX {
    100% {
        transform: translateX(-200%);
    }
}
@keyframes btnTxtMarqueeY {
    100% {
        transform: translateY(-200%);
    }
}
a.btn-underline-gradient,
button.btn-underline-gradient {
    background-clip: text !important;
    -webkit-background-clip: text !important;
    text-fill-color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    background: linear-gradient(to right, var(--color-primary) 0%, var(--color-secondary) 100%);
    display: inline-block;
    font-size: 16px;
    letter-spacing: 0.5px;
    font-weight: 500;
    display: inline-block;
    position: relative;
    z-index: 1;
    transition: all 0.4s ease-in-out;
}
a.btn-underline-gradient::before, a.btn-underline-gradient::after,
button.btn-underline-gradient::before,
button.btn-underline-gradient::after {
    background: linear-gradient(to right, var(--color-primary) 0%, var(--color-secondary) 100%);
    content: "";
    display: inline-block;
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
}
a.btn-underline-gradient::after,
button.btn-underline-gradient::after {
    background: linear-gradient(to right, var(--color-heading) 0%, var(--color-heading) 100%);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transform: scaleX(0);
    transform-origin: right center;
}
a.btn-underline-gradient:hover::after,
button.btn-underline-gradient:hover::after {
    transform-origin: left center;
    transform: scaleX(1);
}

/*-----------------------
    Modern Button
------------------------*/
a.rbt-moderbt-btn {
    position: relative;
    height: 60px;
    line-height: 56px;
    transition: all 0.2s ease;
    padding: 0 26px;
    display: inline-block;
    z-index: 1;
    color: var(--color-heading);
}
@media only screen and (max-width: 767px) {
    a.rbt-moderbt-btn {
        padding: 0 10px;
    }
}
a.rbt-moderbt-btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    border-radius: 28px;
    background: var(--color-primary);
    opacity: 0.5;
    width: 56px;
    height: 56px;
    transition: all 0.3s ease;
    z-index: -1;
}
a.rbt-moderbt-btn i {
    position: relative;
    top: 2px;
    margin-left: 10px;
    transform: translateX(-5px);
    transition: all 0.3s ease;
    display: inline-block;
}
a.rbt-moderbt-btn:hover {
    color: var(--color-white);
}
a.rbt-moderbt-btn:hover i {
    transform: translateX(0);
}
a.rbt-moderbt-btn:hover::before {
    width: 100%;
    background: var(--color-primary);
    opacity: 1;
}

/*----------------------------------
    Education Transparent Button
------------------------------------*/
a.rbt-btn-link,
button.rbt-btn-link,
span.rbt-btn-link {
    color: var(--color-heading);
    position: relative;
    transition: 0.3s;
    font-size: 14px;
    font-weight: 500;
    display: inline-block;
}
a.rbt-btn-link i,
button.rbt-btn-link i,
span.rbt-btn-link i {
    position: relative;
    top: 1px;
    display: inline-block;
    padding-left: 4px;
}
a.rbt-btn-link::after,
button.rbt-btn-link::after,
span.rbt-btn-link::after {
    position: absolute;
    content: "";
    left: auto;
    bottom: 0;
    background: currentColor;
    width: 0;
    height: 2px;
    transition: 0.3s;
    right: 0;
}
a.rbt-btn-link:hover,
button.rbt-btn-link:hover,
span.rbt-btn-link:hover {
    color: var(--color-primary) !important;
}
a.rbt-btn-link:hover::after,
button.rbt-btn-link:hover::after,
span.rbt-btn-link:hover::after {
    width: 100%;
    left: 0;
    right: auto;
}
a.rbt-btn-link.left-icon i,
button.rbt-btn-link.left-icon i,
span.rbt-btn-link.left-icon i {
    padding-left: 0;
    padding-right: 4px;
}
a.rbt-btn-link.color-white:hover,
button.rbt-btn-link.color-white:hover,
span.rbt-btn-link.color-white:hover {
    color: var(--color-white) !important;
}
a.transparent-button,
button.transparent-button,
span.transparent-button {
    color: var(--color-heading);
    position: relative;
    transition: 0.3s;
    font-size: 14px;
    font-weight: 500;
}
a.transparent-button i,
button.transparent-button i,
span.transparent-button i {
    display: inline-block;
    padding-left: 4px;
    transition: 0.4s;
}
a.transparent-button:hover i,
button.transparent-button:hover i,
span.transparent-button:hover i {
    padding-left: 10px;
}

/*-----------------------
 Video Player Button
-------------------------*/
.video-popup-wrapper {
    position: relative;
}
.video-popup-wrapper .position-to-top {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
}
.video-popup-wrapper .rbt-btn.rounded-player:hover {
    transform: translate(-50%, -50%) scale(1.1);
}
.video-popup-wrapper.version-02 .v-shape-1 {
    position: absolute;
    left: -20px;
    bottom: -14px;
}
.video-popup-wrapper.version-02 .v-shape-1.style-02 {
    left: -38px;
    bottom: -30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px), only screen and (max-width: 575px) {
    .video-popup-wrapper.version-02 .v-shape-1.style-02 {
        display: none;
    }
}
.video-popup-wrapper.version-02 .feature-1 {
    position: absolute;
    top: 162px;
    left: -80px;
    min-width: 152px;
    max-width: 200px;
    background: rgba(255, 255, 255, 0.7);
    border: 2px solid var(--color-white);
    box-shadow: 0px 7px 40.9px rgba(47, 87, 239, 0.11);
    backdrop-filter: blur(7.15px);
    border-radius: var(--radius-big);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 20px;
}
@media only screen and (min-width: 1200px) and (max-width: 1599px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px) {
    .video-popup-wrapper.version-02 .feature-1 {
        left: -15px;
    }
}
@media only screen and (max-width: 575px) {
    .video-popup-wrapper.version-02 .feature-1 {
        display: none;
    }
}
.video-popup-wrapper.version-02 .feature-1 .number {
    font-weight: var(--f-semi-bold);
    font-size: var(--h5);
    line-height: 25px;
    color: var(--color-darker);
    margin-bottom: 0;
}
.video-popup-wrapper.version-02 .feature-1 .subtitle {
    font-weight: var(--f-medium);
    font-size: 14px;
    line-height: 20px;
    color: var(--color-body);
    margin-bottom: 0;
}
.video-popup-wrapper.version-02 .rbt-btn.btn-white {
    background: rgba(255, 255, 255, 0.3);
    border: 2px solid var(--color-white);
    backdrop-filter: blur(4.65px);
}
@media only screen and (max-width: 767px) {
    .video-popup-wrapper.version-02 .rbt-btn.btn-white {
        width: 60px;
        height: 60px;
    }
}
@media only screen and (max-width: 575px) {
    .video-popup-wrapper.version-02 .rbt-btn.btn-white {
        width: 60px;
        height: 60px;
        line-height: 60px;
    }
}
.video-popup-wrapper.version-02 .rbt-btn.btn-white .play-icon::before {
    border-left-color: var(--color-white);
    transition: var(--transition);
}
.video-popup-wrapper.version-02 .rbt-btn.btn-white:hover .play-icon::before {
    border-left-color: var(--color-primary);
}

@keyframes ripple {
    0% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        opacity: 1;
    }
    75% {
        -webkit-transform: scale(1.9);
        transform: scale(1.9);
        opacity: 0.5;
    }
    100% {
        -webkit-transform: scale(2.3);
        transform: scale(2.3);
        opacity: 0;
    }
}
@-webkit-keyframes btnIconRipple {
    0% {
        border-width: 4px;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    80% {
        border-width: 1px;
        -webkit-transform: scale(1.35);
        transform: scale(1.35);
    }
    100% {
        opacity: 0;
    }
}
@keyframes btnIconRipple {
    0% {
        border-width: 4px;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    80% {
        border-width: 1px;
        -webkit-transform: scale(1.35);
        transform: scale(1.35);
    }
    100% {
        opacity: 0;
    }
}
.btn-round-white-opacity {
    padding: 0;
    border: 0 none;
    background: var(--white-opacity);
    width: 35px;
    height: 35px;
    border-radius: 100%;
    color: #fff;
    font-size: 16px;
    line-height: 37px;
}

/*--------------------------
    Section Title
---------------------------*/
.rbt-new-badge {
    position: relative;
    display: inline-block;
    z-index: 1;
}
.rbt-new-badge.rbt-new-badge-one {
    color: var(--color-heading);
    font-size: 16px;
    font-weight: var(--f-medium);
    line-height: 1;
    padding: 19px 24px 21px 20px;
    box-shadow: 0 15px 40px rgba(210, 211, 226, 0.631372549);
    background: #fff;
    border-radius: 4px;
}
@media only screen and (max-width: 767px) {
    .rbt-new-badge.rbt-new-badge-one {
        font-size: 14px;
        padding: 18px 10px 18px 10px;
    }
}
.rbt-new-badge.rbt-new-badge-one:before {
    position: absolute;
    top: 50%;
    right: -19px;
    left: -19px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 45px;
    width: -moz-calc(100% + 38px);
    width: calc(100% + 38px);
    background: rgba(255, 255, 255, 0.5);
    -webkit-box-shadow: 0 0 29px rgba(209, 211, 237, 0.3882352941);
    box-shadow: 0 0 29px rgba(209, 211, 237, 0.3882352941);
    z-index: -1;
    content: "";
    -webkit-clip-path: polygon(100% 0, 97% 50%, 100% 100%, 0 100%, 3% 50%, 0 0);
    clip-path: polygon(100% 0, 97% 50%, 100% 100%, 0 100%, 3% 50%, 0 0);
}

.section-title .subtitle {
    font-size: 14px;
    line-height: 15px;
    font-weight: 500;
    color: var(--color-heading);
    margin-bottom: 15px;
    display: inline-block;
    padding: 10px 20px;
    border-radius: 100px;
    text-transform: uppercase;
    display: inline-block;
    background: var(--color-primary);
    color: var(--color-primary);
}
.section-title .subtitle-2 {
    margin-bottom: 20px;
    display: inline-block;
}
.section-title .title {
    margin-bottom: 0;
}
.section-title.text-center .description {
    padding: 0 23%;
    letter-spacing: -0.5px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .section-title.text-center .description {
        padding: 0 10%;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title.text-center .description {
        padding: 0;
    }
}
@media only screen and (max-width: 767px) {
    .section-title.text-center .description {
        padding: 0;
    }
}
.section-title.text-center .description.has-medium-font-size {
    padding: 0 23%;
    letter-spacing: -0.5px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .section-title.text-center .description.has-medium-font-size {
        padding: 0 10%;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title.text-center .description.has-medium-font-size {
        padding: 0 10%;
    }
}
@media only screen and (max-width: 767px) {
    .section-title.text-center .description.has-medium-font-size {
        padding: 0;
    }
}
.section-title.text-xl-start .description {
    padding: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .section-title.text-xl-start .description {
        padding: 0;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title.text-xl-start .description {
        padding: 0;
    }
}
@media only screen and (max-width: 767px) {
    .section-title.text-xl-start .description {
        padding: 0;
    }
}

.section-title-2 .title {
    color: var(--color-darker);
    font-size: 80px;
    font-weight: var(--f-semi-bold);
    line-height: 125%;
    letter-spacing: -0.03em;
    margin-bottom: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .section-title-2 .title {
        font-size: 70px;
    }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .section-title-2 .title {
        font-size: 54px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title-2 .title {
        font-size: 48px;
    }
}
@media only screen and (max-width: 767px) {
    .section-title-2 .title {
        font-size: 42px;
    }
}
@media only screen and (max-width: 575px) {
    .section-title-2 .title {
        font-size: 32px;
    }
}
.section-title-2.with-shape {
    position: relative;
    max-width: 1167px;
    margin: 0 auto;
}
.section-title-2.with-shape .shape-1 {
    position: absolute;
    top: -53px;
    left: 32%;
    z-index: -1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .section-title-2.with-shape .shape-1 {
        max-width: 210px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title-2.with-shape .shape-1 {
        max-width: 180px;
    }
}
@media only screen and (max-width: 767px) {
    .section-title-2.with-shape .shape-1 {
        max-width: 150px;
    }
}
@media only screen and (max-width: 575px) {
    .section-title-2.with-shape .shape-1 {
        max-width: 120px;
    }
}

.select-label,
.rbt-label-style {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.5;
    margin-bottom: 6px;
}

.rbt-title-style-2 {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.5;
    margin-bottom: 0;
}

.rbt-title-style-3 {
    margin-bottom: 24px;
    font-size: 20px;
    padding-bottom: 20px;
    border-bottom: 2px solid var(--color-border-2);
}

.rbt-short-title {
    font-size: 12px;
    padding-bottom: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.5;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--color-border);
}
.rbt-border-with-box {
    padding: 30px;
    border-radius: var(--radius);
    background: var(--color-white);
    overflow: hidden;
    border: 1px solid var(--color-border);
}
@media only screen and (max-width: 767px) {
    .rbt-border-with-box {
        padding: 15px;
    }
}

.rbt-card {
    overflow: hidden;
    box-shadow: var(--shadow-1);
    padding: 30px;
    border-radius: var(--radius);
    background: var(--color-white);
    position: relative;
    height: 100%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card {
        padding: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card {
        padding: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card {
        padding: 15px;
    }
}
.rbt-card .rbt-card-img {
    position: relative;
}
.rbt-card .rbt-card-img a {
    display: block;
}
.rbt-card .rbt-card-img a img {
    width: 100%;
    transition: 0.5s;
    object-fit: cover;
    border-radius: var(--radius);
}
.rbt-card .rbt-card-body {
    padding-top: 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card .rbt-card-body {
        padding-top: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card .rbt-card-body {
        padding-top: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card .rbt-card-body {
        padding-top: 20px;
    }
}
.rbt-card .rbt-card-body .rbt-meta {
    margin-bottom: 14px;
}
@media only screen and (max-width: 767px) {
    .rbt-card .rbt-card-body .rbt-meta {
        margin-bottom: 8px;
    }
}
.rbt-card .rbt-card-body .rbt-category {
    margin-bottom: 15px;
}
.rbt-card .rbt-card-body .lesson-number {
    margin-bottom: 15px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card .rbt-card-body .lesson-number {
        margin-bottom: 8px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card .rbt-card-body .lesson-number {
        margin-bottom: 8px;
    }
}
.rbt-card .rbt-card-body .rbt-card-title {
    margin-bottom: 10px;
}
.rbt-card .rbt-card-body .rbt-card-title a {
    color: var(--color-heading);
}
.rbt-card .rbt-card-body .rbt-card-title a:hover {
    color: var(--color-primary);
}
.rbt-card .rbt-card-body .rbt-card-title {
    font-size: 26px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card .rbt-card-body .rbt-card-title {
        font-size: 22px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card .rbt-card-body .rbt-card-title {
        font-size: 22px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card .rbt-card-body .rbt-card-title {
        font-size: 20px;
    }
}
@media only screen and (max-width: 575px) {
    .rbt-card .rbt-card-body .rbt-card-title {
        font-size: 18px;
    }
}
.rbt-card .rbt-card-body .rbt-card-text {
    color: var(--color-body);
    margin-bottom: 20px;
}
@media only screen and (max-width: 1199px) {
    .rbt-card .rbt-card-body .rbt-card-text {
        margin-bottom: 14px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card .rbt-card-body .rbt-card-text {
        margin-bottom: 10px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
@media only screen and (max-width: 1199px) {
    .rbt-card .rbt-card-body .rbt-author-meta {
        margin-bottom: 10px !important;
    }
}
.rbt-card .rbt-card-body .rbt-review {
    margin-bottom: 12px;
}
.rbt-card .rbt-card-body .rbt-card-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
.rbt-card .rbt-card-body .rbt-card-bottom .rbt-btn-link {
    font-size: 14px;
}
.rbt-card .rbt-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
    margin-top: -10px;
}
@media only screen and (max-width: 767px) {
    .rbt-card .rbt-card-top {
        margin-bottom: 10px;
        margin-top: 0;
    }
}
.rbt-card .rbt-card-top .rbt-review {
    margin-bottom: 0;
}
.rbt-card.variation-02 {
    position: relative;
    padding: 0;
    border-radius: var(--radius);
    box-shadow: var(--shadow-1);
}
.rbt-card.variation-02 .rbt-card-body {
    padding: 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.variation-02 .rbt-card-body {
        padding: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.variation-02 .rbt-card-body {
        padding: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.variation-02 .rbt-card-body {
        padding: 20px;
    }
}
.rbt-card.variation-02 .rbt-card-img a img {
    max-height: 350px;
    border-radius: 6px 6px 0 0;
}
.rbt-card.height-auto .rbt-card-img a img {
    max-height: inherit !important;
}
.rbt-card.card-minimal {
    box-shadow: var(--shadow-9);
}
.rbt-card.card-minimal .rbt-card-body {
    padding: 50px 40px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.card-minimal .rbt-card-body {
        padding: 40px 30px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.card-minimal .rbt-card-body {
        padding: 40px 30px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-minimal .rbt-card-body {
        padding: 20px;
    }
}
.rbt-card.variation-03 {
    height: 100%;
}
.rbt-card.variation-03 .rbt-card-img .thumbnail-link {
    position: relative;
    display: block;
}
.rbt-card.variation-03 .rbt-card-img .thumbnail-link::before {
    position: absolute;
    content: "";
    background: rgba(111, 120, 148, 0.54);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: var(--transition-2);
    opacity: 0;
    border-radius: var(--radius);
}
.rbt-card.variation-03 .rbt-card-img .thumbnail-link .rbt-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: 50px;
    transition: 0.4s;
    opacity: 0;
    width: max-content;
}
.rbt-card.variation-03 .rbt-card-body {
    display: flex;
}
@media only screen and (max-width: 767px) {
    .rbt-card.variation-03 .rbt-card-body {
        padding-top: 15px;
    }
}
.rbt-card.variation-03 .rbt-card-body .rbt-card-title {
    flex-basis: 80%;
    margin: 0;
    text-transform: capitalize;
}
@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .rbt-card.variation-03 .rbt-card-body .rbt-card-title {
        font-size: 22px;
    }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.variation-03 .rbt-card-body .rbt-card-title {
        flex-basis: 90%;
        font-size: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.variation-03 .rbt-card-body .rbt-card-title {
        flex-basis: 90%;
        font-size: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.variation-03 .rbt-card-body .rbt-card-title {
        flex-basis: 90%;
        font-size: 20px;
    }
}
.rbt-card.variation-03 .rbt-card-body .rbt-card-bottom {
    flex-basis: 20%;
    display: flex;
    justify-content: flex-end;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.variation-03 .rbt-card-body .rbt-card-bottom {
        flex-basis: 10%;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.variation-03 .rbt-card-body .rbt-card-bottom {
        flex-basis: 10%;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.variation-03 .rbt-card-body .rbt-card-bottom {
        flex-basis: 10%;
    }
}
.rbt-card.variation-03 .card-information {
    display: flex;
    align-items: center;
    margin-top: 10px;
}
.rbt-card.variation-03 .card-information img {
    border-radius: 50%;
    width: 24px;
    height: 24px;
    border: 2px solid var(--color-border);
    object-fit: cover;
}
.rbt-card.variation-03 .card-information .card-count {
    padding-left: 10px;
}
.rbt-card.variation-03.program-image-large .card-information img {
    width: 40px;
    height: 40px;
}
.rbt-card.variation-03:hover .rbt-card-img .thumbnail-link::before {
    opacity: 1;
}
.rbt-card.variation-03:hover .rbt-card-img .thumbnail-link .rbt-btn {
    margin-top: 0;
    opacity: 1;
}
.rbt-card.variation-03.style_2 {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 12px;
    box-shadow: none;
    position: relative;
    padding: 50px 50px 40px 50px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.variation-03.style_2 {
        padding: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.variation-03.style_2 {
        padding: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.variation-03.style_2 {
        padding: 15px;
    }
}
.rbt-card.variation-03.style_2::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, #5163FF 0%, #FB64AD 100%);
    transition: all 0.3s ease;
    opacity: 0.2;
}
.rbt-card.variation-03.style_2::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 0;
    background: linear-gradient(90deg, rgba(47, 87, 239, 0.05) 0%, rgba(197, 134, 238, 0.05) 100%);
    width: 100%;
    height: calc(100% - 2px);
}
.rbt-card.variation-03.style_2 .rbt-card-body {
    display: block;
    padding-top: 0;
    margin-bottom: 28px;
    position: relative;
    z-index: 2;
}
.rbt-card.variation-03.style_2 .rbt-card-body .rbt-card-title {
    margin-bottom: 10px;
    font-size: 32px;
    font-weight: var(--f-medium);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.variation-03.style_2 .rbt-card-body .rbt-card-title {
        font-size: 28px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.variation-03.style_2 .rbt-card-body .rbt-card-title {
        font-size: 24px;
    }
}
@media only screen and (max-width: 575px) {
    .rbt-card.variation-03.style_2 .rbt-card-body .rbt-card-title {
        font-size: 22px;
    }
}
.rbt-card.variation-03.style_2 .rbt-card-body .rbt-card-text {
    font-size: 17px;
    margin-bottom: 0;
    white-space: wrap;
}
.rbt-card.variation-03.style_2:hover::after {
    opacity: 1;
}
.rbt-card.variation-03.style_2.card-horizontal {
    display: grid;
    grid-template-columns: 0.6fr 1fr;
    gap: 20px 100px;
    padding: 50px 50px 0 74px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px), only screen and (max-width: 575px) {
    .rbt-card.variation-03.style_2.card-horizontal {
        display: flex;
        flex-direction: column;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.variation-03.style_2.card-horizontal {
        padding: 40px 40px 0 40px;
    }
}
@media only screen and (max-width: 575px) {
    .rbt-card.variation-03.style_2.card-horizontal {
        padding: 20px 20px 0 20px;
    }
}
.rbt-card.variation-03.style_2.card-horizontal .rbt-card-img-wrap {
    position: relative;
}
.rbt-card.variation-03.style_2.card-horizontal .rbt-card-img-wrap .men-circle {
    position: absolute;
    left: -25px;
    top: -12px;
    z-index: 2;
}
@media only screen and (max-width: 575px) {
    .rbt-card.variation-03.style_2.card-horizontal .rbt-card-img-wrap .men-circle {
        left: -15px;
        max-width: 75px;
    }
}
.rbt-card.variation-03.style_2.card-horizontal .rbt-card-img-wrap .shape-1 {
    position: absolute;
    top: 119px;
    left: 99px;
    z-index: 2;
    animation: edu_clip_show_left_to_right 1.5s linear infinite;
}
@media only screen and (max-width: 575px) {
    .rbt-card.variation-03.style_2.card-horizontal .rbt-card-img-wrap .shape-1 {
        top: 50px;
        left: 50px;
        max-width: 35px;
    }
}
.rbt-card.variation-03.style_2.card-horizontal .rbt-card-img-wrap .rbt-card-img img {
    border-radius: 10px 10px 0 0;
    width: 100%;
    object-fit: cover;
}
.rbt-card.variation-04 {
    padding: 25px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.variation-04 {
        padding: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.variation-04 {
        padding: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.variation-04 {
        padding: 15px;
    }
}
.rbt-card.variation-04 .rbt-card-body {
    padding-top: 25px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.variation-04 .rbt-card-body {
        padding-top: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.variation-04 .rbt-card-body {
        padding-top: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.variation-04 .rbt-card-body {
        padding-top: 20px;
    }
}
.rbt-card.variation-04 .rbt-card-body .rbt-meta {
    margin-bottom: 10px;
}
.rbt-card.variation-04 .rbt-card-body .rbt-review {
    margin-bottom: 10px;
}
.rbt-card.height-330 .rbt-card-img a img {
    max-height: 330px;
}
.rbt-card.card-list {
    display: flex;
    max-height: 150px;
    border-radius: 2px;
    align-items: center;
    height: 100%;
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list {
        display: block;
        max-height: inherit;
        align-items: center;
        height: auto;
        border-radius: var(--radius);
    }
}
.rbt-card.card-list .rbt-card-img {
    height: 100%;
}
.rbt-card.card-list .rbt-card-img a {
    height: 100%;
}
.rbt-card.card-list .rbt-card-img a img {
    border-radius: 2px 0 0 2px;
    max-height: initial;
    max-width: 290px;
    min-width: 290px;
    object-fit: cover;
    height: 100%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.card-list .rbt-card-img a img {
        max-width: 200px;
        min-width: 200px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list .rbt-card-img a img {
        max-height: initial;
        max-width: inherit;
        min-width: inherit;
        width: 100%;
        object-fit: cover;
        border-radius: var(--radius) var(--radius) 0 0;
    }
}
.rbt-card.card-list .rbt-card-body {
    padding: 30px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
@media only screen and (max-width: 575px) {
    .rbt-card.card-list .rbt-card-body {
        padding: 20px;
    }
}
.rbt-card.card-list-2 {
    display: flex;
    border-radius: var(--radius);
    align-items: center;
    height: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.card-list-2 {
        display: block;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list-2 {
        display: block;
    }
}
.rbt-card.card-list-2 .rbt-card-img {
    flex-basis: 40%;
    height: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.card-list-2 .rbt-card-img {
        height: auto;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list-2 .rbt-card-img {
        height: auto;
    }
}
.rbt-card.card-list-2 .rbt-card-img a {
    display: block;
    height: 100%;
    width: 100%;
}
.rbt-card.card-list-2 .rbt-card-img a img {
    border-radius: var(--radius);
    max-height: 100%;
    max-width: 100%;
}
.rbt-card.card-list-2 .rbt-card-body {
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-basis: 60%;
    padding-left: 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.card-list-2 .rbt-card-body {
        padding-left: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.card-list-2 .rbt-card-body {
        padding-left: 0;
        padding-top: 30px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list-2 .rbt-card-body {
        padding-left: 0;
        padding-top: 30px;
    }
}
.rbt-card.card-list-2 .rbt-card-body .rbt-card-title {
    font-size: 26px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.card-list-2 .rbt-card-body .rbt-card-title {
        font-size: 22px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.card-list-2 .rbt-card-body .rbt-card-title {
        font-size: 22px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list-2 .rbt-card-body .rbt-card-title {
        font-size: 22px;
    }
}
@media only screen and (max-width: 575px) {
    .rbt-card.card-list-2 .rbt-card-body .rbt-card-title {
        font-size: 20px;
    }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.card-list-2.elegant-course {
        display: block;
    }
}
.rbt-card.card-list-2.elegant-course .rbt-card-img {
    flex-basis: 55%;
    display: block;
}
.rbt-card.card-list-2.elegant-course .rbt-card-img a {
    display: block;
    height: 100%;
}
.rbt-card.card-list-2.elegant-course .rbt-card-img a img {
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    min-height: 100%;
    border-radius: 6px 0 0 6px;
}
.rbt-card.card-list-2.elegant-course .rbt-card-body {
    flex-basis: 45%;
    position: relative;
}
.rbt-card.card-list-2.event-list-card .rbt-card-img {
    height: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.card-list-2.event-list-card .rbt-card-img {
        height: auto;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list-2.event-list-card .rbt-card-img {
        height: auto;
    }
}
.rbt-card.card-list-2.event-list-card .rbt-card-img a {
    height: 100%;
}
.rbt-card.card-list-2.event-list-card .rbt-card-img a img {
    border-radius: 6px;
    width: 100%;
    height: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.card-list-2.event-list-card .rbt-card-img a img {
        max-width: 100%;
        height: auto;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list-2.event-list-card .rbt-card-img a img {
        max-width: 100%;
        height: auto;
    }
}
.rbt-card.card-list-2.event-list-card .rbt-card-body {
    padding-left: 25px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-card.card-list-2.event-list-card .rbt-card-body {
        padding-left: 0;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list-2.event-list-card .rbt-card-body {
        padding-left: 0;
        padding-top: 20px;
    }
}
.rbt-card.card-list-2.event-list-card .rbt-card-body .rbt-card-title {
    font-size: 22px;
    margin-bottom: 20px;
}
@media only screen and (max-width: 767px) {
    .rbt-card.card-list-2.event-list-card .rbt-card-body .rbt-card-title {
        font-size: 18px;
        margin-bottom: 10px;
    }
}
.rbt-card.elegant-course {
    padding: 0;
    border-radius: 10px;
    align-items: inherit;
}
.rbt-card.elegant-course .rbt-meta {
    margin: -3px;
    margin-bottom: -6px;
}
.rbt-card.elegant-course .rbt-meta li {
    margin: 3px;
    margin-bottom: 6px;
}
.rbt-card.elegant-course .rbt-meta-badge {
    margin: -3px;
    margin-bottom: -6px;
}
.rbt-card.elegant-course .rbt-meta-badge li {
    margin: 3px;
    margin-bottom: 6px;
}
.rbt-card.elegant-course .rbt-meta-badge li .rbt-badge {
    transition: 0.3s;
}
.rbt-card.elegant-course .rbt-meta-badge li .rbt-badge:hover {
    background: var(--primary-opacity);
    color: var(--color-primary);
}
.rbt-card.elegant-course .rbt-card-img a img {
    border-radius: var(--radius) var(--radius) 0 0;
}
.rbt-card.elegant-course .rbt-card-body {
    padding: 30px;
}
.rbt-card.elegant-course .rbt-card-body .rbt-card-bottom .rbt-btn-link {
    margin-left: 20px;
}
.rbt-card.elegant-course.card-list-2 .rbt-card-body {
    padding: 45px 30px 35px;
}
@media only screen and (max-width: 767px) {
    .rbt-card.elegant-course.card-list-2 .rbt-card-body {
        padding: 45px 20px 35px;
    }
}
.rbt-card.event-grid-card .rbt-meta {
    margin: -3px;
    margin-bottom: 10px;
}
.rbt-card.event-grid-card .rbt-meta li {
    margin: 3px;
}
.rbt-card.event-grid-card .rbt-card-body {
    padding-top: 15px;
}
.rbt-card.event-grid-card .rbt-card-body .rbt-card-title {
    margin-bottom: 22px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-card.event-grid-card .rbt-card-body .rbt-card-title {
        font-size: 24px;
    }
}
.rbt-card.event-grid-card .rbt-badge span {
    font-size: 12px;
    color: var(--color-body);
    display: block;
    font-weight: 700;
    letter-spacing: -0.5px;
}
.rbt-card.rbt-card-latest {
    box-shadow: unset;
    background: transparent;
    border-radius: 0;
    height: auto;
    padding: 0;
}
.rbt-card.rbt-card-latest .rbt-card-img a img {
    max-height: 300px;
}
.rbt-card.rbt-card-latest .rbt-card-body {
    display: flex;
    align-items: center;
    gap: 0px 30px;
    flex-wrap: wrap;
    justify-content: space-between;
}
.rbt-card.rbt-card-latest .rbt-badge-3 {
    top: 20px;
    left: 20px;
}

.rbt-meta {
    margin: -7px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-meta {
        margin: -3px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-meta {
        margin: -3px;
    }
}
.rbt-meta li {
    font-size: 14px;
    line-height: 15px;
    color: var(--color-body);
    display: inline-block;
    margin: 7px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-meta li {
        margin: 3px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-meta li {
        margin: 3px;
        font-size: var(--font-size-b4);
    }
}
.rbt-meta li i {
    margin-right: 5px;
}
.rbt-meta.rbt-meta-white li {
    color: var(--color-white);
}

.rbt-category {
    margin: 0 -5px;
    display: flex;
    flex-wrap: wrap;
}
.rbt-category a {
    display: inline-block;
    padding: 0 20px;
    height: 34px;
    line-height: 33px;
    border: 1px solid var(--color-border);
    border-radius: 500px;
    font-size: 14px;
    font-weight: 400;
    color: var(--color-body);
    transition: 0.4s;
    margin: 0 5px;
    min-width: 56px;
    text-align: center;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-category a {
        padding: 0 10px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-category a {
        padding: 0 10px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-category a {
        padding: 0 10px;
    }
}
.rbt-category a:hover {
    background-color: var(--color-grey);
}

.lesson-number {
    font-size: 14px;
    display: inline-block;
    font-weight: 600;
}
.lesson-number .lesson-time {
    font-weight: 400;
}

.rbt-review {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.rbt-review .rating {
    display: flex;
    align-items: center;
    margin-right: 6px;
}
.rbt-review .rating i {
    font-size: 13px;
    color: #FF9747;
    transition: 0.3s;
}
.rbt-review .rating-count {
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
}

.rating i {
    font-size: 13px;
    color: #FF9747;
    transition: 0.3s;
}
.rating i.off {
    font-weight: 400;
}

.rbt-price {
    display: flex;
    align-items: center;
}
.rbt-price .current-price {
    font-size: 24px;
    font-weight: 700;
}
.rbt-price .off-price {
    font-size: 20px;
    font-weight: 500;
    text-decoration: line-through;
    opacity: 0.4;
    margin-left: 7px;
}
.rbt-price .off-price.version-02 {
    font-size: 22px;
    font-weight: 400;
    opacity: 0.5;
}
.rbt-price.large-size .current-price {
    font-size: 35px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-price.large-size .current-price {
        font-size: 28px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-price.large-size .current-price {
        font-size: 28px;
    }
}
.rbt-price.large-size .off-price {
    font-size: 20px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-price.large-size .off-price {
        font-size: 16px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-price.large-size .off-price {
        font-size: 16px;
    }
}
/*-------------------------
    Course Details
---------------------------*/
.course-details-content.version-02 {
    border-radius: var(--radius-10);
    padding: 92px 100px;
    position: relative;
    background: linear-gradient(90deg, #2F57EF 25.63%, rgba(197, 134, 238, 0.35) 100%);
    overflow: hidden;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .course-details-content.version-02 {
        padding: 80px 60px;
    }
}
@media only screen and (max-width: 767px) {
    .course-details-content.version-02 {
        padding: 60px 40px;
    }
}
@media only screen and (max-width: 575px) {
    .course-details-content.version-02 {
        padding: 40px 20px;
    }
}
.course-details-content.version-02 .light-shape {
    position: absolute;
    top: 0;
    left: 0;
}
.course-details-content.version-02 .shape-1 {
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0.65;
    height: 100%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px), only screen and (max-width: 575px) {
    .course-details-content.version-02 .shape-1 {
        display: none;
    }
}
.course-details-content.version-02 .shape-1 img {
    height: 100%;
}
.course-details-content.version-02 .opacity-8 {
    opacity: 0.8;
}
.course-details-content.version-02 .course-details-feature .feature-sin .icon {
    background-color: rgba(255, 255, 255, 0.1);
}
.course-details-content.version-02 .divider {
    background-color: var(--color-white);
    opacity: 0.1;
}
.course-details-content.version-02 .rounded-player {
    box-shadow: 0px 0px 0px 8px rgba(255, 255, 255, 0.42);
}
@media only screen and (max-width: 767px) {
    .course-details-content.version-02 .rounded-player {
        width: 80px;
        height: 80px;
    }
}
@media only screen and (max-width: 575px) {
    .course-details-content.version-02 .rounded-player {
        width: 60px;
        height: 60px;
    }
}
.course-details-content .course-details-feature {
    gap: 10px 20px;
}
.course-details-content .course-details-feature .feature-sin {
    margin: 0px;
    display: flex;
    gap: 10px;
    position: relative;
}
.course-details-content .course-details-feature .feature-sin:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -10px;
    height: 20px;
    width: 1px;
    background-color: var(--color-heading);
    opacity: 0.1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px), only screen and (max-width: 575px) {
    .course-details-content .course-details-feature .feature-sin:not(:last-child)::after {
        display: none;
    }
}
.course-details-content .course-details-feature .feature-sin .icon {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    position: relative;
    background-color: rgba(107, 115, 133, 0.1);
    font-size: 15px;
}
.course-details-content .course-details-feature .feature-sin .icon i {
    color: var(--color-body);
}
.course-details-content .course-details-feature .feature-sin.rating {
    font-weight: 400;
}
.course-details-content .profile-share a img {
    max-width: 40px;
    border: 2px solid var(--color-white);
    box-shadow: none;
}
.course-details-content .divider {
    background-color: var(--color-heading);
    opacity: 0.1;
}
.course-details-content .number {
    font-size: 16px;
}
.course-details-content .small-text {
    font-size: 12px;
}

/*-------------------------
Course Sidebar
-------------------------*/
.course-sidebar-top {
    margin-top: -500px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .course-sidebar-top {
        margin-top: 0;
    }
}
@media only screen and (max-width: 767px) {
    .course-sidebar-top {
        margin-top: 0;
    }
}
.course-sidebar-top.sidebar-top-110 {
    margin-top: -110px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .course-sidebar-top.sidebar-top-110 {
        margin-top: 0;
    }
}
@media only screen and (max-width: 767px) {
    .course-sidebar-top.sidebar-top-110 {
        margin-top: 0;
    }
}

.course-sidebar .title {
    font-size: 22px;
    font-weight: var(--f-medium);
}
.course-sidebar .subtitle {
    font-size: 14px;
    display: block;
    margin-top: 10px;
    margin-bottom: 20px;
    text-align: center;
}
.course-sidebar .social-share-wrapper {
    background: #f5f5fa;
    margin: 0 -27px -27px;
    padding: 30px;
    border-radius: 0 0 6px 6px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .course-sidebar .social-share-wrapper {
        margin: 0 -10px -10px;
        padding: 20px;
        border-radius: 6px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .course-sidebar .social-share-wrapper {
        margin: 0 -10px -10px;
        padding: 20px;
        border-radius: 6px;
    }
}
@media only screen and (max-width: 767px) {
    .course-sidebar .social-share-wrapper {
        margin: 0 -10px -10px;
        padding: 20px;
        border-radius: 6px;
    }
}
.course-sidebar .social-share-wrapper .rbt-post-share span {
    font-size: 16px;
}
.course-sidebar .contact-with-us p {
    margin-bottom: 0;
    font-size: 14px;
}
.course-sidebar .inner .course-item {
    display: flex;
    gap: 10px 15px;
    border-top: 1px solid var(--color-border);
    padding: 15px 0;
}
.course-sidebar .inner .course-item .item-img {
    max-width: 130px;
}
.course-sidebar .inner .course-item .item-img img {
    border-radius: 2px;
}
.course-sidebar .inner .course-item .rating {
    display: flex;
    align-items: center;
    gap: 10px;
}
.course-sidebar .inner .course-item .rating i {
    font-size: 14px;
    color: var(--color-warning);
}
.course-sidebar .inner .course-item .author {
    font-size: 14px;
}
/* Course Video Wrapper  */
.video-popup-with-text.video-popup-wrapper {
    position: relative;
    display: block;
    z-index: 2;
}
.video-popup-with-text.video-popup-wrapper .play-view-text {
    position: absolute;
    bottom: 20px;
    text-align: center;
    width: 100%;
    z-index: 2;
}
.video-popup-with-text.video-popup-wrapper .position-to-top {
    z-index: 2;
}
.video-popup-with-text.video-popup-wrapper::before {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 85%;
    display: block;
    z-index: 1;
    content: "";
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0) 100%);
    transition: opacity 0.65s cubic-bezier(0.05, 0.2, 0.1, 1);
    cursor: pointer;
    border-radius: 6px;
}

.rbt-widget-details .rbt-course-details-list-wrapper li,
.rbt-widget-details .rbt-default-sidebar-list li,
.rbt-default-sidebar-wrapper .rbt-course-details-list-wrapper li,
.rbt-default-sidebar-wrapper .rbt-default-sidebar-list li {
    display: flex;
    justify-content: space-between;
}
.rbt-widget-details .rbt-course-details-list-wrapper li i,
.rbt-widget-details .rbt-default-sidebar-list li i,
.rbt-default-sidebar-wrapper .rbt-course-details-list-wrapper li i,
.rbt-default-sidebar-wrapper .rbt-default-sidebar-list li i {
    color: var(--color-body);
    margin-right: 10px;
    font-size: 16px;
}
.rbt-widget-details .rbt-course-details-list-wrapper li span,
.rbt-widget-details .rbt-default-sidebar-list li span,
.rbt-default-sidebar-wrapper .rbt-course-details-list-wrapper li span,
.rbt-default-sidebar-wrapper .rbt-default-sidebar-list li span {
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
}
.rbt-widget-details .rbt-course-details-list-wrapper li span.rbt-feature-value,
.rbt-widget-details .rbt-default-sidebar-list li span.rbt-feature-value,
.rbt-default-sidebar-wrapper .rbt-course-details-list-wrapper li span.rbt-feature-value,
.rbt-default-sidebar-wrapper .rbt-default-sidebar-list li span.rbt-feature-value {
    font-size: 12px;
}
.rbt-widget-details .rbt-course-details-list-wrapper li a,
.rbt-widget-details .rbt-default-sidebar-list li a,
.rbt-default-sidebar-wrapper .rbt-course-details-list-wrapper li a,
.rbt-default-sidebar-wrapper .rbt-default-sidebar-list li a {
    color: var(--color-body);
    transition: 0.4s;
}
.rbt-widget-details .rbt-course-details-list-wrapper li a:hover,
.rbt-widget-details .rbt-default-sidebar-list li a:hover,
.rbt-default-sidebar-wrapper .rbt-course-details-list-wrapper li a:hover,
.rbt-default-sidebar-wrapper .rbt-default-sidebar-list li a:hover {
    color: var(--color-primary);
}
.rbt-widget-details .rbt-course-details-list-wrapper li + li,
.rbt-widget-details .rbt-default-sidebar-list li + li,
.rbt-default-sidebar-wrapper .rbt-course-details-list-wrapper li + li,
.rbt-default-sidebar-wrapper .rbt-default-sidebar-list li + li {
    padding-top: 10px;
    margin-top: 10px;
    border-top: 1px solid var(--color-border);
}
/*=========================
    Section Separation
==========================*/
.slick-dotted.slick-slider {
    margin-bottom: 0;
}

.position-to-top {
    position: relative;
    margin-top: -300px;
}

.mt_dec--80 {
    margin-top: -80px;
}

.mt_dec--100 {
    margin-top: -100px;
}

.mt_dec--5 {
    margin-top: -5px !important;
}

.wdt-100 {
    width: 100px;
}

.rbt-section-gap {
    padding: 120px 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-section-gap {
        padding: 80px 0;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-section-gap {
        padding: 80px 0;
    }
}

.rbt-section-gap2 {
    padding: 80px 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-section-gap2 {
        padding: 80px 0;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-section-gap2 {
        padding: 80px 0;
    }
}

.rbt-section-gap3 {
    padding: 100px 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-section-gap3 {
        padding: 80px 0;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-section-gap3 {
        padding: 80px 0;
    }
}

.rbt-section-gapBottom {
    padding-bottom: 120px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-section-gapBottom {
        padding-bottom: 80px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-section-gapBottom {
        padding-bottom: 80px;
    }
}

.rbt-section-gap2Bottom {
    padding-bottom: 80px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-section-gap2Bottom {
        padding-bottom: 80px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-section-gap2Bottom {
        padding-bottom: 80px;
    }
}

.rbt-section-gap3Bottom {
    padding-bottom: 100px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-section-gap3Bottom {
        padding-bottom: 80px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-section-gap3Bottom {
        padding-bottom: 80px;
    }
}

.rbt-section-gapTop {
    padding-top: 120px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-section-gapTop {
        padding-top: 80px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-section-gapTop {
        padding-top: 80px;
    }
}

.rbt-section-gapTopHalf {
    padding-top: 60px;
}

.rbt-section-gap2Top {
    padding-top: 80px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-section-gap2Top {
        padding-top: 80px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-section-gap2Top {
        padding-top: 80px;
    }
}

.rbt-section-gap3Top {
    padding-top: 100px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-section-gap3Top {
        padding-top: 80px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-section-gap3Top {
        padding-top: 80px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .pb--165,
    .pb--85 {
        padding-bottom: 100px;
    }
}
@media only screen and (max-width: 767px) {
    .pb--165,
    .pb--85 {
        padding-bottom: 60px;
    }
}

.mt_dec--120 {
    margin-top: -120px !important;
}

.mt_dec--60 {
    margin-top: -60px !important;
}

.mt_dec--50 {
    margin-top: -50px !important;
}

.mt_dec--30 {
    margin-top: -30px !important;
}

.mt_dec--40 {
    margin-top: -40px !important;
}

.mt_dec--20 {
    margin-top: -20px !important;
}

.ml_dec_20 {
    margin-left: -20px !important;
}

.mt_dec--half {
    margin-bottom: -156px;
}

.default-callto-action-overlap {
    padding-top: 276px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .default-callto-action-overlap {
        padding-top: 80px;
    }
}
@media only screen and (max-width: 767px) {
    .default-callto-action-overlap {
        padding-top: 80px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .ptb--120 {
        padding: 80px 0 !important;
    }
}
@media only screen and (max-width: 767px) {
    .ptb--120 {
        padding: 60px 0 !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .pb--165,
    .pb--120,
    .pb--85,
    .pb--165 {
        padding-bottom: 80px !important;
    }
}
@media only screen and (max-width: 767px) {
    .pb--165,
    .pb--120,
    .pb--85,
    .pb--165 {
        padding-bottom: 60px !important;
    }
}

@media only screen and (max-width: 767px) {
    .pb--70 {
        padding-bottom: 60px !important;
    }
}

.slick-gutter-5 {
    margin-left: -5px;
    margin-right: -5px;
}
.slick-gutter-5 .slick-slide {
    padding-left: 5px;
    padding-right: 5px;
}

.slick-gutter-10 {
    margin-left: -10px;
    margin-right: -10px;
}
.slick-gutter-10 .slick-slide {
    padding-left: 10px;
    padding-right: 10px;
}

.slick-gutter-15 {
    margin-left: -15px;
    margin-right: -15px;
}
.slick-gutter-15 .slick-slide {
    padding-left: 15px;
    padding-right: 15px;
}

.slick-gutter-20 {
    margin-left: -20px;
    margin-right: -20px;
}
.slick-gutter-20 .slick-slide {
    padding-left: 20px;
    padding-right: 20px;
}

.slick-gutter-25 {
    margin-left: -25px;
    margin-right: -25px;
}
.slick-gutter-25 .slick-slide {
    padding-left: 25px;
    padding-right: 25px;
}

.slick-gutter-30 {
    margin-left: -30px;
    margin-right: -30px;
}
.slick-gutter-30 .slick-slide {
    padding-left: 30px;
    padding-right: 30px;
}

.slick-gutter-35 {
    margin-left: -35px;
    margin-right: -35px;
}
.slick-gutter-35 .slick-slide {
    padding-left: 35px;
    padding-right: 35px;
}

.slick-gutter-40 {
    margin-left: -40px;
    margin-right: -40px;
}
.slick-gutter-40 .slick-slide {
    padding-left: 40px;
    padding-right: 40px;
}

.slick-gutter-45 {
    margin-left: -45px;
    margin-right: -45px;
}
.slick-gutter-45 .slick-slide {
    padding-left: 45px;
    padding-right: 45px;
}

.slick-gutter-50 {
    margin-left: -50px;
    margin-right: -50px;
}
.slick-gutter-50 .slick-slide {
    padding-left: 50px;
    padding-right: 50px;
}

.slick-gutter-55 {
    margin-left: -55px;
    margin-right: -55px;
}
.slick-gutter-55 .slick-slide {
    padding-left: 55px;
    padding-right: 55px;
}

.slick-gutter-60 {
    margin-left: -60px;
    margin-right: -60px;
}
.slick-gutter-60 .slick-slide {
    padding-left: 60px;
    padding-right: 60px;
}

.slick-gutter-65 {
    margin-left: -65px;
    margin-right: -65px;
}
.slick-gutter-65 .slick-slide {
    padding-left: 65px;
    padding-right: 65px;
}

.slick-gutter-70 {
    margin-left: -70px;
    margin-right: -70px;
}
.slick-gutter-70 .slick-slide {
    padding-left: 70px;
    padding-right: 70px;
}

.slick-gutter-75 {
    margin-left: -75px;
    margin-right: -75px;
}
.slick-gutter-75 .slick-slide {
    padding-left: 75px;
    padding-right: 75px;
}

.slick-gutter-80 {
    margin-left: -80px;
    margin-right: -80px;
}
.slick-gutter-80 .slick-slide {
    padding-left: 80px;
    padding-right: 80px;
}

.slick-gutter-85 {
    margin-left: -85px;
    margin-right: -85px;
}
.slick-gutter-85 .slick-slide {
    padding-left: 85px;
    padding-right: 85px;
}

.slick-gutter-90 {
    margin-left: -90px;
    margin-right: -90px;
}
.slick-gutter-90 .slick-slide {
    padding-left: 90px;
    padding-right: 90px;
}

.slick-gutter-95 {
    margin-left: -95px;
    margin-right: -95px;
}
.slick-gutter-95 .slick-slide {
    padding-left: 95px;
    padding-right: 95px;
}

.slick-gutter-100 {
    margin-left: -100px;
    margin-right: -100px;
}
.slick-gutter-100 .slick-slide {
    padding-left: 100px;
    padding-right: 100px;
}

/*------------------------
    Edu Common Styles
--------------------------*/
/*-------------------------
    Rbt Default
-------------------------*/
.rbt-index-upper {
    position: relative;
    z-index: 1;
}

.rbt-index-upper-2 {
    position: relative;
    z-index: 2;
}

.sticky-top {
    top: 30px;
    z-index: 9;
}
.sticky-top.sticky-top-130 {
    top: 130px;
}

.rbt-single-group {
    margin: -5px;
}
.rbt-single-group .rbt-single-list {
    margin: 5px;
}

@media only screen and (max-width: 767px) {
    .transform-sm-none {
        transform: none !important;
    }
}
.rbt-shadow-box {
    border-radius: var(--radius);
    background: var(--color-white);
    overflow: hidden;
    box-shadow: var(--shadow-1);
    padding: 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rbt-shadow-box {
        padding: 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rbt-shadow-box {
        padding: 20px;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-shadow-box {
        padding: 20px;
    }
}

.bg-no-shadow {
    box-shadow: none !important;
}

.shadow-1 {
    box-shadow: var(--shadow-1);
}

.shadow-2 {
    box-shadow: var(--shadow-2);
}

.shadow-3 {
    box-shadow: var(--shadow-3);
}

.shadow-4 {
    box-shadow: var(--shadow-1);
}

.shadow-5 {
    box-shadow: var(--shadow-5);
}

.shadow-6 {
    box-shadow: var(--shadow-1);
}

.shadow-7 {
    box-shadow: var(--shadow-7);
}

.shadow-8 {
    box-shadow: var(--shadow-8);
}

.shadow-11 {
    box-shadow: var(--shadow-11) !important;
}
nav ul, nav ol {
    list-style: none;
    list-style-image: none;
    list-style-image: none;
}
.liststyle {
    padding: 0;
    margin: 0;
    list-style: none;
}
.rating-box {
    border-radius: 5px;
    background: var(--warning-opacity);
    text-align: center;
    padding: 22px 10px;
    padding-top: 10px;
}
.rating-box .rating-number {
    font-weight: 800;
    font-size: 66px;
    line-height: 80px;
    color: var(--color-heading);
}
.rating-box span {
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
}
.rating-box .rating svg {
    color: var(--color-warning);
}
.rating-box .sub-title {
    color: var(--color-warning);
}

.rating-text {
    display: inline-block;
    position: relative;
    top: 14px;
}
@media only screen and (max-width: 767px) {
    .rating-text {
        top: 0;
        margin-bottom: 8px;
    }
}
.rating-text svg {
    color: var(--color-warning);
}

.review-wrapper .single-progress-bar {
    position: relative;
    top: -14px;
}
@media only screen and (max-width: 767px) {
    .review-wrapper .single-progress-bar {
        margin-bottom: 15px;
    }
}
.review-wrapper .progress {
    max-width: 70%;
    margin-left: 115px;
    height: 6px;
    background: #EEEEEE;
    border-radius: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .review-wrapper .progress {
        max-width: 61%;
    }
}
@media only screen and (max-width: 767px) {
    .review-wrapper .progress {
        max-width: 83%;
        margin-left: 0;
    }
}
.review-wrapper .progress .progress-bar {
    background-color: var(--color-warning);
    border-radius: 0;
}
.review-wrapper span.value-text {
    position: absolute;
    right: 0;
    top: 50%;
    font-weight: 500;
    font-size: 16px;
}
.rbt-course-review.about-author {
    padding: 25px 0;
}
.rbt-course-review.about-author:first-child {
    padding-top: 0;
}
.rbt-course-review.about-author .rating {
    margin-top: 5px;
    margin-bottom: 10px;
}
.blog-content-wrapper audio {
    display: block;
    width: 100%;
}
.blog-content-wrapper .embed-responsive {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden;
}
.blog-content-wrapper iframe {
    border: 0;
    width: 100%;
    border-radius: 10px;
}
.blog-content-wrapper iframe.square {
    border-radius: 0;
}
.blog-content-wrapper .post-thumbnail img {
    width: 100%;
}
.blog-content-wrapper p {
    line-height: 1.67;
}
.blog-content-wrapper p a {
    color: var(--color-primary);
}
.blog-content-wrapper .tagcloud {
    margin-bottom: 30px;
}
.blog-content-wrapper .social-share-block {
    border-bottom: 1px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.blog-content-wrapper .social-share-block .post-like {
    padding-bottom: 20px;
}
.blog-content-wrapper .social-share-block .post-like a {
    display: flex;
    align-items: center;
}
.blog-content-wrapper .social-share-block .post-like a i {
    width: 40px;
    height: 40px;
    line-height: 34px;
    border: 2px solid var(--color-border);
    color: var(--color-body);
    border-radius: 100%;
    text-align: center;
    margin-right: 20px;
}
.blog-content-wrapper .social-share-block .post-like a span {
    font-size: 16px;
    line-height: 1.5;
}
.blog-content-wrapper .social-share-block .post-like a:hover i {
    background-color: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}
.blog-content-wrapper .social-share-block .post-like a:hover span {
    color: var(--color-primary);
}
.blog-content-wrapper .social-share-block .social-icon {
    padding-bottom: 20px;
}
.blog-content-wrapper iframe,
.blog-content-wrapper .rbt-blockquote {
    border-radius: var(--radius) !important;
}
.blog-content-wrapper iframe.square,
.blog-content-wrapper .rbt-blockquote.square {
    border-radius: 0 !important;
}

.tagcloud {
    margin: -5px;
    display: flex;
    flex-wrap: wrap;
}
.tagcloud a {
    border: 1px solid var(--color-border);
    font-size: 14px;
    color: var(--color-body);
    height: 30px;
    padding: 0 10px;
    margin: 5px;
    display: inline-block;
    line-height: 27px;
    border-radius: 4px;
}
.tagcloud a:hover {
    background-color: var(--color-primary);
    color: #ffffff;
    border-color: var(--color-primary);
}

.about-author {
    padding: 40px 0;
    border-bottom: 1px solid var(--color-border);
}
.about-author .media {
    display: flex;
}
@media only screen and (max-width: 479px) {
    .about-author .media {
        display: block;
    }
}
.about-author .thumbnail a img {
    border-radius: 6px;
    margin-right: 30px;
    margin-bottom: 20px;
    min-width: 105px;
    max-height: 105px;
}
@media only screen and (max-width: 767px) {
    .about-author .thumbnail a img {
        margin-right: 20px;
    }
}
.about-author .media-body .author-info .title {
    margin-bottom: 0;
}
.about-author .media-body .author-info .title a .hover-flip-item span::before {
    color: var(--color-heading);
}
.about-author .media-body .author-info .title a .hover-flip-item span::after {
    color: var(--color-primary);
}
.about-author .media-body .author-info .subtitle {
    color: var(--color-body);
    display: block;
    margin-top: 10px;
    display: block;
}
@media only screen and (max-width: 767px) {
    .about-author .media-body .author-info .subtitle {
        margin-top: 8px;
    }
}
.about-author .media-body .content .description {
    margin-top: 6px;
    margin-bottom: 0;
}
.about-author .media-body .content .social-icon {
    margin-top: 10px;
}

@media only screen and (max-width: 767px) {
    .rbt-instructor .about-author .media {
        display: block;
    }
}
@media only screen and (max-width: 767px) {
    .rbt-instructor .about-author .thumbnail {
        margin-bottom: 30px;
    }
}

/*------------------------
    Comment Post Total
---------------------------*/
.rbt-total-comment-post {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 0;
    border-bottom: 1px solid var(--color-border);
}
@media only screen and (max-width: 575px) {
    .rbt-total-comment-post {
        display: block;
    }
}
@media only screen and (max-width: 575px) {
    .rbt-total-comment-post .add-comment-button {
        margin-top: 20px;
    }
}

/*------------------------
    Comment Form
-------------------------*/
.comment-respond {
    margin: 40px 0;
    position: relative;
}
.comment-respond .comment-form-cookies-consent {
    margin-bottom: 20px;
}
.comment-respond .form-group label {
    font-size: 16px;
}

/* --------------------------
    Comments Styles
-----------------------------*/
.comment-list ul.children {
    padding-left: 75px;
}
@media only screen and (max-width: 767px) {
    .comment-list ul.children {
        padding-left: 20px;
    }
}
.comment-list .comment {
    margin-top: 0;
    margin-bottom: 0;
    border-top: 1px solid var(--color-border);
}
.comment-list .comment:first-child {
    border-top: transparent;
}
.comment-list .comment .children .comment {
    border-top: 1px solid var(--color-border);
}
.comment-list .comment .single-comment {
    padding: 20px 0;
    display: flex;
}
@media only screen and (max-width: 575px) {
    .comment-list .comment .single-comment {
        display: block;
    }
}
.comment-list .comment .single-comment .comment-img {
    margin-bottom: 15px;
    min-width: 70px;
    margin-right: 20px;
    max-width: 70px;
}
.comment-list .comment .single-comment .comment-img img {
    border-radius: 100%;
    width: 100%;
    background: var(--color-white);
    padding: 4px;
    border: 2px solid var(--primary-opacity);
}
.comment-list .comment .commenter {
    margin-bottom: 15px;
    line-height: 18px;
}
.comment-list .comment .commenter a .hover-flip-item span::before {
    color: var(--color-heading);
}
.comment-list .comment .commenter a .hover-flip-item span::after {
    color: var(--color-primary);
}
.comment-list .comment .comment-meta {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    flex-wrap: wrap;
}
.comment-list .comment .time-spent {
    color: var(--color-heading);
    font-size: 12px;
    line-height: 18px;
}
.comment-list .comment .reply-edit a.comment-reply-link {
    font-size: 14px;
    line-height: 18px;
    display: flex;
    color: var(--color-primary);
    margin-left: 8px;
    padding-left: 8px;
    position: relative;
    font-weight: 500;
    overflow: visible;
}
.comment-list .comment .reply-edit a.comment-reply-link .hover-flip-item span::before {
    color: var(--color-heading);
}
.comment-list .comment .reply-edit a.comment-reply-link .hover-flip-item span::after {
    color: var(--color-primary);
}
.comment-list .comment .reply-edit a.comment-reply-link:hover {
    color: var(--color-primary);
}
.comment-list .comment .reply-edit a.comment-reply-link::before {
    position: absolute;
    content: "";
    top: 50%;
    transform: translateY(-50%);
    left: -2px;
    width: 4px;
    height: 4px;
    background: var(--color-heading);
    border-radius: 100%;
}
.comment-list .comment .comment-text p {
    color: var(--color-tertiary);
}