*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: arial, sans-serif;
}    
html,body{
    max-width: 100%;
    overflow-x: hidden;
} 



.min-width-container{
    max-width: 2000px;
    min-width: 300px;
    margin: 0 auto;     
    padding: 0;   
}

/* header Contact */
.head-contact {
    width: 100%;
    background-color: #33363D;
    color: wheat;
    display: flex;
    justify-content: center;
    align-items: center;
}
.contact{
    width: auto;
    max-width: 300px;
    padding: 5px;
    color: white;
    font-size: 1rem;
    align-items: center;
    
}
.contact a span{
    color: chocolate;
}
.links{
    width: auto;
    max-height: 50px;
    padding: 5px;
    max-width: 750px;
    color: white;
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-left: 20rem;
}
.links a, .contact a{
    color: white;
    text-decoration: none;
}



/* menus */


.menus-container{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    /* align-items: center; */
    background-color: rgb(238, 233, 233);
}
.menus-container-box{
    width: 90%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.menus-container-logo{
    width: 10%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.menus-container-logo img{
    width: 80%;
    max-width: 180px;   /* max size jab normal zoom pe ho */
    height: auto;
    object-fit: cover;
    background-size: contain;
}
.menus-container-names{
    width: 90%;
    display: block;
    flex-wrap: wrap;
}
.menus-container-name{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.menus-container-comp-name{
    width: 35%;
    font-size: 0.9rem;
    color: black;
    word-spacing: 0.5rem;
    padding-left: 1rem;
    line-height: 1.5rem;
    justify-content: center;
}
.menus-container-center-name{
    width: 60%;
    font-size: 0.9rem;
    color: black;
    word-spacing: 0.5rem;
    line-height: 1.5rem;
    padding-left: 1rem;
    justify-content: center;
}
.menus-container-menu{
    width: 90%;
    margin-top: 1.7rem;
    gap: 3rem;
    display: flex;
    justify-content: center;
}
.menus-container-menu ul{
    list-style-type: none;
    font-size: 0.9rem;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    gap: 4rem;
}
.menus-container-menu ul li{
    padding: 0.65rem;
}
.menus-container-menu ul a{
    text-decoration: none;
    color: black;
}
a{
    color: inherit;
}
.menus-container-menu ul li:hover{
    background-color: rgb(231, 143, 143);
    color: white;
    cursor: pointer;
    border-radius: 8px;

}
.sub-menu{
    position: relative;
    top: 10px;
    left: -10px;
    z-index: 2;
}
.sub-menu ul{
    display: none;
    position: absolute;
    width: 17rem;
    background-color:  rgb(238, 116, 116);
}
.menus-container-menu ul li:hover ul{
    display: block;
}
.icon-bar{
    display: none;
    font-size: 2rem;
    color: black;
    margin-top: 9px;
}


/* media query for header */



/* Tablet Devices (Max Width 1024px) */
@media (max-width: 1024px) {
    .head-contact {
        flex-direction: row;
        gap: 1rem;
        width: auto;
        height: auto;
        
    }
    .menus-container-menu ul{
        display: none;
    }
    .icon-bar{
        display: flex;
    }
    .menus-container-menu.showData{
        width: 170px;
        position: relative;
        top: -99px;
        left: -48px;
    }
    .menus-container-menu.showData ul{
        display: inline-block;
        font-size: 0.8rem;
        background-color: inherit;
    }
    .menus-container-menu.showData ul ul{
        display: none;
        height: 10rem;
        overflow: scroll;
        background-color: rgb(238, 233, 233);;
        
    }
    .menus-container-menu.showData ul ul{
        margin-left: 7rem;
        margin-top: -2px;
    }
    .menus-container-menu.showData ul ul:hover {
        display: block;
        height: 10rem;
        overflow: scroll;
    }

    .contact, .links {
        width: 100%;
        flex-direction: row;
        justify-content: center;
    }
    .links{
        padding-left: 0;
        flex-direction: row;
    }

    .menus-container-box {
        flex-direction: column;
        align-items: center;
    }

    .menus-container-logo {
        width: 30%;
    }

    .menus-container-logo img {
        width: 10vh;
    }

    .menus-container-names {
        width: 100%;
        flex-direction: row;
    }

    .menus-container-center-name {
        width: 50%;
        text-align: center;
        padding-right: 3rem;
    }
    .menus-container-comp-name{
        width: 50%;
        text-align: center;
        padding-left: 3rem;
    }
    .menus-container-menu {
        margin-left: 0;
        gap: 1rem;
    }

    .menus-container-menu ul {
        flex-direction: column;
        gap: 10px;
    }
}

/* Mobile Devices (Max Width 768px) */
@media (max-width: 768px) {
    .head-contact {
        text-align: center;
        width: 100%;
        height: auto;
    }

    .contact, .links {
        width: 100%;
        flex-direction: row;
        justify-content: center;
    }
    .links{
        padding-left: 0;
        flex-direction: row;
    }

    .menus-container-logo {
        width: 40%;
    }

    .menus-container-logo img {
        width: 8vh;
    }

    .menus-container-center-name {
        width: 50%;
        text-align: center;
        padding-right: 3rem;
        font-size: 0.8rem;
    }
    .menus-container-comp-name{
        width: 50%;
        text-align: center;
        padding-left: 3rem;
        font-size: 0.8rem;
    }

    .menus-container-menu ul {
        flex-direction: column;
        gap: 15px;
    }

    .menus-container-menu ul li {
        padding: 0.5rem;
    }
    .menus-container-menu.showData ul{
        display: inline-block;
        font-size: 0.8rem;
        background-color: inherit;
    }
}

/* Very Small Devices (Max Width 480px) */
@media (max-width: 480px) {
    .head-contact {
        padding: 1rem;
        flex-direction: row;
    }

    .contact, .links {
        gap: 0.2rem;
        flex-direction: row;
    }

    .menus-container-logo {
        width: 50%;
    }

    .menus-container-logo img {
        width: 10vh;
    }

    .menus-container-center-name {
        width: 50%;
        text-align: center;
        padding-right: 1.5rem;
        font-size: 0.5rem;
    }
    .menus-container-comp-name{
        width: 50%;
        text-align: center;
        padding-left: 1.5rem;
        font-size: 0.5rem;
    }
    .menus-container-menu.showData ul{
        display: inline-block;
        font-size: 0.6rem;
        background-color: inherit;
    }
}



/* home section */



#eye-mode-container{
    text-align: center;
    position: fixed;
    top: 80px;
    right: 0px;
    z-index: 2;
}
#eye-mode-container button{
    cursor: pointer;
}
.home{
    background-image: url("graphics/home-back.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    scroll-behavior: inherit;
}
.home-box{
    background-color: #000000;
    opacity: 0.8;
    text-align: center;
}
.home-headi0{
    padding-top: 3rem;
    font-size: 2rem;
    color: chocolate;
    word-spacing: 0.7rem;
}
.home-headi1{
    padding-top: 3rem;
    color: white;
    font-size: 4rem;
}
.home-headi2{
    margin-top: 1rem;
    color: chocolate;
    font-size:3rem;
}
.premium-courses{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 4rem;
    padding-top: 5rem;
}
.premium-course-box{
    flex-direction: row;
    float: left;
}
.premium-course{
    width: 10rem;
    height: 10rem;
    border-radius: 50%; 
}
.premium-course img{
    width: 10rem;
    height: 10rem;
    border-radius: 50%;
    object-fit: cover;
}
.premium-course-name{
    font-size: 1rem;
    color: white;
    padding-top: 1.5rem;
    text-align: center;
}
.premium-course-name-hindi{
    font-size: 1rem;
    color: chocolate;
    text-align: center;
    padding-top: 1rem;
}
.success-line{
    font-size: 3rem;
    margin-top: 10rem;
    color: RED;
    word-spacing: 0.6rem;
    text-align: center;
}
.roadmap{
    font-size: 2rem;
    margin-top: 4rem;
    color: cornflowerblue;
    text-align: center;
    word-spacing: 0.7rem;
}


/* @media query */

/* for tablet */

@media (max-width: 1024px){
    .home{
    background-image: url("graphics/home-back.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    }
    .premium-course{
    width: 8rem;
    height: 8rem;
    border-radius: 50%; 
    }
    .premium-course img{
        width: 8rem;
        height: 8rem;
    }
    .success-line{
    margin-top: 6rem;
    }
    .roadmap{
    word-spacing: 0.6rem;
    line-height: 2.7rem;
    }
}



/* for mobile */

@media (max-width: 768px){
    .home-headi0{
    padding-top: 2rem;
    font-size: 1rem;
    word-spacing: 0.6rem;
    }
    .home{
        background-image: url("graphics/home-back.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        background-attachment: fixed;
    }
    .home-headi1{
        padding-top: 2rem;
        font-size: 1.9rem;
    }
    .home-headi2{
        margin-top: 0.7rem;
        font-size:1.8rem;
    }
    .premium-courses{
        gap: 2.5rem;
        padding-top: 3rem;
    }
    .premium-course{
        width: 5rem;
        height: 5rem;
        border-radius: 50%; 
    }
    .premium-course img{
        width: 5rem;
        height: 5rem;
    }
    .premium-course-name{
        font-size: 0.5rem;
        padding-top: 1.2rem;
    }
    .premium-course-name-hindi{
        font-size: 0.7rem;
        padding-top: 0.7rem;
    }
    .success-line{
        font-size: 1.9rem;
        margin-top: 3rem;
    }
    .roadmap{
        font-size: 1rem;
        margin-top: 2rem;
        line-height: 1.3rem;
        word-spacing: 0.6rem;
    }
}


/* courses section  */
    
.courses{
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    float: left;
    padding-top: 2rem;
    background-attachment: fixed;
}
.courses-box{
    width: 95%;
    height: auto;
    display: block;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    background-color: transparent;
}
.courses-headi{
    font-size: 2rem;
    font-style: italic;
    font-weight: lighter;
    padding-top: 2rem;
    padding-bottom: 2rem;
    text-align: center;
}
.course-container{
    display: block;
    text-align: center;
}
.course-container-row{
    display: flex;
    justify-content: center;
    align-items: center;
    
}
.course-container-col1,.course-container-col2{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    gap: 0rem 2rem;
}
.course-container-course{
    background-color: rgb(205, 202, 202);
    padding: 1rem 2rem;
    display: block;
    border-radius: 5px;
    color: black;
}
.course-container-course:hover{
    background-color: rgb(164, 162, 162);
    box-shadow: 3px 3px 3px  rgba(0, 0, 0, 0.9),
                -3px -3px 3px  rgba(0, 0, 0, 0.9);
    color: white;
}
.course-graphic img{
    width: 10rem;
    height: 7rem;
    object-fit: contain;
    margin-bottom: 0.5rem;
}
.course-container-course h3, .course-container-course h5{
    opacity: 0.9;
    font-weight: 400;
    line-height: 1.5rem;
}
.course-container-course button{
    font-size: 1rem;
    width: max-content;
    padding: 0.4rem 1.5rem;
    margin-top: 0.5rem;
    background-color: rgba(15, 7, 57, 0.951);
    color: white;
    border-radius: 5px;
    cursor: pointer;
}
.course-container-course button a{
    text-decoration: none;
}


/* Tablet */
@media (max-width: 1024px) {
    .course-container-row{
        margin: 0;
    }
    .course-container-col1, .course-container-col2{
        padding: 0.3rem;
        gap: 0rem 0.6rem;
    }
    .course-container-course{
        padding: 1.2rem 3rem;
    }
    .course-graphic img{
        width: 5rem;
        height: 5rem;
        object-fit: contain;
        margin-bottom: 0.2rem;
    }
    .course-container-course h3, .course-container-course h5{
        opacity: 0.9;
        font-size: 0.7rem;
        font-weight: 400;
        line-height: 1.3rem;
    }
    .course-container-course button{
        font-size: 0.7rem;
        width: max-content;
        padding: 0.3rem 1.2rem;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .course-container-row{
        flex-direction: column;
    }
    .course-container-col1,.course-container-col2{
        padding: 1rem;
        gap: 0rem 2rem;
    }
    .course-container-course{
        padding: 1rem 2rem;
        display: block;
    }
    .course-graphic img{
        width: 10rem;
        height: 7rem;
        object-fit: contain;
        margin-bottom: 0.5rem;
    }
    .course-container-course h3, .course-container-course h5{
        opacity: 0.9;
        font-weight: 400;
        font-size: 0.9rem;
        line-height: 1.5rem;
    }
    .course-container-course button{
        font-size: 1rem;
        width: max-content;
        padding: 0.4rem 1.5rem;
        margin-top: 0.5rem;
        
    }
}

/* Small Tablet / Large Mobile */

@media (max-width: 480px) {
    .courses-headi{
        font-size: medium;
    }
    .course-container-row{
        flex-direction: column;
    }
    .course-container-col1,.course-container-col2{
        padding: 0.7rem;
        gap: 0rem 2rem;
    }
    .course-container-course{
        padding: 1rem 2rem;
        display: block;
    }
    .course-graphic img{
        width: 6rem;
        height: 6rem;
        object-fit: contain;
        margin-bottom: 0.2rem;
    }
    .course-container-course h3, .course-container-course h5{
        opacity: 0.9;
        font-weight: 400;
        font-size: 0.9rem;
        line-height: 1.4rem;
    }
    .course-container-course button{
        font-size: 0.8rem;
        width: max-content;
        padding: 0.4rem 1.5rem;
        margin-top: 0.5rem;
        
    }
    
}

 
/* team section */
.marquee-team-section{
    max-width: 2000px;
    min-width: 300px;
    margin: 0 auto;     
    padding-top: 2rem;}
    
.team-headi{
    font-size: 2rem;
    font-style: italic;
    font-weight: lighter;
    padding-top: 2rem;
    justify-content: center;
    text-align: center;
    margin-top: 2rem;
}

marquee {
    width: auto;
    height: auto;
    background-color: rgb(208, 196, 196);
}

.marquee-wrapper {
  display: flex;
  align-items: center;
  gap: 3.5rem;
  width: max-content;
  animation: scroll-left 25s linear infinite;
}



.team-container-members {
  text-align: center;
  font-family: Arial, sans-serif;
  font-size: 0.9rem;
}
.team-container-members a {
  text-decoration: none;
  color: #222;
  transition: color 0.2s ease-in-out;
}

.circle {
  width: 95px;
  height: 95px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #f9f9f9;
  margin: 0 auto;
}

.circle img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-member-name {
  font-size: 0.85rem;
  font-weight: 600;
  color: #000;
  margin-top: 5px;
  text-transform: uppercase;
}

.team-container-members:hover .team-member-name {
  color: #d00000;
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 768px) {
  .circle {
    width: 75px;
    height: 75px;
  }
  .team-member-name {
    font-size: 0.75rem;
  }
  .marquee-wrapper {
    gap: 1rem;
  }
}









/* classe mode */

.classes-mode-container{
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    padding-top: 1rem;
    padding-bottom: 1rem;
    background-attachment: fixed;
}
.classe-mode-container-box1{
    width: 95%;
    height: auto;
    display: inline-block;
    flex-wrap: wrap;
    text-align: center;
    background-color: transparent;
}
.classe-mode-container-box{
    padding: 5rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-self: center;
    gap: 10rem;
}
.classe-mode-headi{
    font-size: 2rem;
    font-style: italic;
    font-weight: lighter;
    padding-top: 2rem;
    text-align: center;
}
.online-mode , .offline-mode{
    gap: 2rem;
    padding: 2rem;
    text-align: center;
    box-shadow: 0px 0px 3px 3px  rgba(0, 0, 0, 0.6);

}
.online-graphic img{
    width: 12rem;
    height: 10rem;
    object-fit: contain;
}
.online-class-headi{
    padding-top: 0.5rem;
    font-size: 1rem;
}
.online-mode a, .offline-mode a{
    text-decoration: none;
}
.online-mode a:hover,.offline-mode a:hover{
    opacity: 0.8;
}
.online-mode:hover,.offline-mode:hover{
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.9);
    background-color: white;
    color: black;
}
.online-class-headi a{
    color: blue;
    font-size: 1.1rem;
    line-height: 2rem;
}
.online-class-headi a:hover, .online-class-headi a:hover{
    color: red;
    font-size: 1.2rem;
}


/* Tablet */
@media (max-width: 1024px) {
    .online-mode , .offline-mode{
    padding: 0.5rem;
    font-size:0.2rem ;
    }
    .online-graphic img{
    width: 8rem;
    height: 8rem;
    object-fit: contain;
    }
    .classe-mode-container-box{
        gap: 5rem;
    }
        
}

/* Mobile */
@media (max-width: 768px) {
    .classe-mode-headi{
    font-size: 0.5rem;
    font-style: italic;
    font-weight: lighter;
    padding-top: 0rem;
    text-align: center;
}
    .online-mode , .offline-mode{
    padding: 0.4rem;
    font-size:0.2rem ;
    }
    .online-graphic img{
    width: 4.5rem;
    height: 4.5rem;
    object-fit: contain;
    }
    .classe-mode-container-box{
        gap: 2rem;
    }
    .online-class-headi{
    padding-top: 0.2rem;
    font-size: 0.5rem;
}
}

/* Small Tablet / Large Mobile */

@media (max-width: 480px) {
    
    
}


/* service providers */
   
.Service-provider-container{
    text-align: center;
    padding-top: 1rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding-bottom: 1rem;
    background-color: transparent;
    background-attachment: fixed;
}
.Service-provider-container-box1{
    height: auto;
    width: 95%;
    padding-bottom: 2rem;
    background-color: transparent;
}
.Service-provider-container-headi{
    font-size: 2rem;
    font-style: italic;
    font-weight: lighter;
    padding-top: 2rem;
    text-align: center;
}
.Service-provider-container-box{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding-top: 3rem;
    gap: 8rem;
}
.providers-container{
    width: 170px;
    height: 210px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    box-shadow: 0px 0px 3px 3px  rgba(0, 0, 0, 0.6);
}
.providers{
    width: 130px;
    height: 130px;
    border-bottom-left-radius:70%;
    border-bottom-right-radius: 70%;
    overflow: hidden;

}
.provider-circle{
    width: 130px;
    height: 105px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    background-image: linear-gradient(0deg,rgba(80,134,72,1) 0%, rgba(5,30,34,1) 100%);   
    border-top-left-radius: 40%;
    border-top-right-radius: 40%;
    transform: translate(0%,16%);

}

.provider-circle img{
    width: 125%;
    height: 125%;
    object-fit: contain;
    position: relative;
    bottom: 20%;

}
.provider-name{
    padding: 1rem;
}
.provider-circle img:hover{
    width: 140%;
    height: 140%;
    transition-timing-function: ease;
    transition-duration: 1s;
}
.providers-container:hover{
    background-color: rgb(221, 221, 221);
    box-shadow: 0px 0px 4px 4px  rgba(24, 134, 45, 0.9);
    color: black;
}



/* footer */

.footer-container{
    background-attachment: fixed;
    width: 100%;
    height: 100%;
    background-color: #3a3b3c;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.footer-container-box{
    width: 90%;
    height: 600px;
    display: flex;
    justify-content: space-evenly;
    align-items: cente;
}
.footer-box-content{
    width: 25%;
    height: 500px;
    color: white;
}
.startup-india-name{
    width: 95%;
    height: 155px;
    display: block;
    justify-content: center;
    text-align: center;
    color: white;
    line-height: 50px;
}
.startup-india-logo{
    width: 95%;
    height: 155px;
    background-image: url(images/startup-india.png);
    background-repeat: no-repeat;
    background-size: 100% 50%;
    margin-top: 65px;
}
.make-in-india{
    width: 95%;
    height: 155px;
    background-image: url("images/make-in-india.png");
    background-repeat: no-repeat;
    background-size: 100% 80%;
    margin-top: 25px;
}
.services-link{
    text-decoration: none;
    color: white;
    opacity: 0.6;

}
.img-line{
    margin-left: 10px;
}
.footer-container span{
    font-size: 1rem;
    color: white;
    padding-bottom: 1.2rem;
    word-spacing: 0.1rem;
}







/* Mobile devices (max width 768px) */
@media (max-width: 768px) {
    .footer-container-box {
        flex-direction: column;
        height: auto;
    }

    .footer-box-content {
        width: 90%;
        margin-bottom: 30px;
        height: auto;
    }

    .startup-india-name h2,
    .startup-india-name h1 {
        font-size: 1.2rem;
    }

    input, textarea {
        width: 90%;
    }

    .services-link {
        display: block;
        margin-bottom: 10px;
    }
}

/* Very small devices (max width 480px) */
@media (max-width: 480px) {
    header {
        flex-direction: column;
        align-items: flex-start;
    }

    #contactForm {
        text-align: left;
    }

    input, textarea {
        width: 100%;
    }

    .startup-india-logo, .make-in-india {
        background-size: contain;
    }

    .img-line {
        margin-left: 0;
    }
}




/* brand container */
.brand-box{
    height: auto;
    width: 100%;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    background-color: transparent;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.brand-headi{
    font-size: 2rem;
    font-style: italic;
    font-weight: lighter;
    padding: 1rem;
    text-align: center;
}

.brand-row1, .brand-row2, .brand-row3, .brand-row4, .brand-row5, .brand-row6, .brand-row7, .brand-row8{
    height: auto;
    width: 72%;
    display: flex;
    flex-wrap: wrap;
    border-radius: 8px;
    justify-content: space-evenly;
    background-color: transparent;
}

.brands{
    height: 100px;
    width: 18%;
    border: 1px solid green;
    background-color: white;
    border-radius: 8px;
    margin: 1.5rem;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

}

.brands:hover{
    box-shadow: 0px 0px 15px 2px black;
}

.brand-img1{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/circle\ digits.png);
    background-size: 60% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img2{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/cirecle\ coracle\ india.png);
    background-size: 60% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}

.brand-img3{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/co.png);
    background-size: 67% 97%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img4{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracle\ hindi\ with\ r.png);
    background-size: 76% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img5{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracle\ hindi.png);
    background-size: 80% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img6{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracle\ india\ circle.jpg);
    background-size: 60% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img7{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracle\ news.png);
    background-size: 70% 80%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img8{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracle\ school.jpeg);
    background-size: 70% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img9{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracle\ science\ with\ tm.png);
    background-size: 60% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img10{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/CORACLE\ UNIVERSITY\ ROUND.png);
    background-size: 60% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img11{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracle\ worl\ with\ tm.png);
    background-size: 65% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img12{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracle\ worldwide1.png);
    background-size: 77% 65%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img13{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracle.png);
    background-size: 82% 70%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img14{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracleacademy.png);
    background-size: 82% 78%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img15{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coraclecapital.png);
    background-size: 75% 78%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img16{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracleglobal1.png);
    background-size: 80% 78%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img17{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracleinternational.png);
    background-size: 70% 65%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img18{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coraclepharma.png);
    background-size: 70% 70%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img19{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/coracleround.png);
    background-size: 85% 60%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img20{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/digits\ india\ r.png);
    background-size: 70% 80%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img21{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/DIGITS\ INDIA.png);
    background-size: 67% 72%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img22{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/digits.jpeg);
    background-size: 60% 85%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img23{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/gate\ with\ r.jpg);
    background-size: 63% 95%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img24{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/hargol\ with\ r.png);
    background-size: 70% 72%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img25{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/made\ in\ indi.png);
    background-size: 60% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img26{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/MSME-Logo.png);
    background-size: 72% 80%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img27{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/network\ marketing.jpg);
    background-size: 65% 90%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img28{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/startup\ ipr\ with\ tm.jpg);
    background-size: 90% 60%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img29{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/startup.jpg);
    background-size: 95% 50%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}
.brand-img30{
    height: 100px;
    width: 18%;
    background-color: white;
    background-image: url(images/zikoper\ r.jpg);
    background-size: 95% 80%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}


/* Default (Desktop) */
.brand-row1, .brand-row2, .brand-row3, .brand-row4,
.brand-row5, .brand-row6, .brand-row7, .brand-row8 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.brands {
    flex: 1 1 18%; /* Grow and shrink with minimum 18% */
    max-width: 150px;
    min-width: 120px;
}

/* Tablet */
@media (max-width: 1024px) {
    .brands {
        flex: 1 1 30%;
    }
}

/* Small Tablet / Large Mobile */
@media (max-width: 768px) {
    .brands {
        flex: 1 1 45%;
    }

    .brand-headi {
        font-size: 1.5rem;
    }

    .brand-box {
        height: auto;
        padding-bottom: 2rem;
    }
}

/* Mobile */
@media (max-width: 480px) {
    .brands {
        flex: 1 1 80%;
    }
}




/* .team detals */


.team-detail-container{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    background-color: transparent;
}
.team-detail-container-box{
    width: 95%;
    height: auto;
    display: block;
    flex-wrap: wrap;
    padding: 2rem;
    background-color: transparent;
}
.coracle-team-headi{
    display: block;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    font-size: 2rem;
}
.team-row1{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 3rem;
    padding-top: 3rem;
}
.team-row1-box{
    background-image: linear-gradient(to right, rgba(0,0,0,0.8),#FFD700);
    border-radius: 8px;
    box-shadow: 0px 0px 5px 2px black;
    overflow: hidden;
}
.team-row1-box:hover{
    box-shadow: 0px 0px 7px 2px green;
    background-image: linear-gradient(to right, rgba(0,0,0,0.8),rgb(213, 213, 8));
}
.team-member-name-container{
    font-size: 1.2rem;
    word-spacing: 2px;
    color: white;
    padding-top: 1rem;
    padding-left: 1rem;
}
.team-member-name-container span{
    font-size: 1.3rem;   
    color: rgb(240, 142, 72);
}
.team-member-name-container p{
    font-size: 2rem;
    line-height: 3rem;
}
.team-member-detail-container1{
    display: flex;
    flex-wrap: wrap;
    align-items: center;

}
.team-member-details-container{
    width: 180px;
    height: 80px;
    letter-spacing: 0.2px;
    line-height: 0.9rem;
    font-size: 0.7rem;
    border-radius: 10px;
    border-bottom-right-radius: -10%;
    margin-left: 1rem;
    padding: 0.4rem;
    background-color: rgba(255,255,255, 0.2);
}
.team-member-img-container{
    display: flex;
    width: 210px;
    height: 100px;
    justify-content: center;
    align-items: center;
    /* background-image: url(graphics/dev-roadmap-removebg-preview.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    background-size: cover; */
    transform: translate(5%, 0%);

}
.team-member-img-container img{
    width: 10rem;
    height: 10rem;
    transform: translate(20%, -12%);
    object-fit: contain;
    transform: translate(5%, -13.5%);
}




/* Media Query for tablets and smaller screens */
@media screen and (max-width: 1024px) {
    .team-row1 {
        flex-direction: column;
        gap: 2rem;
    }

    .team-member-detail-container1 {
        flex-direction: column;
        align-items: center;
    }

    .team-member-details-container {
        width: 90%;
        margin-left: 0;
        text-align: center;
    }

    .team-member-img-container {
        width: 200px;
        height: 200px;
        transform: translate(0%, 0%);
    }

    .team-member-img-container img {
        transform: translate(0%, 0%);
    }
}

/* Media Query for mobile phones */
@media screen and (max-width: 768px) {
    .team-detail-container-box {
        padding: 1rem;
    }

    .coracle-team-headi {
        font-size: 1.5rem;
    }
    .team-row1,.classes-mode-container-row {
        gap: 1rem;
    }

    .team-member-name-container {
        font-size: 1.1rem;
        padding-top: 1rem;
        padding-left: 1rem;
    }

    .team-member-name-container span {
        font-size: 1.3rem;
    }

    .team-member-name-container p {
        font-size: 2rem;
        line-height: 2.5rem;
    }

    .team-member-img-container {
        width: 150px;
        height: 150px;
    }

    .team-member-img-container img {
        width: 8rem;
        height: 8rem;
        transform: translate(0%, 0%);
    }
}







/* contac form */



.form-box{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
}
.contact-form-box-content{
    width: 95%;
    height: auto;
    margin: 2rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    background-color: transparent;
}
.contact-form-content{
    width: 40%;
    height: auto;
    margin: 3rem;
    flex-wrap: wrap;
    font-size: 18px;
    padding-left: 3rem;
    padding-top: 12px;
    box-shadow: 0px 0px 15px 2px black;

}
.contact-form-content input, .contact-form-content label{
    width: 300px;
    height: 32px;
}
.contact-form-content textarea{
    width: 300px;
    height: 50px;
}

/* Tablets */
@media (max-width: 1024px) {
    .contact-form-content {
        width: 60%;
        padding-left: 2rem;
    }

    .contact-form-content input,
    .contact-form-content label,
    .contact-form-content textarea {
        width: 90%;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .contact-form-content {
        width: 90%;
        padding-left: 1rem;
        margin: 1rem;
    }

    .contact-form-content input,
    .contact-form-content label,
    .contact-form-content textarea {
        width: 100%;
    }

    button {
        width: 100%;
    }
}

/* Small mobile (very small devices) */
@media (max-width: 480px) {
    .contact-form-content {
        padding-left: 0.5rem;
        margin: 1rem;
    }

    .contact-form-content input,
    .contact-form-content label,
    .contact-form-content textarea {
        width: 100%;
    }

    button {
        width: 100%;
    }
}




/* classe mode page */




#classes-sec{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
}
.classes-mode-container{
    width: 95%;
    height: auto;
    margin: 2rem;
    display: block;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.classe-mode-headi{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    font-size: 2rem;
}

.online-platform-name{
    display: flex;
    flex-wrap: wrap;
    font-size: 1.5rem;
    padding-top: 1rem;
    padding-left: 20rem;
    word-spacing: 5px;
    
}
.classes-mode-container-row{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 5rem;
    padding-top: 3rem;
   
}
.offline-platform-name{
    display: flex;
    flex-wrap: wrap;
    font-size: 1.5rem;
    padding-top: 5rem;
    padding-left: 20rem;
    word-spacing: 5px;
    font-weight: 600;
}
.classes-mode-container-row2{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 7rem;
    padding-top: 3rem;
   
}
.offline-graphic14 img{
    width: 16rem;
    height: 14rem;
    position: relative;
    left: 10rem;
    object-fit: contain;
}
.offline-mode1{
    padding: 1rem;
    box-shadow: 0px 0px 3px 3px  rgba(0, 0, 0, 0.6);

}
.offline-class-headi1{
    padding-top: 0.5rem;
    font-size: 1.5rem;
    text-align: justify;
}
.offline-class-headi1 span{
    
    font-size: 1.3rem;
    word-spacing: 5px;
    text-align: justify;
}
.offline-mode1:hover{
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.6);
}


/* ADCA-V page */

#topics{
    padding-bottom: 3rem;
}
.adca-main-container{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(17, 109, 239);
    gap: 15rem;
    overflow: hidden;
}
.adca-headi-container{
    display: inline-block;
    text-align: center;
    word-spacing: 0.5rem;
    line-height: 4rem;
    color: white;

}
.adca-headi-container h1{
    font-size: 2.6rem;
}
.adca-headi-container button{
    font-size: 1.5rem;
    padding: 0.5rem 2rem;
    margin-top: 2rem;
    font-weight: 600;
    cursor: pointer;
}
.adca-img-container img{
    width: 20rem;
    height: auto;
    object-fit: contain;
    position: relative;
    bottom: -2.49rem;
}
.course-overview-container{
    padding: 1.5rem 5rem;
    display: inline-block;
    text-align: center;
    word-spacing: 0.5rem;
    line-height: 1.7rem;
}
.course-overview-container h2{
    font-size: 2rem;
    padding: 1rem 0rem 1.5rem 0rem;
}
.course-overview-container p{
    text-align: justify;
}
.key-highlight-headi{
    font-size: 2rem;
    padding: 1rem 0rem 1rem 5rem;
}
.key-highlight{
    display: flex;
    text-align: center;
    padding-left: 5rem;
    gap: 2rem;
}

.key-highlight-points{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.5rem;
    gap: 4rem;
}
.key-highlight-points a{
    text-decoration: none;
}
.key-highlight-point{
    display: block;
    background-color: rgba(223, 251, 255,0.8);
    text-align: center;
    line-height: 1.6rem;
    letter-spacing: 0.6px;
    padding: 0.5rem 3.2rem;
    border-radius: 10px;
}
.key-highlight-point a img, .key-highlight-point img{
    width: 5rem;
    height: auto;
    object-fit: contain;
}
.key-highlight-point h3, .key-highlight-point h5{
    font-size: 1rem;   
    align-items: center;
    font-weight: 100;
    padding-bottom: 0.5rem;
}
.key-highlight-point h3{
    font-weight: 600;
}
.topics-container{
    width: 100%;
    height: auto;
    display: block;
} 
.topics-heading{
    font-size: 2rem;
    padding: 1rem 0rem 1rem 5rem;
}
.topics{
    padding: 1rem;
}
.topics ul{
    padding: 0.2rem 1rem 0.5rem 9rem;
    overflow: scroll;
    width: max-content;
    height: 14rem;
    list-style: none;
}
.topics ul li{
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 2rem;
}

.topics ul li:before {
  content: '👉 ';
}
.choose-us{
    display: flex;
    background-color: rgba(223, 251, 255,0.8);
    align-items: center;
    line-height: 1.6rem;
    letter-spacing: 0.6px;
    padding: 0.5rem 3.2rem;
    border-radius: 10px;
    gap: 1rem;
}
.choose-us img{
    width: 5rem;
    height: auto;
    object-fit: contain;
}
.purchase-container{
    display: flex;
    justify-content: center;
    align-items: center;
}
#topics a button{
    margin-top: 5rem;
    font-size: 1.5rem;
    padding: 1rem 5rem;
    background-color: rgba(15, 7, 57, 0.951);
    color: white;
    border-radius: 5px;
    cursor: pointer;
}

/* Tablet */
@media (max-width: 1024px) {
    .adca-main-container{
    gap: 7rem;
    }
    .adca-headi-container{
    word-spacing: 0.35rem;
    line-height: 3.5rem;
    }
    .adca-headi-container h1{
    font-size: 2.2rem;
    }
    .adca-headi-container button{
    font-size: 1.5rem;
    padding: 0.5rem 2.7rem;
    margin-left: 0.5rem;
}
    .course-overview-container h2{
    font-size: 1.8rem;
    opacity: 0.7;
    }
    .key-highlight-headi{
    font-size: 1.5rem;
    }
    .key-highlight{
    padding-left: 2rem;
    gap: 1rem;
    }

    .key-highlight-points{
    gap: 2rem;
    }
    .key-highlight-point{
    line-height: 1.4rem;
    letter-spacing: px;
    padding: 0.5rem 2.3rem;
    }
    .key-highlight-point a img, .key-highlight-point img{
    width: 3rem;
    height: auto;
    object-fit: contain;
    }
    .key-highlight-point h3, .key-highlight-point h5{
    font-size: 0.8rem;   
    font-weight: 100;
    padding-bottom: 0.5rem;
    }
    .topics-heading{
    font-size: 1.5rem;
    padding: 1rem 0rem 1rem 5rem;
    }
    .topics{
        padding: 1rem;
    }
    .topics ul{
        padding: 0.2rem 1rem 0.5rem 9rem;
        overflow: scroll;
        width: max-content;
        height: 12rem;
        list-style: none;
    }
    .topics ul li{
        font-size: 0.8rem;
        line-height: 1.7rem;
    }
    .choose-us{
    line-height: 1.5rem;
    padding: 0.5rem 1rem;
    border-radius: 10px;
    gap: 1rem;
    }
    .choose-us img{
        width: 3rem;
    }
    #topics a button{
        margin-top: 2rem;
        font-size: 1.5rem;
        padding: 1rem 2rem;
        background-color: rgba(15, 7, 57, 0.951);
    }
}

/* Mobile */
@media (max-width: 768px) {
    .adca-main-container{
    gap: 0.000001rem;
    }
    .adca-headi-container{
    line-height: 2.5rem;
    }
    .adca-headi-container h1{
    font-size: 1.5rem;
    margin-left: 5rem;
    }
    .adca-headi-container button{
    font-size: 1.2rem;
    padding: 0.5rem 1.5rem;
    width: max-content;
    margin-left: 5rem;
    }
    .adca-img-container img{
        width: 18rem;
    }
    .course-overview-container h2{
    font-size: 1.7rem;
    opacity: 0.7;
    }
    .key-highlight-headi{
    font-size: 1.2rem;
    }
    .key-highlight{
    padding-left: 1rem;
    gap: 0.5rem;
    }

    .key-highlight-points{
    gap: 0.5rem;
    flex-wrap: wrap;
    }
    .key-highlight-point{
    line-height: 1.2rem;
    letter-spacing: px;
    padding: 0.5rem 1.5rem;
    }
    .key-highlight-point a img, .key-highlight-point img{
    width: 2rem;
    }
    .key-highlight-point h3, .key-highlight-point h5{
    font-size: 0.8rem;   
    font-weight: 100;
    padding-bottom: 0.5rem;
    }
    .topics-heading{
    font-size: 1.2rem;
    padding: 1rem 0rem 1rem 5rem;
    }
    .topics{
        padding: 1rem;
    }
    .topics ul{
        padding: 0.2rem 1rem 0.5rem 9rem;
        width: max-content;
        height: 12rem;
    }
    .topics ul li{
        font-size: 0.8rem;
        line-height: 1.7rem;
    }
    .choose-us{
    line-height: 1.3rem;
    padding: 0.5rem 0.7rem;
    gap: 0.5rem;
    }
    .choose-us img{
        width: 3rem;
    }
    #topics a button{
        margin-top: 1.5rem;
        font-size: 1.2rem;
        padding: 0.5rem 1rem;
        background-color: rgba(15, 7, 57, 0.951);
    }
}

/* Small Tablet / Large Mobile */

@media (max-width: 480px) {
    
}