 
/*====================================== GENERAL STYLES =========================*/
:root{ 
	--color-first:#024b73;
	--color-second:#ce1f4e;
	--color-content:#666;
	--color-article-content:#1e1919;
	--bg-light:#f7f7f7;
	--font-family-heading:'PT Serif', serif;
	--font-family-content:'Heebo', sans-serif;
  } 
  *,::after,::before{box-sizing: border-box;}
  * {
	  margin: 0;
	  padding: 0;
	  font-family: var(--font-family-content);
	  font-weight: 400;
	  font-size: 16px;
	  letter-spacing: 0.01em;
	  line-height: 1.5;
	  color: var(--color-content);
	  text-transform: none;
  }
  a,a:hover,.decorationNone{text-decoration: none;}
  html {scroll-behavior: smooth;}	
  p{white-space:pre-line;}
  ul li {list-style: none;}
  img {object-fit: cover;object-position: center;max-width: 100%;}
  .hideInMobile {display: block;}
  .hideInWeb,.moreArticles{display: none;}	
  .bg-first,.button.btn-first{background:var(--color-first);}
  .bg-second,.button.btn-second{background:var(--color-second);}
  .lightBg {background:var(--bg-light);}
  .button:focus,input[type=submit].button:focus,.button i,.button:hover,.webContent.textWhite .mainHeading,
  .webContent.textWhite .subHeading,.webContent.textWhite p {color: #fff;}	
  .color-first,.webContent .color-first,small.color-first,.webContent .mainHeading.color-first,
  .webContent .subHeading.color-first,.webContent p.color-first,.webContent.textWhite p.color-first{color:var( --color-first);}
  .color-second,.webContent .color-second,small.color-second,.webContent .mainHeading.color-second,
  .webContent .subHeading.color-second,.webContent p.color-second {color:var( --color-second);}
  
  .wrapper,.posRel {position: relative;}
  .h-45{height: 45px;}
  .headingline {
	  width: 100%;
	  height: 1px;
	  margin: 5px 0;
  }
  .posAbs{position: absolute;}
  .button,input[type=submit].button{
	  display: inline-block;
	  border-radius: 0;
	  padding:7px 35px;
	  color: #fff;
	  font-size: 1rem;
	  font-weight:600;
	  letter-spacing: 1px;
	  border: 1px solid transparent;
	  text-transform: capitalize;
	  outline: 0;
	  cursor: pointer;
  }
  .webContent .mainHeading,.webContent .article-contents h1 {
	  font-size: 2rem;
	  font-weight: 600;
	  color: var(--color-first);
	  text-transform:initial;
	  font-family:var(--font-family-heading);
	  letter-spacing: 0;
	  margin-bottom: 5px;
	  line-height: 1em;
  }
  .webContent .line{
	  position: relative;
	  display: inline-block;
	  width: 300px;
	  height: 1px;
	  border-bottom: 1px solid #dfdfdf;
	  margin: 10px 0;
   } 
  .webContent .line:after {
	  position: absolute;
	  content: '';
	  left:0%;
	  bottom: -1px;
	  width: 40%;
	  height: 2px;
	  background-color: var(--color-second);
  } 
  .webContent .text-center .line:after {
	  left:30%;
  } 
  .webContent .subHeading {
	  font-size: 1.3rem;
	  color: var(--color-second);
	  letter-spacing:0px;
	  text-transform: capitalize;
	  font-family:var(--font-family-content);
	  font-weight: 400;
	  margin-bottom: 5px;
  }
  .webContent p {
	  color: var(--color-content);
	  font-size: 1.05rem;
	  line-height: 1.4;
  }	
  input.form-control, select.form-select{height: 45px;}
  input.form-control, select.form-select,textarea.form-control {
	  resize: none;
	  border-radius: 0;
  }
  input.form-control:hover, select.form-select:hover,textarea.form-control:hover,input.form-control:focus, 
  select.form-select:focus,textarea.form-control:focus{
	  border-color:#ced4da;
	  box-shadow: none;
	  outline: none;
  }
  .displayFlex {
	  display: flex;
	  justify-content: center;
	  align-items: center;
  }	
  .text-limit-1{
	  overflow: hidden;
	  text-overflow: ellipsis;
	  display: -webkit-box;
	  -webkit-line-clamp: 1;
	  -webkit-box-orient: vertical;
  }
  .text-limit-2{
	  overflow: hidden;
	  text-overflow: ellipsis;
	  display: -webkit-box;
	  -webkit-line-clamp: 2;
	  -webkit-box-orient: vertical;
  }
  .text-limit-2.subHeading{height:52px;}
  .text-limit-3{
	  overflow: hidden;
	  text-overflow: ellipsis;
	  display: -webkit-box;
	  -webkit-line-clamp: 3;
	  -webkit-box-orient: vertical;
  }
  .text-limit-3.mainHeading{height: 115px;line-height: 1.2em}
  .breadcrumb-item a {
	  color: var(--color-first) !important;
	  font-weight: 400;
  }
  .text-limit-4{
	  overflow: hidden;
	  text-overflow: ellipsis;
	  display: -webkit-box;
	  -webkit-line-clamp: 4;
	  -webkit-box-orient: vertical;
  }
  .internalBanner{background: var(--color-second);}
  .internalBanner .webContent .mainHeading{font-weight: 700;}
  .mainBanner{
	  background: url(../img/banner.png);
	  background-size: cover;
	  background-repeat: no-repeat;
	  height: 350px;
	  display:flex;
	  justify-content: center;
	  align-items: center;
  }
  .mainBanner .mainHeading{font-size: 2.5rem}
  .mainBanner p{font-size: 1.2rem}
  .articles-section .card,.articles-section .card img{transition: 0.3s linear;}
  .articles-section .card:hover img{filter: brightness(0.8);}
/*====================================== OWL CAROUSEL STYLES =========================*/		
  .owl-theme .owl-nav [class*=owl-] {
	margin: 0 !important
  }
  .owl-carousel .owl-nav button span {
	opacity: 0;
	width: 0;
	height: 0
  }
  .owl-carousel .owl-nav button:focus {
	outline: 0 !important;
	border: 0 !important
  }
  .owl-carousel .owl-nav button:hover {
	background: 0 0 !important
  }
  .owl-carousel .owl-nav button.owl-next::after, .owl-carousel .owl-nav button.owl-prev::after {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	top: 10px;
	right: 5px;
	bottom: 5px;
	left: 20px;
	transform: rotate(45deg);
	border-radius: 0;
	border: 2px solid #fff;
	border-left: 0;
	border-bottom: 0;
	margin-left: -9px;
	margin-bottom: 4px
  }
  .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
	width: 25px;
	height: 25px;
	background: var(--color-second) !important;
	position: absolute;
	top: -10%;
	border-radius: 0px !important;
  }
  .owl-theme .owl-nav .owl-prev {
	right: 55px;
	transition: background .5s;
	line-height: 30px !important;
	transform: rotate(180deg)
  }
  .owl-theme .owl-nav .owl-next {
	right:15px;
	transition: background .5s;
	line-height: 30px !important;
  }
