/* @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
  --theme-color: #0d5ef4;
  --theme-color2: #f20f10;
  --title-color: #0f2239;
  --small-title-color: #4a5565;
  --body-color: #4d5765;
  --smoke-color: #f3f7fb;
  --black-color: #000000;
  --white-color: #ffffff;
  --light-color: #72849b;
  --yellow-color: #ffb539;
  --success-color: #28a745;
  --error-color: #dc3545;
  --border-color: #ecf1f9;
  --title-font: "Poppins", sans-serif;
  --main-container: 1380px;
  --container-gutters: 24px;
  --section-space: 120px;
  --section-space-mobile: 80px;
  --section-title-space: 70px;
  --ripple-ani-duration: 5s;
  --angle: 45deg;
  --opacity: 0.5;
}

html {
      scroll-behavior: smooth;
}

*{
    /* padding: 0;
    margin: 0;
    box-sizing: border-box; */
    /* font-family: "Poppins", sans-serif; */
    font-family: "Poppins", sans-serif;
    
}

.main_container {width: 100%;overflow: hidden;}
.navbar-section{
    width: 100%;
    height: 80px;
    background-color: #fff;
    display: flex;
    font-weight: 500;
    font-size: 18px;
    position: fixed;
    z-index: 3;
}

.learnify-logo{
    width: 48%;
    display: flex;
    justify-content: start;
    align-items: center;
}

