@media screen and (max-width:1700px) {
   #slider-top .bg-img {
      height: 760px;
   }
}

@media screen and (max-width:1690px) {
   #banner-home .btn-floating {
       top: 520px !important;
   }
}

@media screen and (max-width:1441px) {
   #banner-home .btn-floating {
       top: 450px !important;
   }

   .tp-btn {
       font-size: 14px;
       padding: 6px 28px;
    }

    .tp-upcoming-title {
       font-size: 60px;
    }

    .tp-upcoming-subtitle {
       font-size: 18px;
       font-weight: 400;
       line-height: 26px;
    }

    .tp-upcoming-gap {
       padding: 155px 0;
    }

    #slider-top .bg-img {
      height: 630px;
   }
   
   #slider-top .slide-part-1 {
      min-height: 260px;
   }

   #slider-top .slide-part-3 {
      min-height: 137px; 
   }
   
   #slider-top .slide-part-2,
   #slider-top .slide-part-4 {
      min-height: 120px;
   }

   #slider-top .slide-part-3 .slide-pattern {
      top: -101%;
   }
}


@media screen and (max-width:1300px) {
   #slider-top h2 {
      font-size: 25px;
      line-height: 37px;
   }

   #slider-top .slide-part-1 {
      min-height: 190px;
   }

   #slider-top .slide-desc p {
      font-size: 16px;
      line-height: 24px;
   }

   #slider-top .slide-part-2, #slider-top .slide-part-4 {
      min-height: 90px;
   }

   #slider-top .slide-part-3 {
      min-height: 99px;
   }

   #slider-top .slide-part-3 {
      min-height: 99px;
   }

   #slider-top .slide-part-3 img {
      width: 120px;
   }

   #slider-top .slide-part-3 .slide-pattern {
      top: -90%;
   }

   #ecosystem .desc {
      width: 80%;
   }
}


@media screen and (max-width:1200px) {
   #banner-home .btn-floating {
       top: 380px !important;
   }

   #ecosystem .eco-head .item-img > div {
      height: 80px;
   }

   #ecosystem .eco-head .desc {
      width: 100%;
   }
   
   #divider .sect-content {
      width: 70%;
   }
   
   .featured-exh .item {
      padding: 40px;
   }
   
   .featured-exh .item .item-top, .featured-exh .item .item-bottom {
      gap: 20px;
   }
   
   .featured-exh .item .item-bottom {
      margin-top: 20px;
   } 
   
   .featured-exh .item-img > div {
      height: 101px;
   }

   .featured-exh .item {
      width: 100%; 
   }

   .footer2 .bottom-1 ul li img {
      width: 300px;
   }

   .footer2 .btn-foot {
      height: 40px;
      font-size: 14px;
   }

   #ecosystem .eco-head .item-inner {
      margin: 0 auto;
   }
}

@media screen and (max-width:1024px) {
   #slider-top {
      margin-top: 87px;
   }
}

