@import url('https://fonts.googleapis.com/css2?family=Yellowtail&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&family=Playwrite+IS:wght@100..400&display=swap');

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

:root {

  /* regpop.css starts here */
  --persian-blue: #1845ad;
  --bright-azure-color: #23a2f6;
  --fiery-orange-color: #ff512f;
  --sunset-orange-color: #f09819;
  --semi-transparent-white-color-reg: rgba(255, 255, 255, 0.13);
  --dark-shade-purle-color: rgba(8, 7, 16, 0.6);
  --color-red: red;
  --whisper-gray-color: #f1f1f1;
  --soft-light-white-color: rgba(255, 255, 255, 0.07);

  /* career.css starts here */

  --vivid-orange-color: #ff7029;
  --dark-charcoal-grey: #282b2d;
  --pumpkin-orange-color: rgba(255, 112, 41, 0.7);
  --pinkish-red-color: rgb(249, 119, 148);
  --medium-purple-color-rgb: rgb(98, 58, 162);
  --purple-light-color-rgb: rgb(102, 51, 153);
  --light-cyan-color-rgb: rgb(69, 179, 224);
  --light-greenish-yellow-color: #3f3f37;
  --cranberry-red-color: #b92b27;
  --royal-blue-color: #1565C0;
  --light-sky-blue-color-rgb: rgb(151, 213, 255);
  --light-pinkish-color-rgb: rgb(255, 155, 185);
  --light-violet-color-rgb: rgb(207, 150, 207);
  --light-bluish-color-rgb: rgb(107, 116, 179);
  --medium-violet-color-rgb: rgb(102, 51, 204);
  --medium-pink-redish-color-rgb: rgb(244, 111, 111);
  --lighter-violet-color-rgb: rgb(216, 176, 216);
  --lighter-cyan-color-rgb: rgb(53, 169, 215);
  --lighter-purplish-violet-color-rgb: rgb(247, 164, 216);
  --lighter-purple-blue-color-rbg: rgb(115, 102, 252);
  --reddish-brown-color: rgb(94, 6, 26);
  --dark-magneta-color: #ba07699b;
  --charcoal-grey-color: #5c5b59;
  --taupe-grey-color: rgba(92, 91, 89, 0.5);
  --taupe-greyish-color: #6a6561;
  --slate-grey-rgba-color: rgba(106, 101, 97, 0.9);
  --dark-blue-cyan-color: #093d5c;
  --semi-transparent-blue: rgba(9, 61, 92, 0.5);
  --venn-hover-background-color: rgba(55, 104, 140, 0.9);
  --venn-light-purple-color: rgba(94, 87, 123, 0.5);
  --venn-light-purple-hover-color: rgba(98, 95, 117, 0.9);
  --venn-light-greenish-color: rgba(98, 119, 70, 0.5);
  --venn-dark-greenish-color: rgba(58, 78, 32, 0.9);

  /* speaking.css starts here */

  --orange-color: orange;
  --dark-blue-color-service: #017AD5;
  --purple-Heliotrope-color: #a148ff;
  --charcoal-color: #252525;
  --coral-color: #ff6f45;
  --dark-gray-color: #3d3d3d;
  --Dark-Slate-Blue-color: #263d5a;
  --white-color: #ffffff;
  --light-grayish-color: #e9e9e8;
  --banner-background-gradient-start: rgba(255, 255, 255, 0.3);
  --banner-background-gradient-end: rgba(255, 255, 255, 0.6);
  --light-transparent-black-color: rgba(0, 0, 0, 0.1);
  --blur-filter: blur(3.5px);
  --border-radius: 30px;
  --light-cyan-color: #03e9f4;
  --accent-gradient: linear-gradient(90deg, var(--light-cyan-color) 0%, #ff6f45 100%);
  --rich-black-color: #080808;
  --banner-heading-line-color: #b80000;
  --button-text-color-active: #ffffff;
  --button-readmore-hover: #fff;
  --azure-blue-color-speaking: #0093E9;
  --azure-blue-light-color-speaking: #80D0C7;
  --banner-background-image: url(../img/background5.jpg);
  --section-background-image: url(../img/teal6.png);
  --button-hover-shadow: 0 0 5px var(--dark-blue-color-service),
    0 0 25px var(--dark-blue-color-service),
    0 0 50px var(--dark-blue-color-service),
    0 0 100px var(--dark-blue-color-service);

  /* social connection.css starts here */

  --color-royal-blue: #4169E1;
  --color-mulberry: #C06C84;
  --color-raspberry-rose: #C33764;
  --color-chartreuse: #7FFF00;
  --scl-card-body-card-text: rgb(37, 36, 36);
  --scl-card-body-card-tittle: #1d1160;

  /* worklife.css starts here */

  --wrk-life-flx-container: #fff;
  --wrk-life-flx-container-rgb: 0, 0, 0;
  --wrk-life-left-zone-list: #cccccc;
  --wrk-life-content_testimonial-1-h2: #d64541;
  --wrk-life-content_testimonial-2-h2: #f5d76e;
  --wrk-life-content_testimonial-3-h2: #00b16a;
  --wrk-life-content_testimonial-4-h2: #f27935;
  --wrk-life-content_testimonial-5-h2: #8013b3;
  --wrk-life-content_testimonial-1-label-bc: #d64541;
  --wrk-life-content_testimonial-2-label-bc: #f5d76e;
  --wrk-life-content_testimonial-3-label-bc: #00b16a;
  --wrk-life-content_testimonial-4-label-bc: #f27935;
  --wrk-life-content_testimonial-5-label-bc: #9d28b8;
  --wrk-life-content_testimonial-1-hover-bg1: #ffffff;
  --wrk-life-content_testimonial-1-hover-bg2: #d64541a3;
  --wrk-life-content_testimonial-2-hover-bg1: #ffffff;
  --wrk-life-content_testimonial-2-hover-bg2: #f5d76e59;
  --wrk-life-content_testimonial-3-hover-bg1: #ffffff;
  --wrk-life-content_testimonial-3-hover-bg2: #00b16aa3;
  --wrk-life-content_testimonial-4-hover-bg1: #ffffff;
  --wrk-life-content_testimonial-4-hover-bg2: #f27935a3;
  --wrk-life-content_testimonial-5-hover-bg1: #ffffff;
  --wrk-life-content_testimonial-5-hover-bg2: #a1117ba3;
  --wrk-life-p-testimonial-color: #808080d4;
  --wrk-life-p-testimonialform-color: #33475c;

  /* style.css starts here */
  --logo-text-color: #015AD5;

  --transparent-background: transparent;
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-black-rgb: 0, 0, 0;

  --color-red: #FF0000;
  --color-red-rgb: 255, 0, 0;

  --color-blue: #0000FF;
  --color-blue-rgb: 0, 0, 255;

  --color-yellow: #FFFF00;
  --color-yellow-rgb: 255, 255, 0;

  --color-magenta: #FF00FF;
  --color-magenta-rgb: 255, 0, 255;

  --color-purple: #800080;
  --color-purple-rgb: 128, 0, 128;

  --color-teal: #008080;
  --color-teal-rgb: 0, 128, 128;

  --color-cyan: #00FFFF;
  --color-cyan-rgb: 0, 255, 255;

  --color-orange: #fe5c02;
  --color-orange-rgb: 255, 165, 0;

  --color-gray: #808080;
  --color-gray-rgb: 128, 128, 128;
  --color-gray-rgba: rgba(64, 64, 64, 0.09);

  --color-light-gray: #D3D3D3;
  --color-light-gray-rgb: 211, 211, 211;

  --color-dark-gray: #A9A9A9;
  --color-dark-gray-rgb: 169, 169, 169;
  --color-darker-gray: #8c8c8c;
  --color-brown: #A52A2A;
  --color-brown-rgb: 165, 42, 42;

  --color-pink: #FFC0CB;
  --color-pink-rgb: 255, 192, 203;

  --color-gold: #FFD700;
  --color-gold-rgb: 255, 215, 0;
  --color-light-gold-yellow: #f6d365;
  --color-silver: #C0C0C0;
  --color-silver-rgb: 192, 192, 192;

  --color-sky-blue: #87CEEB;
  --color-sky-blue-rgb: 135, 206, 235;

  --color-forest-green: #228B22;
  --color-forest-green-rgb: 34, 139, 34;
  --color-amber: #f9b234;
  --color-dark-blue: #1D2671;
  --color-salt-box: #6C5B7B;


  --color-silver: #c6c6c6;
  --color-pistachio: rgb(178, 202, 58);
  --color-charcoal-gray: rgb(30, 30, 37);
  --rotating-border-button-background-color: #135058;
  --rotating-border-button-text-color: white;
  --media-icons-color: #262626;

  --media-icons-background-color: #f00;
  --media-icons-hover: #ffee10;
  --media-icons-text-shadow: #e2dfaf;
  --media-icons-sl-icon: #3b5999;
  --media-icons-sl2-icon: #0077b5;
  --media-icons-sl3-icon: #C33764;

  --color-gradient-back-to-top-start: #B06AB3;
  --color-gradient-back-to-top-middle: #4568DC;
  --color-gradient-back-to-top-end: #b47eb6;

  --color-gradient-back-to-top-hover-text: rebeccapurple;
  --navbar-light-gray: #EEEEE;
  --menu-button-border-color: #e7eaf6;
  --pulse-animate-background-color: rgba(0, 0, 209, 0.2);
  --pulse-animate-background-full-color: rgba(0, 206, 209, 0.8);
  --circular-menu-box-shadow: rgba(0, 0, 0, 0.3);
  --color-icon-item: #333;
  --about-background-color: #360033;
  --about-background-gradient-color: #0b8793;
  --about-background-gradient-bg1: #93860b87;
  --infocardcontainer-background-color: #355C7D;
  --color-media-label: #099CAC;
  --color-courses-item-date: #f9b234;
  --color-courses-item-box-shadow: #ffee10;
  --color-courses-item-hover: #e2dfaf;
  --cube-color1: #cf5c5c;
  --cube-color2: #c19b4a;
  --cube-color3: #def2a0;
  --cube-color4: #c6ee4a;
  --cube-color5: #42eca6;
  --cube-color6: #64b3d9;
  --cube-color7: #208ea2;
  --cube-color8: #498ada;
  --cube-color9: #5b73df;
  --cube-color10: #897ed3;
  --courses-item-bg1: #8a2387;
  --courses-item-bg2: #e94057;
  --courses-item-bg3: #f27121;
  --co-item-lgbg1: #f27121;
  --co-item-lgbg2: #9733ee;
  --co-item-lgbg3: #33001b;
  --co-item-lgbg4: #ff0084;
  --co-item-lgbg5: #FF512F;
  --co-item-lgbg6: #DD2476;
  --co-item-n5: #cd3e94;
  --co-item-n6: #4c49ea;
  --cd-success-bg: #CC95C0;
  --cd-success-lbg2: #DBD4B4;
  --cd-success-lbg3: #7AA1D2;
  --cd-success-lbg4: #203A43;
  --cd-success-lbg5: #2C5364;
  --cd-success-lbg6: #0F2027;
  --cd-success-bg2: rgb(2, 6, 23);
  --multi-card-color: rgb(88 199 250 / 0%);
  --multi-card-color-lbg1: #1d2b64;
  --multi-card-color-lbg2: #f8cdda;
  --multi-card-color-lbg3: #03001e;

  --multi-card-color-lbg4: #7303c0;
  --multi-card-color-lbg5: #c33764;
  --multi-card-color-lbg6: #1d2671;

  --stack-card-bg1: #44A08D;
  --stack-card-bg2: #093637;
  --btn-read-indian-red: #C04848;
  --btn-read-deep-purple: #480048;
  --intro-pastel-red: #f45b69;

  --maintimeline-rich-black: #232323;
  --timeline-teal-color: #158B8E;
  --bt-read1-peru: #D18B49;
  --service-block5-i-color: #0047AB;
  --service-block5-btn-readbg1: #FD8112;
  --service-block5-btn-readbg2: #0085CA;

  --font-title: "Montserrat", sans-serif;
  --font-text: "Lato", sans-serif;
  --gradient-start: hsla(0, 0%, 0%, 0);
  --gradient-mid: hsla(0, 0%, 0%, 0.3);
  --gradient-end: hsl(0, 0%, 0%);
  --periwinkle-blue: #C9D6FF;


  /* blog-listing-page.css starts here */
  --card-img-height: 200px;
  --white-smoke-color: #f5f5f5;
  --dark-teal-shade-color-rgba: rgba(31, 45, 61, 0.125);
  --cherry-red-color: #fc5356;
  --midnight-blue-color: #20247b;
  --dark-blue-color-blog: #304352;
  --light-grayish-orange-color: #d7d2cc;
  --alabaster-color: #e9e7e4;
  --lightest-grey-color: #eee;
  --shadow-blue: #6F8BA4;
  --transparent-black-rgba: rgba(0, 0, 0, 0);
  --slate-blue: #505f79;
  --news-tag-color: #36b37e;
  --deals-tag-color: #ffab00;
  --politics-tag-color: #ff5630;
  --lime-mint-color: rgba(227, 252, 239, 0.1);
  --transparent-black-color-rgba-shadow: rgba(0, 0, 0, 0.07);
  --transparent-black-color-rgba-hover: rgba(0, 0, 0, 0.65);
  --light-greyish-blue-color: #ebecf0;
  --red-color-text: #e01b1b;
  --purple-color-text: #cc15cc;
  --font-title: "Montserrat", sans-serif;

  /* blog-single.css starts here */

  --white-smoke-color: #f5f5f5;
  --cherry-red-color: #fc5356;
  --midnight-blue-color: #20247b;
  --dark-teal-shade-color-rgba: rgba(31, 45, 61, 0.125);
  --dark-blue-color-blog: #304352;
  --light-grayish-orange-color: #d7d2cc;
  --lightest-grey-color: #eee;
  --shadow-blue: #6f8ba4;
  --zinc-white-color: #ddd;
  --dribbble-bg-color: #ea4c89;
  --dribbble-box-shadow: rgba(234, 76, 137, 0.5);
  --behance-bg-color: #0067ff;
  --behance-box-shadow: rgba(0, 103, 255, 0.5);
  --linkedin-bg-color: #0177ac;
  --linkedin-box-shadow: rgba(1, 119, 172, 0.5);
  --red-color: #ff0000;
  --semi-transparent-tomato-red: rgba(252, 83, 86, 0.6);
  --semi-transparent-black: rgba(0, 0, 0, 0.5);
  --semi-transparent-black-shadow: rgba(0, 0, 0, .6);
  --vivid-sky-blue: #03e9f4;
  --black-color: #000;

  /* career.css starts here */

  --logo-text-color: #015AD5;
  --color-white-rgb: 255, 255, 255;
  --button-background-color: #f1db25;

  /* coaching and training.css starts here */

  --color: rgba(30, 30, 30);
  --bgColor: rgba(245, 245, 245);
  --color-green-rgb: 0, 128, 0;
  --coachTraining-brochure-skyblue: #007bff;
  --coachTraining-brochure-hover: #0056b3;
  --coachTraining-formcontrol-color: #495057;
  --coachTraining-formcontrol-border: #ced4da;
  --coachTraining-formcontrol-bordercolor-focus: #80bdff;
  --coachTraining-formcontrol-boxshadow: rgba(0, 123, 255, 0.25);
  --coachTraining-formcontrol-placeholder: #6c757d;
  --coachTraining-formcontrol-disabled: #e9ecef;
  --coachTraining-formcontrol-label-color: #007bff;
  --coachTraining-showread-faqtoggle: #007bff;
  --coachTraining-userreviewcontainer: #007bff;
  --coachTraining-module-badge: #007bff;
  --coachTraining-courses-card: #007bff;
  --coachTraining-headform-boxshadow: rgb(0 0 0 / 25%);
  --coachTraining-button-bg1: #6FB2D2;
  --coachTraining-button-bg2: #711A75;
  --coachTraining-downloadbrochure-hoverbg1: #FF577F;
  --coachTraining-downloadbrochure-hoverbg2: #192965;
  --coachTraining-leftcourse-innerbg1: #d9a7c7;
  --coachTraining-leftcourse-innerbg2: #fffcdc;
  --coachTraining-fa-icon-color: rgb(31, 87, 109);
  --coachTraining-faq-title-color: #5f2c82;
  --coachTraining-coursefaq-bg: #5f2c82;
  --coachTraining-timeline-line-bg: #d9a7c7;
  --coachTraining-timeline-line-bg2: #fffcdc;
  --coachTraining-timeline-dot-color: #480048;
  --coachTraining-c-slide-bg1: #A3CCB6;
  --coachTraining-c-slide-bg2: #EC7871;
  --coachTraining-c-slide-border: #FCEDB7;
  --coachTraining-key-bg: #6666661a;
  --coachTraining-marquee-i-color: #126180;
  --coachTraining-marquee-img-border: #eee;
  --coachTraining-timelinep-bg1: #743ad5;
  --coachTraining-timelinep-bg2: #d53a9d;
  --coachTraining-timelinep-bg3: #30cfd0;
  --coachTraining-timelinep-bg4: #330867;
  --coachTraining-timelinep-color: #34435E;
  --coachTraining-timecard-bg1: #C5796D;
  --coachTraining-timecard-bg2: #DBE6F6;
  --coachTraining-timecard-bg3: #d9a7c7;
  --coachTraining-timecard-a-hover: #330867;
  --coachTraining-timecard-ptext-hover: #192965;
  --coachTraining-card-main-border: #283593;
  --coachTraining-card-0-bg1: #ad5389;
  --coachTraining-card-0-bg2: #3c1053;
  --coachTraining-profile-bg1: #df89b5;
  --coachTraining-profile-bg2: #bfd9fe;
  --coachTraining-faqscolor: #2b2b2b;
  --coachTraining-accordion-button-color: #192965;
  --coachTraining-accordion-button-bg: #e7f1ff;
  --coachTraining-courses-card-boxshadow: rgba(207, 216, 220, .4);
  --coachTraining-icon-bg: #eee;
  --coachTraining-viewCourseCta-color: #4079da;
  --coachTraining-badgespan-bg: #fffbec;
  --coachTraining-badgespan-color: #fed85d;
  --coachTraining-text2-color: #a5aec0;
  --coachTraining-card-carousel1-p-color: #303133;
  --coachTraining-card-carousel1-cardhead-color: #0056b3;
  --coachTraining-carousel-btn-color: #004975;
  --coachTraining-sub-info-color: #004975;
  --coachTraining-ul-underline-brdrbtm-color: #eee;
  --coachTraining-medium-bordered-icon-color: #d0d0d0;
  --coachTraining-largest-icon-bg: #8fc135;
  --coachTraining-iconlist-timeline-bc: #ccc;
  --coachTraining-exp-separator-bc: #0cb4ce;
  --coachTraining-sec-title-color: #303133;
  --coachTraining-pathslidewrpp-bshadow: rgb(53, 53, 53);
  --coachTraining-pathslide-tcard-h1: #004975;
  --coachTraining-btnlbtn-boxshadow: rgba(56, 56, 56, 0.822);
  --coachTraining-btnlbtn-hover: rgb(11, 185, 238);
  --coachTraining-btnlbtn-checked: rgba(53, 53, 53, 0.308);
  --coachTraining-btnlbtn-checked-bg: #87CEFA;
  --coachTraining-course-faq-n-odd-bg: #262b15;
  --coachTraining-course-faq-n-even-bg: #5a293c;
  --logo-text-color: #015AD5;
  --forest-green: #2acc80;
  --Bittersweet: #ff606e;
  --modal-medium-gray: #8d8d8d;
  --blue-grey: #495056;
  --light-shade-blue: #ebeff8;
  --semi-transparent-white-color: rgba(255, 255, 255, 0.3);
  --light-black-opacity-color: rgba(0, 0, 0, 0.1);
  --semi-black-transparent-color: rgba(0, 0, 0, 0.75);
  --dark-cyan-color-modal: rgba(12, 12, 12, 0.363);
  --semi-transparent-red-color: rgba(255, 0, 0, 0.75);
  --blue-violet-color: #6c63ff;
  --light-blue-violet-color: #4a40c8;

  /* contacts.css starts here */

  --color-greenyellow: #ADFF2F;
  --contact-info-item-bg: #130F40;
  --contact-page-form-h2: #071c34;
  --contact-page-form-input-sbmt-color: #071c34;
  --contact-page-info-icon-color: #fda40b;
  --contact-page-info-text-color: #999999;
  --contact-page-form-input-color: #f9f9f9;
  --contact-page-form-singleinput-field-txtcolor: #f9f9f9;
  --contact-page-form-singleinput-field-btncolor: #fda40b;
  --contact-page-form-singleinput-field-btnhover-color: #071c34;
  --contact-page-form-singleinput-field-h4-color: #464646;
  --contact-page-form-singleinput-field-btnwhitecolor: #ffff;

  /* emotion_well.css starts here */

  --emtl-slider-content: #333333;
  --emtl-card-crimson-red: #970C0A;
  --color-dark-charcoal: #282828;
  --emtl-card-text-bg: #e6b09d;
  --emtl-slider-golden-rod: #fdc84b;
  --emtl-slider-bg1-magenta: #e4267c;
  --emtl-slider-bg2-dodgerblue: #2682e4;
  --emtl-button: #007BFF;
  --emtl-button-hover: #0056b3;
  --emtl-button-focus: rgba(0, 123, 255, 0.5);
  --emtl-button-disabled: #cccccc;
  --emtl-button-bg: #6235ac;
  --emtl-slider-likes: #ff6060;

  /* enroll.css starts here */

  --white-color: #fff;
  --transparent-black-color-bg: rgba(0, 0, 0, 0.4);
  --dark-blue-color-enroll: #5369f8;

  /* environment care.css starts here */
 
  --envprot-button-activebg: #ffffe6;
  --envprot-button-color: #10100e;

  /* events.css starts here */

  --blue-greyish-color: #8d97ad;
  --dark-slate-blue-color-events: #3e4555;
  --whitish-grey-color: #f4f8fa;
  --blue-light-color: #316ce8;
  --blue-lighter-color-events: #188ef4;
  --light-grey: #ddd;
  --light-lavender-color: #e0e0e5;
  --dark-yellowish-color: #f9d442b9;
  --light-yellowish-color: #f9d342;
  --medium-yellowish-color: #d4b743;
  --dark-shade-greyish: #292826;

  /* footer.css strats here */

  --text-hover-black-footer: black;
  --footer-bg-color: rgba(0, 0, 0, 0.6);
  --facebook-icon-hover-footer: #3b5999;
  --twitter-icon-hover-footer: black;
  --linkedin-icon-hover-footer: #0077b5;
  --insta-start-icon-hover-footer: #1D2671;
  --insta-end-icon-hover-footer: #C33764;
  --highlight-color: #ffee10;
  --footer-list-hover-color: #757575;
  --cursor-pointer-color: green;
  --page-footer-bg: rgba(255, 255, 255, 0.2);
  --box-shadow-color: rgba(0, 0, 0, 0.1);

  /* health first.css starts here */

  --htcard-body-bg: rgba(106, 104, 104, 0.2);
  --htcard-heading-velvet: rgba(168, 15, 109, 0.955);
  --htcard-bgrnd1-cornflower-blue: #4568DC;
  --htcard-bgrnd2-mediumpurple: #B06AB3;
  --htcard-bgrnd3-whitesmoke: #f0f2f0;
  --healcard-heading-plum: #4B1248;
  --healcardbg1: #B06AB3;
  --healcardng2: #C33764;
  --htcard-blog-slider-box-shadow: rgba(34, 35, 58, 0.2);
  --htcard-blog-slider-mandarinorange: #fe8a39;
  --htcard-blog-slider-crimsonred: #fd3838;
  --htcard-blog-slider-boxshadow: rgba(252, 56, 56, 0.2);
  --htcard-blog-slider-title: #0d0925;
  --htcard-blog-slider-text: #4e4a67;
  --htcard-blog-slider-button-border: rgba(252, 56, 56, 0.4);
  --htcard-blog-slider-pagination-bullet: rgba(252, 56, 56, 0.3);
  --htcard-blog-slider-page-bullet-active: #062744;
  --htcard-card-carousel: #303133;
  --htcard-card-head-medium-blue: #0056b3;
  --htcard-carousel-button: #004975;

  /* job guarantee.css starts here */

  --red-color: red;
  --light-grayish-blue: #ECF1F5;
  --light-blue-color: rgba(8, 15, 52, 0.04);
  --black-color: black;
  --grey-color: #686868;
  --dark-gray-color: #3E3E3E;
  --custom-purple-color: #2b0353;
  --dark-gray-color-btn: #333;
  --transparent-pruple-color-rgba: rgba(96, 8, 52, 0.671);
  --light-grayish-blue-color: #f5f6fa;
  --light-grey-color-pop: #f9f9f9;
  --transparent-black-color-rgba-shadow: rgba(0, 0, 0, 0.1);
  --red-shade-color: #ff6b6b;
  --gray-shade-color: #555;
  --light-purple-color: #BE93C5;
  --light-cyan-color: #7BC6CC;
  --purple-color-rgba-box: rgb(128, 2, 128);
  --red-purple-color-h2: #7a0e3b;
  --gray-shadow-color-courses: #666;
  --medium-grey-color: #6e6e6e;
  --cyan-blue-color: #00accd;
  --light-grey-color-btn: #b3b3b3;
  --light-grey-btn-color: #a5a5a5;
  --custom-blue-cyan-color: #95d7e4;
  --light-pink-color: #F29492;
  --dark-cyan-color-border: #0bf4f3;
  --dark-blue-color-card: #1D2B64;
  --transparent-black-color-bg: rgba(0, 0, 0, 0.5);
  --lightest-gray-color-bg: #fafafa;
  --dark-gray-bgcolor: #212121;

  /* latest news.css starts here */

  --blackberry-color: #360033;
  --metallic-seaweed-color: #0b8793;
  --blue-purple-color: #3a3973;
  --light-shadow-blue-color: rgba(31, 45, 61, 0.125);
  --fiery-rose-color: #fe4f6c;

   /* mental health.css starts here */

   --mth-card-body-text: rgb(37, 36, 36);
   --mth-slider-controller-hover: #2da6ff;
   --mth-slider-control-bg: #e2e2e2;
 
   /* nav.css starts here */
 
   --color-text-Light-Gray: #999;
   --color-navbar-sidebar-bg: black;
   --color-navbar-sidebar-text: #fff;
   --color-navbar-sidebar-hover-bg: #fff;
   --color-navbar-sidebar-hover-text: black;
   --color-navbar-article-bg: black;
   --color-navbar-article-text: #fff;
   --color-box-shadow: rgba(0, 0, 0, 0.1);
 
   /* physical health.css starts here */
 
   --phcardbody-card-text: rgb(37, 36, 36);
   --phcardbody-sliderpage-content: #e2e2e2;
   --phcardbody-sliderpage-link-pewterblue: #80a1c1;
   --phcardbody-sliderpage-link-hover: #6386a9;
 
   /* preventive care.css starts here */
 
   --prevcare-button-color: #10100e;
   --prevcare-dots-bg: #242421;
   --prevcare-dots-activebg: #ffffe6;
 
   /* public speaking.css starts here */
 
   --orange-red-color: #e93f1a;
   --white-color: white;
   --semi-transparent-white-color: rgba(255, 255, 255, 0.1);
   --white-color1: #ddd;
   --transparent-black-color-rgba: rgba(0, 0, 0, 0);
   --chaos-black-color: #101010;
   --light-shade-grey-color: #aaa;
   --carousel-speaking-nav-color1: #c514bf;
   --carousel-speaking-nav-color2: #e36b09;
   --carousel-speaking-nav-color3: #820333;
   --carousel-speaking-nav-color4: #c9283e;
   --carousel-speaking-nav-color5: #0bdaf1;
   --carousel-speaking-nav-color6: #27f40c;
   --carousel-speaking-nav-color7: #530ff2;
   --carousel-speaking-nav-color8: #c0ed0eab;
   --very-dark-grey-color: #080808;
   --dark-red-color: #b80000;
   --magenta-color: magenta;
   --light-transparent-black-color-rgba1: rgba(0, 0, 0, 0.1);
   --deep-blue-purple-color: #3B2ED0;
   --gunmetal-color: #535062;
   --dark-indigo-color-rgba: rgba(12, 5, 46, 0.3);
   --dark-indigo-color-rgba1: rgba(12, 5, 46, 0.25);
   --snow-white-color: #F5F4FE;
   /* --light-purle-color-circle-rgba1: rgba(60, 26, 229, 0.25);
   --light-purle-color-circle-rgba2: rgba(60, 26, 229, 0.247904);
   --light-purle-color-circle-rgba3: rgba(59, 26, 229, 0.241896);
   --light-purle-color-circle-rgba4: rgba(58, 26, 229, 0.2324);
   --light-purle-color-circle-rgba5: rgba(57, 26, 229, 0.219837);
   --light-purle-color-circle-rgba6: rgba(55, 26, 229, 0.20463);
   --light-purle-color-circle-rgba7: rgba(53, 26, 229, 0.1872);
   --light-purle-color-circle-rgba8: rgba(51, 26, 229, 0.16797);
   --light-purle-color-circle-rgba9: rgba(48, 26, 229, 0.147363);
   --light-purle-color-circle-rgba10: rgba(46, 26, 229, 0.1258);
   --light-purle-color-circle-rgba11: rgba(44, 26, 229, 0.103704);
   --light-purle-color-circle-rgba12: rgba(41, 26, 229, 0.0814963);
   --light-purle-color-circle-rgba13: rgba(39, 26, 229, 0.0596);
   --light-purle-color-circle-rgba14: rgba(36, 26, 229, 0.038437);
   --light-purle-color-circle-rgba15: rgba(34, 26, 229, 0.0184296);
   --light-purle-color-circle-rgba16: rgba(32, 26, 229, 0);
   --light-purle-color-circle2-rgba: rgba(60, 26, 229, 0); */
   --indigo-color-circle: #3C1AE5;
   --rotate-speed: 40;
   --count: 8;
   --easeInOutSine: cubic-bezier(0.37, 0, 0.63, 1);
   --easing: cubic-bezier(0.000, 0.37, 1.000, 0.63);
   --light-orange-color-circle-rgba1: rgba(255, 165, 0, 0.25);
   --light-orange-color-circle-rgba2: rgba(255, 165, 0, 0.247904);
   --light-orange-color-circle-rgba3: rgba(255, 165, 0, 0.241896);
   --light-orange-color-circle-rgba4: rgba(255, 165, 0, 0.2324);
   --light-orange-color-circle-rgba5: rgba(255, 165, 0, 0.219837);
   --light-orange-color-circle-rgba6: rgba(255, 165, 0, 0.20463);
   --light-orange-color-circle-rgba7: rgba(255, 165, 0, 0.1872);
   --light-orange-color-circle-rgba8: rgba(255, 165, 0, 0.16797);
   --light-orange-color-circle-rgba9: rgba(255, 165, 0, 0.147363);
   --light-orange-color-circle-rgba10: rgba(255, 165, 0, 0.1258);
   --light-orange-color-circle-rgba11: rgba(255, 165, 0, 0.103704);
   --light-orange-color-circle-rgba12: rgba(255, 165, 0, 0.0814963);
   --light-orange-color-circle-rgba13: rgba(255, 165, 0, 0.0596);
   --light-orange-color-circle-rgba14: rgba(255, 165, 0, 0.038437);
   --light-orange-color-circle-rgba15: rgba(255, 165, 0, 0.0184296);
   --light-orange-color-circle-rgba16: rgba(255, 165, 0, 0);
   --light-orange-color-circle2-rgba: rgba(255, 165, 0, 0);
   --dark-orange-color-rgba: rgba(153, 76, 0, 0.3);
   --dark-orange-color-rgba1: rgba(153, 76, 0, 0.25);

  /* life lessons.css starts here */

  --blue-color: #007bff;
  --dark-gray-color: #333;
  --dark-blue-color: #33475c;
  --light-blue-hover-color: #2682e4;
  --light-sea-green-color: #0cb4ce;
  --lighter-grey-color-rgba: rgba(255, 255, 255, 0.2);
  --dark-grey-color-rgba: rgba(0, 0, 0, 0.1);
  --transparent-grey-color-rgba: rgba(255, 255, 255, 0.3);
  --dark-teal-color-rgb: rgb(7, 108, 103);
  --light-charcoal-color-shadow: #474747;
  --medium-blue-color: #079cf2;
  --white-smoke-color: whitesmoke;
  --very-light-grey: #cccccc;
  --dark-blue-color-abt: #263d5a;
  --light-transparent-dark-grey: rgba(0, 0, 0, 0.12);
  --light-off-white-color: #eef2f3;
  --dim-grey-color-rgba-shadow: rgba(0, 0, 0, 0.2);
  --smoke-grey-color-rgba-shadow: rgba(0, 0, 0, 0.24);
  --testimonial-color-1: #d64541;
  --testimonial-color-2: #f5d76e;
  --testimonial-color-3: #00b16a;
  --testimonial-color-4: #f27935;
  --testimonial-color-5: #f2355e;
  --testimonial-color-6: #4122de;
  --testimonial-color-7: #7ade22;
  --testimonial-color-8: #de9922;
  --testimonial-hover-color-1: #d64541a3;
  --testimonial-hover-color-2: #f5d76e59;
  --testimonial-hover-color-3: #00b16aa3;
  --testimonial-hover-color-4: #f27935a3;
  --testimonial-hover-color-5: #f23574a3;
  --testimonial-hover-color-6: #6435f2a3;
  --testimonial-hover-color-7: #5ef235a3;
  --testimonial-hover-color-8: #f2d235a3;
  --background-color-light-white-blue: #f5f7fa;
  --secondary-background-color-light-white: #c3cfe2;
  --midnight-blue-text-color: #002147;
  --smoky-black-color: #16161d;
  --gratitude-header-color: #666;
  --button-background-color: #f1db25;
  --turquoise-blue-shadow-color: rgba(12, 231, 235, 1);
  --violet-blue-color-carosel: #3d76d9;
  --highly-transparent-black-color: rgba(0, 0, 0, .1);
  --semi-transparent-black-color-rgba: rgba(0, 0, 0, .5);
  --semi-transparent-black-color1-rgba: rgba(0, 0, 0, 0.3);
  --semi-transparent-black-color2-rgba: rgba(0, 0, 0, .28);
  --midnight-teal-color: #004975;
  --zinc-white-color: #eee;
  --green-yellow-color: #8fc135;
  --ghost-white-color: #d0d0d0;
  --grayish-blue-color: #303133;
  --golden-orange-color: #f89d36;
  --light-grey-color-service: #dee2e6;
  --lightest-grey-color-service: #fafafb;
  --dim-grey-color-rgba-shadow: rgba(47, 60, 78, 0.15);
  --zinc-white-color1: #ddd;
  --main-accent-color-learning: rgba(31, 181, 172, .9);
  --secondary-accent-color-service: #86bc42;
  --tertiary-accent-color-service: #48c7ec;
  --grey-color-corner: #999;
  --raisin-black-color: #222222;
  --highlight-color: #ec6d48;
  --floral-white-color-service: #f8f9fa;
  --aluminium-white-color-service: #f7f7f7;
  --black-color-text: #000;
  --blood-red-color-hover: #D00003;
  --semi-transparent-charcoal-gray-color: rgba(50, 50, 50, 0.16);
  --black-color-tex-service: #000;

}


.dancing-script-trail-main {
  /* font-family: "Dancing Script", cursive; */
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}

@media only screen and (min-width: 1000px){
  .dancing-script-trail-main{
    font-size: 50px;
  }
}

@media screen and (max-width: 600px) {
  .card-swiper #nextButton{
      width: 200px;
  }

}

