@media (min-width: 1200px) {
    .container {
        width: 96%;
    }
}
@media (max-width: 1299px){
.navbar-nav>li>a {
    font-size: 14px;
}
}
@media(min-width:1600px){
.bottom-list {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    margin: 0;
    list-style: none;
    flex-wrap: wrap;
    width: 100%;
    text-align: center;
}

.bottom-list > li {
    flex: 1;
    min-width: 120px;
    padding: 5px 10px;
}
.bottom-list > li > a {
    display: block;
    width: 100%;
    text-decoration: none;
    color: var(--light-text-color);
}
}

@media (max-width: 767px) {

  /* desktop-subheader */
  .top-bar {
    display: none;
  }

  .visible-xs-block .row {
    margin-bottom: 10px;
  }
  .visible-xs-block img {
   /*  max-height: 40px; */
    height: auto;
  }

  .input-group .form-control {
    border-radius: 20px 0 0 20px;
  }

  .input-group-btn .btn {
    border-radius: 0 20px 20px 0;
    background: #0d7a74;
    color: #fff;
    border: none;
  }

  .glyphicon-user {
    margin-right: 5px;
    color: #009688;
  }

  .acc {
    color: #000;
  }

  .acc span {
    margin-top: 10px;
  }

/*   .bottom-nav {
    border-top: 1px solid #ddd;
    padding: 10px 0;
    background-color: #fff;
    width: 100%;
    margin-left: 0px;
  }
 */
 .bottom-nav {
	border: none;
	padding: 0;
	background-color: #fff;
	width: 100%;
	margin-left: 0px;
}
.navbar {

	min-height: 45px;
	
}
  .all-category {
    display: none !important;
  }

  .collapsed {
    width: 100%;
  }

  .navbar-toggle span i {
    padding-right: 20px;
  }

/*   .navbar-toggle {
    width: 85%;
    margin: 0px 0px 0px 30px;
    float: unset;
    color: #fff;
    font-size: 17px;
    background-color: #009688;

  } */
.navbar-toggle {
	width: 100%;
	margin: 0;
	float: unset;
	color: #fff;
	font-size: 17px;
	background-color: #009688;
	border-radius: 0 !important;
}
  .navbar-nav>li>a {
    color: #333;
    padding: 10px 0px 10px 40px;
    font-size: 16px;
    color: #979797;
  }
.banner-section .container-fluid {
	padding: 0;
	text-align: center;
}
}





@media (max-width: 767px) {
  /* section1 */

 

  .pharma-div {
    width: 100%;
    padding-bottom: 50px;
  }

  .pharma-div h1 {
    padding: 50px 0px 0px 10px;
    font-size: 35px;
  }

  .pharma-div h2 {
    padding: 0px 0px 0px 10px;
    font-size: 30px;
  }
  .three {
     width: 100%;
     padding: 10px 0px 0px 0px;
     border-radius: 30px;
 }


 /* section2 */
 .sec-2{
    margin-top: 50px;
 }
 .brand{
         font-size: 30px;
 }
 .slide-logos{
    width: 100%;

 }


 .btn-row {
     width: 100%;
     margin-top: 0px;
     
 }
 .fst-btn button {
     
     font-size: 18px;
     width: 100%;
 }

 .fst-btn button span i {
     font-size: 16px;

 }
.second-btn button span i {
    border-radius: 50%;
    background-color: var(--pharmavend-secondary-color);
    color: var(--white-color);
    padding: 8px;
    font-size: 18px;
    height: 30px;
    float: right;
    width: 30px;
}

 .second-btn button span i {
     
     font-size: 16px;
  
 }

 .btn-row2{
    width: 100%;
     margin-top: 0px;
     margin-left: 0px;


 }
 /* section3 */
  #promoCarousel {
     width: 100%;
     margin-left: 0px;
    
 }
 .circle{
    display: none !important;
 }
 .img-responsive{
    padding-right: 0px;
    padding-left: 50px;
    
}
 .carousel-right img {
     max-height: 200px;
 }
 .custom-carousel {
     
     margin: 30px auto;
     padding: 33px;
     
 }

 .carousel-left {
     max-width: 50%;
     padding: 20px 0px;
 }
  .carousel-left h2 {
     font-size: 30px;
    
 }

 .carousel-left p {
     font-size: 16px;

 }