.learnify-logo img{margin-left: 15%;}
.logo-text{background-color: var(--theme-color);color: #ffffff;height: 100%;border-top-right-radius: 30px;display: flex;flex-direction: column;justify-content: center;line-height: 30px;padding: 0 55px 0 0;}
.logo-image{background-color: var(--theme-color);width: 93px; height: 100%;display: flex;align-items: center; }
.logo-image img {border-radius: 50%;background-color: #fff;}
.learnify-logo-text{font-weight: 700;font-size: 40px;padding-top: 5px;}
.learnify-logo-text2{padding-left: 77px;line-height: 26px;color: #ffffff;}
.menu-bar{width: 52%;}

.menu-bar ul{
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    height: 100%;
    /* height: 330px; */
}

.menu-bar ul li{text-decoration: none;list-style: none;cursor: pointer;}

.menu-bar ul .underline-nav-btn{
    position: relative;
    letter-spacing: 0.5px;
}
.menu-bar .underline-nav-btn span{
    transform: translateY(-10px);
}

.menu-bar ul .underline-nav-btn::after{
    content: '';
    position: absolute;
    background-color: #2276BE;
    height: 3px;
    width: 0;
    left: 0;
    bottom: -5px;
    transition: width 0.5s ease-in-out ;
}

.menu-bar ul .underline-nav-btn:hover::after{width: 100%;}
.menu-bar ul .underline-nav-btn.active::after{width: 100%;}

.menu-bar ul .login-btn{
    padding: 5px 20px;
    border: 1px solid #2276BE;
    border-radius: 30px;
    color: #2276BE;
    font-size: 14px;
    transition: background-color 0.3s ease-in-out;
}

.menu-bar ul .login-btn:hover{
    color: white;
    background-color: #2276BE;
}

.main-section{
    position: relative;
    /* height: calc(100vh - 80px); */
    height: 100vh;
    width: 100%;
    display: flex;
    padding-top: 80px;
}
.main-section::before{
    content: ' ';
    position: absolute;
    top: 0;
    left: 0;
    padding-top: 80px;
    background: url('../images/background.png') no-repeat center center fixed;
    background-size: cover;
    opacity: 0.7;
    /* height: calc(100vh - 80px); */
    height: 100vh;
    width: 100%;
}



.main-section .left-text{
    margin-left: 9%;
    height: 60vh;
    width: 450px;
    width: 50%;
    z-index: 1;
}

.main-section .left-text .left-text-line0{
    line-height: 40px;
    font-family: "Poppins", sans-serif;
    font-size: 62px;
    font-weight: 600;
    padding-top: 100px;
    color: var(--theme-color);
    /* padding-bottom: 8px; */
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #eeeef9, 0 0 30px #f0f0f5, 0 0 40px #e4e4eb, 0 0 50px #ebebf1, 0 0 60px #e1e1e9;
}

.main-section .left-text .left-text-line1{
    font-family: "Poppins", sans-serif;
    font-size: 62px;
    font-weight: 600;
    /* padding-top: 100px; */
    color: var(--theme-color);
    padding-bottom: 8px;
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #eeeef9, 0 0 30px #f0f0f5, 0 0 40px #e4e4eb, 0 0 50px #ebebf1, 0 0 60px #e1e1e9;
}

.main-section .left-text .left-text-line2{
    font-family: "Poppins", sans-serif;
    font-size: 48px;
    font-weight: 500;
    line-height: 40px;
    color: var(--title-color);
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #eeeef9, 0 0 30px #f0f0f5, 0 0 40px #e4e4eb, 0 0 50px #ebebf1, 0 0 60px #e1e1e9;
}

.main-section .left-text .left-text-line3{
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    padding-top: 25px;
    font-size: 20px;
    /* font-style: italic; */
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #eeeef9, 0 0 30px #f0f0f5, 0 0 40px #e4e4eb, 0 0 50px #ebebf1, 0 0 60px #e1e1e9;
}

.main-section .left-text .left-text-line4{
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    padding-bottom: 25px;
    font-size: 20px;
    /* font-style: italic; */
    padding-bottom: 40px;
    line-height: 23px ;
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #eeeef9, 0 0 30px #f0f0f5, 0 0 40px #e4e4eb, 0 0 50px #ebebf1, 0 0 60px #e1e1e9;
}

.main-section .left-text button{
    padding: 15px 40px; 
    background-color: #2276BE;
    border-radius: 30px;
    color: #FEFFFF;
    font-size: 18px;
    font-weight: 400;
    border: none;
}

.main-section .right-part{
    width: 50%;
    position: relative;
    height: 100%;
    z-index: 2;
}

.hero-counter-wrap {
  gap: 15px;
  background: var(--white-color);
  box-shadow: 0px 4px 32px 0px rgba(170, 179, 198, 0.15);
  border-radius: 100px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 13px 50px 13px 20px;
  position: absolute;
  -webkit-animation: jumpAni 7s linear infinite;
  animation: jumpAni 7s linear infinite;
  left: -60px;
  bottom: 100px;
}
.hero-counter-wrap.hero-counter2 {
  padding: 13px 38px 13px 20px;
  -webkit-animation: jumpAni 4s linear infinite;
  animation: jumpAni 4s linear infinite;
  left: auto;
  right: -50px;
  bottom: 200px;
}
@media (max-width: 1500px) {
  .hero-counter-wrap.hero-counter2 {
    right: 0;
  }
}
.hero-counter-wrap.hero-counter2 .hero-counter_icon {
  background: var(--theme-color2);
}
.hero-counter-wrap.hero-counter2 .hero-counter_number {
  color: var(--theme-color2);
}
.hero-counter-wrap .details {
  -webkit-box-flex: 0;
  -webkit-flex: none;
  -ms-flex: none;
  flex: none;
}
.hero-counter_icon {
  width: 55px;
  height: 55px;
  line-height: 55px;
  background-color: var(--theme-color);
  text-align: center;
  border-radius: 50%;
  /* position: relative; */
  /* -webkit-box-flex: 0;
  -webkit-flex: none;
  -ms-flex: none; */
  display: flex;
  justify-content: center;
  align-items: center;
}
.hero-counter_number {
  font-size: 36px;
  font-weight: 700;
  color: var(--theme-color);
  margin-bottom: -3px;
  margin-top: -0.3em;
}
.hero-counter_number span {
  color: var(--title-color);
}
.hero-counter_text {
  font-size: 16px;
  font-weight: 400;
  font-family: var(--title-font);
  display: block;
  margin-bottom: -10px;
}

@-webkit-keyframes jumpAni {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes jumpAni {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

.hero-shape-shape4{
    position: absolute;
    left: 30rem;
    top: 0;
    transform: translateX(0);
    z-index: 2;
    animation: swayhero 7s linear infinite;
}


@keyframes swayhero {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.hero-shape-shape1{
   position: absolute;
    left: 0;
    bottom: 0;
    transform: translateX(0);
    /* animation: swayhero 7s linear infinite;  */
    animation: spin 15s linear infinite;
    
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}





.mobile-menu-btn{display: none;}

.section-2{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    /* height: 384px; */
    font-family: "Poppins", sans-serif;
}

.section-2 h1{
    text-align: center;
    font-family: "Poppins", sans-serif;
    word-spacing: 3px;
    padding-top: 100px;
    font-size: 50px;
    font-weight: 400;
}

.section-2 .text-line-3{
    width: 500px;
    text-align: center;
    color: gray;
    font-weight: 600;
    font-family: "Poppins", sans-serif;
    font-size: 18px;
    padding: 18px 0;
}

.section-2 .button-line-4{
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 10px;
}

.section-2 .button-line-4 .button-join-me{
    width: 150px;
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.section-2 .button-line-4 .button-1{
    padding: 10px 30px;
    border-radius: 30px;
    background-color: black;
    transition: padding 0.3s ease-in-out;
}
.section-2 .button-line-4 .button-1 a{
    color: white;
    text-decoration: none;
}

.section-2 .button-line-4 .button-1:hover{
    padding: 12px 34px;
}

.section-2 .button-line-4 .button-2{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: white;
    border: none;
    transition: font-size 0.3s ease-in-out;
}

.section-2 .button-line-4 .button-2:hover{
    font-size: 15px;
    font-weight: 600;
}

.section-2 .button-line-4 .button-2 a{
    text-decoration: none;
    padding: 0 5px;
}


.section-2-a{
    background-image: url('/images/hero/hero_bg_2_1.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    
}

/* .section-2-a::before{
    content: ' ';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    background-image: url('/images/hero/hero_bg_2_1.jpg');
    background-repeat: no-repeat;
    background-position: center center;
} */

.section-2-a-content{
    display: flex; 
    padding-left: 1rem;
    padding-right: 1rem; 
    /* padding-bottom: 5rem;  */
    /* padding-top: 9rem;  */
    flex-direction: column; 
    justify-content: center; 
    align-items: center; 
    width: 100%; 
    /* min-height: 100vh;  */
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; 
    text-align: center; 
}

.section-2-a-content-button{
    display: flex; 
    margin-top: 1.5rem;     
    flex-direction: column; 
    gap: 1rem; 
    justify-content: center; 
    align-items: center;
}
.section-2-a-content-button-join{
    padding-top: 0.5rem;
    padding-bottom: 0.5rem; 
    padding-left: 1.5rem;
    padding-right: 1.5rem; 
    border-radius: 9999px; 
    font-size: 0.875rem;
    line-height: 1.25rem; 
    color: #ffffff; 
    background-color: #000000; 
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    transition-duration: 300ms; 
}

.section-2-a-content-button-join:hover {
    box-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); 
    --ring-color: #000000; 
    --transform-scale-x: 1.05;
    --transform-scale-y: 1.05; 
}





.section-3{
    /* width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 0 0 0; */

    padding-left: 1rem;
    padding-right: 1rem; 
    padding-top: 4rem;
    padding-bottom: 4rem; 
    width: 100%; 
    text-align: center; 
}

.section-3 .company-partners{ height: 80px;}
.section-3 .company-partners img{ transition: width .2s ease-in-out;}
.section-3 .company-partners img:hover{width: 950px;}

.section-3 .top-companies{
    width: 100%;
    height: 550px;
    overflow: hidden;
    text-align: center;
    position: relative; 
    padding-top: 60px;
}   

.section-3 .top-companies h2{
    /* font-family: "Poppins", sans-serif;
    font-size: 34px; */

    margin-bottom: 0.75rem; 
    font-size: 54px;
    line-height: 2.208; 
    font-weight: 500; 
    color: var(--title-color); 
}

.section-3 .top-companies p{
    font-family: "Poppins", sans-serif;
    margin-bottom: 2.5rem; 
    font-size: 1.125rem;
    line-height: 1.25rem; 
    color: var(--small-title-color);
    font-weight: 600;
}

.section-3 .top-companies .company-banner-1{
    /* width: 100%; */
    position: absolute;
    left: 0; 
    display: flex;
    gap: 3rem;
    white-space: nowrap;
    animation: scrollBanner 8s linear infinite;

    /* transform: translateX(-5.52417%); */
    /* <div class="flex w-max gap-12" style="transform: translateX(-5.52417%);"> */
    /* class="h-24 md:h-28 object-contain rounded-xl transition-transform duration-300 hover:scale-110"> */
}

@keyframes scrollBanner {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}

.section-4{
    display: flex; 
    justify-content: center; 
    width: 100%; 
    /* background-image: linear-gradient(to bottom, #fff7ed , #ffedd5 , #fed7aa );  */
    /* background-image: linear-gradient(to bottom, #B9DEEB , #B9DEEB , #3080C9 );  */
    /* background: linear-gradient(0deg, #EBF6FA 0%, #64C2B4 100%); */
    
    /* background:#CCEBE9 */
    background: url('../images/bg/course_bg_2.png') no-repeat center center fixed;
    background-size: cover;
    border: none;
    /* opacity: 0.9;
    height: 80vh;
    width: 100%; */
}

.section-4 .content-area{
    overflow: hidden; 
    margin: 1rem;
    border-radius: 1.5rem; 
    border-width: 1px; 
    width: 100%; 
    /* background-image: linear-gradient(to right, #ff6e0c , #ff823d , #ff994f );  */
    border: none;

    /* background: #3B9792; */
    /* background: url('../images/learnify_bg_600.png') no-repeat center center fixed;
    background-size: cover; */
  
    
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    /* backdrop-blur: blur(12px);  */
    max-width: 90rem;
}

.section-4a{
    display: flex; 
    justify-content: center; 
    width: 100%;
    background: url('../images/bg/what-you-experiance.png') no-repeat center center;
    
}

.section-4a .content-area{
    overflow: hidden; 
    margin: 8rem 2.5rem;
    padding: 35px;
    width: 100%; 
    /* background: url('../images/learnify_bg_600.png') no-repeat center center fixed;
    background-size: cover; */
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    max-width: 90rem;
    border: 0.3rem solid transparent;
    /* Paint an image in the border */
    /* border-image: conic-gradient( from var(--angle), #d53e33 0deg 90deg, #fbb300 90deg 180deg,#377af5 180deg 270deg,#399953 270deg 360deg) 1 stretch; */
    /* background: rgb(255 255 255 / 0.5); */
    /* border-radius: 1.5rem;  */
}

@property --opacity {
  syntax: "<number>";
  initial-value: 0.5;
  inherits: false;
}

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

@keyframes opacityChange {
  to {
    --opacity: 1;
  }
}

@keyframes rotate {
  to {
    --angle: 360deg;
  }
}


.section-4a .content-area {
  animation: rotate 4s linear infinite, opacityChange 3s infinite alternate;
}






.ca-section-4a{
    padding-left: 1.5rem;
    padding-right: 1.5rem; 
    padding-top: 4rem;
    padding-bottom: 4rem; 
    border-bottom-right-radius: 1.5rem;
    border-bottom-left-radius: 1.5rem; 
    color: #ffffff; 
    /* background-image: linear-gradient(to right, #ff823d , #ff994f);  */
    /* background: #5CBFBA; */
    /* background: #4caaaf; */
    /* background: linear-gradient(232deg,rgba(0, 0, 0, 1) 0%, rgba(104, 176, 162, 1) 0%, rgba(105, 158, 181, 1) 100%); */
    /* color: black; */
}

.s4a-content-box-col-3-li{
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    color: #fff;
    line-height: 2.5rem;
}

.s4a-content-box-col-3-li:hover {
 color: var(--theme-color); 
}

.content-area .ca-section-1{
    padding-left: 1.5rem;
    padding-right: 1.5rem; 
    padding-top: 3rem;
    padding-bottom: 3rem; 
    margin-top: 1rem; 
    border-top-left-radius: 1.5rem;
    border-top-right-radius: 1.5rem; 
    border: none;
    width: 100%; 
    color: #ffffff; 
}

.ca-section-1 .heading-1{
    font-size: 54px;
    font-weight: 600; 
    letter-spacing: -0.025em; 
    text-align: center; 
    color: var(--title-color);
    word-spacing: 5px;
    line-height: 1.208;
    /* drop-shadow: drop-shadow(0 4px 3px rgba(0, 0, 0, 0.07)) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.06));  */
}

.tab-1{
    display: flex; 
    flex-direction: column; 
    gap: 2rem; 
    align-items: center; 
}

.tab-1-left{
    margin-top: 1rem;
}

.tab-1-left-content{
    font-size: 1rem;
    line-height: 1.5rem; 
    line-height: 1.625; 
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    transition-duration: 300ms; 
}

/* .tab-1-left-content:hover {
 color: #ffffff; 
 } */

.tab-1-image{
    overflow: hidden; 
    border-radius: 1rem; 
    border: 5px solid #fff; 
    
    height: 14rem; 
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); 
}

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

.tab-2{
    display: flex; 
    flex-direction: column; 
    gap: 2rem; 
    align-items: center; 
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
}

.tab-2-left{
    margin-top: 1rem;
}

.tab-1-left-content{
    font-size: 1rem;
    line-height: 1.5rem; 
    line-height: 1.625; 
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    transition-duration: 300ms; 
    color: var(--small-title-color);
}

/* .tab-1-left-content:hover {
 color: #ffffff; 
 } */

.tab-2-image{
    overflow: hidden; 
    border-radius: 1rem; 
    border-width: 1px; 
    height: 14rem; 
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); 
}

.tab-1-download{
    display: inline-flex; 
    margin-top: 1rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem; 
    padding-left: 2rem;
    padding-right: 2rem; 
    gap: 0.75rem; 
    align-items: center; 
    border-radius: 9999px; 
    font-weight: 600; 
    color: #ffffff; 
    background-image: linear-gradient(to right, var(--tw-gradient-stops)); 
    background-color: #000000; 
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    transition-duration: 300ms; 
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);  
}

.tab-1-download:hover {

}


.ca-section-2{
    padding-left: 1.5rem;
    padding-right: 1.5rem; 
    padding-top: 4rem;
    padding-bottom: 4rem; 
    border-bottom-right-radius: 1.5rem;
    border-bottom-left-radius: 1.5rem; 
    color: #ffffff; 
    /* background-image: linear-gradient(to right, #ff823d , #ff994f);  */
    /* background: #5CBFBA; */
    background: #4caaaf;
}

.s2-top-boder{
    display: grid;
    gap: 2.5rem; 
    align-items: flex-start; 
    font-size: 1rem;
    line-height: 1.5rem; 
}

.s2-content-box{
    display: grid;
    gap: 2.5rem; 
    align-items: flex-start; 
    font-size: 1rem;
    line-height: 1.5rem; 
    
}

.s2-content-box-col-1{
    font-size: 1.5rem;
    line-height: 1.75rem; 
    font-weight: 500;
    font-style: italic;
    color: var(--theme-color);
}

.s2-content-box-col-3{
    display: flex; 
    flex-direction: column; 
    gap: 1.5rem; 
    align-items: flex-start; 
}

.s2-content-box-col-3-ul{
    margin-top: 0.5rem; 
    font-size: 1rem;
    line-height: 1.5rem; 
    text-decoration: underline; 
    list-style: none;
    text-decoration: none;
    font-weight: 500;
}
.s2-content-box-col-3-li{
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    color: #ffffff;
    line-height: 2.5rem;
}

.s2-content-box-col-3-li:hover {
 color: #363535; 
}

.s2-content-box-col-3-image{
    overflow: hidden; 
    border-radius: 0.75rem; 
    border-width: 1px; 
    width: 100%; 
    height: auto; 
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); 
}

/* Section 5 */

.course-section-5-spacer{padding-top: 60px;}

.section-5{
    width: 100%; 
    /* background-color: #8ccccd; */
    /* background: url('../images/learnify_bg_600.png') no-repeat center center fixed;
    background-size: cover; */
    /* background-color: #fff; */
    /* background: url('/images/bg/course_bg_2.png') no-repeat center center ; */
    background: url(/images/bg/course_bg_2.png);
}


.section-5-content{
    position: relative; 
    padding-left: 1.5rem;
    padding-right: 1.5rem; 
    padding-top: 4rem;
    padding-bottom: 4rem; 
}

.section-5-h2{
    margin-bottom: 2.5rem; 
    font-size: 2.25rem;
    line-height: 2.5rem; 
    font-weight: 700; 
    line-height: 1.375; 
    color: #000000; 
}
.section-5-selection-btn{
    display: flex; 
    margin-bottom: 2rem; 
    flex-wrap: wrap; 
    gap: 0.75rem; 
}
.section-5-selection-btn-all{
    padding-top: 0.5rem;
    padding-bottom: 0.5rem; 
    padding-left: 1rem;
    padding-right: 1rem; 
    /* border-radius: 9999px;  */
    border-radius: 8px;
    border-width: 1px; 
    border-color: transparent; 
    font-size: 0.875rem;
    line-height: 1.25rem; 
    font-weight: 500; 
    color: #000000; 
    background-color: #ffffff; 
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    transition-duration: 300ms; 
}
.section-5-selection-btn-all:hover {
    color: #ffffff; 
    background-color: var(--theme-color); 
 }

 .selection-5-btn-active{
    padding-top: 0.5rem;
    padding-bottom: 0.5rem; 
    padding-left: 1rem;
    padding-right: 1rem; 
    /* border-radius: 9999px;  */
    border-radius: 8px;
    font-size: 0.875rem;
    line-height: 1.25rem; 
    font-weight: 500; 
    color: #ffffff; 
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); 
    background: var(--theme-color);
 }

 .section-5-selection-courses{
    display: grid ;
    grid-template-columns: repeat(1, minmax(0, 1fr)); 
    gap: 2rem; 
 }
 .section-5-selection-courses-container-cover{
    position: relative;
 }
.section-5-selection-courses-container{
    display: block; 
    padding: 1rem; 
    border-radius: 0.75rem; 
    background-color: transparent; 
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    transition-duration: 200ms; 
    cursor: pointer; 
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); 
}
.section-5-selection-courses-container-image{
    position: relative; 
    margin-bottom: 1rem; 
    width: 100%; 
    height: 12rem; 
    cursor: pointer; 
}

.section-5-selection-courses-container-image-img{object-fit: cover; border-radius: 0.5rem; width: 100%; height: 100%;transition: transform 0.5s ease-in-out;}
.section-5-selection-courses-container-image:hover .section-5-selection-courses-container-image-img{transform: scale(1.08536);}
.section-5-selection-courses-container-h3{margin-bottom: 0.25rem; font-size: 1.125rem;line-height: 1.75rem; font-weight: 600;color: var(--title-color);}
.section-5-selection-courses-container-p{margin-bottom: 0.5rem; font-size: 0.875rem;line-height: 1.25rem; color: #6B7280;}
.section-5-selection-courses-container-nowlive{font-size: 0.875rem;line-height: 1.25rem; color: #374151;}


/* Section 6 */

.services-section-6-spacer{padding-top:100px}
.section-6{
    width: 100%; 
    /* background-color: #8ccccd; */
    /* background: url('../images/learnify_bg_600.png') no-repeat center center fixed;
    background-size: cover; */
    
    /* background-color: #fff; */
}
.section-6-container{
    display: flex; 
    overflow: hidden; 
    position: relative; 
    padding: 8rem 2.5rem; 
    flex-direction: column; 
    gap: 3rem; 
    justify-content: center; 
    align-items: flex-start; 
    min-height: 100vh; 
    z-index: 1;
}

.section-6-container-right-icons{
    display: grid ;
    position: relative; 
    z-index: 10; 
    padding: 2.5rem; 
    grid-template-columns: repeat(1, minmax(0, 1fr)); 
    gap: 2.5rem; 
    border-radius: 1.5rem; 
    border: 1px solid var(--small-title-color); 
    /* backdrop-blur: blur(24px);  */
}
.section-6-container-right-icons-cover{
    padding: 2rem; 
    border-radius: 1rem; 
    border: 1px solid var(--small-title-color); 
    transition-property: transform;
    /* transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); */
    /* transition-duration: 300ms;  */
    transition-duration: 500ms; 
    cursor: pointer; 
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); 
    /* backdrop-blur: blur(16px);  */
}

.section-6-container-right-icons-cover:hover {
    --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);
    --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transform: scale(1.08536);
}

.section-6-container-right-icons-cover:hover{
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); 
 }