.lrnfail-section2 .heading-title, .medium .heading-title{
  color: var(--logo-text-color);
  font-size: 20px;
}


body {
  font-family: 'Poppins', 'Courier New', Courier, monospace;
  overflow-x: hidden;
  /* background: #000046; 
  background: -webkit-linear-gradient(to bottom, #1CB5E0, #000046); 
  background: linear-gradient(to bottom, #1CB5E0, #000046);
   */


  /* background-repeat: no-repeat; */


  /* background-color: rgba(0, 0, 0, 0.6) !important;  */
  /* backdrop-filter: blur(5px); */

  top: 0;
  left: 0px;
  /* animation: animateImageOpacity 70s ease-in-out infinite;  */
  /* background: rgba(255, 255, 255, 0.2);

top: 0;
 left: 0px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px); */

}

/* @keyframes animateImageOpacity {

  0% {
    background-position: 0% 0%;
  }

  25% {
    background-position: 50% 0%;
  }

  50% {
    background-position: 100% 0%;
  }

  75% {
    background-position: 50% -0%;
  }

  100% {
    background-position: 0% 0%;
  }
}  */
/* --------------------------------stars--------------------------------------- */




/* ------------------Enroll now ------------------ */

.rotating-border-button {
  /* background-color: #135058; */
  border-radius: 125px;
  background-color: var(--logo-text-color);
  color: var(--color-white);
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  /* display: inline-block; */
  font-size: 26px;
  /* margin-top: 200px; */
  cursor: pointer;
  position: relative;
  overflow: hidden;
  width: 250px;
  border: none;


}