/*====================================== HOME STYLES =========================*/	
  .moreArticleCard .moreArticleLargeImg{
	  width: 100%;
	  height:655px;
  }
  .moreArticleSmallImg{width: 100%;height: 250px;}
  .carousel-control-next, .carousel-control-prev{
	  top: initial;
	  width: 30px;
	  height: 30px;
	  background-color: var(--color-second);
	  bottom: -10%;
	  opacity: 1;
  }
  .carousel-control-next-icon, .carousel-control-prev-icon{width: 1.5rem;height: 1.5rem}
  .carousel-control-prev{left:45%}
  .carousel-control-next{right:45%}
/*====================================== CATEGORIES STYLES =========================*/	
  .categories-section .card{
	  border-radius: 30px;
	  margin-bottom: 10px;
  }
  .categories-section .card img.categories-img{
	  border-top-right-radius: 30px;
	  border-top-left-radius: 30px;
  }
  .categories-section .card .subHeading{
	  font-size: 1.1rem;
	  text-transform: capitalize;
	  letter-spacing:0 ;
	  color: var(--color-first);
  }
  .categories-section .card .card-body{
	  height: 100px;
	  display: flex;
	  align-items: flex-end;
	  justify-content: center;
	  position: relative;
  }
  .categories-section .card .card-body .category-icons{
	  position: absolute;
	  display: inline-block;
	  width: 60px;
	  height: 60px;
	  top: -20%;
	  left: 38%;
	  display: inline-flex;
	  justify-content: center;
	  align-items: center;
	  border-radius: 50%;
	  background-color: var(--color-second);
  }
  .categories-section .card .card-body .category-icons i{
	  font-size: 1.3rem;
  }