.section-7{
    padding: 7rem 1.5rem;
    width: auto;
    background-image: url(/images/bg/course_bg_2.png);
}

.toggle-faq{
    max-height: 0;
    transition: max-height 1s ease-in-out;
    
}
/* .show-faq{
    max-height: 150px;
} */

.show-faq-answer:hover .toggle-faq{
    max-height: 150px;
}

.section-8{
    padding: 7rem 1.5rem;
    overflow: hidden; 
    padding-top: 3rem; 
    padding-bottom: 3rem;
    /* background-color: #fff; */
    color: var(--small-title-color);
}

.section-8-h2{
    margin: 5rem 0 1rem 0; 
    font-size: 54px;
    line-height: 2.25rem; 
    font-weight: 700; 
    line-height: 1.375; 
    text-align: center; 
}
.section-8-container{
    overflow-x: hidden; 
    position: relative; 
    margin: 4rem 0; 
    width: 100%; 
}
.section-8-cover{
    display: flex; 
    padding-left: 1.5rem;
    padding-right: 1.5rem; 
    margin-left: 1.5rem; 
    align-items: flex-start; 
    width: max-content; 
    animation: marquee-scroll 20s linear infinite; 
    animation-play-state: running; 
}

.section-8-container:hover .section-8-cover {
  animation-play-state: paused; 
}