/* .yellowtail-regular {
  font-family: "Yellowtail" !important;
  font-weight: 400 !important;
  font-style: normal !important;
  text-transform: uppercase !important;
} */

.enroll-btn {
  display: flex;
  /* flex-direction: row; */
  /* justify-content: end; */
  align-items: end;
  /* padding-top: 50px; */
  padding-left: 10%;
  margin-top: 30px;
  /* color: var(--white-color);
  background-color: var(--logo-text-color); */
}

.rotating-border-button:before {
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  width: calc(100% + 10px);
  height: calc(100% + 10px);
  /* border: 2px solid #4CAF50; */
  border-radius: 50%;
  z-index: -1;
  opacity: 0;
  transition: all 0.5s ease-in-out;
}

.rotating-border-button:hover {
  /* animation: rotate-border 1s linear infinite; */
  opacity: 1;
  background-color: var(--color-orange) !important;
  color: var(--white-color) !important;
}

@keyframes rotate-border {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.rotating-border-button:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background-color: #4CAF50; */
  /* border-radius: 50%; */
  z-index: -2;
  opacity: 0;
  transition: all 0.5s ease-in-out;
}

.rotating-border-button:hover:after {
  animation: pulse 1s ease-in-out infinite;
  opacity: 0.5;
}

@keyframes pulse {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.2);
  }

  100% {
    transform: scale(1);
  }
}

