/* training center */
.text-14{
    font-size: 14px;
}
@media (min-width: 340px) and (max-width: 362px) {
    .text-60{
     font-size: 20px !important;
    }
    .text-14{
        font-size: 12px !important;
    }
    .sm-me-5{
        margin-right: 3rem !important;
    }
   .heading{
    font-size: 22px !important;
   }
    .line-banner{
     height: 35vh !important;
    }
    .button_banner{
     font-size: 13px !important;
     width: 12rem !important;
    }
    .special {
        right: 0 !important;
    }
    .card_course{
     width: 20rem !important;
     margin-left: 0 !important;
    }
    .btnact{
     font-size: 13px !important;
    }
    .carousel-click{
     font-size: 8px !important;
    }
    body{
        position: sticky!important;
        overflow-x: hidden!important;
        }
        .row{
        --bs-gutter-x: 0!important;
        --bs-gutter-y: 0!important;
        }
    .paragraph{
        font-size: 11px !important;
    }
    .contact-button{
        font-size: 11px !important;
    }
    .course_img{
     height: 150px !important;
    }
    .OurApproach_image{
     width: 100% !important;
    }
    .workshopHelight{
     font-size: 26px !important;
    }
    .card_course_end{
     width: 18rem !important;
    }
    .container{
        margin-left: 0 !important;
    }
 }
 
 /* iphone SE iphone 12 pro max */
 @media (min-width: 355px) and (max-width: 395px) {
    .sm-me-5{
        margin-right: 3rem !important;
    }
    body{
        position: sticky!important;
        overflow-x: hidden!important;
        }
        .row{
        --bs-gutter-x: 0!important;
        --bs-gutter-y: 0!important;
        }
    .heading{
        font-size: 22px !important;
       }
     .text-60{
      font-size: 29px !important;
     }
     .fs-3{
      font-size: 14px !important;
     }
     .text-14{
        font-size: 10px !important;
    }
     .special {
        right: 0 !important;
    }
     .line-banner{
      height: 30vh !important;
     }
     .button_banner{
      font-size: 13px !important;
  
     }
     .card_course{
      width: 21rem !important;
      margin-right: 15px !important;
     }
     .btnact{
      font-size: 13px !important;
     }
     .carousel-click{
      font-size: 8px !important;
     }
     .course_img{
         height: 195px !important;
      width: 100% !important;
     }
     .OurApproach_image{
      width: 100% !important;
     }
     .workshopHelight{
      font-size: 26px !important;
     }
     .card_course_end{
        width: 19rem;
     }
     
  }
 /* iphone SE iphone 14 pro max  */
 @media (min-width: 410px) and (max-width: 433px) {
    .text-14{
        font-size: 10px !important;
    }
    html{
        overflow-x: hidden !important;
    }
    body{
        position: sticky!important;
        overflow-x: hidden!important;
        }
        
    .heading{
        font-size: 22px !important;
       }
     .text-60{
      font-size: 40px !important;
     }
     .fs-3{
      font-size: 14px !important;
     }
     .line-banner{
      height: 30vh !important;
     }
     .button_banner{
      font-size: 13px !important;
  
     }
     .row{
        --bs-gutter-x: 0!important;
        --bs-gutter-y: 0!important;
        }
     .container{
        --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0;
     }
     .card_course{
      width: 24rem !important;
     }
     .btnact{
      font-size: 13px !important;
     }
     .carousel-click{
      font-size: 8px !important;
     }
     .text-14{
      font-size: 14px !important;
     }
     .course_img{
         height: 200px !important;
      width: 100% !important;
     }
     .OurApproach_image{
      width: 100% !important;
     }
     .workshopHelight{
      font-size: 26px !important;
     }
     .special {
        right: 0 !important;
    }
    .card_course_end{
        width: 20rem;
     }
  }
 /* iphone xr iphone 14 pro max */
 
 /* pixel  */
 @media (min-width: 435px) and (max-width: 470px) {
    .card_course_end{
        width: 20rem;
     }
     .text-14{
        font-size: 10px !important;
    }
    body{
        position: sticky!important;
        overflow-x: hidden!important;
        }
        .row{
        --bs-gutter-x: 0!important;
        --bs-gutter-y: 0!important;
        }
    .special {
        right: 0 !important;
    }
    .heading{
        font-size: 22px !important;
       }
     .text-60{
      font-size: 40px !important;
     }
     .fs-3{
      font-size: 14px !important;
     }
     .line-banner{
      height: 30vh !important;
     }
     .button_banner{
      font-size: 13px !important;
  
     }
     .card_course{
      width: 23.5rem !important;
      margin-right: 15px !important;
     }
     .btnact{
      font-size: 13px !important;
     }
     .carousel-click{
      font-size: 8px !important;
     }
     .text-14{
      font-size: 14px !important;
     }
     .course_img{
         height: 200px !important;
      width: 100% !important;
     }
     .OurApproach_image{
      width: 100% !important;
     }
     .workshopHelight{
      font-size: 26px !important;
     }
     
  }
 /* ipad mini */
 @media (min-width: 760px) and (max-width: 820px) {
    .heading{
        font-size: 15px !important;
       }
       body{
        position: sticky!important;
        overflow-x: hidden!important;
        }
        .row{
        --bs-gutter-x: 0!important;
        --bs-gutter-y: 0!important;
        }
    .special {
        right: 23%!important;
    }
     .text-60{
      font-size: 20px !important;
     }
     .fs-3{
      font-size: 14px !important;
     }
     .line-banner{
      height: 30vh !important;
     }
     .button_banner{
      font-size: 13px !important;
  
     }
 .img_logos{
     width: 120px !important;
 }
     .btnact{
      font-size: 10px !important;
     }
     .carousel-click{
      font-size: 8px !important;
     }
     .text-14{
      font-size: 13px !important;
     }

     .card_course{
         width: 22rem !important;
     }
     .category-content{
         justify-content: center !important;
     }
     .course_img{
         height: 200px !important;
     }
     .OurApproach_image{
      width: 100% !important;
     }
     .workshopHelight{
      font-size: 26px !important;
     }
     .background-overlay{
         height: 300px !important;
     }
     .card_course_end{
         width: 20rem !important;
     }
     .button_banner{
         font-size: 10px !important;
     }
     .core_values{
         font-size: 26px !important;
     }
     .card_contact{
         width: 24rem !important;
     }
     .we_chose{
        width: 20rem !important;
        height: 40vh !important;
     }
     .same_height{
        height: 340px !important;
     }
     .cust_gap2{
        gap: 10px !important;
     }
  }

  @media (min-width: 820px) and (max-width: 860px) {
    .special {
        right: 25%!important;
    }
    body{
        position: sticky!important;
        overflow-x: hidden!important;
        }
        .row{
        --bs-gutter-x: 0!important;
        --bs-gutter-y: 0!important;
        }
    .heading{
        font-size: 17px !important;
    }
    .text-60{
     font-size: 40px !important;
    }
    .fs-3{
     font-size: 14px !important;
    }
    .line-banner{
     height: 30vh !important;
    }
    .button_banner{
     font-size: 13px !important;
 
    }
.img_logos{
    width: 130px !important;
}
    .btnact{
     font-size: 10px !important;
    }
    .carousel-click{
     font-size: 8px !important;
    }
    .text-14{
     font-size: 11px !important;
    }

    .card_course{
        width: 21rem !important;
    }
    .category-content{
        justify-content: center !important;
    }
    .course_img{
        height: 200px !important;
    }
    .OurApproach_image{
     width: 100% !important;
    }
    .workshopHelight{
     font-size: 26px !important;
    }
    .background-overlay{
        height: 300px !important;
    }
    .card_course_end{
        width: 20rem !important;
    }
    .button_banner{
        font-size: 10px !important;
    }
    .core_values{
        font-size: 26px !important;
    }
    .card_contact{
        width: 24rem !important;
    }
    .we_chose{
       width: 20rem !important;
       height: 40vh !important;
    }
    .same_height{
       height: 340px !important;
    }
    .cust_gap2{
       gap: 10px !important;
    }
    body{
        position: sticky!important;
        overflow-x: hidden!important;
        }
        .row{
        --bs-gutter-x: 0!important;
        --bs-gutter-y: 0!important;
        }
 }
 /* width 900 to 1024 */
 @media (min-width: 900px) and (max-width: 1024px) {
 
    .special {
        right: 28%!important;
    }
    .heading{
        font-size: 21px !important;
    }
    .category-content{
        display: flex !important;
    }
     .text-60{
      font-size: 40px !important;
     }
     
     .line-banner{
      height: 25vh !important;
     }
     .button_banner{
      font-size: 13px !important;
  
     }
 .img_logos{
     width: 150px !important;
 }
     .btnact{
      font-size: 10px !important;
     }
     .carousel-click{
      font-size: 8px !important;
     }
     .text-14{
      font-size: 12px !important;
     }
     .card_course{
         width: 21rem !important;
         height: 35vh !important;
     }
     .course_img{
         height: 200px !important;
     }
     .OurApproach_image{
      width: 100% !important;
     }
     .workshopHelight{
      font-size: 26px !important;
     }
     .background-overlay{
         height: 300px !important;
     }
     .card_course_end{
         width: 20rem !important;
     }
     .button_banner{
         font-size: 10px !important;
     }
     .core_values{
         font-size: 26px !important;
     }
     .card_contact{
         width: 24rem !important;
     }
     .cust_gap2{
        gap: 40px !important;
     }
   .card_contact{
    width: 28.4rem !important;
   }
   .we_chose{
    width: 22rem !important;
   }
   .same_height{
    height: 21vh !important;
   }
   body{
    position: sticky!important;
    overflow-x: hidden!important;
    }
    .row{
    --bs-gutter-x: 0!important;
    --bs-gutter-y: 0!important;
    }
  }
 


  @media (min-width: 1024px) and (max-width: 1290px) {
    
    .text-60{
        font-size: 40px !important;
       }
       .special {
        right: 23%!important;
    }
       
       .button_banner{
        font-size: 16px !important;
    
       }
   .img_logos{
       width: 150px !important;
   }
       .btnact{
        font-size: 10px !important;
       }
       .carousel-click{
        font-size: 8px !important;
       }
       .text-14{
        font-size: 11px !important;
       }
       .card_course{
           width: 19rem !important;
           height: 33vh !important;
       }
   .course_special_img{
    height: 40px !important;
   }
       .category-content{
           justify-content: center !important;
       }
       .OurApproach_image{
        width: 100% !important;
       }
       .workshopHelight{
        font-size: 26px !important;
       }
       .background-overlay{
           height: 300px !important;
       }
       .card_course_end{
           width: 20rem !important;
       }
       
       .core_values{
           font-size: 26px !important;
       }
       .card_contact{
           width: 24rem !important;
       }
       .cust_gap2{
          gap: 40px !important;
       }
     .card_contact{
      width: 28.4rem !important;
     }
     .we_chose{
      width: 22rem !important;
     }
     .same_height{
      height: 21vh !important;
     }
     .heading{
        font-size: 30px !important;
     }
     .line-banner{
        height: 40vh !important;
     }
}


       /* Base button styling */
       .btnact {
        position: relative;
        padding-bottom: 1rem;
        /* Adjust based on your design */
        border: none;
        /* Remove default border */
        background: transparent;
        /* Transparent background */
        cursor: pointer;
        /* Pointer cursor on hover */
    }

    /* Hover effect */
    .btnact:hover {
        border-bottom: 2px solid #007bff;
        /* Change to desired color */
        transition: border-bottom 0.3s ease-in-out;
        /* Smooth transition */
    }

    .course_img {
        width: 100% !important;
        height: 250px !important;
    }

    .modal1 {
        display: none;
        position: fixed;
        z-index: 1050;
        /* Bootstrap's z-index for modals */
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
        background-color: rgba(0, 0, 0, 0.8);
        align-items: center;
        justify-content: center;
    }

    .modal-content {
        position: relative;
        max-width: 90%;
        max-height: 80%;
        margin: auto;
    }

    .modal-image {
        width: 100%;
        height: auto;
        max-width: 600px;
        /* Adjust as needed */
        max-height: 400px;
        /* Adjust as needed */
        object-fit: contain;
        display: flex;
        justify-content: center;

    }

    .close,
    .prev,
    .next {
        position: absolute;
        top: 50%;
        padding: 16px;
        color: white;
        font-weight: bold;
        font-size: 24px;
        cursor: pointer;
        user-select: none;
        transform: translateY(-50%);
    }

    .close {
        right: 20px;
        top: 1px;
    }

    .prev {
        left: 20px;
    }

    .next {
        right: 60px;
        /* Adjust to prevent overlap with close button */
    }

    .prev:hover,
    .next:hover {
        background-color: rgba(0, 0, 0, 0.8);
    }

    /* modal css end */

    .select-wrapper {
        position: relative;
        width: 300px;
        /* Adjust as needed */
        margin: 20px;
    }

    .select-box {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 4px;
        cursor: pointer;
        background-color: #fff;
    }

    .select-text {
        font-size: 16px;
    }

    .select-icon {
        font-size: 16px;
    }

    .options {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        border: 1px solid #ccc;
        border-radius: 4px;
        background-color: #fff;
        z-index: 10;
    }

    .option {
        padding: 10px;
        cursor: pointer;
    }

    .option:hover {
        background-color: #f0f0f0;
    }

    .error-message {
        color: red;
        margin-top: 10px;
    }

    .images1by1 img {
        opacity: 0;
        /* Initial opacity */
        transform: translateY(-20px);
        /* Start slightly above */
    }

    @media (min-width: 340px) and (max-width: 390px) {
        .paragraph {
            font-size: 13px !important;
        }
        body{
            position: sticky!important;
            overflow-x: hidden!important;
            }
            .row{
            --bs-gutter-x: 0!important;
            --bs-gutter-y: 0!important;
            }
        .text-14 {
            font-size: 12px !important;
        }
    }

    @media (min-width: 750px) and (max-width: 800px) {


        /* footer */
        .quick_links {
            width: 30% !important;
        }

        .leagal {
            width: 30% !important;
        }

        .contact_footer {
            width: 40% !important;
        }

        .special {
            margin-right: 25%;
            width: 165px !important;
            font-size: 14px !important;
        }
    }
    @media (max-width: 410px) {
.poster{
    font-size: 12px !important;
}

}
@media (max-width: 586px) {
.special{
right: 0;
}
.dashboard-img {
background: none !important;
}
}
@media (min-width: 760px) and (max-width: 800px){
.special{
right: 25% !important;
}
}
@media (min-width: 820px) and (max-width: 930px){
.special{
right: 25% !important;
}
}
@media (min-width: 800px) and (max-width: 830px){
.special{
right: 25% !important;
}
}
@media (min-width: 930px) and (max-width: 1130px){
.special{
right: 22% !important;
}
}
@media (min-width: 1130px) and (max-width: 1330px){
.special{
right: 25% !important;
}
}

@media (min-width: 820px) and (max-width: 920px) {
    /* footer */
        .quick_links {
        width: 30% !important;
        }

    .leagal {
        width: 30% !important;
    }

        .contact_footer {
        width: 40% !important;
    }
}
@media (min-width: 750px) and (max-width: 800px) {


/* footer */
.quick_links {
width: 30% !important;
}

.leagal {
width: 30% !important;
}

.contact_footer {
width: 40% !important;
}
}
    @media (min-width: 820px) and (max-width: 920px) {


        /* footer */
        .quick_links {
            width: 30% !important;
        }

        .leagal {
            width: 30% !important;
        }

        .contact_footer {
            width: 40% !important;
        }

        .special {
            width: 165px !important;
            font-size: 14px !important;
        }
    }
    .heading{
        font-size: 50px;
    }
 
 /* training center end */