@keyframes marquee-scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-20%);
  }
}
.section-8-cover-items{
    display: flex; 
    padding: 1.5rem; 
    flex-direction: column; 
    border-radius: 0.75rem; 
    background-color: #F9FAFB; 
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); 
    width: 320px;
    margin-left: 1.5rem;
    
}

.section-9{
    padding-left: 1.5rem;
    padding-right: 1.5rem; 
    padding-top: 4rem;
    padding-bottom: 4rem; 
    width: 100%; 
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; 
    color: #b3c1d3; 
    /* background: #ff6e0c; */
    /* background: #9FD650;
    background: linear-gradient(3deg,rgba(159, 214, 80, 1) 0%, rgba(80, 198, 198, 1) 50%, rgba(63, 120, 214, 1) 100%); */
    /* background-color: #EDFEF6; */
    background: url(../images/bg/what-you-experiance.png) no-repeat center center;
}

.section-9-container{
    display: flex; 
    /* margin-bottom: 4rem;  */
    flex-direction: column; 
    gap: 2.5rem; 
    justify-content: space-between; 
}

.section-9-container-content{
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr)); 
    gap: 2rem; 
    row-gap: 2.5rem; 
    width: 100%; 
    font-size: 0.875rem;
    line-height: 1.75rem; 
}