@media screen and (max-width: 992px) {

  .ht_0 {
    height: 0 !important;
  }
}

/* ----------------------------social media icons hover-------------- */

.media-icons {
  display: flex;
  flex-direction: row;
  /* justify-content: end; */
  justify-content: center;
  align-items: center;
  /* transform: translate(-50%, -50%); */
}

.d-block-ryt {
  display: block !important;
}


.media-icons a {
  /* width: 38px;
  height: 35px; */
  background-color: var(--color-white);
  text-align: center;
  line-height: 15px;
  font-size: 22px;
  margin: 0 10px;
  padding-top: 4px;
  display: block;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
  border: 0px solid var(--color-white);
  z-index: 1;
}

.media-icons a .smicon {
  position: relative;
  color: var(--media-icons-color);
  transition: .5s;
  z-index: 3;
}

.media-icons a:hover .smicon {
  color: var(--color-white);
  transform: rotateY(360deg);
  background-color: var(--transparent-background) !important;


}

.media-icons a:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--media-icons-background-color);
  transition: .5s;
  z-index: 2;


}

.media-icons a:hover {

  box-shadow: 0 0 5px var(--media-icons-hover);
  text-shadow: 0 0 35px var(--media-icons-text-shadow);
}

.media-icons a:hover:before {
  top: 0;
  transform: scale(1.1);
  box-shadow: 0 0 20px var(--media-icons-hover);
}

.media-icons .sl-icon:before {
  background: var(--media-icons-sl-icon) !important;

}

.media-icons .sl-icon1:before {
  background: var(--color-black) !important;
}

.media-icons .sl-icon2:before {
  background: var(--media-icons-sl2-icon) !important;
}

.media-icons .sl-icon3:before {
  background: var(--media-icons-sl3-icon);
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to bottom, var(--color-dark-blue), var(--media-icons-sl3-icon));
  background: linear-gradient(to bottom, var(--color-dark-blue), var(--media-icons-sl3-icon));

}

/* --------------social media icons hover ends------------------------- */
/* -------------------------------back to top button----------------- */
.back-to-top {
  background: var(--color-gradient-back-to-top-middle);
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, var(--color-gradient-back-to-top-start), var(--color-gradient-back-to-top-middle), var(--color-gradient-back-to-top-start));
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to bottom, var(--color-gradient-back-to-top-start), var(--color-gradient-back-to-top-middle), var(--color-gradient-back-to-top-end));
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  padding: 10px;
  position: fixed;
  display: none;
  right: 20px;
  bottom: 30px;
  z-index: 1;
  color: var(--color-white);
}

.back-to-top:hover {
  color: var(--color-gradient-back-to-top-hover-text) !important;
  background: var(--color-white) !important;
}

/* ----------------------------back to top button ends------------- */


.bg-custom {
  background-color: var(--color-black);
  color: var(--color-white);
}

.bg-light {
  /* background-color: #f0f0f0 !important; */
  background-color: var(--transparent-background) !important;
}

.btn {
  font-weight: 500;
  transition: .5s;
}

.btn.btn-primary {
  color: var(--color-white);
}

.headerContainer {
  background-image: url('../img/Body_Background.jpeg');
  background-size: cover;
  height: 500px;
  margin-left: -10px;

}
.text-orangered {
  color: #fe5c02 !important;
}

.text-anmi{
  overflow: hidden;
  /* border-right: 0.10em solid orange; */
  white-space: nowrap;
  animation: typing 4s steps(40, end) infinite;
}

@keyframes typing{
  from{
    width: 0;
  }
  to{
    width: 100%;
  }
}


.trail-sec {
  position: absolute;
  top: 40%;
  padding-left: 10%;
}

.btn-sm-square {
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  font-weight: normal;
}


.logo-img {
  width: 100%;
  height: 70px !important;

}

.navbar .dropdown-toggle::after {
  border: none;
  content: "\f107";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  vertical-align: middle;
  margin-left: 8px;
}

.navbar-light .navbar-nav .nav-link {
  margin-right: 30px;
  padding: 25px 0;
  color: var(--color-white);
  font-size: 15px;
  font-weight: 500;
  text-transform: capitalize;
  outline: none;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active {
  color: var(--color-orange);
}

@media (max-width: 991.98px) {
  .navbar-light .navbar-nav .nav-link {
    margin-right: 0;
    padding: 10px 0;
  }

  .navbar-light .navbar-nav {
    border-top: 1px solid var(--navbar-light-gray);
  }
}


.navbar-light .navbar-nav .nav-link {
  color: var(--color-white);
  font-weight: 500;
}

.navbar-light.sticky-top {
  /* top: -100px; */
  transition: .5s;
  z-index: 1001;
}

@media (min-width: 992px) {
  .navbar .nav-item .dropdown-menu {
    display: block;
    border: none;
    margin-top: 0;
    top: 150%;
    opacity: 0;
    visibility: hidden;
    transition: .5s;
  }

  .navbar .nav-item:hover .dropdown-menu {
    top: 100%;
    visibility: visible;
    transition: .5s;
    opacity: 1;
  }
}

.navbar {
  /* position: fixed;
margin-top: 145px; */
  width: 100%;
  background-color: var(--color-black);
  padding: 0;
  z-index: 1000;
}



/* ----------------------------------Navbar----------------------------- */
/* Style the navbar for a clean look */


.menu-button {
  margin-top: 100px;
  position: absolute;
  top: calc(50% - 40px);
  /* Adjusted to vertically center */
  left: calc(50% - 55px);
  /* Adjusted to horizontally center */
  text-decoration: none;
  text-align: center;
  color: var(--color-white);
  border-radius: 50%;
  display: block;
  height: 90px;
  width: 90px;
  line-height: 50px;
  padding-top: 35px;
  /* Remove padding */
  background-color: var(--transparent-background);
  /* Transparent background color */
  border: 5px solid var(--menu-button-border-color);
  /* Red border */
  animation: pulse 2s infinite alternate;
  /* Animation effect */
  box-shadow: 0 0 70px 30px var(--color-white);
}

@keyframes pulse {
  0% {
    background-color: var(--pulse-animate-background-color);
  }

  100% {
    background-color: var(--pulse-animate-background-full-color);
  }
}

/* -------------------------------------@@@@------------------------------- */
.circular-menu {
  width: 250px;
  height: 250px;
  margin: 0px auto;
  position: relative;
  margin-left: 62%;
  border-radius: 50%;
  padding: 20px;
  box-shadow: 0 0 20px rgba(var(--color-black), 0.3);
  display: block !important;
  padding-top: 130px;
}

.circle {

  width: 300px;
  height: 300px;
  opacity: 1;
  transform: scale(1);
  transition: all 0.4s ease-out;
}

/* -------------------test------------------ */

.outer-circle {

  position: absolute;
  margin-top: -20px;
  margin-left: -10%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--transparent-background);
  animation: rotate 10s linear infinite;
}

.inner-circle {
  position: absolute;
  margin-top: 200px;
  left: 100%;
  margin-left: -80px;
  transform: translate(-50%, -50%);
  width: 350px;
  height: 350px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
}

.icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 300px;
  height: 300px;
  text-align: center;
  text-decoration: none;
  color: var(--color-icon-item) !important;
  font-size: 14px;
  transition: all 0.3s ease;
}


.circle .fa-solid:hover {
  color: var(--color-light-gold-yellow) !important;
}

.circle .fa-solid:hover span {
  color: var(--color-white) !important;
}


@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}





/* ----------------------------testttt--------------------- */
.circle .fa-solid {
  font-size: 50px;
  display: inline-block !important;
  color: var(--color-white) !important;

}

.circle a {
  text-decoration: none;
  color: var(--color-white) !important;
  display: block !important;
  height: 40px;
  width: 40px;
  line-height: 40px;
  margin-left: -77px;
  margin-top: -85px;
  position: absolute;
  text-align: center;
  font-size: 20px;
  background-color: var(--transparent-background);
  padding-top: 20px;
  border-radius: 50%;


}


.circle a span {
  border: none !important;
  position: absolute;
  bottom: 60%;
  left: 50%;
  transform: translateX(-60%);
  width: 100%;
  text-align: center;
  color: var(--color-white) !important;
  font-size: large;
  font-weight: 500;
  border: none !important;
  line-height: 20px;
  display: inline-block !important;
  font-family: 'Poppins', 'Courier New', Courier, monospace;
}





/* ------------------------------ */
/* Footer css */
.logo-footer {
  width: 200px;
}
.logo-color{
  color: var(--white-color)
}


footer {
  background-color: rgba(var(--color-black), 0.6) !important;
}

.text-dark {
  color: var(--color-white) !important;
}

/* ----------------------about me css--------------------------------------------------- */
#about {
  background: var(--about-background-color);
  /* fallback for old browsers */
  /* background: -webkit-linear-gradient(to bottom, var(--about-background-color), var(--about-background-gradient-color), var(--about-background-color), var(--about-background-gradient-color)); */
  /* Chrome 10-25, Safari 5.1-6 */
  /* background: linear-gradient(to top, var(--about-background-gradient-color), var(--about-background-color), var(--about-background-gradient-color)); */
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  background: linear-gradient(to top right, #373636, var(--about-background-color), var(--about-background-gradient-bg1));
}

.bg-image {
  background: linear-gradient(to top, var(--color-salt-box), transparent, var(--color-mulberry)) !important;
}


#blur-overlay {

  backdrop-filter: blur(2px);
  /* Adjust the blur amount */
  z-index: 1;
  /* Ensure the overlay is on top of the background image */
}

/* ----- */
.infocardContainer * {

  font-family: 'Poppins', 'Courier New', Courier, monospace;
  font-weight: 300;
  width: 800px;
  /* height: 350px; */
}

a {
  text-decoration: none;
}

/* a:visited {
color: #555566;
} */
/* a:hover {
text-decoration: underline;
} */
.infocardContainer {

  display: flex;
  height: 200px;
  width: 200px;
  border-radius: 100px;
  background: var(--transparent-background);
  /* background: #ad5389;  */
  /* /* background: -webkit-linear-gradient(to right, #3c1053, #ad5389);   */
  background: var(--infocardcontainer-background-color);
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, var(--color-mulberry), var(--color-salt-box), var(--infocardcontainer-background-color));
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, var(--color-salt-box), transparent, var(--color-mulberry));
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */


  transition: all 500ms ease-in;
  transition-delay: 1s;
  margin: auto;
  /* margin-top: 75px; */
  margin-bottom: 25px;
  --margin-top: 100px;
}