@media screen and (max-width:991px) {
   #banner-home .inner {
       flex-wrap: wrap !important;
   }

   #banner-home .bg-img {
       width: 100%;
   }

   #navbar .logo-co-loc {
       width: 150px !important;
   }

   
   #navbar {
       font-size: 12px;
   }

   #navbar p {
       margin-bottom: 0;
       font-size: 12px;
   }

   #navbar .logo {
       width: 50px !important;
   }

   #navbar .inner .left, #navbar .inner .right {
       flex-wrap: wrap;
       gap: 0px !important; 
   }

   #navbar .inner .right {
       justify-content: end;
       text-align: end;
   }

   .page-title {
       width: auto !important;
   }

   .list-pertanyaan .d-flex {
       flex-wrap: wrap !important;
   }

   .list-pertanyaan .d-flex > div {
       width: 100% !important;
   }

   .mob-mb8 {margin-bottom: 8px;}
   .mob-mb22 {margin-bottom: 22px;}

   .tp-instructor-wrap {
       position: unset;
   }

   .tp-instructor-title {
       color: var(--tp-heading-primary) !important;
   }
   
   .tp-profile-social a {
       color: var(--tp-heading-primary) !important;
       border: 1px solid var(--tp-heading-primary) !important;
   }  

   .tp-instructor-content {
       margin-top: 14px;
   }

  .tp-instructor-avatar img {
       height: 60px !important;
       width: 60px !important;
   }

   #user-banner .tp-dashboard-banner-bg {
       overflow: unset;
       box-shadow: unset !important;
   }

   .tp-dashboard-banner-bg::after {
       display: none;
   }

   .tp-profile-social {
       margin-top: 0px;
   }

   .tp-instructor-info {
       flex-wrap: unset !important;
   }

   .tp-instructor-avatar {

       height: 80px;
       width: 80px;
       background: #fff !important;
       padding: 10px;
       border-radius: 50%;
   }

   .tp-dashboard-banner-wrap {
       padding-bottom: 30px !important;
   }
   
   .tp-instructor-wrap { 
       transform: translateY(17px) !important; 

   }
   .tp-instructor-avatar::after {
       width: 60px !important;
       height: 60px !important;
       background-size: contain !important;
       border-radius: unset !important;
       margin: 0 auto;
       
   }

   .tp-instructor-wrap {
       padding: 0 !important;
   }

   .tp-instructor-avatar {
      padding: 0 !important;
   }

   .tp-instructor-avatar,
   .tp-instructor-avatar img {
      height: 60px !important;
      width: 60px !important;
  }

   .tp-dashboard-banner-bg::after {
      display: none;
  }

  .tp-profile-social {
      margin-top: 0px;
  }

  .tp-instructor-info {
      flex-wrap: unset !important;
  }

  .tp-instructor-avatar {

      height: 80px;
      width: 80px;
      background: #fff !important;
      padding: 10px;
      border-radius: 50%;
  }

  .tp-dashboard-banner-wrap {
      padding-bottom: 30px !important;
  }
  
  .tp-instructor-wrap { 
      transform: translateY(17px) !important; 

  }
  .tp-instructor-avatar::after {
      width: 60px !important;
      height: 60px !important;
      background-size: contain !important;
      border-radius: unset !important;
      margin: 0 auto;
      
  }

  .tp-instructor-wrap {
      padding: 0 !important;
      top: 60px;
  }

   #user-banner .tp-dashboard-banner-bg {
      overflow: unset;
      box-shadow: unset !important;
      margin-top: 80px !important;
  }

    .title-50 {
       font-size: 30px;
       line-height: 40px;
    }

    .desc-22, .desc-22 p {
       font-size: 18px;
       line-height: 27px;
    }

    #ecosystem .desc {
       width: 100%;
    } 
    
    #divider {
       min-height: 274px;
    }

    #divider .sect-content {
       width: 100%;
    }

    #divider h3 {
       font-size: 25px;
       line-height: 34px;
    }

    .footer2 .bottom-1 ul {
       flex-wrap: wrap;
    }

    .footer2 .bottom-1 ul .item:nth-child(1) {
       width: 100%;
    }

    .footer2 .bottom-1 ul li img {
       width: 200px;
    } 

    .footer2 .btn-foot {
       margin: 50px auto 0;
    }
}



@media screen and (max-width:820px) {
   #banner-home .btn-floating {
       top: unset !important;
       bottom: 20% !important;
   }

   .tp-upcoming-title {
       font-size: 40px;
   }

   .tp-upcoming-subtitle {
       font-size: 16px; 
       line-height: 24px;
   }
}

@media screen and (max-width:768px) {
   .footer-detail {
      padding-top: 30px;
   }

   #slider-top .item {
      padding-bottom: 250px;
      position: relative;
   }

   #slider-top .slide-inner {
      flex-wrap: wrap;
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0px;
   }

   #slider-top .left-part,
   #slider-top .right-part {
      width: 100%;
   }

   #slider-top .slide-part-3 img {
      display: none;
   }

   #slider-top .right-part {
      flex-wrap: wrap;
   }

   #slider-top .right-part .right-part-1 {
      width: 50%;
   }

   #slider-top .right-part .right-part-2 {
      width: 50%;
   }

   #slider-top .slide-part-4 {
      width: 100%;
   }

   #slider-top .right-part {
      align-items: start;
   }

   #slider-top .slide-part-2 {
      min-height: 99px;
   }
   
.button-question {
   flex-wrap: wrap;
}

}

