/* RESPONSIVE CSS

-------------------------------------------------- */



@media (min-width: 40em) {

  /* Bump up size of carousel content */

  .carousel-caption p {margin-bottom:0; font-size:18px; line-height:30px;}



  .featurette-heading {font-size: 50px;}

}



@media (min-width: 62em) {

  .featurette-heading {margin-top: 7rem;}

}

@media (min-width: 1280px) and (max-width: 1366px) {

  .navbar .dropdown .dropdown ul {left: -90%;}



  .navbar .dropdown .dropdown:hover>ul {left: -100%;}

  

  

}



@media(max-width:1400px){

	.navbar a, .navbar a:focus{font-size:15px;}

	.header .btn-book-a-table, .header .btn-book-a-table:focus{margin-left:20px;}

	.counter .item{font-size:26px;}

	.counter .item b{font-size:160px;}

	.banner .content-area{width:90%;}

}



@media(max-width:1200px){

	h2{font-size:28px; }

	h4{font-size:22px; }

	.navbar>ul>li{padding:10px 6px;}

	.navbar a, .navbar a:focus{font-size:13px;}

	.header .tel{padding-left:10px; font-size:13px;}

	.header .btn-book-a-table, .header .btn-book-a-table:focus{margin-left:10px; font-size:13px; padding:13px 15px;}

	.slideshow.home .slide-content .title br{display:none;}

	.about-section{font-size:18px; line-height:32px;}

	.about-section h2{line-height:42px;}

	.pharma-section .content-block{font-size:20px;}

	.pharma-section .content-block h2{font-size:30px;}

	

	.com-section figure{width:100%; height:100%;}

	.com-section figure img{height:100%;}

	.com-section .txt-block{margin:5em 2em 0 0;}

	.com-section .txt-block p{font-size:30px; line-height:40px;}

	.counter .item b{font-size:112px; line-height:80px;}

	.team-section .cn-block .item figure{height:auto;}

	.client-list li{width:25%;}

	

	.benefit-section.blog .card .heading{line-height:16px; top:89%;}

	.benefit-section.blog .footer{position:relative; bottom:auto;}

	.benefit-section.blog .footer ul{width:79%;}

	.benefit-section.blog .footer li:first-child{margin-bottom:10px;}

	.benefit-section .carousel-control{width:12%;}

}