.infocardContainer {
  width: 100%;
  /* height: 300px; */
  border-radius: 100px 80px 80px 100px;
  transition: all 1s ease-out;
  padding-bottom: 60px;
  margin-bottom: 50px;

}

.infocardContainer #textbois {
  padding-top: 10px !important;
  display: block !important;
}

.infocardContainer {
  height: auto !important;
  padding: 10px !important;
}

.infocardContainer #image-profile {
  padding-top: 75px !important;

}

.infocardContainer .about-list {
  margin-top: 0px !important;
  /* padding-top: 3px !important; */
}

.infocardContainer #textbois .para {

  display: block !important;
  color: var(--color-white);
  margin-bottom: 30px !important;
  /* overflow-x: hidden !important; */
  height: auto !important;
  width: 100%;
  /* Hide horizontal overflow */
  white-space: nowrap;
  line-height: 2em !important;
  /* Prevent text from wrapping */
  /* text-overflow: ellipsis !important;
  width: calc(100% - 20px); */
  /* Adjust the width on hover */

}

.infocardContainer div {
  /* text-color: white; */
  flex-shrink: 1;
  width: 100%;
  --background-color: var(--color-forest-green);
}

.infocardContainer div * {
  /* display: flex; */
  --flex: inherit;
  overflow: hidden;
  text-overflow: hidden;
  --background-color: var(--color-yellow);
  color: var(--color-white);
  white-space: nowrap;
  width: 0;
  height: auto;
  transition: all 450ms ease-in;
  transition-delay: 1s;
}

.infocardContainer div * {
  --background-color: var(--color-purple);
  /* display: flex;
  justify-content: left;
  align-items: center; */
  visibility: visible;
  transition: all 1s ease-out;
  transition-delay: 500ms;
  width: 100%;
  height: auto;

}

.infocardContainer #image-profile,
.infocardContainer #image-profile img {
  --background-color: var(--color-red);
  height: 200px;
  width: 200px;
  padding-right: 10px;
  border-radius: 100%;
  flex-shrink: 0;
  object-fit: cover;
}

.infocardContainer #image-profile img {
  height: 200px;
  width: 180px;
  transition: none;
  display: float;
  position: relative;
  border: 0px solid var(--color-white);
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

.infocardContainer #textbois {
  position: relative;

}

/* Style the headings */
.dark-color {
  color: var(--color-white);
  /* Set dark color */
  margin-bottom: 5px;
  /* Add some bottom margin */
}

.theme-color {
  color: var(--color-pistachio) !important;
  /* Set theme color */
}

/* Style the paragraphs */
#textbois p {
  line-height: 1.5;
  /* Set line height */


}

#textbois {
  display: none;
}

#textbois .para {

  width: 100%;
  height: 40vh;
  margin-bottom: 10px !important;
  /* position: absolute; */

}

.media {
  width: 50% !important;
}

/* Style the labels */
.media label {
  font-weight: bold;
  /* Make it bold */
  color: var(--color-media-label) !important;
}

/* Style the details */
.media p {
  margin-bottom: 5px;
  /* Add some bottom margin */
}

/* Style the row */
/* .about-list {
margin-top: 20px; } */

/* Style the columns */
.about-list .col-md-6 {
  padding: 0 0px;
  /* Add padding */
}

/* ----------------------------about me css ends------------------------------------------ */
/* --------------------------------happy client section------------------------------ */

.counter {

  display: block !important;
}

/* .stage {

  background: rgba(255, 255, 255, 0.2); 
  border-radius: 16px;
  box-shadow: 0 4px 30px rgba(var(--color-black-rgb), 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  margin-bottom: 50px;
  margin-top: 0px;
  width: 100% !important;
  background-image: url("../img/teal6.png");
  background-size: cover;
  background-repeat: no-repeat;
} */

/* .stage .cubespinner {

  animation: 13s ease-in-out 0s infinite normal none running spincube;
  transform-style: preserve-3d;
  transform-origin: 50px 50px 0px;
  margin-left: 33% !important; */
/* margin-left: calc(50% - 50px); */
/* 
}


.face1.active,
.face2.active,
.face3.active,
.face4.active {
  animation: none;
}


@keyframes spincube {

  from,
  to {
    -moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    -ms-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
  }

  16% {
    -moz-transform: rotateY(-90deg);
    -ms-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
  }

  33% {
    -moz-transform: rotateY(-90deg) rotateZ(90deg);
    -ms-transform: rotateY(-90deg) rotateZ(90deg);
    transform: rotateY(-90deg) rotateZ(90deg);
  }

  50% {
    -moz-transform: rotateY(-180deg) rotateZ(90deg);
    -ms-transform: rotateY(-180deg) rotateZ(90deg);
    transform: rotateY(-180deg) rotateZ(90deg);
  } */

/* 66% {
 -moz-transform: rotateY(-270deg) rotateX(90deg);
 -ms-transform: rotateY(-270deg) rotateX(90deg);
 transform: rotateY(-270deg) rotateX(90deg);
} */
/* 83% {
 -moz-transform: rotateX(90deg);
 -ms-transform: rotateX(90deg);
 transform: rotateX(90deg);
} */
/* } */
/* 
.cubespinner {
  -webkit-animation-name: spincube;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-duration: 12s;

  animation-name: spincube;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-duration: 12s;

  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;

  -webkit-transform-origin: 60px 60px 0;
  -moz-transform-origin: 60px 60px 0;
  -ms-transform-origin: 60px 60px 0;
  transform-origin: 60px 60px 0;
} */

/* .stage div {

  position: absolute;
  width: 100px;
  height: 100px;
  border: 2px solid var(--color-charcoal-gray);
  background: rgba(var(--color-black-rgb), 0.9);
  text-align: center;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;


} */

/* .cubespinner div {

  position: absolute;
  width: 180px;
  height: 180px; */
/* /* border: 1px solid #ccc; */
/* border-radius: 20px; */
/* background: rgba(255,255,255,0.8); */
/* background: transparent;
  box-shadow: inset 0 0 20px rgba(var(--color-white-rgb), 0.2);
  line-height: 100px;
  text-align: center;
  font-size: 100px;
  animation: animateBg 10s linear infinite;
  background-image: linear-gradient(0deg, var(--cube-color1), var(--cube-color2), var(--cube-color3), var(--cube-color4), var(--cube-color5), var(--cube-color6), var(--cube-color7), var(--cube-color8), var(--cube-color9), var(--cube-color10), var(--cube-color1), var(--cube-color2));
  background-size: 100% 1100%;

} */

/* @keyframes animateBg {
  0% {
    background-position: 0% 0%;
  }

  100% {
    background-position: 0% 100%;
  }
} */


/* .cubespinner .face1 {
  -webkit-transform: translateZ(60px);
  -moz-transform: translateZ(60px);
  -ms-transform: translateZ(60px);
  transform: translateZ(60px);
}

.cubespinner .face2 {
  -webkit-transform: rotateY(90deg) translateZ(60px);
  -moz-transform: rotateY(90deg) translateZ(60px);
  -ms-transform: rotateY(90deg) translateZ(60px);
  transform: rotateY(90deg) translateZ(60px);
}

.cubespinner .face3 {
  -webkit-transform: rotateY(90deg) rotateX(90deg) translateZ(60px);
  -moz-transform: rotateY(90deg) rotateX(90deg) translateZ(60px);
  -ms-transform: rotateY(90deg) rotateX(90deg) translateZ(60px);
  transform: rotateY(90deg) rotateX(90deg) translateZ(60px);
}

.cubespinner .face4 {
  -webkit-transform: rotateY(180deg) rotateZ(90deg) translateZ(60px);
  -moz-transform: rotateY(180deg) rotateZ(90deg) translateZ(60px);
  -ms-transform: rotateY(180deg) rotateZ(90deg) translateZ(60px);
  transform: rotateY(180deg) rotateZ(90deg) translateZ(60px);
} */


/* .face1 .content,
.face2 .content,
.face3 .content,
.face4 .content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 1;

} */


.content {

  width: 80%;
  height: 80%;
  /* line-height: 12px; */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

}

/* .cubespinner {

  padding-top: 40px;
  height: 300px;

} */

.count {

  font-size: 24px;
  font-weight: bold;
}

p {
  margin-top: 5px;
  font-size: 15px;
  font-weight: 700;
}

.bg-ctr {
  background: transparent !important;
  background: var(--infocardcontainer-background-color);
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, var(--color-mulberry), var(--color-salt-box), var(--infocardcontainer-background-color));
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, var(--color-salt-box), transparent, var(--color-mulberry));
}

/* 

.stage .counter {

  display: block !important;
}

/* --------------------------------------------Card------------------- */
/* Reusable variables */
/* Count data styles */

/* --------------------------------------------------- */
/* .format-container {
width: 70%;
margin: 0 auto;
} */


.courses_box {

  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;

  /* padding: 50px 0; */
}

.courses_item {
  /* -ms-flex-preferred-size: calc(33.33333% - 30px);
flex-basis: calc(33.33333% - 30px); */

  margin: 30px 0px 0px 0px;

  overflow: hidden;

  border-radius: 28px;

  box-shadow: 0 0 5px var(--color-courses-item-box-shadow);
}

#counterSection {
  /* padding-top: 40px; */
  /* height: 300px; */
  /* /* /* padding-top: 50px; */
  /* padding-bottom: 150px;  */
  /* margin-bottom: 500px; */
  /* background: rgba(255, 255, 255, 0.2); */
  /* border-radius: 16px; */
  box-shadow: 0 4px 30px rgba(var(--color-black-rgb), 0.1);
  /* backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px); */
  /* border: 1px solid rgba(255, 255, 255, 0.3); */
  /* margin-bottom: 50px; */
  margin-top: 0px;

}

.courses-item_link {
  display: block;
  padding: 30px 0px;
  height: 150px;
  background-color: var(--transparent-background);
  justify-items: center;
  text-align: center;
  overflow: hidden;
  position: relative;

}

.courses-item_link:hover,
.courses-item_link:hover .courses-item_date {
  text-decoration: none;
  color: var(--color-white);
  /* box-shadow: 0 0 5px #ffee10; */
  text-shadow: 0 0 35px var(--color-courses-item-hover);
  transform: scale(1.1);

}

.courses-item_link:hover .courses-item_bg {
  -webkit-transform: scale(10);
  -ms-transform: scale(10);
  transform: scale(10);
}

.courses-item_title {
  /* min-height: 87px; */
  margin-left: 30px;

  overflow: hidden;

  font-weight: bold;
  font-size: 30px;
  color: var(--color-white);

  z-index: 2;
  position: relative;
}

.courses-item_date-box {
  font-size: 18px;
  color: var(--color-white);

  z-index: 2;
  position: relative;
}

.courses-item_date {
  font-weight: bold;
  color: var(--color-amber);
  /* margin-left: 50px; */
  -webkit-transition: color .5s ease;
  -o-transition: color .5s ease;
  transition: color .5s ease
}

.courses-item_bg {
  height: 128px;
  width: 128px;
  background-image: linear-gradient(to right, var(--courses-item-bg1), var(--courses-item-bg2), var(--courses-item-bg3));
  z-index: 1;
  position: absolute;
  top: -75px;
  right: -25px;

  border-radius: 50%;

  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}

.cobg1 {

  background-image: linear-gradient(to right, var(--co-item-lgbg1), var(--co-item-lgbg2)) !important;
}

.cobg2 {
  background-image: linear-gradient(to right, var(--co-item-lgbg3), var(--co-item-lgbg4)) !important;
}

.cobg3 {
  background-image: linear-gradient(to right, var(--co-item-lgbg5), var(--co-item-lgbg6));
}

.courses_item:nth-child(5n) {
  background-color: var(--co-item-n5);
}

.courses_item:nth-child(6n) {
  background-color: var(--co-item-n6);
}



@media only screen and (max-width: 979px) {
  .courses_item {
    -ms-flex-preferred-size: calc(50% - 30px);
    flex-basis: calc(50% - 30px);
  }

  .courses-item_title {
    font-size: 24px;
  }
}


@media only screen and (max-width: 639px) {
  .courses_item {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
  }

  .courses-item_title {
    min-height: 72px;
    line-height: 1;

    font-size: 24px;
  }

  .courses-item_link {
    padding: 22px 40px;
  }

  .courses-item_date-box {
    font-size: 16px;
  }
}

/* ------------------------------ */