.section-9-container-endsection{
    display: flex; 
    padding-top: 1.5rem; 
    flex-direction: column; 
    gap: 1rem; 
    justify-content: space-between; 
    align-items: center; 
    border-top-width: 1px; 
    font-size: 0.875rem;
    line-height: 1.25rem; 
}

.connect-with-us{
    position: fixed; 
    right: 1.5rem; 
    bottom: 1.5rem; 
    z-index: 50; 
}

.connect-with-us:hover{
    /* transform: translateX(-22.5743px) translateY(-128.025px); */
   
}

/* Connect With Us Button show buttons on hover disabled*/
/* .connect-with-us-buttons:hover .connect-with-us-whatsapp{
    transform: translateX(-79.4847px) translateY(-102.87px);
    
}

.connect-with-us-buttons:hover .connect-with-us-help{
    transform: translateX(-22.5743px) translateY(-128.025px);
}

.connect-with-us-buttons:hover .connect-with-us-insta{
    transform: translateX(-118.186px) translateY(-54.1482px);
}

.connect-with-us-buttons:hover .connect-with-us-linkedin{
    transform: translateX(-129.813px) translateY(6.97796px);
} */


.connect-with-us-btn{
    position: relative; 
    padding: 1.2rem; 
    border-radius: 9999px; 
    color: #ffffff; 
    background-color: #000000; 
    transition: 0.3s;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    animation: bounce 1s infinite;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); 
}