/*====================================== ARTICLES AND DETAILS STYLES =========================*/	
  .articles-section .webContent .subHeading{ 
	  font-size: 1.2rem;
	  line-height:1.35;
	  margin:10px 0;
	  font-weight: 500;
	  text-transform: capitalize; 
  }
  .articles-section .webContent .related-articles-block .mainHeading{
	  font-size: 1.6rem;
	  font-weight: 500;
  }
  .webContent .article-contents h1{font-weight:600;font-size:2.5rem }
  .articles-section .webContent .related-articles-block .subHeading{font-size: 1.15rem}
  .articles-section .card img{max-width: 100%;display: block;}
  .card.largeCard img{width:100%;height: 250px}
  .card.mediumCard img{width:100%;height: 175px}
  .card .smallCard img{width:100%;height: 85px}
  .articles-section .card p{margin-bottom: 0.5rem}
  .search_cloud-title {
	font-size: 22px;
	font-weight: 700;
	line-height: 1.5;
	color: #23262c;
	margin-bottom: 10px
  }
  .search_cloud {
	display: flex;
	flex-wrap: wrap
  }
  .search_cloud li {
	border: 1px solid var(--color-second);
	margin: 0 9px 9px 0
  }
  .search_cloud li a {
	color: var(--color-first);
	font-size: 16px;
	line-height: 1.5;
	padding: 3px 9px;
	display: block
  }
  .search_cloud li:hover {
	color: #fff;
	border-color:var(--color-first);
	background-color: var(--color-first);
	background-position: left bottom
  }
  .search_cloud li:hover a {
	color: #fff
  }
  .article-contents h2,.article-contents h3,.article-contents h4,.article-contents h5,.article-contents h6,
  .article-contents h2 span,.article-contents h3 span,.article-contents h4 span,.article-contents h5 span,
  .article-contents h6 span{
	  line-height: 1.35;
	  margin-top: 15px;
	  text-transform: capitalize;
	  color: var(--color-article-content);
	  letter-spacing: 0px;
	  font-family: var(--font-family-content);
	  margin-bottom: 5px;
  }
  .article-contents a,.article-contents a strong,.article-contents strong a{
	  color: #00f;
	  text-decoration: underline;
	  font-size: 1.05rem;
  }
  .article-contents strong a{font-weight: 600}
  .article-contents h2,.article-contents h2 span{font-size: 1.7rem;font-weight: 800;}
  .article-contents h3,.article-contents h3 span{font-size: 1.5rem;font-weight: 700;}
  .article-contents h4,.article-contents h4 span{font-size: 1.3rem;font-weight: 600;}
  .article-contents h5,.article-contents h5 span{font-size: 1.2rem;font-weight: 600;}
  .article-contents h6,.article-contents h6 span{font-size: 1.1rem;font-weight: 600;}
  .article-contents p,.article-contents p span,.article-contents span p,.article-contents p strong,
  .article-contents strong,.article-contents span{
	  color: var(--color-content);
	  font-size: 1.05rem;
	  line-height: 1.4;
	  white-space: pre-line;
  }
  .article-contents span{
	  display: inline-block;
	  margin-bottom: 1rem;
  }
  .article-contents img{max-width: 100%;height: auto;margin: 10px 0;display: block;}
  .article-contents ul{padding-left: 10px}
  .article-contents ul li,.drugs-name.injectableDrugsName ul li,ul.sitemapList li{
	  margin-bottom:5px;
	  position: relative;
	  padding-left: 20px;
   }
   .drugs-name.injectableDrugsName ul li{
	  margin-bottom:5px;
	}
  .article-contents ul li:before,.drugs-name.injectableDrugsName ul li:before,ul.sitemapList li:before{
	  position: absolute;
	  font: var(--fa-font-solid);
	  content: "\f101";
	  color: var(--color-second);
	  width: 10px;
	  height: 10px;
	  font-size: 0.8rem;
	  left: 0;
	  top: 6px;
  }
  .drugs-name.injectableDrugsName ul li:before,ul.sitemapList li:before{
	  font: var(--fa-font-regular);
	  content: '\f192';
	  font-size: 0.75rem;
  }