/* -------------------------------------Happy client sends-------------------------- */
/* ------------------------------------our successs------------------------------ */
.cd-success .border::before {
  content: "";
  position: absolute;
  width: 5rem;
  height: 17rem;
  left: 4.5rem;
  top: -40%;
  /* background: #1D2B64; 
background: -webkit-linear-gradient(to right, #F8CDDA, #1D2B64);  
background: linear-gradient(to right, #F8CDDA, #1D2B64);  */
  background: var(--cd-success-bg);
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, var(--cd-success-lbg3), var(--cd-success-lbg2), var(--cd-success-bg));
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, var(--cd-success-lbg3), var(--cd-success-lbg2), var(--cd-success-bg));
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */


  /* background-image: linear-gradient(to right,#fff, #fc5c7d, #6a82fb); */
  animation: 6s linear 0s infinite normal none running barra;
  /* border-radius: 10px; */
  border: transparent !important;
}

.cd-success .border::after {
  content: "";
  position: absolute;
  inset: 5px;
  background: --cd-success-lbg6;
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, var(--cd-success-lbg5), var(--cd-success-lbg4), var(--cd-success-lbg6));
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to bottom, var(--cd-success-lbg5), var(--cd-success-lbg4), var(--cd-success-lbg4), var(--cd-success-lbg6));
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  /* background: rgb(7, 13, 30); */
  border-radius: 20px;
  border: transparent !important;

}