@media screen and (max-width:600px) {
   .tp-apply-process-subtitle span {
      display: block;
      margin: 0 auto 7px;
   }

   .tp-apply-process-subtitle {
      text-align: center;
   }
         
   
   .event-wrapper {
      flex-wrap: wrap;
   }
   .event-wrapper > div {
         width: 100%;
   }

    
   h2.page-title {
      font-size: 25px;
   }

   p {
      font-size: 14px;
      line-height: 20px;
   }

   .form-select, 
   input[type=text], input[type=email], input[type=tel], input[type=number], input[type=password], input[type=url], textarea {
      height: 44px;
      line-height: 33px;
      font-size: 14px;
   }

   .open-popup {
      padding: 12px 26px;
      height: 54px;
   }

   .reg-submit {
      padding: 16px 35px;
   }

   #banner-home .btn {
       width: 200px;
       font-size: 12px;
   } 
    

   .tp-instructor-wrap {
       display: none !important;
   }

   .footer2 .top-2 img {
      width: 220px;
      max-width: 100%;
   } 

   .footer2 .bottom-1 ul {
      flex-wrap: wrap;
      row-gap: 10px;
      column-gap: 20px;
   }

   .footer2 .bottom-1 ul li img {
      width: 100%;
   }

   .title-50,
   .footer2 h2 {
      font-size: 22px;
      line-height: 27px;
   }

   .desc-22, .desc-22 p {
      font-size: 14px;
      line-height: 20px;
   }

   #ecosystem {
      padding-top: 40px;
   }
   #ecosystem .desc {
      margin-top: 0px;
   }

   .tp-campus-choose-content {
      margin-bottom: 20px;
   }

   .footer2 .top-1 {
      padding-bottom: 30px;
   }

   .footer2 .top-2 {
      padding-bottom: 30px;
   }

   .footer2 .top-1 p {
      font-size: 16px;
      line-height: 25px;
      width: 100%;
   }

   .footer2 h4 {
      font-size: 18px;
   }

   .footer2 .copyright p {
      font-size: 12px;
      line-height: 20px;
      margin: 0;
   }

   .footer2 .bottom-2 {
      padding: 16px 0 13px;
   }

   .footer2 .bottom-1 {
      padding: 30px 0;
   }

   .footer2 .btn-foot {
      width: 200px;
      margin: 40px auto 0;
   }

   .footer2 .footer-top {
      padding-top: 60px;
   }

   .tp-header-logo img {
      width: 230px !important;
   }

   #slider-top {
      margin-top: 67px;
   }

   #ecosystem .eco-head .item-img > div {
      height: 130px;
   }

   #ecosystem .eco-head .item-inner {
      width: 100%;
   }

   #ecosystem .item .title {
      font-size: 22px;
   }

   #ecosystem .item .sub {
      font-size: 18px;
      margin-top: 10px;
   }

   #divider h3 {
      font-size: 18px;
      line-height: 25px;
   }

   #divider {
      min-height: 220px;
   }

   .featured-exh .item {
      padding: 20px;
   }

   .featured-exh .item .item-top, .featured-exh .item .item-bottom {
      flex-wrap: wrap;
   }

   .featured-exh .item .item-title, .featured-exh .item .item-info,
   .featured-exh .item .item-cta, .featured-exh .item .item-img {
      width: 100%;
   }

   .desc-16, .desc-16 p {
      font-size: 14px;
      line-height: 20px;
   }

   .featured-exh .main-title {
      font-size: 20px;
      margin-bottom: 10px;
   }

   .featured-exh .item-cta a {
      font-size: 14px;
      height: 35px;
      width: 150px;
   }

   .footer-pattern {
      height: 80px !important;
   }

   #slider-top .right-part .right-part-2,
   #slider-top .right-part .right-part-1 {
      width: 100%;
   }

   #slider-top .slide-part-1 {
      padding: 0 31px;
   }

   #slider-top .slide-part-2 {
      min-height: 68px;
      justify-content: start;
      padding: 0 31px;
   }

   #slider-top .slide-part-3,
   #slider-top .slide-part-4 {
      padding: 0 31px;
   }

   #slider-top .item {
      padding-bottom: 400px;
   }

   #slider-top .bg-img {
      height: 200px;
   }

   #slider-top .slide-part-1 {
      min-height: 150px;
   }

   #slider-top h2 {
      font-size: 22px;
      line-height: 33px;
   }

   .button-question div {
     width: 100%;
 }

 .container.v2 {
     width: 90%;
 }

 .mob-form-margin {
     margin-bottom: 10px;
 }

}


@media screen and (max-width:320px) {
   .tp-header-logo img {
      width: 180px !important;
   }
}