.carousel-indicators{
    left: 7%;
    bottom: 30px;
}


/* section4 cards*/
 .product-section {
     margin-top: 50px;
 }
 .about-section {
    background-color: var(--light-bg-color);
    padding: 40px 0;
}

 .section-title h2 a {
     
     padding: 0px;
 }
.section-title h2 {
    font-size: 20px;
    margin: 0;
}
.product-section a.pull-right {
    font-size: 14px;
    padding: 0;
}
.about-subtext {
    color: var(--light-text-color);
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 10px;
    max-width: 800px;
}
.about-box p {
    font-size: 14px;
    color: var(--light-text-color);
    margin-bottom: 28px;
}
.overlay-text {
    display: none;
}
a.read-more {
    font-size: 14px;
    margin: 0;
}
.overlay-title {
    font-weight: bold;
    font-size: 16px;
}
/* section7 */

 .about-section {
     margin-top: 50px;
     
 }

 
 .about-box {
     
     padding: 15px;
     
 }
 /* section8 */
  .features-section h2 {
     font-size: 30px;
     padding: 0px 0px;
          font-weight: 600;

     font-family: 'Playfair Display', Georgia, serif;
 }
  .features-section h2 span {
     font-weight: 600;

     font-size: 30px;
     
 }
 /* section9 */
  .con-9 {
     width: 100%;
 }
  .faq-section h2 {
     font-size: 30px;
     margin-bottom: 20px;

 }

 .faq-section h2 span {
     font-weight: 500;
 }
 .faq-item {
     
     padding: 20px 0;
 }
 .faq-question {
     font-size: 18px;
     margin: 0;
    
     
 }

 .faq-answer {
     font-size: 16px;
 }

 .faq-icon {
     font-size: 18px;
 }


/* footer  */
.footer-con{
    width: 100%;
 }
  .footer a {
     font-size: 16px;
     margin: 0 10px;
 }








}


 /* Responsive adjustments */
 @media (max-width: 768px) {
     .carousel-inner>.item>.carousel-content {
         flex-direction: column;
         text-align: center;
     }

     .carousel-left,
     .carousel-right {
         max-width: 100%;
         margin-bottom: 20px;
     }

      section.banner-section .pharma-div {
    padding: 10px;
}
section.banner-section .pharma-div h1 {
    font-size: 32px;
}
section.banner-section .pharma-div h2 {
    font-size: 32px;
    padding-bottom: 0;
}
section.banner-section .search-box-2 {
    margin: 10px 0;
}
section.banner-section .pharma-div p {
    padding-top: 15px;
    font-size: 16px;
    padding-bottom: 10px;
}

.second-btn button {
    font-size: 14px;
    text-align: left;
}
 }








 @media (min-width: 768px)  and (max-width: 991px) {

/* header for tablets */
.logo {
    height: 40px;
}
.top-bar {
    padding: 15px 0px;
    border-bottom: 1px solid #eee;
    width: 90%;
}
/* bottom-nav  */
 .bottom-nav {
    
    padding: 10px 0;
    background-color: #fff;
    width: 100%;
    margin-left: 0px;
  }
  .bottom-list{
    display: flex;
    justify-content: space-evenly;
    width: 100%;
  }
.navbar-nav>li>a {
  
    padding: 10px 0px 0px 10px;
    font-size: 11px;
    color: #979797;
}
/* section1 */

 

  .pharma-div {
    width: 100%;
    padding-bottom: 50px;
  }

  .pharma-div h1 {
    padding: 50px 0px 0px 10px;
    font-size: 35px;
  }

  .pharma-div h2 {
    padding: 0px 0px 0px 10px;
    font-size: 30px;
  }
  .search-box-2 {
     background: #313131;
     padding: 6px 10px;
     border-radius: 25px;
     display: flex;
     align-items: center;
     margin: 30px 10px;
 }
 .pharma-div p {
     font-weight: 600;
     padding: 10px 0px 0px 10px;
     font-size: 15px;
 }
  .three {
     width: 100%;
     padding: 10px 0px 0px 0px;
     border-radius: 30px;
 }
 /* section2 */
 .sec-2{
    margin-top: 50px;
 }
 .brand{
         font-size: 30px;
 }
 .slide-logos{
    width: 100%;

 }
.btn-row {
     width: 100%;
     margin-top: 0px;
     
 }
 .fst-btn button {
     
     font-size: 18px;
     width: 100%;
 }

 .fst-btn button span i {
     font-size: 16px;

 }
 .second-btn button {
   
     width: 100%;
     margin-top: 10px;

 }

 .second-btn button span i {
     
     font-size: 16px;
  
 }

 .btn-row2{
    width: 100%;
     margin-top: 0px;
     margin-left: 0px;


 }
  /* section3 */
  #promoCarousel {
     width: 100%;
     margin-left: 0px;
    
 }
 .circle{
    display: none !important;
 }
 .img-responsive{
    padding-right: 0px;
    padding-left: 50px;
    
}
 .carousel-right img {
     max-height: 200px;
 }
 .custom-carousel {
     
     margin: 30px auto;
     padding: 33px;
     
 }

 .carousel-left {
     max-width: 50%;
     padding: 20px 0px;
 }
  .carousel-left h2 {
     font-size: 30px;
    
 }

 .carousel-left p {
     font-size: 16px;

 }