@keyframes barra {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/* #bsb-fact-pro-3-observer {
  margin-top: 0px;
  background: url("../img/teab1.jpg");
  background-repeat: no-repeat;
  background-size: contain;
} */


.cd-success {
  width: 12rem;
  height: 10rem;
  border-radius: 25px;
  position: relative;
  -moz-box-pack: center;
  justify-content: center;
  -moz-box-align: center;
  align-items: center;
  margin-bottom: 1rem;
  overflow: hidden;
  transition: 0.5s;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem;
  background: var(--cd-success-bg2);
  /* border: 2px solid rgb(38, 35, 56); */
}





.cd-success h3 {
  z-index: 1;
  object-fit: contain;
}

.cd-success p {
  z-index: 3;
  text-align: center;
  margin-bottom: 3vh;
  line-height: 3px;
}

/* --------------------------------------Our success ends------------------------------- */
.card::after {
  display: block;
  position: absolute;
  /* bottom: -10px; */
  left: 20px;
  width: calc(100% - 40px);
  height: 35px;
  background-color: var(--transparent-background) !important;
  /* background-color: #fff; */
  -webkit-box-shadow: 0 19px 28px 5px var(--color-gray-rgba);
  box-shadow: 0 19px 28px 5px var(--color-gray-rgba);
  content: '';
  z-index: -1;
}

a.card {
  text-decoration: none;
}

.card {
  position: relative;
  border: 0;
  border-radius: 0;
  /* background-color: #fff; */
  background-color: var(--transparent-background) !important;
  -webkit-box-shadow: 0 12px 20px 1px var(--color-gray-rgba);
  box-shadow: 0 12px 20px 1px var(--color-gray-rgba);
}

.card {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  /* background-color: #fff; */
  background-clip: border-box;
  border: 1px solid rgba(var(--color-white), 0.125);
  border-radius: .25rem;
}

.box-shadow {
  -webkit-box-shadow: 0 12px 20px 1px rgba(var(--color-gray-rgba), 0.09) !important;
  box-shadow: 0 12px 20px 1px rgba(var(--color-gray-rgba), 0.09) !important;
}

.ml-auto,
.mx-auto {
  margin-left: auto !important;
}

.mr-auto,
.mx-auto {
  margin-right: auto !important;
}

.rounded-circle {
  border-radius: 50% !important;
}

.bg-white {
  background-color: var(--color-white) !important;
}

.ml-auto,
.mx-auto {
  margin-left: auto !important;
}

.mr-auto,
.mx-auto {
  margin-right: auto !important;
}

.d-block {
  display: block !important;
}

img,
figure {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

.card-text {
  padding-top: 12px;
  color: var(--color-darker-gray);
}

.text-sm {
  font-size: 12px !important;
}

p,
.p {
  margin: 0 0 16px;
}



/* ----------------------------Multi cards----------------------- */

@property --rotate {
  syntax: "<angle>";
  initial-value: 132deg;
  inherits: false;
}



.multi-card {
  background: var(--color-black) !important;
  width: 100%;
  height: 100%;
  padding: 3px;
  position: relative;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  text-align: center;
  display: flex;
  font-size: 1.5em;
  color: var(--multi-card-color);
  cursor: pointer;
  font-family: cursive;
}

/* .multi-card:hover {
color: rgb(88 199 250 / 100%);
transition: color 1s;
} */
/* .multi-card:hover:before, .multi-card:hover:after {
animation: none;
opacity: 0;
} */


.multi-card::before {
  content: "";
  width: 104%;
  height: 105%;
  border-radius: 10px;
  background-image: linear-gradient(var(--rotate), var(--multi-card-color-lbg1), var(--multi-card-color-lbg2), var(--transparent-background));
  position: absolute;
  z-index: -1;
  top: -3%;
  left: -2%;
  animation: spin 2.5s linear infinite;
}

.multi-card::after {
  position: absolute;
  content: "";
  top: calc(var(--card-height) / 6);
  left: 0;
  right: 0;
  z-index: -1;
  height: 100%;
  width: 100%;
  margin: 0 auto;
  transform: scale(0.8);
  filter: blur(calc(var(--card-height) / 6));
  background-image: linear-gradient(var(--rotate), var(--multi-card-color-lbg3), var(--multi-card-color-lbg4), var(--multi-card-color-lbg5), var(--multi-card-color-lbg6));
  opacity: 1;
  transition: opacity .5s;
  animation: spin 2.5s linear infinite;
}

@keyframes spin {
  0% {
    --rotate: 0deg;
  }

  100% {
    --rotate: 360deg;
  }
}

.card-body {
  z-index: 1;
  background: var(--transparent-background) !important;
}

.card-body h3 {
  z-index: 1;
  color: var(--color-white) !important;

}

.card-body p {
  z-index: 3;


}

.animate-card {
  transition: transform 0.3s ease !important;
}

.animate-card:hover {
  transform: translateY(-10px) scale(1.05) !important;
  box-shadow: 0 10px 20px rgba(var(--color-white-rgb), 0.2);
}

.multi-card:hover .card-body p,
.multi-card.focus .card-body p {
  opacity: 1;
  visibility: visible !important;
}

/* ======================================================================================================= */
.back-cards {
  background: url("../img/teab1.jpg");
  /* background-color: var(--color-white); */
  /* color:var(--color-black); */
  background-repeat: no-repeat;
  background-size: cover;
  /* padding-bottom: 50px; */
}

.grid-container {
  display: grid;
  grid-template-columns: 1fr 3fr;
  /* height: 500px; */
  gap: 20px;
}

.mutli-title {
  width: 50%;
  margin-top: 80px;
}


/* --------------------------------------new code----------- */


ul.card-stacks {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  list-style-type: none;
  margin: 0px 50px 0px 50px;
  padding: 0 5% 0 5%;

}

li.stack {
  padding: 0;
  margin: 0 !important;
  width: 100%;
}

ul.cards-down {
  display: flex;
  flex-direction: column;
  justify-content: center;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

li.card {
  background-image: var(--stack-card-bg1);
  /* background-image: -webkit-linear-gradient(346deg, var(--stack-card-bg1), var(--stack-card-bg2)); */

  overflow: hidden;
  height: 300px;
  width: 280px;
  border-radius: 10px;
  margin: 10px auto;
  border: none;
  position: relative;
}

.cd-content {
  padding: 10px;
}

.box-shadow {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
  border-radius: 50%;
  margin: 0 auto 10px;
}

.card-title {
  font-size: 1.2em;
  margin: 0;
}

.card-text {
  font-size: 0.9em;
  margin: 10px 0;
}

.bt-read {
  color: #007bff;
  text-decoration: none;
  font-size: 0.9em;
}












.mt-cd-title {
  text-align: center;
  color: var(--color-white) !important;
  margin: 40px 0 5px !important;
}

.mt-cd-text {
  margin: 0 0 20px;
}

.card-display {
  display: flex;
  justify-content: center;
  margin-left: 200px;
}

.bt-read {
  margin-left: -5px;
  margin-top: -15px;
  display: inline-block;
  padding: 10px 0px 20px 0px;
  background: var(--btn-read-indian-red);
  /* fallback for old browsers */
  /* background: -webkit-linear-gradient(to right, var(--color-blue),var(--color-gold)); */
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to left, var(--service-block5-btn-readbg1),
      var(--service-block5-btn-readbg2));
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  width: 150px;
  height: 43px !important;
  color: var(--color-white) !important;
  text-align: center;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  /* transition: background-color 0.3s ease;
  animation: arrow-animation 1s infinite linear; */
}

.bt-read:hover {
  background-color: var(--color-white) !important;
}

.fe-icon-arrow-right {
  margin-left: 5px;

}

@keyframes arrow-animation {
  0% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(15px);
  }

  66% {
    transform: translateX(15px);
  }

  100% {
    transform: translateX(10px);
  }
}











/* -==================================================================== */
/* -------------------------Multi cards ends -------------------------------- */

/* Slide In */
.slide {
  animation-name: slide;
}

@keyframes slide {
  0% {
    opacity: 0;
    transform: translate(4em, 0);
  }

  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}

/* Slide Left */
.slide-left {
  animation-name: slide-left;
}

@keyframes slide-left {
  0% {
    opacity: 0;
    transform: translate(-40px, 0);
  }

  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}

.slide-up {
  animation-name: slide-up;
}

@keyframes slide-up {
  0% {
    opacity: 0;
    transform: translateY(3em);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.delay-1 {
  animation-delay: 0.3s;
}

.delay-2 {
  animation-delay: 0.6s;
}

.delay-3 {
  animation-delay: 0.9s;
}

.delay-4 {
  animation-delay: 1.2s;
}

.delay-5 {
  animation-delay: 1.5s;
}

.delay-6 {
  animation-delay: 1.8s;
}

.delay-7 {
  animation-delay: 2.1s;
}

.delay-8 {
  animation-delay: 2.4s;
}





/* /-------------------------------------------------- */
.intro {
  background: var(--intro-pastel-red);
  padding: 100px 0;
}

.container {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

h1 {
  font-size: 2.5rem;
}

/* ----------------------TIMELINE FOR 768px ------------------------ */
.main-timeline {
  position: relative
}



.main-timeline:before {
  content: "";
  display: block;
  width: 2px;
  height: 100%;
  background: var(--color-silver);
  margin: 0 auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0
}

.main-timeline .lgttimeline {
  margin-bottom: 40px;
  position: relative
}

.main-timeline .lgttimeline:after {
  content: "";
  display: block;
  clear: both
}

.main-timeline .icon {
  width: 18px;
  height: 18px;
  line-height: 18px;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0
}

.main-timeline .icon:before,
.main-timeline .icon:after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.33s ease-out 0s
}

.main-timeline .icon:before {
  background: var(--color-white);
  border: 2px solid var(--maintimeline-rich-black);
  left: -3px
}

.main-timeline .icon:after {
  border: 2px solid var(--color-silver);
  left: 3px
}

.main-timeline .lgttimeline:hover .icon:before {
  left: 3px
}

.main-timeline .lgttimeline:hover .icon:after {
  left: -3px
}

.main-timeline .date-content {
  width: 50%;
  float: left;
  margin-top: 22px;
  position: relative
}

.main-timeline .date-content:before {
  content: "";
  width: 36.5%;
  height: 2px;
  background: var(--color-silver);
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 10px;
  bottom: 0
}

.main-timeline .date-outer {
  width: 125px;
  height: 125px;
  font-size: 16px;
  text-align: center;
  margin: auto;
  z-index: 1
}

.main-timeline .date-outer:before,
.main-timeline .date-outer:after {
  content: "";
  width: 125px;
  height: 125px;
  margin: 0 auto;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  transition: all 0.33s ease-out 0s
}

.main-timeline .date-outer:before {
  background: var(--color-white);
  border: 2px solid var(--maintimeline-rich-black);
  left: -6px
}

.main-timeline .date-outer:after {
  border: 2px solid var(--color-silver);
  left: 6px
}

.main-timeline .lgttimeline:hover .date-outer:before {
  left: 6px
}

.main-timeline .lgttimeline:hover .date-outer:after {
  left: -6px
}

.main-timeline .date {
  width: 100%;
  margin: auto;
  position: absolute;
  top: 27%;
  left: 0
}

.main-timeline .month {
  font-size: 18px;
  font-weight: 700
}

.main-timeline .year {
  display: block;
  font-size: 30px;
  font-weight: 700;
  color: var(--maintimeline-rich-black);
  line-height: 36px
}

.main-timeline .timeline-content {
  width: 50%;
  padding: 20px 0 20px 50px;
  float: right
}

.main-timeline .title {
  font-size: 19px;
  font-weight: 700;
  line-height: 24px;
  margin: 0 0 15px 0
}

.main-timeline .description {
  margin-bottom: 0
}

.main-timeline .lgttimeline:nth-child(2n) .date-content {
  float: right
}

.main-timeline .lgttimeline:nth-child(2n) .date-content:before {
  left: 10px
}

.main-timeline .lgttimeline:nth-child(2n) .timeline-content {
  padding: 20px 50px 20px 0;
  text-align: right
}

@media only screen and (max-width: 991px) {
  .main-timeline .date-content {
    margin-top: 35px
  }

  .main-timeline .date-content:before {
    width: 22.5%
  }

  .main-timeline .timeline-content {
    padding: 10px 0 10px 30px
  }

  .main-timeline .title {
    font-size: 17px
  }

  .main-timeline .lgttimeline:nth-child(2n) .timeline-content {
    padding: 10px 30px 10px 0
  }
}

@media only screen and (max-width: 767px) {
  .main-timeline:before {
    margin: 0;
    left: 7px
  }

  .main-timeline .lgttimeline {
    margin-bottom: 20px
  }

  .main-timeline .lgttimeline:last-child {
    margin-bottom: 0
  }

  .main-timeline .icon {
    margin: auto 0
  }

  .main-timeline .date-content {
    width: 95%;
    float: right;
    margin-top: 0
  }

  .main-timeline .date-content:before {
    display: none
  }

  .main-timeline .date-outer {
    width: 110px;
    height: 110px
  }

  .main-timeline .date-outer:before,
  .main-timeline .date-outer:after {
    width: 110px;
    height: 110px
  }

  .main-timeline .date {
    top: 30%
  }

  .main-timeline .year {
    font-size: 24px
  }

  .main-timeline .timeline-content,
  .main-timeline .lgttimeline:nth-child(2n) .timeline-content {
    width: 95%;
    text-align: center;
    padding: 10px 0
  }

  .main-timeline .title {
    margin-bottom: 10px;
  }
}

.timeline-content .title{
  color: var(--color-black) !important;

}


/* ------------------------Time line for 768px ends--------------------- */

/* TIMELINE
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* .timeline{
  margin-top: -140px !important;
background: url("../img/teal10.jpg");
background-repeat: no-repeat;
background-size: contain; 

}*/
.timeline ul {

  padding: 50px 0;
}

.timeline ul li {
  /* background: url("../img/teal10.jpg"); */
  background-repeat: no-repeat;
  background-size: contain;
  list-style-type: none;
  position: relative;
  width: 6px;
  margin: 0 auto;
  padding-top: 50px;
  background: var(--color-light-gray);
}

.timeline ul li::after {
  background: var(--bt-read1-peru);
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: inherit;
  z-index: 1;
}

.timeline ul li div {
  border-bottom: 3px solid var(--color-amber);
  position: relative;
  bottom: 0;
  width: 300px;
  padding: 15px;
  background: var(--transparent-background);
  border-radius: 0 0 35px 0;
  color: var(--color-black);
  font-size: medium;
  font-family: 'Poppins', 'Courier New', Courier, monospace;
}

.timeline ul li div::before {
  content: "";
  position: absolute;
  bottom: 7px;
  width: 0;
  height: 0;
  border-style: solid;
}

.timeline ul li:nth-child(odd) div {
  left: 45px;
}

.timeline ul li:nth-child(odd) div::before {
  left: -15px;
  border-width: 8px 16px 8px 0;
  border-color: var(--transparent-background) var(--transparent-background) var(--transparent-background) var(--transparent-background);

}

.timeline ul li:nth-child(even) div {
  left: -439px;
}

.timeline ul li:nth-child(even) div::before {
  right: -15px;
  border-width: 8px 0 8px 16px;
  border-color: var(--transparent-background) var(--transparent-background) var(--transparent-background) var(--transparent-background);

}

time {
  display: block;
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 8px;
}


/* EFFECTS
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.timeline ul li::after {
  transition: background 0.5s ease-in-out;
}

.timeline ul li.in-view::after {
  background: var(--timeline-teal-color);
}

.timeline ul li div {
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s ease-in-out;
}

.timeline ul li:nth-child(odd) div {
  transform: translate3d(200px, 0, 0);
}

.timeline ul li:nth-child(even) div {
  transform: translate3d(-200px, 0, 0);
}

.timeline ul li.in-view div {
  transform: none;
  visibility: visible;
  opacity: 1;
}


/* GENERAL MEDIA QUERIES
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@media screen and (max-width: 900px) {
  .timeline ul li div {
    width: 200px;
  }

  .timeline ul li:nth-child(even) div {
    left: -289px;
    /*250+45-6*/
  }
}

@media screen and (max-width: 600px) {

  .timeline ul li {
    margin-left: 20px;
  }

  .timeline ul li div {
    width: calc(100vw - 116px);
  }

  .timeline ul li:nth-child(even) div {
    left: 45px;
  }

  .timeline ul li:nth-child(even) div::before {
    left: -15px;
    border-width: 8px 16px 8px 0;
    border-color: var(--transparent-background)var(--intro-pastel-red) var(--transparent-background) var(--transparent-background);
  }
}




@media (max-width: 425px) {
  .timeline ul {
    padding: 0 10px;
  }

  .timeline li {
    margin-bottom: 1.5em;
  }

  .timeline li div {
    padding: 10px;
    font-size: 0.9em;
  }

  .timeline li time {
    font-size: 1em;
  }

  .timeline li h3 {
    font-size: 1.2em;
  }

  .timeline li p {
    font-size: 0.9em;
  }
}

/* EXTRA/CLIP PATH STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.timeline-clippy ul li::after {
  width: 40px;
  height: 40px;
  border-radius: 0;
}

.timeline-rhombus ul li::after {
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

.timeline-rhombus ul li div::before {
  bottom: 12px;
}

.timeline-star ul li::after {
  clip-path: polygon(50% 0%,
      61% 35%,
      98% 35%,
      68% 57%,
      79% 91%,
      50% 70%,
      21% 91%,
      32% 57%,
      2% 35%,
      39% 35%);
}

.timeline-heptagon ul li::after {
  clip-path: polygon(50% 0%,
      90% 20%,
      100% 60%,
      75% 100%,
      25% 100%,
      0% 60%,
      10% 20%);
}

.timeline-infinite ul li::after {
  animation: scaleAnimation 2s infinite;
}

@keyframes scaleAnimation {
  0% {
    transform: translateX(-50%) scale(1);
  }

  50% {
    transform: translateX(-50%) scale(1.25);
  }

  100% {
    transform: translateX(-50%) scale(1);
  }
}

/* ---------------------------------------navbar-content--------------------------------------- */





/* - */
/* -------------------------Media Query------------------------ */
/* Default styles for circular menu */
.circular-menu,
.outer-circle,
.menu-button {
  display: none !important;
  /* Hide the menu by default */
}

/* Media query for large devices */
@media (min-width: 992px) {

  .circular-menu,
  .outer-circle,
  .menu-button {
    display: block !important;
    /* Display the menu for large devices */
  }
}


/* card section latest news starts here */


@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Montserrat:wght@700&display=swap");



/* RESET */

/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default margin */
.card__description {
  margin: 0;
}

/* GLOBAL STYLES */
/* body {
  display: grid;
  place-items: center;
  height: 100vh;
} */
.card__title {
  font-size: 2.25rem;
  font-family: var(--font-title);
  color: var(--color-white);
  line-height: 1.1;
}

.card__description {
  font-family: var(--font-text);
  font-size: 1rem;
  line-height: 1.5;
  color: var(--color-white);
  text-align: left;
}

.flow>*+* {
  margin-top: var(--flow-space, 1em);
}

/* CARD COMPONENT */

.card_news {
  display: grid;
  place-items: center;
  /* width: 80vw;
  max-width: 21.875rem; */
  height: 350px;
  overflow: hidden;
  border-radius: 0.625rem;
  box-shadow: 0.25rem 0.25rem 0.5rem rgba(var(--color-white-rgb), 0.25);
}

.card_news>* {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
}

.card__background {
  object-fit: fill;
  max-width: 100%;
  height: 100%;
}

.card__content {
  --flow-space: 0.9375rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-self: flex-end;
  /* height: 55%; */
  padding: 12% 1.25rem 1.875rem;
  background: linear-gradient(180deg,
      var(--gradient-start) 0%,
      var(--gradient-mid) 10%,
      var(--gradient-end) 100%);
}

.card__content--container {
  --flow-space: 1.25rem;
}

.card__title {
  position: relative;
  width: fit-content;
  width: -moz-fit-content;
  padding-bottom: 0;
  /* Prefijo necesario para Firefox  */
}

.card__title::after {
  content: "";
  position: absolute;
  height: 0.3125rem;
  width: calc(100% + 1.25rem);
  bottom: calc((1.25rem - 0.5rem) * -1);
  left: -9px;
  background-color: var(--timeline-teal-color);
}



.card__button {
  padding: 0.75em 1.6em ;
  width: fit-content !important;
  font-variant: small-caps !important;
  font-weight: bold !important;
  border-radius: 0.45em !important;
  border: none !important;
  background-color: var(--timeline-teal-color) !important;
  font-family: var(--font-title) !important;
  /* font-size: 14px !important; */
  color: var(--color-black) !important;
}

.card__button:focus {
  outline: 2px solid var(--color-black) !important;
  outline-offset: -5px !important;
}

@media (any-hover: hover) and (any-pointer: fine) {
  .card__content {
    transform: translateY(62%);
    transition: transform 500ms ease-out;
    transition-delay: 500ms;
  }

  .card__title::after {
    opacity: 0;
    transform: scaleX(0);
    transition: opacity 1000ms ease-in, transform 500ms ease-out;
    transition-delay: 500ms;
    transform-origin: right;
  }

  .card__background {
    transition: transform 500ms ease-in;
  }

  .card__content--container> :not(.card__title),
  .card__button {
    opacity: 0;
    transition: transform 500ms ease-out, opacity 500ms ease-out;
  }

  .card_news:hover,
  .card_news:focus-within {
    transform: scale(1.05);
    transition: transform 500ms ease-in;
  }

  .card_news:hover .card__content,
  .card_news:focus-within .card__content {
    transform: translateY(0);
    transition: transform 500ms ease-in;
  }

  .card_news:focus-within .card__content {
    transition-duration: 0ms;
  }

  .card_news:hover .card__background,
  .card_news:focus-within .card__background {
    transform: scale(1.3);
  }

  .card_news:hover .card__content--container> :not(.card__title),
  .card_news:hover .card__button,
  .card_news:focus-within .card__content--container> :not(.card__title),
  .card_news:focus-within .card__button {
    opacity: 1;
    transition: opacity 500ms ease-in;
    transition-delay: 500ms;
  }

  .card_news:hover .card__title::after,
  .card_news:focus-within .card__title::after {
    opacity: 1;
    transform: scaleX(1);
    transform-origin: left;
    transition: opacity 500ms ease-in, transform 500ms ease-in;
    transition-delay: 500ms;
  }
}

/* .blog-listing {
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}

.blog-listing .visible {
  opacity: 1;
} */


/* ---==== Scrolling-animations styles Started here ====--- */

/* Initially hide the elements */
.scroll-animation {
  opacity: 0;
  transform: translateY(10px);
  /* Move the elements down */
  transition: opacity 1s, transform 0.2s;
}

/* Apply animation when in view */
.scroll-animation.in-view {
  opacity: 1;
  transform: translateY(0);
}

/* card section latest news ends here */


.bt-read1 {
  border-radius: 2px;
  padding: 8px 12px;
  color: var(--bt-read1-peru);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  text-transform: uppercase;
  transition: 0.5s ease;
  margin-top: 300px;
}

.bcr-read {
  border-radius: 2px;
  padding: 8px 12px;
  color: var(--bt-read1-peru);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  text-transform: uppercase;
  /* transition: 0.5s ease; */
  /* margin-top: 300px; */
}

.courcard {
  background: var(--color-white);
  max-width: 400px;
  margin: 100px auto;
  border-radius: 12px;
  box-shadow: 0 10px 20px rgba(var(--color-white-rgb), 0.19), 0 6px 6px rgba(var(--color-white-rgb), 0.23);
  box-sizing: border-box;
  padding: 48px;
  text-align: center;
}

.course-products {
  position: relative;
  transition: 0.5s ease;
}

.courproduct {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s ease;
}

.courproduct.active {
  opacity: 1;
  visibility: visible;
}

.thumbnail {
  margin: 0 0 48px;
}

.title {
  margin: 0 0 12px;
  color: var(--bt-read1-peru);
  font-size: 24px;
  transition: 0.5s ease;
}



/* .description {
  margin: 0 0 48px;
} */

.courfooter {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 0 -12px -12px;
}

[ripple] {
  z-index: 1;
  position: relative;
  overflow: hidden;
}

[ripple] .ripple {
  position: absolute;
  background: var(--color-white);
  width: 60px;
  height: 60px;
  border-radius: 100%;
  transform: scale(0);
  animation: ripple 2s;
}

@keyframes ripple {
  0% {
    transform: scale(0);
    opacity: 0.2;
  }

  lgtline 100% {
    transform: scale(20);
    opacity: 0;
  }
}

/* Hide the card by default */
.courcard {
  display: none;
}

/* Show the card only for devices with a width of 768px or 425px */
@media (min-width: 425px) and (max-width: 768px) {
  .courcard {
    display: block;
  }
}

/* @media (max-width: 425px) {
  .main-timeline {
    display: none;
  }

  #lgtline {
    display: block;
  }

} */

/* @media only screen and ( max-width:769px) {
  #lgtline{
    display: none !important;
  }
  .main-timeline {
    display: block !important;
  }
}
@media only screen and (min-width:800px){
  #lgtline{
    display: block;
  }
  .main-timeline {
    display: none !important;
  }
} */
/* --------------------------------Media Queries ----------------------- */
@media (max-width: 768px) {

  .back-to-top {
    /* right: 120px; */
    bottom: 20px;
    font-size: 16px;
    /* Adjust font size for smaller screens */
  }
}

@media (max-width: 900px) {
  body {
    overflow-x: hidden;
  }

  .back-to-top {
    right: 59px !important;
    bottom: 15px;
    font-size: 14px;
    /* Further adjust font size for very small screens */
  }
}

@media screen and (max-width: 768px) {
  .footer-container {
    width: 100%;
    padding: 20px;
  }

  .footer-content {
    flex-direction: column;
    align-items: center;
  }

  .footer-description {
    width: 100%;
    text-align: center;
  }

  .footer-links {
    text-align: center;
  }

  .footer-section {
    margin-bottom: 30px;
  }
}

@media screen and (max-width: 425px) {
  .footer-container {
    width: 100%;
    padding: 20px 10px;
  }

  .footer-description {
    width: 100%;
  }

  .footer-links {
    text-align: center;
  }

  .footer-section {
    margin-bottom: 20px;
  }
}

@media screen and (min-width: 900px) and (max-width: 992px) {

  .enroll-btn {
    padding-top: 300px;
  }
}


@media screen and (max-width: 900px) {

  .enroll-btn {
    padding-top: 300px;
  }

  #counterSection {
    /* padding-bottom: 350px !important; */
    margin: 0 40px;
  }

  #abt-sec {
    display: flex;
    flex-direction: column;
  }


  ul.card-stacks {
    display: none;

  }

  .courcard {
    display: block;
    /* background: url("../img/teab1.jpg");
    margin-top: -20px;
    display: block; */
  }

  .mutli-title {

    width: 100% !important;
    margin-top: 0px !important;
  }

  .mutli-title .card-display {
    margin-left: 260px !important;
  }


}

