:root {
 
  --primary: #0DAFAF;
  --secondary: #00ACD4;
  --shape-secondary: #E9F7FF;
  --primary-opacity-11: rgba(13, 175, 175, 0.11);
  --secondary-opacity-11:  rgba(81, 177, 228, 0.11);
  --red-opacity-11: rgba(213, 57, 80, 0.11);
  --green-opacity-11: rgba(0, 171, 83, 0.11);
  --border-primary: 1px solid #0DAFAF;
  --stroke-primary: 1px solid #EFEFEF;
  --text-stroke: #F0FFFF;
  --font-600: 600;
  --font-900: 900;
  --font-size-22: 22px;
  --font-size-20: 20px;
  --font-size-18: 18px;
  --font-size-16: 16px;
  --font-size-24: 24px;
  --font-size-28: 28px;
  --font-size-36: 36px;
  --font-size-48: 48px;
  --font-size-42: 42px;
  --pad-20:20px;
  --border-radius:20px;
  --gap-20:20px;
  --gap-10:10px;
  --light-green: #E8FFFF;
  --white: #fff;
  --bg:#fff;
  --bg-white: #fff;
  --bg-light: #EFEFEF;
  --bg-white-90: rgba(255, 255, 255, 0.96);
  --bg-white-30: rgba(255, 255, 255, 0.3);
  --bg-white-70: rgba(255, 255, 255, 0.7);
  --bg-white-10: rgba(255, 255, 255, 0.1);
  --bg-secondary: #29CAC2;
  --bg-dark: #151A33;
  --black: #000;
  --bg-black-90: rgba(0, 0, 0, 0.90);
  --font-colour: #151A33;
  --font-colour-white: #fff;
  --bg-primary: #EAFAF9;
  --bg-blur: rgba(0, 0, 0, 0.7);
  --brd-colour: #F4F4F4;
  --brd-colour2: #EFEFEF;
  --brd-white: #fff;
  --brd-colour3: rgba(239, 239, 239, 0.2);
  --blue: #00ACD4;
  --font-secondary: #7886AF;
  --font-colour-nav: #7886AF;
  --story-border: rgba(120, 134, 175, 0.20);
  --white-opecity-8: rgba(255, 255, 255, 0.08);
  --red:#D53951;
  --green:#00AB52;
  --orange:#FBBC05;
  --switch-bg: #314256;
  --gradiant1: linear-gradient(5deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(13, 175, 175, 0.1));
  --gradiant4: linear-gradient(45deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(81, 177, 228, 0.20));
  --gradiant-red: linear-gradient(45deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(213, 57, 80, 0.20));
  --gradiant-green: linear-gradient(45deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(0, 171, 83, 0.20));
  --gradiant2: linear-gradient(to bottom, #0DB2B2, #FFFFFF);
  --gradiant3: linear-gradient(to bottom, #51B0E4, #FFFFFF);
  --gradiant5: linear-gradient(to bottom, #0DB2B2, #FFFFFF);
  --gradiant6: linear-gradient(to bottom, #51B0E4, #FFFFFF);
  --gradiant7: linear-gradient(to left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(13, 175, 175, 0.1));
  --gradiant8: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(81, 177, 228, 0.20));
  --gradiant9: linear-gradient(5deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 58, 48, 0.1));
  --gradiant10: linear-gradient(to bottom, #00AB52, #FFFFFF);
  --gradiant-border:linear-gradient(-60deg, #fff, #51B0E4, #0DAFAF, #fff);
  --send-gradiant: linear-gradient(to bottom, #0DAFAF, #67DEDE);
  --subscribed-ico: url('../images/icons/bag-check.svg');
  --subscribe-ico: url('../images/icons/bag-add.svg');
  --challenge-bg: url('../images/icons/Union.svg');
  --live-ico: url('../images/icons/live-ico.svg');
  --theme-ico: url('../images/day-icon.png');
  --video-ico: url('../images/icons/camera-video.svg');
  --book-ico: url('../images/icons/book.svg');
  --quiz-ico: url('../images/icons/quiz.svg');
  --clock-ico: url('../images/icons/clock-circle.svg');
  --lock-ico: url('../images/icons/lock.svg');
  --download-ico: url('../images/icons/download.svg');
  --download-ico-blue: url('../images/icons/download-blue.svg');
  --gradiant-bg: url('../images/Gradiant.png');
  --check-mark: url('../images/icons/check-mark-circle.svg');
  --play-ico: url('../images/icons/play-ico.svg');
  --pause-ico: url('../images/icons/pause.svg');
  --attachment-ico: url('../images/icons/attachment-chat.svg');
  --calendar-ico: url('../images/icons/calendar.svg');
  --tag-ico: url('../images/icons/tag.svg');
  --user-ico: url('../images/icons/user.svg');
  --eye-ico: url('../images/icons/eye.svg');
  --eyeSlash-ico: url('../images/icons/eye-slash.svg');
  --leaderboard: url('../images/icons/leaderboard.svg');
  --tick: url('../images/icons/tick.svg');
  --checkBox-ico: url('../images/icons/check-box.svg');
  --home-ico: url('../images/icons/home-ico.svg');
  --home-ico-active: url('../images/icons/home-ico-active.svg');
  --myCourse-ico: url('../images/icons/myCourse-ico.svg');
  --myCourse-ico-active: url('../images/icons/myCourse-ico-active.svg');
  --privateClass-ico: url('../images/icons/privateClass-ico.svg');
  --privateClass-ico-active: url('../images/icons/privateClass-ico-active.svg');
  --askTeacher-ico: url('../images/icons/askTeacher-ico.svg');
  --askTeacher-ico-active: url('../images/icons/askTeacher-ico-active.svg');
  --more-ico: url('../images/icons/more-ico.svg');
  --more-ico-active: url('../images/icons/more-ico-active.svg');
  --btn-not-active: #ABB2C7;
  --white-50: rgba(255, 255, 255, 0.5);
  --bg-light-blue:#E3F4F8;
  --gradiant-rose: linear-gradient(to bottom, #FFFFFF, #FB0E66);
  --gradiant-violet: linear-gradient(to bottom, #FFFFFF, #4F46E5);
  --gradiant-blue: linear-gradient(to right, #0DAFAF, #51B0E4);
  --green-gradiant: linear-gradient(to bottom, #fff, #00AB52);
  --gradiant-main: linear-gradient(to bottom, #fff, #0DB2B2);
  --gradiant-second: linear-gradient(to bottom, #fff, #51B0E4);
  --secondary-font: "Baloo 2", sans-serif;

}

.english{
  --font-size-20: 16px;
  --font-size-48: 42px;
  --font-size-16: 14px;
  --font-size-24: 20px;
  --font-size-18: 15px;
  --gradiant7: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(13, 175, 175, 0.1));
  --gradiant8: linear-gradient(to left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(81, 177, 228, 0.20));
  --gradiant1: linear-gradient(-5deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(13, 175, 175, 0.1));
  --gradiant4: linear-gradient(-45deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(81, 177, 228, 0.20));
  --gradiant-red: linear-gradient(-45deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(213, 57, 80, 0.20));
  --gradiant-green: linear-gradient(-45deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(0, 171, 83, 0.20));
}


@media (max-width: 480px) {
  :root{
     --font-size-48: 30px;
     --font-size-20: 16px;
     --font-size-24: 20px;
     --font-size-28: 20px;
     --font-size-18: 15px;
     --pad-20:12px;
     --border-radius:10px;
     --gap-20:12px;
  }
  .english{
    --font-size-48: 26px;
    --font-size-20: 14px;
    --font-size-24: 16px;
    --font-size-18: 13px;
  }
}




.darktheme{
  --black: #fff;
  --bg:#0E1116;
  --bg-white: #141920;
  --bg-secondary: #0E1116;
  --bg-primary: #202631;
  --stroke-primary: 1px solid #202631;
  --text-stroke: #1B212B;
  --font-colour: #fff;
  --bg-white-90: rgba(14, 17, 22, 0.96);
  --bg-white-70: rgba(14, 17, 22, 0.7);
  --shape-secondary: rgba(81, 177, 228, 0.1);
  --bg-light: #202631;
  --bg-dark: #fff;
  --font-colour-white: #141920;
  --font-secondary: #94A0A0;
  --light-green: rgba(13, 175, 175, 0.1);
  --gradiant1: linear-gradient(5deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(13, 175, 175, 0.2));
  --dark: #022930;
  --brd-colour:#202631;
  --font-colour-nav: #94A0A0;
  --brd-colour2:#202631;
  --theme-ico: url('../images/night-icon.png');
  --subscribe-ico: url('../images/icons/bag-add-dark.svg');
  --challenge-bg: url('../images/icons/Union-dark.svg');
  --live-ico: url('../images/icons/live-ico-dark.svg');
  --video-ico: url('../images/icons/camera-video-dark.svg');
  --book-ico: url('../images/icons/book-dark.svg');
  --quiz-ico: url('../images/icons/quiz-dark.svg');
  --clock-ico: url('../images/icons/clock-circle-dark.svg');
  --lock-ico: url('../images/icons/lock-dark.svg');
  --play-ico: url('../images/icons/play-ico-dark.svg');
  --attachment-ico: url('../images/icons/attachment-chat-white.svg');
  --calendar-ico: url('../images/icons/calendar-dark.svg');
  --gradiant2: linear-gradient(to bottom, #0DB2B2, #0E1116);
  --gradiant3: linear-gradient(to bottom, #51B0E4, #0E1116);
  --gradiant4: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(81, 177, 228, 0.20));
  --gradiant-red: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(213, 57, 80, 0.20));
  --gradiant-green: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(0, 171, 83, 0.11));
  --gradiant7: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(13, 175, 175, 0.2));
  --gradiant8: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(81, 177, 228, 0.20));
  --gradiant9: linear-gradient(5deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(255, 58, 48, 0.2));
  --gradiant10: linear-gradient(to bottom, #00AB52, #0E1116);
  --gradiant-border:linear-gradient(-60deg, #0E1116, #51B0E4, #0DAFAF, #0E1116);
  --btn-not-active:#0B2525; 
  --bg-light-blue:rgba(41, 202, 194, 0.06);
  --switch-bg: #0B2525;
  --bg-white-10: rgba(0, 0, 0, 0.1);
  --brd-white: rgba(81, 177, 228, 0.1);
  --gradiant-rose: linear-gradient(to bottom, #0E1116, #FB0E66);
  --gradiant-violet: linear-gradient(to bottom, #0E1116, #4F46E5);
  --tag-ico: url('../images/icons/tag-dark.svg');
  --green-gradiant: linear-gradient(to bottom, #0E1116, #00AB52);
  --gradiant-main: linear-gradient(to bottom, #0E1116, #0DB2B2);
  --gradiant-second: linear-gradient(to bottom, #0E1116, #51B0E4);
  --user-ico: url('../images/icons/user-dark.svg');
  --eye-ico: url('../images/icons/eye-dark.svg');
  --eyeSlash-ico: url('../images/icons/eye-slash-dark.svg');
  --tick: url('../images/icons/tick-w.svg');
}

.english.darktheme{
  --gradiant1: linear-gradient(-5deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(13, 175, 175, 0.2));
  --gradiant7: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(13, 175, 175, 0.2));
  --gradiant8: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(81, 177, 228, 0.20));
  --gradiant4: linear-gradient(-45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(81, 177, 228, 0.20));
  --gradiant-red: linear-gradient(-45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(213, 57, 80, 0.20));
  --gradiant-green: linear-gradient(-45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(0, 171, 83, 0.11));
}



 /*  Regular */

@font-face {
  font-family: 'Lina-Round';
  src: url('../fonts/Linaround-Regular.woff') format('woff'),
       url('../fonts/Linaround-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;

}

 /*  Medium */

@font-face {
  font-family: 'Lina-Round';
  src: url('../fonts/Linaround-Medium.woff') format('woff'),
       url('../fonts/Linaround-Medium.otf') format('opentype');
  font-weight: 600;
  font-style: normal;

}

 /*  bold */

@font-face {
  font-family: 'Lina-Round';
  src: url('../fonts/Linaround-Bold.woff') format('woff'),
       url('../fonts/Linaround-Bold.otf') format('opentype');
  font-weight: 900;
  font-style: normal;

}

 /*  Light */

@font-face {
  font-family: 'Lina-Round';
  src: url('../fonts/Linaround-Light.woff') format('woff'),
       url('../fonts/Linaround-Light.otf') format('opentype');
  font-weight: 100;
  font-style: normal;

}