/*====================================== ALL DRUGS STYLES =========================*/	
  .alphabets-tab .nav-tabs {
	gap: 5px
  }
  .alphabets-tab a.nav-link {
	font-size: 14px;
	padding: 0;
	text-transform: capitalize;
	font-weight: 700;
	color: #353535;
	height: 35px;
	width: 35px;
	line-height: 30px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	background-color: #f1f1f1;
	border-color: #bababa !important;
	border-radius: 4px
  }
  .alphabets-tab .nav-tabs .nav-item.show .nav-link, .alphabets-tab .nav-tabs .nav-link.active, 
  .alphabets-tab .nav-tabs .nav-link:focus, .alphabets-tab .nav-tabs .nav-link:hover {
	  color: #fff !important;
	  background-color: var(--color-first) !important;
	  border-color: var(--color-first) !important;
  }
  .drugs-name ul {
	display: grid;
	grid-gap: .8rem;
	grid-template-columns: repeat(5, 1fr);
  }
  .drugs-name.injectableDrugsName ul{
	  grid-template-columns: repeat(2, 1fr);
  }
  .drugs-name ul li,ul.sitemapList li {
	width: 100%;
	text-align: left;
	cursor: pointer;
	-webkit-transition: background .5s;
	transition: background .5s;
	background-color: #fff;
	box-shadow: 0 .125rem .25rem rgb(0 0 0 / 18%);
  /*  border-left: 2px solid var(--color-first)*/
  }
  .drugs-name.injectableDrugsName ul li,ul.sitemapList li{box-shadow: none;background-color: transparent;position: relative;}
  .drugs-name ul li a,ul.sitemapList li a {
	font-size: .9rem;
   font-weight: 600;    
	padding: 5px 5px 5px 10px;
	color: #000;
	word-break: break-word;
	display: flex;
	justify-content: space-between;
	align-items: center
  }
  .drugs-name.injectableDrugsName ul li a,ul.sitemapList li a{color: var(--color-content);padding:0}
  .browseList{
	  column-count: 3;
  }
  .browseList.popularDrugList{column-count: 4}
  .browseList li a {
	  font-size: .9rem;
	  line-height: 1.3;
	  font-weight: 500;
	  color: var(--color-content);
	  text-decoration: none;
  }
  .injectableDrugsText{
	  width: 100%;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  outline: 1px solid #fff;
  outline-offset: 2px;
  border-radius: 5px;
  background-color: #fff5f8;
  }
  .injectableDrugsListCarousel .injectableDrugsText{
  outline: 1px solid #b8dcf0;
  background-color: #b8dcf0;
}
  .injectableDrugsCols:not(:nth-last-child(n+3)){margin-bottom: 1.5rem;}
  .injectableDrugsText p{
  font-size: .9rem;
  color: var(--color-first);
  font-weight: 600;
}
.injectableDrugsSection{
	background: url(../img/injectableDrugsBg.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}

.author-details{
	display: flex;
	align-items: center;
	margin: 10px 0;
	}
	.author-details .author-img{
	display: inline-block;
	width: 35px;
	height: 35px;
	}
	.author-details .author-txt{margin-left: 10px;width: 80%;}
	.author-details .author-img,.author-details .author-txt{clear: both;}
	.author-details .author-img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
	margin-top : -4px
	}
	.author-details .author-txt span{color: #333}
	.author-details .author-txt a{color: #3557ff;}
	.seperatorLine{border-right: 1px solid #333; padding-right: 5px;margin-right: 5px}
	.author-details-desc img {
	width: 150px;
	height: 150px;
	float: left;
	margin:0 20px 20px 0px;
	margin-left:0;
	border-radius:50%;
	object-fit: cover;
	object-position: center;
	}
	.author-details-desc{width:100%}