@media(max-width:980px){

	.logo{width:18%;}

	.navbar {position:fixed; top:0;  right:-100%; width: 100%; max-width:400px; border-left:1px solid #666; bottom:0; transition:0.3s; z-index:9997;}

.mobile-nav-active .navbar{right:0;}

.mobile-nav-active .navbar:before{content:''; position:fixed; background:rgba(255, 255, 255, 0.8); z-index:9996; inset:0;}

.navbar ul{position: absolute; display:block; inset:0; padding:50px 0 10px 0; margin:0; background:rgba(255, 255, 255, 0.9); overflow-y:auto; transition:0.3s; z-index:9998;}

.navbar .dropdown>.dropdown-active, .navbar .dropdown .dropdown>.dropdown-active {display: block;}

.navbar .dropdown ul, .navbar .dropdown .dropdown ul {position: relative; left:0; display: none; padding: 10px 0; margin: 10px 10px 10px 0; width:100%; transition: all 0.5s ease-in-out; border: 1px solid #eee; 

visibility:visible; opacity:1; box-shadow:none;}

.mobile-nav-show::before{display:inline-block;}

.mobile-nav-hide:before{content:"\f00d"; display:inline-block; font-family:FontAwesome!important;}



.banner, .main-banner .carousel-item{padding:5em 0;}

.banner .content-area, .banner .carousel-caption{width:100%;}

.banner br{display:none;}

.banner .content-area{width:100%;}

.banner h1, .inner-banner h1, .bl-banner h1, .main-banner h1{font-size:46px; line-height:65px;}



h2{font-size:28px!important; line-height:36px!important;}

.pharma-section .content-block{padding:0; font-size:18px; line-height:30px;}



.twin-section{padding:4em 15px 2em;}

.ph-solution{padding:3em 0;}



.com-section .txt-block{margin:0;}

.com-section .txt-block p{font-size:22px; line-height:30px;}



.btn{font-size:14px; padding:10px 40px;}

.testimonial-section .carousel-caption{padding:1rem 0rem;}

.carousel-caption p{font-size:16px; line-height:28px;}

.testimonial-section .rating{margin-top:1em;}

.testimonial-section .carousel-control-prev{left:34%;}

.testimonial-section .carousel-control-next{right:34%;}



.new{padding-right:0;}



.about-section p, .about-section h2{width:100%;}



.counter .col-md-6{margin-bottom:30px;}

.counter .item b{font-size:175px; line-height:130px;}

.vision-section .item, .add-section .item{text-align:center;}

.vision-section .item img, .add-section .item img{margin-bottom:10px;}

.team-section .cn-block:before{height:100%; border-radius:0;}



.team-section .cn-block .item{margin-bottom:1em;}

.banner.about{padding-bottom:2em;}



.expert-area .address{margin:5em 0 0 0; text-align:center;}

.expert-area .address figure{margin:0 auto 1em;}



.benefit-section .carousel-control{width:16%;}



.client-list li{width:33%;}



.counter .item{padding:1.5em; text-align:center;}

}

@media(max-width:767px){

header .tel{display:none;}

.testimonial-section .carousel-caption {position: initial;   z-index: 10;   padding: 3rem 2rem;   color: rgba(78, 77, 77, 0.856);   text-align: center;   font-size: 0.7rem;  }

 .testimonial-section i {padding:0.8rem} 

  .benefit-section.blog .col-sm-4{max-width:100%; flex:100%; }

  .benefit-section.blog .footer{position:relative; padding-top:1em;}

  .benefit-section.blog .footer ul{width:70%;}

  .bl-banner{height:auto; padding:4em 0;}

  

  .slideshow .slide-content .caption{padding:0 20px; text-align:center;}

  .slideshow .icon{float:none; margin:0 auto 1em; width:100px; height:100px; font-size:12px; line-height:16px;}

  .inner-banner h1, .bl-banner h1, .slideshow .slide-content .title{font-size:34px; line-height:50px; margin-bottom:10px;}

  

  .main-banner .carousel-caption{text-align:center;}

  .inner-banner h1 br, .bl-banner h1 br, .main-banner h1 br{display:none;}

  .benefit-section .carousel-control{width:23%;}

  .benefit-section .carousel-control-next, .benefit-section .carousel-control-prev{width:35px; height:35px; font-size:18px;}

  

  .carousel-indicators{width:20px; height:50px; margin:0; bottom:0; top:40%; left:auto; right:10px; display:block;}

  .main-banner .carousel-indicators li{margin:5px 0;}

  

  .card-header{font-size:18px;}

  

  .about-section{font-size:18px; line-height:30px; padding:3em 0;}

  

  .banner, .main-banner .carousel-item{padding:6em 0;}

  .banner .content-area{width:100%;}

  .banner h1, .inner-banner h1, .bl-banner h1{font-size:36px; line-height:56px;}

  .inner-banner .iso, .banner .iso, .main-banner .iso, .slideshow .iso{width:65px; height:175px;}

  .banner .btn, .inner-banner .carousel-caption .btn{margin-top:0;}

  .twin-section{padding:3em 15px;}

  .twin-section .item{height:auto; margin:15px 0; padding-bottom:2em;}

  .pharma-section{padding:0;}

  

  .ph-solution{padding:4em 0 2em;}

  

  .ph-solution .item, .benefit-section .card{height:auto; margin:0;}

  

  .com-section .txt-block{margin:0 0 3em 0; text-align:center;}

  .com-section figure{width:100%; height:auto; float:none;}

  

  .testimonial-section .carousel{padding:4em 0; height:auto;}

  .testimonial-section .carousel-control-prev, .testimonial-section .carousel-control-next{top:27%;}

  .testimonial-section .carousel-control-prev{left:31%;}

  .testimonial-section .carousel-control-next{right:31%;}

  .testimonial-section .carousel-inner{overflow:inherit;}

  

  .testimonial-section p{font-size:18px; line-height:30px; padding:1em 0;}

  

  .owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled{display:block!important;}

  

  .counter .item{height:auto; margin-bottom:1em; }

  

  .st-section .owl-nav{top:-3em; right:43%;}

  .st-section .owl-carousel .owl-nav button.owl-next, .st-section .owl-carousel .owl-nav button.owl-prev{width:30px; height:30px; line-height:30px; font-size:16px;}

  .st-section{padding-bottom:0;}

  

  .site-footer .social-icon{margin-top:2em;}

  .site-footer .copy{text-align:center;}

  

  .logo{width:26%;}

  .counter .col-md-6{margin-bottom:0;}

  .ph-solution .item, .benefit-section .card{padding:2em 2em 3em;}

  .ph-solution .item .more{bottom:20px;}

  

  .vision-section .item.one{padding:2em;}

  

  .banner .icon{float:none; margin:2em auto 1em;}

  

  .client-list li{width:50%;}

  .client-section .item{height:auto; line-height:inherit!important;}

  .bl-detail{padding:0;}

  .bl-detail .header ul{width:85%;}

  .bl-detail .header li{margin-bottom:10px;}

  

  .slideshow .slide-content .title{width:100%;}

  .slideshow .slide .btn{margin:0 auto;}

  

  .about-section h2, .about-section p{width:100%;}

  

  .about-section h2{margin-bottom:20px;}

  

  .pharma-section .content-block{padding-top:40px; text-align:center;}

  .com-section .txt-block a{margin:1em auto;}

  .modal-dialog{top:2em;}

  

}

@media(max-width:600px){

	.logo {width: 35%;}

	.banner, .main-banner .carousel-item{padding:3em 0 11em;}

	.banner .content-area{text-align:center;}

	.banner h1, .inner-banner h1, .bl-banner h1, .main-banner h1{font-size:28px; line-height:42px; text-align:center;}

  .inner-banner .iso, .banner .iso, .slideshow .iso{width:46px; height:125px; bottom:30px; right:15px;}

  .banner .line, .bl-banner .line{margin-bottom:10px;}

  .com-section .txt-block p{font-size:24px; line-height:36px;}

  

  .carousel-item{height:auto;}

  .testimonial-section .carousel-caption{padding:0 1rem;}

  .testimonial-section .carousel-control-prev, .testimonial-section .carousel-control-next{top:0%;}

  .testimonial-section .carousel-control-prev{left:24%;}

  .testimonial-section .carousel-control-next{right:24%;}

  

  .testimonial-section .rating li{padding:5px;}

  .testimonial-section .rating li img{width:50%;}

  

  

  

  .expert-area .address{margin:4em 0 0 0em;}

  .expert-area .btn{margin:0 1em;}

  .expert-area .address figure{margin:0 auto 1em;}

  

  .testimonial-section h2{font-size:26px!important;}

  

  .slideshow{height:500px;}

  .slideshow.home{height:400px;}

  .slideshow .slide-content{display:block; top:4em;}

  

  .slideshow .slide-content .title{font-size:28px; line-height:40px; width:100%; margin-bottom:1em;}

  .slideshow .slide-content .title br{display:none;}

  

  .slideshow.solution .slide-content .title{margin-bottom:10px;}

  

  .modal-dialog{max-width:96%;}

  .modal-header{padding:1.5em;}

  .modal-body{padding:0 1.5em 1.5em;}

}

@media(max-width:480px){

	.info li{width:100%; float:none; text-align:center; margin-bottom:10px;}

	#demo-form .btn{width:100%; margin-top:1em; rigth:0;}

	.about-section h2{font-size:20px!important;}

}