@media only screen and (max-width: 1400px) {}
@media only screen and (max-width: 1200px) {}
@media only screen and (max-width: 1024px) {}
@media only screen and (max-width: 991px) {
  .orange-btn {padding: 12px 30px;}
  .primary-btn span {padding: 12px 30px;}
  header .navbar .navbar-toggler{box-shadow: none; border: 0; margin-left: auto;}
  header .navbar .navbar-toggler span{font-size: 32px; color:#171717;}
  header .navbar-collapse{ position: fixed; background:#fff; box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px; top: -20px; left: -15px; bottom: 0; width: 330px; height: 100vh !important; transition: .3s;z-index: 999; }
  header .collapse:not(.show) {display: block; left: -345px; transition: .3s;}
  header .collapse.show{ left: -15px; transition: .3s; display:block;}
  header .navbar-nav { align-items: start; }
  header .mobile-device { display: flex; padding: 20px; background: #ffdfcf; justify-content: space-between; align-items: center;}
  header .navbar-light .navbar-nav .support a { width: 100%; display: block; }
  header .navbar-nav li { width: 100%; }
  header .navbar-light .navbar-nav .nav-link { padding: 10px 15px; }
  header.nav-up .collapse.show{ top: 85px; }
  section.data-protection { padding-bottom: 0; }
  section.data-protection .video { width: 100%; position: relative; }
  section.support-page .inner-div::before { bottom: 55%; width: 100%; }
  section.support-page .inner-div::after { top: 42%; width: 100%; }
  section.support-page .contect-info,
  section.support-page .contact-from { padding: 30px 15px; }
  section.common-breadcrums h1 {font-size: 1.7rem;}
  section.blog-details .blog-title h1 { font-size: 1.7rem;}
  footer .dot:before {height: 0px;}
  header .navbar-nav li.cust-drop ul li a {padding: 8px 10px 8px 31px;}
  header .navbar-nav li.cust-drop ul.dropdown-menu {box-shadow: none;border-radius: 0px;}
  .accountauthOffcanvas .auth {display: block;}
  .accountauthOffcanvas .auth .leftside {width: 100%;height: 100%;display: block;}
  .accountauthOffcanvas .auth .rightside {width: 100%;display: block;}
  .profiledetailmodal .profile-banner .pro-img { max-width: 400px; }
}
@media only screen and (max-width: 768px) {
  section { padding: 30px 0; }
  body { font-size: 0.9rem; }
  .section-title h2 { font-size: 1.3rem; }
  section.common-breadcrums h1 {font-size: 1.3rem;}
  section.hero-banner .banner-text .new { font-size: 15px; }
  section.hero-banner .banner-text h1 { font-size: 2rem; }
  section.hero-banner .banner-text p { font-size: 0.9rem; }
  section.hero-banner { height: auto; padding-top: 140px; }
  section.accuracy .img1{ margin: 0 0 25px; }
  section.accuracy .box { margin: 12px 0; }
  section.solution-list .box p { font-size: 1rem; }
  section.blood-management .high-blood .img{ margin: 12px 0; }
  section.payment-service .box { margin: 20px 0; }
  section.subscription .section-title h2 { font-size: 2.3rem; }
  section.subscription h3 { font-size: 1.2rem; }
  section.crucial-health .box.two-one { justify-content: center; }
  section.crucial-health .box.two-one lottie-player { display: none; }
  section.blog-details .blog-title h1 {font-size: 1.5rem;padding: 0px;}
  section.blog-details .blog-title h1:after {height: 0;}
  section.subscription .section-title h2 {font-size: 1.9rem;}
  section.career-detail h1 {font-size: 2.0rem;}
  section.order-detail .information .product-information {border: none;}
  .compare-modal .compare-box .img { position: initial; }
  .compare-modal .compare-box .img.vsimg::after { top: initial; right: 0;left: 0; margin: 0 auto;  bottom: -23px; }
  .compare-modal .accuracy .acc-box h5 { font-size: 1rem; }
  .compare-modal .accuracy .acc-box { margin: 15px auto; }
}
@media only screen and (max-width: 767px) {
  .blog-box .img img {height: auto;}
  .blog-box .content .top {margin-top: 15px;}
}
@media only screen and (max-width: 667px) {
  section.blood-management .analysis-video .mocup img { position: initial; }
  section.blood-management .analysis-video .video-main video { height: auto; right: 0;}
  .accountauthOffcanvas .auth .leftside {display: none;}
  section.my-order .order-list .top {flex-wrap: wrap;}
  section.my-order .order-list .top .pro-info {margin: 25px 0px 15px 0px;}
  section.order-detail .orders-invoice .order-info {padding: 3px 20px;border-radius: 24px;margin: 0 0 10px;}
  section.order-detail .orders-invoice .order-body .contact-details .box {width: 70%;}
  section.order-detail .orders-invoice .order-info.confirmed {margin-bottom: 20px;}
  section.checkout .service-box .cart-salon-box .detail {display: flex;flex-wrap: wrap;justify-content: space-between;}
  section.checkout .service-box .cart-salon-box .price {margin: 0px;}
}
@media only screen and (max-width: 568px) {
  .pt-140 { padding-top: 100px; }
  .page-title h1 {font-size: 1.5rem;}
  .form-control, .form-select {border-radius: 10px;}
  section.about-banner .banner-text { top: 28%; }
  section.about-banner .banner-text h1 { font-size: 1.5rem; }
  section.blood-management .main-div { margin: 0px 0 20px; }
  section.about-our-story h2 { font-size: 1.2rem; }
  section.about-ourteam { padding: 30px 0; }
  section.about-ourteam .img { padding: 0 0 0 20px; }
  section.our-commitment .listing { border: 0; padding: 0; }
  section.our-commitment .listing .box { gap: 10px; margin: 10px 0; }
  section.our-commitment .listing .box .content h4 { font-size: 1.2rem; }
  section.product-details .product-info h1 { font-size: 1.2rem; }
  section.about-ourteam .text { padding: 10px 0 0 20px;}
  section.about-ourteam .text h3{ font-size: 1.1rem; }
  .profiledetailmodal .profile-banner .info { position: initial; }
  .profiledetailmodal .profile-banner .info img{ max-height: 70px; }
  .compare-modal .compare-box{ padding: 30px 20px; }
  section.data-protection .content{ padding: 0 0 30px; }
  section.best-class .box .img img { height: auto; }
  .blog-box .content h2 {margin: 10px 0px;font-size: 19px;}
  section.subscription .section-title h2 {font-size: 1.5rem;}
  footer .foot-logo img {height: 25px;}
  footer .footer-link h4 {font-size: 1rem;}
  section.order-detail .orders-invoice .order-body .table .box .content {padding: 10px 0px 0px 0px;}
  section.career-detail h1 {font-size: 1.5rem;}
  section.career-detail .opening .box {margin: 0px 50px 0px 0px;}
  section.career-detail h2 {font-size: 1.3rem;}
  section.career-detail .opening .box p {font-size: 1rem;margin-bottom: 7px;}
  section.career-detail .opening .box h4 {font-size: 1.2rem;}
  section.career-detail .apply-form {padding: 10px;border-radius: 8px;}
  section.career-detail .apply-form .upload {border-radius: 10px;}
  section.cms-page h4 {font-size: 1.2rem;}
  section.profile-detail .gray-bg {border-radius: 10px;padding: 15px;}


  .otp-modal .modal-content .modal-header .modal-title {font-size: 21px;}
  .otp-modal .modal-content .modal-header .cust-cls.btn-close {top: 30px;}
  .cart-modal {border-radius: 0px;margin: 0px;}
  .cart-modal .cart-product-list .product-img {padding: 10px 10px;border-radius: 6px;}

  section.testimonial .testimonial-slider .test-img .quote { left: 0; bottom: 0; transform: none; right: 0; margin: 0 auto; top:unset; }
  section.testimonial .testimonial-slider .test-img .quote img { max-width: 80px; }
  section.testimonial .testimonial-slider .test-img .timg { width:260px; height:260px; }

  section.thank-you .box h1 { font-size: 3.3rem; }
}
@media only screen and (max-width: 480px) {
  section.subscription .sub-from .white-btn { width: 100%; }
  .orange-btn {padding: 10px 24px;}
  .primary-btn span {padding: 10px 24px;}
  .cust-page .show {margin-bottom: 10px;}
  section.order-detail .orders-invoice .order-body .contact-details .box {width: 100%;}
  .otp-modal .modal-content .otp .box .otp-input {background-color: #FFFFFF0D;margin: 0px 3px;padding: 22px 0px;text-align: center;border-radius: 5px;color: #fff;font-size: 1rem;}
}
@media only screen and (max-width: 400px) {}