.carousel-indicators{
    left: 7%;
    bottom: 30px;
}

/* section4 cards*/
 .product-section {
     margin-top: 50px;
 }

 .section-title h2 a {
     
     padding: 0px;
 }
 .section-title h2{
  font-size: 20px;
 }
/* section7 */

 .about-section {
     margin-top: 50px;
 }
 .about-box h4 {
    font-size: 22px;
    margin: 0px 0px 10px;
}
.about-box p {
    font-size: 14px;
    margin-bottom: 0px;
     display: -webkit-box;
  -webkit-line-clamp: 5;  /* limit to 3 lines */
  -webkit-box-orient: vertical;  
  overflow: hidden;
}
 
 .about-box {
     
     padding: 10px;
     
 }
/* section8 */
  .features-section h2 {
     font-size: 30px;
     padding: 0px 0px;
          font-weight: 600;

     font-family: 'Playfair Display', Georgia, serif;
 }
  .features-section h2 span {
     font-weight: 600;

     font-size: 30px;
     
 }


 /* section9 */
  .con-9 {
     width: 100%;
 }
  .faq-section h2 {
     font-size: 30px;
     margin-bottom: 20px;

 }

 .faq-section h2 span {
     font-weight: 500;
 }
 .faq-item {
     
     padding: 20px 0;
 }
 .faq-question {
     font-size: 18px;
     margin: 0;
    
     
 }

 .faq-answer {
     font-size: 16px;
 }

 .faq-icon {
     font-size: 18px;
 }


/* footer  */
.footer-con{
    width: 100%;
 }
  .footer a {
     font-size: 16px;
     margin: 0 10px;
 }



}


@media (max-width: 767px) {
  .desktop-nav {
    display: none;
  }
  
  .mobile-dropdown-menu {
    display: none;
    position: absolute;
    left: 15px;
    right: 15px;
    background: white;
    list-style: none;
    padding: 0;
    margin: 5px 0 0;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 6px 12px rgba(0,0,0,0.1);
    z-index: 1000;
  }
  
  .mobile-dropdown-menu.show {
    display: block;
  }
  
  .mobile-dropdown-menu li {
    padding: 10px 15px;
    border-bottom: 1px solid #f5f5f5;
  }
  
  .mobile-dropdown-menu li:last-child {
    border-bottom: none;
  }
  
  .mobile-dropdown-menu li a {
    display: block;
    color: #333;
    text-decoration: none;
  }
  
  .navbar-header {
    position: relative;
  }
}

@media (min-width: 768px) {
  .navbar-header {
    display: none;
  }
  
  .dropdown-menu {
    display: none;
    position: absolute;
    background: white;
    min-width: 200px;
    box-shadow: 0 6px 12px rgba(0,0,0,0.175);
    z-index: 1000;
    list-style: none;
    padding: 5px 0;
    margin: 0;
  }
  
  .dropdown:hover .dropdown-menu {
    display: block;
  }
  
  .dropdown-menu li {
    padding: 8px 15px;
  }
  
  .dropdown-menu li a {
    display: block;
    color: #333;
    text-decoration: none;
  }
}