.cwu_rotate0{
    transform: rotate(0deg);
    transition: transform 0.4s ease-in-out ;
}

.rotate45{
    transform: rotate(-45deg);
}

.cwu_main_icon_text_hide{
    display: none;
}

.connect-with-us-help{
    position: absolute; 
    padding: 0.75rem; 
    border-radius: 9999px; 
    color: #ffffff; 
    background-color: #7C3AED; 
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); 
    transform: translateX(7px) translateY(0px);
    transition: transform 0.5s ease-in-out;
    transition-delay: 0.s, 0s, 0s;
 }

.connect-with-us-help:hover {
    background-color: #6D28D9; 
 }

.connect-with-us-help-indicator{
    position: absolute; 
    left: 3rem; 
    top: 50%; 
    padding-top: 0.25rem;
    padding-bottom: 0.25rem; 
    padding-left: 0.5rem;
    padding-right: 0.5rem; 
    border-radius: 0.25rem; 
    font-size: 0.75rem;
    line-height: 1rem; 
    color: #ffffff; 
    white-space: nowrap; 
    background-color: #000000; 
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms; 
    transition-duration: 200ms; 
    --transform-scale-x: 0;
    --transform-scale-y: 0; 
    transform-origin: left; 
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); 
 }
  

 .connect-with-us-whatsapp{
    transform: translateX(7px) translateY(0px);
    transition: transform 0.5s ease-in-out;
    transition-delay: 0.1s, 0s, 01s;
 }

.connect-with-us-insta{
    transform: translateX(7px) translateY(0px);
    transition: transform 0.5s ease-in-out;
    transition-delay: 0.2s, 0s, 02s;
 }

.connect-with-us-linkedin{
    transform: translateX(7px) translateY(0px);
    transition: transform 0.5s ease-in-out;
    transition-delay: 0.3s, 0s, 03s;
}

.connect-with-us-help-show{
    transform: translateX(-22.5743px) translateY(-128.025px);
}
.connect-with-us-whatsapp-show{
    transform: translateX(-79.4847px) translateY(-102.87px);
} 
.connect-with-us-insta-show{
    transform: translateX(-118.186px) translateY(-54.1482px);
} 
.connect-with-us-linkedin-show{
    transform: translateX(-129.813px) translateY(6.97796px);
}



@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animationTimingFunction: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: translateY(0);
    animationTimingFunction: cubic-bezier(0, 0, 0.2, 1);
  }
} 


/* Community Section */
    .community-section{
        /* margin: 4rem 0; */
        /* padding: 4rem 18px; */
        background-image: url(/images/bg/course_bg_2.png);
    }

    .community-card, .community-card-head {
        display: flex;
        justify-content: space-between;
    }
    .community-card {
        background: url(/images/community/community_banner.png);
        background-position: 50%;
        background-size: cover;
        border: 1px solid #d3d3d3;
        border-radius: 14px;
        flex-direction: column;
        height: 911px;
        padding: 30px;
        position: relative;
        width: 100%;
    }

    .community-card-head {
        align-items: center;
        flex-direction: column;
        justify-content: center;
    }
    

    .community-card-para {
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        letter-spacing: 3px;
    }                       
    
    .community-card-heading {
        color: #fff;
        font-size: 36px;
        font-weight: 700;
        letter-spacing: -1px;
        line-height: 40px;
        margin-top: 40px;
        width: 292px;
    }
    
    .community-count-card-container {
        display: flex;
        gap: 22px;
        margin-top: 60px;
    }

    .community-count-card {
        width: 79px;
    }
    .community-count-card p {
        color: #878787;
        font-size: 10px;
        font-weight: 600;
        letter-spacing: 2px;
        transition: 1s;
    }
    .community-count-card h5 {
        color: #fff;
        font-size: 35px;
        font-weight: 600;
        letter-spacing: -1px;
    }
    .community-para-grey {
        color: #878787;
        font-size: 16px;
        font-weight: 400;
        transition: 1s;
    }


    .accenture-location, .deloitte-location, .hp-location, .jio-location, .ola-location, .visa-location {
        animation-duration: 3s;
        animation-iteration-count: infinite;
        animation-name: locationbounce;
        animation-timing-function: ease-in-out;
        position: absolute;
    }

    .hp-location {
        animation-delay: 1s;
        left: 5.5%;
        top: 50%;
    }

    .visa-location {
        animation-delay: 1.5s;
        left: 10.8%;
        top: 50%;
    }
    .deloitte-location {
        animation-delay: 2s;
        left: 16%;
        top: 48%;
    }
    .accenture-location {
        animation-delay: 2.5s;
        left: 37.5%;
        top: 44%;
    }
    .ola-location {
        animation-delay: 3s;
        left: 59%;
        top: 55%;
    }   
    .jio-location {
        animation-delay: 3.5s;
        left: 61.5%;
        top: 57%;
    }


    @keyframes locationbounce {
        0% {transform: translateY(0);}
        50% {transform: translateY(-20px);}
        100% {transform: translateY(0);}
    }


