@media only screen and (min-width: 200px) and (max-width: 299px) {
    .level-btn{
        height: 40px;
        line-height: 40px;
        font-size: 14px;
    }
    .e-btn{
        height: 40px;
        line-height: 40px;
        font-size: 14px;
    }
    .sidebar__area{
        width: 290px;
    }
    .sidebar__close{
        right: 50px;
    }
    .footer__widget-title {
        margin-top: 20px;
      }
    .e-btn-2{
        margin-bottom: 10px;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
    }
    .hero__thumb-shape img.hero-1-dot {
        bottom: -60px;
        left: 0px;
        height: 60px;
    }
    .hero__shape .hero-corner-shape{
        height: 70px;
    }
    .course-shape img{
        height: 70px;
    }
    .title-style-1{
        margin-bottom: 20px;
    }
    .title-style-1 h1{
        font-size: 30px;
        line-height: 40px;
    }
    .title-style-1 h3{
        font-size: 20px;
    }
    .course-banner{
        margin-top: 0px;
        margin-bottom: 30px;
    }
    .coding-platform-content img{
        display: none;
    }
    .coding-platform-content{
        margin: 30px 0px;
    }
    .coding-platform-counter{
        position: relative;
        bottom: inherit;
        width: 100%;
    }
    .column-shape img{
        height: 50px;
    }
    .column-block{
        padding: 0;
    }
    .column-block p{
        padding: 0;
    }
    .column_block__area  .col-lg-6:first-child img{
        margin-bottom: 30px;
    }
    .expert-trainer-block{
        margin: 20px 0px;
    }
    .best-experience-banner img{
        width: 100%;
    }
    .young-coders-banner img{
        width: 100%;
    }
    .price__item {
        padding: 40px 20px;
    }
    .price__item .e-btn{
        font-size: 15px;
        line-height: 35px;
    }
    .swiper-slide-active{
        transform: initial !important;
        z-index: 99999;
      }
      .project__slider{
        padding: 0;
      }
}
@media only screen and (min-width: 300px) and (max-width: 767px) {
    .hero__title{
        margin-top: 30px;
    }
    .hero__shape img.hero-1-dot-2 {
        bottom: 65%;
        height: 60px;
    }
    .hero__shape img.hero-1-circle{
        top: 6%;
        height: 25px;
    }
    .hero__thumb-shape img.hero-1-circle-4 {
        top: -100px;
        right: 0%;
        height: 40px;
    }
    .hero__content-wrapper{
        margin-bottom: 40px;
    }
    .level-content-with-banner img{
        height: auto;
    }
    .level-content-with-banner{
        padding: 0!important;
    }
    .section-dot-shape img{
        height: 100px;
    }
    .learning-outcomes{
        margin-bottom: 30px;
    }
    .level-box-style-1{
        margin: 0!important;
        padding: 30px;
    }
    .level-box-style-2{
        margin: 0!important;
        padding: 30px;
    }
    .level-box-style-3{
        margin: 0!important;
        padding: 30px;
    }
    .level__area  h1{
        font-size: 30px;
        margin-bottom: 0px;
    }
    .level__area  h2{
        font-size: 26px;
        line-height: 35px;
    }
    .admission-title{
        font-size: 30px;
        margin-bottom: 30px;
    }
    .admission-process-item{
        margin-bottom: 30px;
        height: auto;
    }
    footer{
        text-align: center;
    }
    footer::before{
        width: 150px;
    }
    .footer__subscribe{
        width: 100%;
    }
    .footer__subscribe h1{
        font-size: 30px;
        line-height: 40px;
        margin-bottom: 30px;
    }
    .footer__top{
        padding-top: 80px!important;
        padding-bottom: 15px;
    }
    .footer__subscribe-input input{
        width: 70%;
    }
    .footer__subscribe-input button{
        width: 30%;
    }
    .footer__subscribe-input{
        margin-bottom: 50px;
    }
    .footer__widget .contact__details li{
        display: inherit;
    }
    .footer__social {
        float: none!important;
        margin-top: 20px;
    }
    .footer__widget-title {
        margin-top: 20px;
      }
      .e-btn-2{
        margin-bottom: 10px;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
    }
    .hero__thumb-shape img.hero-1-dot {
        bottom: -60px;
        left: 0px;
        height: 60px;
    }
    .hero__shape .hero-corner-shape{
        height: 70px;
    }
    .course-shape img{
        height: 70px;
    }
    .title-style-1{
        margin-bottom: 20px;
    }
    .title-style-1 h1{
        font-size: 30px;
        line-height: 40px;
    }
    .title-style-1 h3{
        font-size: 20px;
    }
    .title-style-2{
        margin-bottom: 20px;
    }
    .title-style-2 h1{
        font-size: 30px;
        line-height: 40px;
    }
    .title-style-2 h3{
        font-size: 20px;
    }
    .course-banner{
        margin-top: 0px;
        margin-bottom: 30px;
    }
    .coding-platform-content img{
        display: none;
    }
    .coding-platform-content{
        margin: 30px 0px;
    }
    .coding-platform-counter{
        position: relative;
        bottom: inherit;
        width: 100%;
    }
    .column-shape img{
        height: 50px;
    }
    .column-block{
        padding: 0;
    }
    .column-block p{
        padding: 0;
    }
    .column_block__area  .col-lg-6:first-child img{
        margin-bottom: 30px;
    }
    .expert-trainer-block{
        margin: 20px 0px;
    }
    .best-experience-banner img{
        width: 100%;
    }
    .young-coders-banner img{
        width: 100%;
    }
    .price__item {
        padding: 40px 20px;
    }
    .price__item .e-btn{
        font-size: 15px;
        line-height: 40px;
    }
    .rating i{
        font-size: 10px;
    }
    .testimonial__info span{
        font-size: 11px;
    }
    .swiper-slide-active{
        transform:initial !important;
        z-index: 99999;
      }
      .project__slider{
        padding: 0;
      }
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .hero__title{
        margin-top: 30px;
    }
    .hero__shape img.hero-1-dot-2 {
        bottom: 65%;
        height: 60px;
    }
    .hero__shape img.hero-1-circle{
        top: 6%;
        height: 25px;
    }
    .hero__thumb-shape img.hero-1-circle-4 {
        top: -100px;
        right: 0%;
        height: 40px;
    }
    .hero__content-wrapper{
        margin-bottom: 40px;
    }
    .level-content-with-banner img{
        height: auto;
    }
    .level-content-with-banner{
        padding: 0!important;
    }
    .section-dot-shape img{
        height: 100px;
    }
    .learning-outcomes{
        margin-bottom: 30px;
    }
    .level-box-style-1{
        margin: 0!important;
        padding: 30px;
    }
    .level-box-style-2{
        margin: 0!important;
        padding: 30px;
    }
    .level-box-style-3{
        margin: 0!important;
        padding: 30px;
    }
    .level__area  h1{
        font-size: 30px;
        margin-bottom: 0px;
    }
    .level__area  h2{
        font-size: 26px;
        line-height: 35px;
    }
    .admission-title{
        font-size: 30px;
        margin-bottom: 30px;
    }
    .admission-process-item{
        margin-bottom: 30px;
    }
    footer::before{
        width: 150px;
    }
    .footer__subscribe{
        width: 100%;
    }
    .footer__subscribe h1{
        font-size: 30px;
        line-height: 40px;
        margin-bottom: 30px;
    }
    .footer__top{
        padding-top: 80px!important;
        padding-bottom: 15px;
    }
    .footer__subscribe-input input{
        width: 70%;
    }
    .footer__subscribe-input button{
        width: 30%;
    }
    .footer__subscribe-input{
        margin-bottom: 50px;
    }
    .footer__widget .contact__details li{
        display: inherit;
    }
    .footer__social {
        float: none!important;
        margin-top: 20px;
    }
    .footer__widget-title {
        margin-top: 20px;
      }
      .e-btn-2{
        margin-bottom: 10px;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
    }
    .hero__thumb-shape img.hero-1-dot {
        bottom: -60px;
        left: 0px;
        height: 60px;
    }
    .hero__shape .hero-corner-shape{
        height: 70px;
    }
    .course-shape img{
        height: 70px;
    }
    .title-style-1{
        margin-bottom: 20px;
    }
    .title-style-1 h1{
        font-size: 30px;
        line-height: 40px;
    }
    .title-style-1 h3{
        font-size: 20px;
    }
    .course-banner{
        margin-top: 0px;
        margin-bottom: 30px;
    }
    .coding-platform-content img{
        display: none;
    }
    .coding-platform-content{
        margin: 30px 0px;
    }
    .coding-platform-counter{
        position: relative;
        bottom: inherit;
        width: 100%;
    }
    .column-shape img{
        height: 50px;
    }
    .column-block{
        padding: 0;
    }
    .column-block p{
        padding: 0;
    }
    .column-block img{
        display: block;
    }
    .column_block__area  .col-lg-6:first-child img{
        margin-bottom: 30px;
    }
    .expert-trainer-block{
        margin: 20px 0px;
    }
    .best-experience-banner img{
        width: 80%;
    }
    .young-coders-banner img{
        width: 80%;
    }
    .rating i{
        font-size: 10px;
    }
    .testimonial__info span{
        font-size: 11px;
    }
    .swiper-slide-active{
        transform: initial !important;
        z-index: 99999;
      }
      .project__slider{
        padding: 0;
      }
}
@media only screen and (min-width: 1024px) and (max-width: 1160px) {
    .admission-process-item h4{
        font-size: 18px;
    }
    footer::before{
        height: 105px;
        width: 275px;
    }
    .book-box{
        padding: 30px 25px;
    }
    .courses-box img{
        height: 60px;
    }
    .hero__shape .hero-corner-shape{
        height: 80px;
    }
    .course-shape img{
        height: 80px;
    }
    .course-banner {
        margin-top: 80px;
    }
    .title-style-1 h1{
        font-size: 45px;
    }
    .coding-platform-counter{
        width: 85%;
        padding: 30px 30px 0px 30px;
    }
    .coding-platform-counter .counter__content h4{
        margin-bottom: 0px;
    }
    .coding-platform-content img {
        right: 0px;
        top: 10px;
    }
    .expert-trainer-block img{
        height: auto;
    }
    .expert-trainer-block p{
        padding: 0;
    }
    .expert-trainer-block::before{
        height: 220px;
        width: 218px;
    }
    .more-expert{
        margin-top: 10px;
    }
    .best-experience-banner img{
        width: 60%;
    }
    .young-coders-banner img{
        width: 80%;
    }
    .price__item {
        padding: 40px;
    }
}
@media only screen and (min-width: 1100px) and (max-width: 1300px) {
    .column-shape img{
        height: 100px;
    }
    .modal-dialog{
        max-width: 1000px;
        max-height: 1000px;
    }
}
@media only screen and (min-width: 1400px) and (max-width: 2400px) {
    .modal-dialog{
        max-width: 1000px;
        max-height: 1000px;
    }
}