.about-list .media p {

  font-size: small !important;
}

@media screen and (min-width: 992px) {

  .about-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .about-list .sec-1 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
  }

  .sec-1 label {
    width: 50% !important;
  }

}

@media screen and (min-width: 768px) and (max-width:992px) {

  .about-list .sec-1 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
  }

  .sec-1 label {
    width: 50% !important;
  }

  .padding_top_10px {
    padding-top: 10px;
  }

}


@media screen and (min-width: 568px) and (max-width:768px) {

  .infocardContainer {
    display: flex;
    flex-direction: column;
  }

  .infocardContainer #image-profile {
    padding-top: 10px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
  }

  .infocardContainer #image-profile img {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .about-list {
    margin-left: 20%;
  }


  .about-list .sec-1 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
  }

  .sec-1 label {
    width: 50% !important;
  }

  .padding_top_10px {
    padding-top: 10px;
  }

}

@media screen and (max-width:568px) {

  .infocardContainer {
    display: flex;
    flex-direction: column;
    padding-bottom: 60px !important;
  }

  .infocardContainer #image-profile {
    padding-top: 10px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
  }

  .infocardContainer #image-profile img {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .about-list .sec-1 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
  }

  .sec-1 label {
    width: 50% !important;
  }

  .padding_top_10px {
    padding-top: 10px;
  }

}

/* -------------------------------courses new design--------------------------- */
.service-block5 {
  position: relative;
  border: 1px solid var(--aluminium-white-color-service);
  background: var(--white-color);
  box-shadow: 0px 10px 30px 0px var(--semi-transparent-charcoal-gray-color);
  border-radius: 15px;
  overflow: hidden;
  padding: 30px
}

.service-block5:before {
  position: absolute;
  top: -42px;
  right: -100px;
  z-index: 0;
  content: " ";
  width: 250px;
  height: 120px;
  background: var(--aluminium-white-color-service);
  border-bottom-left-radius: 0;
  transition: all 0.4s ease-in-out;
  transform: rotate(45deg);
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out
}

.service-block5:hover:before {
  background: var(--color-amber);
}

.service-block5 .service-icon {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 1;
  text-align: center
}

.service-block5 img {
  /* color: var(--secondary-accent-color-service); */
  font-size: 38px;
  line-height: normal;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  margin-top: -12px;
  margin-left: 25%;
  height: 80px;
}

.service-block5 i {
  color: var(--service-block5-i-color);
  font-size: 45px;
  line-height: normal;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;

}

.service-block5:hover img {
  color: var(--white-color)
}

.service-block5:hover i {
  color: var(--white-color)
}

.service-block5 .service-desc1 {
  position: relative
}

.service-block5 .service-desc1 h4 {
  margin-bottom: 8px;
  font-size: 18px;
  font-weight: 600;
  text-align: left;
}

.service-block5 .service-desc1 h5 {
  margin-bottom: 5px;
  font-size: 12px;
  font-weight: 500;
  text-align: left;
}

.service-block5 .service-desc1 h5:after {
  content: '';
  display: block;
  width: 80px;
  height: 2px;
  background: var(--color-amber);
  margin-top: 10px;
  margin-bottom: 15px;
  -moz-transition-duration: .4s;
  -ms-transition-duration: .4s;
  -webkit-transition-duration: .4s;
  -o-transition-duration: .4s;
  transition-duration: .4s
}

.service-block5 p {
  margin-top: 25px;
  padding-right: 50px;
  margin-bottom: 0;
  text-align: left;
}

@media screen and (max-width: 1199px) {
  .service-block5:before {
    right: -110px
  }

  .service-block5 .service-desc1 h4 {
    font-size: 16px;
    margin-bottom: 5px
  }

  .service-block5 p {
    padding-right: 40px;
    margin-top: 20px
  }

  .service-block5 img {
    font-size: 34px
  }
}

@media screen and (max-width: 991px) {
  .service-block5 {
    padding: 25px
  }

  .service-block5 .service-desc1 h4 {
    font-size: 15px
  }

  .service-block5 img {
    font-size: 32px
  }

  .service-block5 p {
    margin-top: 15px;
    padding-right: 30px
  }
}

@media screen and (max-width: 767px) {
  .service-block5 {
    padding: 20px
  }

  .service-block5:before {
    right: -130px
  }

  .service-block5 img {
    font-size: 28px
  }

  .service-block5 .service-icon {
    top: 13px;
    right: 12px
  }
}

.margin-30px-bottom {
  margin-bottom: 30px;
}

/* -------------------- */
#blog {
  padding: 24px 0px 0px 20px !important;
}

/* -------------- */

/* ----------------------
@media screen and (min-width:980px){
  .infocardContainer:hover .about-list{
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .sec-1{
    padding-left: 20px;
    margin-bottom: 15px;
  }

  .sec-1 p{
    padding-top: 7px; 
    width:100%; 
    font-size: 14px;
  }
  .sec-1 a{
    padding-top: 7px; 
    width:100%; 
    font-size: 14px;
  }

  .mail-sec-prop{
    padding-top: 7px; 
    width:105%; 
    font-size: 14px;
  }

  .sec-1 label{
    width:60%
  }
} */


/* 
@media screen and (min-width: 600px) and (max-width: 980px) {

  .infocardContainer:hover .about-list{
    display: grid !important;
    grid-template-rows: repeat(2, 1fr) !important;
  }
  .sec-1{
    padding-left: 0px;
  }

  .infocardContainer:hover{
    height: 500px !important;
  }

  .textbois{
    margin-bottom: 20px;
  }
} */

/* @media screen and (min-width: 600px) and (max-width: 868px) {

  .infocardContainer:hover .about-list{
    display: grid !important;
    grid-template-rows: repeat(2, 1fr) !important;
  }
  .sec-1{
    padding-left: 0px;
  }

  .infocardContainer:hover{
    height: 550px !important;
  }

  .textbois{
    margin-bottom: 20px;
  }
} */

/* @media screen and (max-width: 600px) {

  .enroll-btn {
    padding-top: 350px;
  }

  .media label{
    font-size: 16px !important;
  }

  #counterSection {
    display: grid !important;
    justify-content: center;
    align-items: center;
    padding-bottom: 700px !important;

    margin: 40px;
  }

  #abt-sec {
    display: flex;
    flex-direction: column;
  }

  .logo-img {
    display: none !important;
  }

  .about-avatar {
    display: flex !important;
    flex-direction: column !important;
  }

  .infocardContainer:hover {
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    height: 140vh !important;
    padding-bottom: 40px;
  }

  .infocardContainer:hover #image-profile img{
    padding-top: 0px !important;
    position: absolute;
    top: 40px;
  }
  #textbois .dark-color {
    justify-content: center !important;
  }

  .infocardContainer:hover #textbois{
    position: absolute;
    top: 25%;
   
  }

  .infocardContainer:hover #textbois .para{
    overflow: hidden;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .about-list .media {

    width: 100% !important;
    padding: 10px !important;
  }
  
  .about-list .media p{
    width: 100% !important;
    font-size:14px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 3px;
    margin-left: -100px;
  }

  .about-list {
    row-gap: 30px;
    padding-left: 30px;
    align-items: center;
    text-align: center;
    display: flex !important;
    flex-direction: column !important;
  }

  .about-list .sec-1{
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: left !important;

  }

  .courses-item_title {
    margin-left: 0px !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .stack {
    display: flex !important;
    flex-direction: column !important;
  }

  .mutli-title {
    width: 100% !important;
    margin-top: 0px !important;
  }

  .mutli-title {
    font-size: 20px !important;
  }

  .bsb-fact-pro-3-observer h1 {
    font-size: 20px !important;
  }

  .bsb-fact-pro-3-observer h3 {
    font-size: 15px !important;
  }

  ul.card-stacks {
    margin-top: 30px;

  }

  .courcard {
    max-width: 300px;
    display: block;
  }

  .bt-read1 {
    margin-top: 380px;
  }

  .mutli-title .card-display {
    margin-left: 110px !important;
  }
} */

@media screen and (max-width: 425px) {

  .enroll-btn {
    padding-top: 300px;
  }

  #counterSection {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
    align-items: center;
    padding-bottom: 700px !important;
    /* margin-bottom: 40px !important; */
    margin: 40px;
  }

  .courses_item {
    margin: 40px !important;
  }

  .mutli-title {
    font-size: small !important;
  }

  .bsb-fact-pro-3-observer h1 {
    font-size: small !important;
  }

  #abt-sec {
    display: flex;
    flex-direction: column;
  }



  .about-avatar {
    display: flex !important;
    flex-direction: column !important;
  }

  .card-display {
    margin-left: 30px;
  }

}




/* ---------------------------------------------------------------- */