*{
    margin:0px;
    padding:0px;
}

/*******************************************
        Header Part Responsive
********************************************/

@media(max-width: 990px){
    .header-menu{
        display: none;
    }
    .cv-side{
    margin-right:10px
}
}

@media(min-width: 990px){
    .side-menu{
        display:none;
    }
}

@media(max-width: 520px){
    .cv-btn{
        display:none;
    }
}

/*******************************************
          Hero Part Responsive
********************************************/

@media (min-width:1400px){
    .hero-social-info{
        top:446px;
        left:-100px;
    }
}

@media (min-width: 1200px) and (max-width: 1235px){
    .hero-social-info{
        top:418px;
        left:-112px;
    }
}

@media (min-width: 992px) and (max-width: 1200px){
    .hero-social-info{
        top:390px;
        left:-112px;
    }

    .arrow-shape{
        position: absolute;
        right:45.5%;
        transform: rotate(7deg);
        top:20%;
    }
}

@media (min-width: 992px) and (max-width: 1015px){
    .hero-social-info{
        top:390px;
        left:-118px;
    }
}

@media (min-width:0px) and (max-width: 992px){
    .hero-social-info{
        display: none;
    }

    .arrow-shape{
        display: none;
    }

    .star-shape{
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 940px){
    /*_____________ Hero text-animation ______________*/

    .txt-wrapper{
        padding-bottom:15px;
    }

    .static-txt{
        font-size: 30px;
        font-weight: bold;
        color:#273536;
    }

    .dynamic-txt{
        height: 40px;
        line-height: 40px;
        overflow:hidden;
    }

    .dynamic-txt li{
        list-style-type: none;
        font-size:28px;
        position:relative;
        top: 0;
        animation: slide 12s steps(2) infinite;
        color:#28E98C;
    }

    @keyframes slide {
        100% {
        top: -84px; /* 2 items × 90px line-height = 180px */
        }
    }

    .dynamic-txt li span{
        position: relative;
        margin: 1px 0;
        line-height: 40px;
    }

    .dynamic-txt li span::after{
        content: "";
        position: absolute;
        left: 0;
        height: 100%;
        width: 100%;
        background: #fff;
        border-left: 2px solid #71f0b3;
        animation: typing 6s steps(15) infinite;
    }

    @keyframes typing {
        40%, 60% {
        left: calc(100% + 5px);
        }
        100% {
        left: 0;
        }
    }
}

@media (min-width: 317px) and (max-width: 435px){
/*_____________ Hero text-animation ______________*/

    .txt-wrapper{
        padding-bottom:15px;
    }

    .static-txt{
        font-size: 30px;
        font-weight: bold;
        color:#273536;
    }

    .dynamic-txt{
        height: 40px;
        line-height: 40px;
        overflow:hidden;
    }

    .dynamic-txt li{
        list-style-type: none;
        font-size:28px;
        position:relative;
        top: 0;
        animation: slide 12s steps(2) infinite;
        color:#28E98C;
    }

    @keyframes slide {
        100% {
        top: -84px; /* 2 items × 90px line-height = 180px */
        }
    }

    .dynamic-txt li span{
        position: relative;
        margin: 1px 0;
        line-height: 40px;
    }

    .dynamic-txt li span::after{
        content: "";
        position: absolute;
        left: 0;
        height: 100%;
        width: 100%;
        background: #fff;
        border-left: 2px solid #71f0b3;
        animation: typing 6s steps(15) infinite;
    }
}

@media (min-width: 0) and (max-width: 317px){
    /*_____________ Hero text-animation ______________*/

    .dynamic-txt li{
        animation: none;
    }

    .hero-wrapper-btn {
        margin-top: 25px;
        align-items: center;
    }

    .hero-youtube-btn{
        display: none;
    }
}

@media (min-width:0px) and (max-width: 768px){
    .hero-banner-thumb{
        width:100%;
        padding-top:15%;
    }
}

@media (max-width: 700px){
    .hero-shape-img{
        display: none;
    }
}

@media (max-width:576px){
    .input-group{
        display: inline;
    }

    .sent-box{
    margin-left:5px;
    margin-top:20px;
    }
}

/*******************************************
          About Part Responsive
********************************************/

@media (min-width:0px) and (max-width:992px){
    .about-container{
        padding-top:60px;
    }
    
    .about-banner-image{
        margin-top:30px;
    }

    .about-wrapper .random-shape{
        display: none;
    }

    .about-wrapper .star-about{
        display: none;
    }
}

@media (min-width:0px) and (max-width:426px){

    .shape-left{
        padding:11px 8px 0px 9px;
        left:-20px;
        top:73%;
    }

    .research-b-img img{
        width:60px;
    }

    .research-b-img h2{
        font-size:15px;
    }

    .shape-left p{
        font-size:15px;
    }

    .shape-right{
        padding:11px 8px 0px 9px;
        top:28%;
        right:0%;
    }

    .shape-right p{
        font-size: 15px;
    }

}

@media (min-width:426px) and (max-width:615px){
    .shape-left{
        left:-4px;
        padding:9px 15px 0px 15px;
    }

    .research-b-img img{
        width:70px;
    }

    .research-b-img h2{
        font-size: 16px;
    }
    
    .shape-left p{
        font-size: 16px;
    }

    .shape-right{
        right:-1%;
        padding:9px 15px 0px 15px;
    }

    .shape-right p{
        font-size:16px;
    }
}

@media (min-width:0px) and (max-width:374px){
    .about-title h2{
        font-size:26px;
    }
    
    .about-project-experience{
        gap:50px;
    }

    .experience-year h3{
        font-size:14px;
    }
}

/*******************************************
          Experience Part Responsive
********************************************/

@media (min-width:376px) and (max-width:576px){
    .ex-section-title .ex-front{
        font-size:98px;
    }
}

@media (min-width:0px) and (max-width:376px){
    .ex-section-title .ex-front{
        font-size:83px;
    }
}

@media (min-width:0px) and (max-width:576px){
    .experience-item span{
        font-size:13px;
    }

    .ex-content h2{
        font-size:18px;
    }

    .ex-content h3{
        font-size: 13px;;
    }

    .experience-item h6{
        font-size:13px;
    }
}

/*******************************************
          Courses Part Responsive
********************************************/

@media (min-width:0px) and (max-width:576px){
    
    .text{
        float: left;
    }

    .courses-l-btn{
        float: right;
        margin-top:4px;
    }

    .courses-l-btn i{
        width:24px;
        height: 24px;
    }
    
    .head span{
        display: none;
    }
}

@media (min-width:0px) and (max-width:375px){
    .text{
        font-size:16px;
    }

    .courses-l-btn{
        margin-top:1px;
        gap:6px;
    }

    .courses-l-btn i{
        width:22px;
        height: 22px;
    }

    .courses-item:hover .courses-l-btn a{
        font-size:14px;
    }

}

/*******************************************
          Award Part Responsive
********************************************/

@media (min-width:0px) and (max-width:1199px){
    .award-text h3{
        font-size:17px;
    }

    .award-item .icon img{
        width:50px;
    }
}

/*******************************************
          Protfolio Part Responsive
********************************************/

@media (min-width:0px) and (max-width:425px){
    
    .p-title-bar p{
        font-size:25px;
    }
    
    .card-item h2{
        font-size:16px;
    }

    .super-heading p{
        font-size:24px;
        margin-bottom:10px;
    }
}

@media (min-width:0px) and (max-width:991px){
    .t-m{
        margin-top:25px;
    }
}

/*******************************************
          Gallery Part Responsive
********************************************/

@media (min-width:0px) and (max-width:1024px){
    .g-content img{
        width:23px;
    }

    .g-content h2{
        font-size:16px;
    }

    .g-content p{
        font-size:18px;
    }
}

@media (min-width:0px) and (max-width:768px){
    
    .gallery-c-wrapper{
        margin-top:-20px;
    }
    
    .g-content h2{
        font-size:16px;
        justify-content: center;
    }

    .g-content p{
        text-align: center;
    }

}

/*******************************************
          Footer Part Responsive
********************************************/

@media (min-width:0px) and (max-width:768px){
    .b-text{
        font-size:12px;
    }

    .t-text a{
        font-size:12px;
    }
}

@media (min-width:0px) and (max-width:576px){
    
    .footer-top{
        left:45%;
    }

    .b-text{
        text-align: center;
        padding-top:15px;
    }
    
    .t-text{
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

/*--------------------------------------------------------------------------------------- 
                                     Contact Page
 --------------------------------------------------------------------------------------*/

/*******************************************
          Contact Page Header Responsive
********************************************/

@media (min-width:0px) and (max-width:426px){
    
    .page-heading{
        padding:90px 0px;            
    }
    
    .page-heading h2{
        font-size:44px;
    }

    .breadcrumb-list{
        margin-top:0px;
    }

    .contact-section{
        padding-top:70px;
        padding-bottom:90px;
    }

    .c-s-title h2{
        font-size:32px;
        margin-bottom:5px;
    }

    .form-container{
        padding:28px 15px;
        margin-bottom:20px;
    }

    .form-container h3{
        font-size:28px;
    }

    .theme-btn{
        font-size:14px;
        padding:13px 0px;
    }
}

/*--------------------------------------------------------------------------------------- 
                                     Undergraduate Page
 --------------------------------------------------------------------------------------*/

/*******************************************
        Undergraduate Page Responsive
********************************************/

@media (min-width:768px) and (max-width:992px){
    .dotlottie{
        width:200px;
        height: 130px;
    }
    .ug-text h3{
        font-size:16px;
    }
    .ug-text h4{
        font-size:22px;
    }

}

@media (min-width:0px) and (max-width:767px){
    .ug-item{
        margin-bottom:25px;
    }
}

@media (min-width:375px) and (max-width:768px){
    .page-heading h2{
        font-size:48px;
    }
}

@media (min-width:0px) and (max-width:375px){
    .ug-wrapper{
        padding:20px;
    }
    .ug-text h3{
        font-size:18px;
    }
    .ug-text h4{
        font-size:22px;
    }
    .dotlottie{
        width:200px;
        height: 170px;
    }
    .page-heading h2{
        font-size:36px;
    }
}

/*--------------------------------------------------------------------------------------- 
                                     Undergraduate Courses Page
 --------------------------------------------------------------------------------------*/

/*******************************************
    Undergraduate Coursess Page Responsive
********************************************/

@media (min-width:320px) and (max-width:375px){
    .book-icon{
        padding:15px 15px;
    }
    .book-conetent{
        font-size:16px
    }
}

@media (min-width:0px) and (max-width:768px){
    .ug-wrapper{
        padding-bottom:25px;
    }
    .book-wrapper{
        margin-bottom:20px;
        padding:10px 15px;
    }
}

/*--------------------------------------------------------------------------------------- 
                                     Class Details Page
---------------------------------------------------------------------------------------*/

/*******************************************
        Class Details Page Responsive
********************************************/

@media (min-width:768px) and (max-width:992px){
    .video-box{
        width:90%;
    }
}

@media (min-width:426px) and (max-width:767px){
    .video-box{
        width:100%;
        height: 280px;
    }
    .video-box img{
        height: 280px;
    }
    .d-pera{
        text-align: justify;
    }
}

@media (min-width:0px) and (max-width:426px){
    .video-box{
        width:95%;
        height: 225px;
    }

    .video-box img{
        height: 225px;
    }

    .c-de-heading h2{
        font-size:22px;
    }
}

@media (min-width:425px) and (max-width:540px){
    .details-header h2{
        font-size:6.25rem;
    }
}

@media (min-width:0px) and (max-width:425px){
    .details-header h2{
        font-size:4.8rem;
    }
}

/*--------------------------------------------------------------------------------------- 
                                     Protfolio Page
---------------------------------------------------------------------------------------*/

/*******************************************
    Undergraduate Coursess Page Responsive
********************************************/

@media (min-width:0px) and (max-width:992px){
    .pro-items{
        width:100%;
        margin-left:0%;
    }

    .pro-pagination{
        margin-left:0%;
    }
}

@media (min-width:0px) and (max-width:425px){
    .pro-thumb{
        height: 235px;
    }
    .pro-date-c{
        font-size:14px;
    }
    .pro-heading h3{
        font-size:16px;
    }
}