/* About CSS Starts here. */

.about-main-section{
    background-color: #EDFEF6;  
}
.about-offer-banner{
   
}



.kenburns-top {
	-webkit-animation: kenburns-top 5s ease-out infinite alternate both;
	        animation: kenburns-top 5s ease-out infinite alternate both;
}

@-webkit-keyframes kenburns-top {
  0% {
    -webkit-transform: scale(1) translateY(0);
            transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
            transform-origin: 50% 16%;
  }
  100% {
    -webkit-transform: scale(1.25) translateY(-15px);
            transform: scale(1.25) translateY(-15px);
    -webkit-transform-origin: top;
            transform-origin: top;
  }
}
@keyframes kenburns-top {
  0% {
    -webkit-transform: scale(1) translateY(0);
            transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
            transform-origin: 50% 16%;
  }
  100% {
    -webkit-transform: scale(1.25) translateY(-15px);
            transform: scale(1.25) translateY(-15px);
    -webkit-transform-origin: top;
            transform-origin: top;
  }
}



.th-btn {
  position: relative;
  z-index: 2;
  overflow: hidden;
  vertical-align: middle;
  display: inline-block;
  border: none;
  text-transform: uppercase;
  text-align: center;
  background-color: var(--theme-color);
  color: var(--white-color);
  font-family: var(--title-font);
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  padding: 20.5px 29px;
  box-shadow: 0px 6px 16px rgba(13, 94, 244, 0.24);
  border-radius: 5px;
}
.th-btn:before {
  content: "";
  position: absolute;
  height: 0%;
  left: 50%;
  top: 50%;
  width: 600%;
  background-color: var(--title-color);
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(60deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(60deg);
  transform: translateX(-50%) translateY(-50%) rotate(60deg);
  z-index: -1;
  -webkit-transition: 0.7s ease;
  transition: 0.7s ease;
}
.th-btn:hover,
.th-btn.active {
  color: var(--white-color);
}
.th-btn:hover::before,
.th-btn.active::before {
  height: 560%;
}



.preloader {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 999;
  background-color: var(--title-color);
  
}
.preloader .th-btn {
  padding: 15px 20px;
  border-radius: 0;
  font-size: 14px;
}
.preloader-inner {
  text-align: center;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  line-height: 1;
}
.preloader-inner img {
  display: block;
  margin: 0 auto 10px auto;
}
.loader {
  width: 48px;
  height: 48px;
  background: var(--theme-color);
  display: block;
  margin: 20px auto;
  position: relative;
  box-sizing: border-box;
  animation: rotationBack 1s ease-in-out infinite reverse;
}
.loader::before {
  content: "";
  box-sizing: border-box;
  left: 0;
  top: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  width: 48px;
  height: 48px;
  background: var(--theme-color);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.loader::after {
  content: "";
  box-sizing: border-box;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  background: #fff;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
@-webkit-keyframes rotationBack {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}
@keyframes rotationBack {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}
.th-btn {
  position: relative;
  z-index: 2;
  overflow: hidden;
  vertical-align: middle;
  display: inline-block;
  border: none;
  text-transform: uppercase;
  text-align: center;
  background-color: var(--theme-color);
  color: var(--white-color);
  font-family: var(--title-font);
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  padding: 20.5px 29px;
  box-shadow: 0px 6px 16px rgba(13, 94, 244, 0.24);
  border-radius: 5px;
}
.th-btn:before {
  content: "";
  position: absolute;
  height: 0%;
  left: 50%;
  top: 50%;
  width: 600%;
  background-color: var(--title-color);
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(60deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(60deg);
  transform: translateX(-50%) translateY(-50%) rotate(60deg);
  z-index: -1;
  -webkit-transition: 0.7s ease;
  transition: 0.7s ease;
}
.th-btn:hover,
.th-btn.active {
  color: var(--white-color);
}
.th-btn:hover::before,
.th-btn.active::before {
  height: 560%;
}

.th-btn.style5 {
  background-color: var(--title-color);
}
.th-btn.style5:before {
  background-color: var(--theme-color);
}
.th-btn.style5:hover:before {
  background-color: var(--theme-color);
}

.footer-page-link:hover{
    color: var(--theme-color)
}



.team-card.style2 {
    background: transparent;
    box-shadow: none;
    text-align: center;
    margin: 0;
    padding-top: 3px;
}


.team-card.style2 .team-img-wrap {
    position: relative;
}

.team-card.style2 .team-img-wrap .team-shape {
    position: absolute;
    left: 0;
    top: -3px;
    -webkit-transition: 0.7s;
    /* transition: 0.7s; */
    animation: rotationBack 2s ease-in-out infinite reverse;
    z-index: 1;
    
}

.team-card.style2 .team-img-wrap .team-shape-2 {
    position: absolute;
    left: 0;
    top: -3px;
    -webkit-transition: 0.7s;
    /* transition: 0.7s; */
    animation: rotationBack 2s ease-in-out infinite;
    z-index: 1;
    
}

.team-card.style2 .team-img-wrap .team-shape-2 path  {
    fill: red;
}

.team-card.style2 .team-img-wrap .team-img {
    border-radius: 50%; 
    border: 2px solid rgba(208, 219, 233, 0.5);
    padding: 25px;
}

.team-card.style2 .team-img-wrap .team-img img {
    border-radius: 50%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
}

.team-card.style2 .team-img-wrap .team-social {
    bottom: 55px;
    left: 50%;
    top: auto;
    right: auto;
    opacity: 1;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}


.team-card.style2 .team-img-wrap .team-social {
    bottom: 55px;
    left: 50%;
    top: auto;
    right: auto;
    opacity: 1;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

.team-card .team-social {
    position: absolute;
    top: -25px;
    right: 30px;
    opacity: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    z-index: 1;
}









/* Styles for screens smaller than 768px */
@media only screen and (max-width: 768px) {
    
    .main_container {
        width: 100%;
        overflow: hidden;
        
    }
    .hide{
        /* display: none; */
        /* opacity: 1;
        opacity: 1; */
    }

    .menu-bar{
        position: absolute;
        right: 0;
        top: 0;
        width: 0%;
        opacity: 1;
        transition: width 0.5s ease-in-out, opacity 0.2s ease-in;
    }

    .menu-bar.show{
        /* display: block; */
        width: 35%;
        opacity: 1;
    }

    .menu-bar ul{
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 55px;
        right: 0;
        /* background-color: #FEFFFF; */
        background-color: #8ccccd;
        z-index: 1;
        overflow: hidden;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        height: 330px;
        padding-top: 10px;
    }

    .menu-bar li {
        height: 60px;
    }
    .menu-bar .underline-nav-btn{
        display: flex;
        justify-content: center;
        align-items: center;
        /* width: 40%; */
        z-index: 2;
        
    }
    .menu-bar.underline-nav-btn.text{
        /* width: 100%; */
        
        /* background-color: #FEFFFF; */
        /* z-index: 2; */
        
    }

    .learnify-logo {
        width: 100%;
        /* position: relative; */
    }
    .learnify-logo img {
        margin-left: 5%;
        z-index: 1;
    }
    .main-section .left-text .left-text-line3 , .main-section .left-text .left-text-line4 {
        font-size: 16px;
    }
    .mobile-menu-btn{
        display: block;   
        position: absolute;
        top: 30px;
        right: 15px;
    }

    .menu-bar ul .login-btn{
        padding: 5px 25px 5px 25px;
        /* margin-bottom: 10px; */
        /* border: 1px solid #2276BE; */
        border-radius: 20px;
        /* color: #2276BE;
        font-size: 14px;
        transition: background-color 0.3s ease-in-out; */
    }

    .menu-bar ul .underline-nav-btn::after{
        bottom: 20px;

    }

    
    
}

@media only screen and (min-width: 768px) {
    .section-2-a-content-button{flex-direction: row; }
    .section-3 .top-companies h2{font-size: 54px; line-height: 4rem; }
    .section-3 .top-companies p{ font-size: 1.125rem;line-height: 2.5rem;}
    .section-4 .content-area{margin: 6rem 2.5rem;}
    .content-area .ca-section-1{/* padding: 2rem; */padding-left: 3rem;padding-right: 3rem; padding-top: 2rem;padding-bottom: 5rem; }
    .ca-section-1 .heading-1{font-size: 54px;line-height: 1.208;}
    .tab-1{flex-direction: row;}
    .heading-1 .tab-1{flex-direction: row; }
    .tab-1 .tab-1-left{width: 50%;}
    .tab-1-image{width: 50%}
    .tab-2{flex-direction: row; flex-direction: row-reverse; }
    .tab-2 .tab-2-left{width: 50%;}
    .s2-top-boder{gap: 4rem; font-size: 1.125rem;line-height: 1.75rem;}
    .s2-content-box{gap: 4rem; font-size: 1.125rem;line-height: 1.75rem; grid-template-columns: 1fr 3fr 2fr;}
    .s2-content-box-col-1{font-size: 1.5rem;line-height: 2rem; }
    .s2-content-box-col-3{flex-direction: row; }
    .s2-content-box-col-3-ul{font-size: 1.125rem;line-height: 1.75rem;}
    .s2-content-box-col-3-image{width: 10rem;}
    .section-3 .company-partners{ height: 230px;}
    .section-5{/* padding: 2.5rem; */width: 100%;}
    .section-5-content{padding-left: 5rem;padding-right: 5rem; }
    .section-5-selection-courses{grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .section-6-container-right-icons{grid-template-columns: repeat(2, minmax(0, 1fr));}
    .section-9{padding-left: 4rem;padding-right: 4rem;}
    .section-9-container-content{grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .section-9-container-endsection{flex-direction: row;}
}



@media only screen and (min-width: 1024px) { 
    .section-5-selection-courses{grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .section-6-container{flex-direction: row; }
    .section-6-container-right-icons{grid-template-columns: repeat(3, minmax(0, 1fr)); width: 66.666667%;}
    .section-9-container{flex-direction: row; }
    .section-9-container-content{grid-template-columns: repeat(4, minmax(0, 1fr));}
}
    

@media only screen and (min-width: 1280px) { 
    .section-5-selection-courses{
        grid-template-columns: repeat(4, minmax(0, 1fr)); 
    }
    
    .community-section {
        /* margin: 4rem 0; */
        padding: 4rem 120px;
    }
    .community-card {
        border-radius: 30px;
    }
    
    .community-card-head {
    flex-direction: row;
    justify-content: space-between;
}
    
    .community-card-para {
        font-size: 12px;
    }
    .community-card-heading {
        font-size: 49px;
        line-height: 54px;
        margin-top: 45px;
        width: 360px;
    }

    .community-count-card-container {
        display: flex;
        gap: 50px;
    }
    .community-count-card {
        width: 150px;
    }
    .community-count-card p {
        font-size: 14px;
    }
    .community-count-card h5 {
        font-size: 60px;
    }
    .community-para-grey {
        font-size: 14px;
    }

}