:root {
  --theme-color: #0a993c;
}
/*=====Urdu_Font_Family_Included_Start(28_Feb_2024_Wednesday)=====*/
@font-face {
    font-family: 'NotoNastaliqUrdu';
    src: url(../fonts/arabic/NotoNastaliqUrdu-Regular.ttf);
  }
  .urduHeading{
    font-family: 'NotoNastaliqUrdu';
    font-size:30px;
    line-height:56px;
    text-align:right;
  }
  .urduParagraph{
    font-family:'NotoNastaliqUrdu';
    font-size:16px;
    line-height:55px;
    text-align:right;
    font-weight:700;
  }
  /*=====Urdu_Font_Family_Included_End(28_Feb_2024_Wednesday)=====*/
  /*=====Arabic_Font_Family_Included_Start(29_Jan_2024_Monday)=====*/
@font-face {
    font-family: 'AlQalamArabic';
    src: url(../fonts/arabic/Al-Qalam-Quran-Majeed-Web-Regular.ttf);
}
.alQalamArabicChapter{
  font-family: 'AlQalamArabic';
  font-size:22px !important;
  /*font-weight:normal;*/
  line-height:0px;
}
.alQalamArabicHeading{
  font-family: 'AlQalamArabic';
  font-size:28px !important;
  line-height:56px;
  text-align:right;
}
.alQalamArabic{
  font-family: 'AlQalamArabic';
  font-size:25px;
  line-height:56px;
  text-align:right;
}
#fontSlider {
  background: linear-gradient(to right, #3597bf 0%, #3597bf 50%, #fff 50%, #fff 100%);
  border: solid 1px #3597bf;
  border-radius: 8px;
  height: 7px;
  width:100%;
  outline: none;
  transition: background 450ms ease-in;
  -webkit-appearance: none;
}
/*=====Arabic_Font_Family_Included_End(29_Jan_2024_Monday)=====*/
.chapter-bg{
    background:#F9F9F9;
    /*padding: .625rem;*/
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
    margin-bottom: 20px;
    overflow: hidden;
}
.ayat-bg{
    /*background-image:url('../images/pattern-bg.jpg');*/
    background:#F9F9F9;
    /*padding: .625rem;*/
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
    margin-bottom: 20px;
    overflow: hidden;
}
.ayat-bg:hover{
    color:#FFF !important;
}
.ayat-bg > p{
    text-align:justify !important;
    /*color: #000 !important;*/
}
.ayat-bg p:hover{
    color:#FFF !important;
}
.logo-gradient-text {
  /* Fallback: Set a background color. */
  background-color:#FFF !important;
  /* Create the gradient. */
  /*background-image: linear-gradient(to right, #f493e2 , #72fdfc);*/
  
  background-image: linear-gradient(38deg, #00a3ff,#3ed6e8 33%,#e83e8c 66%, #e83e8c); /*linear-gradient(38deg, #00a3ff, #35f787 33%, #f46692 66%, #f493e2);*/
  /* Set the background size and repeat properties. */
  background-size: 100%;
  background-repeat: repeat;
  /* Use the text as a mask for the background. */
  /* This will show the gradient as a text color rather than element bg. */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
}
.bismiallah-gradient-text {
    background: linear-gradient(to left, #e83e8c, #72fdfc, #e83e8c, #72fdfc);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
}
.ayat-widget-gradient-text {
    background: linear-gradient(to left, #e83e8c, #72fdfc, #e83e8c, #72fdfc);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
}
.word-audio{
    cursor: pointer;
    text-decoration: none;
}
.word-audio:hover{
  background:#000;
  border:1px solid;   
  color: #FFF;
  padding: 2px 1px;
  border-radius:7px;
  cursor: pointer;
  text-decoration: none;
}
.play-pause-button{
    font-size: 11px;
    cursor: pointer;
    background: #FFF;
    border-radius: 12px;
    padding: 6px;
    border: 1px solid #000;
    text-decoration: none;
}
.play-pause-word{
    /*font-size: 11px;*/
    cursor: pointer;
    text-decoration: none;
}
/*===== Primary Color =====*/
/*===== Background Color =====*/
.thm-bg,
.thm-layer:before,
.thm-btn span,
.plyr .player .controls > div:hover,
.plyr .player .controls > div:focus,
.plyr .player .progressbar .bar-played,
.plyr .player .volume .volume-adjust div div,
.prod-caro > button.slick-arrow:hover,
.prod-caro > button.slick-arrow:focus,
.qty-wrap .bootstrap-touchspin > span button:hover,
.qty-wrap .bootstrap-touchspin > span button:focus,
.serv-box:hover,
.slick-slider:not(.feat-caro) ul.slick-dots li button:hover,
.slick-slider:not(.feat-caro) ul.slick-dots li button:focus,
.slick-slider:not(.feat-caro) ul.slick-dots li.slick-active button,
.plyr.v2 .player .volume .volume-btn:hover,
.plyr.v2 .player .volume .volume-btn:focus,
.plyr.v4 .player .volume .volume-btn:hover,
.plyr.v4 .player .volume .volume-btn:focus,
.video-box > a:hover,
.video-box > a:focus,
.about-video > a:hover,
.about-video > a:focus,
.event-caro > button.slick-arrow:hover,
.event-caro > button.slick-arrow:focus,
.pack-box.active,
.post-share:hover > i,
.post-share-social > a:hover,
.post-share-social > a:focus,
.course-box3:hover:before,
.white-layer .fact-box > span:after,
ul.pagination > li.page-item.prev a.page-link:hover, 
ul.pagination > li.page-item.next a.page-link:hover,
ul.pagination > li.page-item.prev a.page-link:focus, 
ul.pagination > li.page-item.next a.page-link:focus,
ul.pagination > li.page-item.active a.page-link, 
ul.pagination > li.page-item a.page-link:hover, 
ul.pagination > li.page-item a.page-link:focus,
.social-links4 > a:hover,
.social-links4 > a:focus,
.sermons-btns2 > a:hover i, 
.sermons-btns2 > a:focus i,
.sermon-video > a:hover,
.sermon-video > a:focus,
.services-detail-info > span + ul:before,
.prod-btn:hover,
.prod-btn:focus,
.prod-detail-tabs ul.nav-tabs li.nav-item a.nav-link:hover,
.prod-detail-tabs ul.nav-tabs li.nav-item a.nav-link:focus,
.prod-detail-tabs ul.nav-tabs li.nav-item a.nav-link.active,
.adt-info-list > li::before,
.social-links4.v2 > a:hover,
.social-links4.v2 > a:focus,
.styled-list > li:before,
.rspn-scil > a:hover,
.rspn-scil > a:focus,
.rspn-mnu-btn:hover,
.rspn-mnu-btn:focus,
.rspn-mnu-cls:hover,
.rspn-mnu-cls:focus
{
    /*background-color: var(--theme-color);#e83e8c*/
    /*background-image:none;
    background:linear-gradient(to right,#67e1f5,#e83e8c);*/
    
    color: #fff !important;
    background: #3597bf;
    transition: all 0.2s ease;
    box-shadow: 3px 3px 14px rgba(0,0,0,0.4);
    cursor: pointer;
    
}

/*===== Text Color =====*/
.thm-clr,
nav ul li:hover > a,
nav ul li.active > a,
nav ul li > a:focus,
.rsnp-mnu ul > li:hover > a,
.rsnp-mnu ul > li.active-parent > a,
.rsnp-mnu ul > li.active > a,
.rsnp-mnu ul > li > a:focus,
.topbar-info-list > li a:hover,
.topbar-info-list > li a:focus,
.social-links > a:hover,
.social-links > a:focus,
header.style3 .social-links > a:hover,
header.style3 .social-links > a:focus,
.bg-color1 .social-links > a:hover,
.bg-color1 .social-links > a:focus,
.plyr .player .volume > div:hover,
.plyr .player .volume > div:focus,
.prod-info > h3 a:hover,
.prod-info > h3 a:focus,
.prod-info > a,
.serv-box > a,
.course-inner > h4 a:hover,
.course-inner > h4 a:focus,
.team-info > h3 a:hover,
.team-info > h3 a:focus,
.event-info > h3 a:hover,
.event-info > h3 a:focus,
.post-info > h3 a:hover,
.post-info > h3 a:focus,
.post-meta > li a:hover,
.post-meta > li a:focus,
.widget ul li > a:before,
.widget ul li:hover > a,
.widget ul li > a:focus,
.bottom-bar p a,
.serv-info > h3,
.event-wrap2 > a,
.event-info2 > h3 a:hover,
.event-info2 > h3 a:focus,
.sec-title-inner > p.thm-clr,
.urgent-donat-info > h3 a:hover,
.urgent-donat-info > h3 a:focus,
.urgent-donat-meta > li.thm-clr,
.post-info2 > h3 a:hover,
.post-info2 > h3 a:focus,
.learn-top-inner > a,
.learn-post-info > h4 a:hover,
.learn-post-info > h4 a:focus,
.learn-post-info > a,
.course-info2 > h3 a:hover,
.course-info2 > h3 a:focus,
.white-layer .fact-inner > h5,
.team-info2 > h3 a:hover,
.team-info2 > h3 a:focus,
.post-info3 > h3 a:hover,
.post-info3 > h3 a:focus,
.post-meta3 > li.thm-clr,
.social-links3 a i,
.social-links3 > a:hover,
.social-links3 > a:focus,
.black-layer .social-links3 > a:hover,
.black-layer .social-links3 > a:focus,
.bottom-links > li a:hover,
.bottom-links > li a:focus,
.bottom-inner > p a:hover,
.bottom-inner > p a:focus,
ol.breadcrumb > li.breadcrumb-item a:hover,
ol.breadcrumb > li.breadcrumb-item a:focus,
.team-detail-info-list > li,
.experties-list > li a:before,
.experties-list > li a:hover,
.experties-list > li a:focus,
.sermon-info-list > li:before,
.services-info-list > li:before,
.sermons-btns2 > a,
.sermons-btns2 > a i,
.gallery-info > h3 a:hover,
.gallery-info > h3 a:focus,
.cart-table td h5 a:hover,
.cart-table td h5 a:focus,
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after,
.cont-info-box > p a:hover,
.cont-info-box > p a:focus,
.comment-detail > a,
.author-social-inner > a:hover,
.author-social-inner > a:focus,
.tags-links > a:hover,
.tags-links > a:focus,
.author-info > h4 a:hover,
.author-info > h4 a:focus,
.comment-detail > h4 a:hover,
.comment-detail > h4 a:focus,
.mini-post-info > h4 a:hover,
.mini-post-info > h4 a:focus,
.widget2 ul li:hover,
.widget2 ul li:hover > a,
.widget2 ul li a:focus,
.widget2 ul.cate-list li:hover,
.widget2 ul.cate-list li:hover > a,
.widget2 ul.cate-list li a:focus,
.mini-cause-info > h4 a:hover,
.mini-cause-info > h4 a:focus,
.widget2 ul li:hover a::before,
.widget2 ul li a:focus:before,
.rspn-srch > button:hover,
.rspn-srch > button:focus,
.rspn-cnt > span a:hover,
.rspn-cnt > span a:focus
{
	/*color: var(--theme-color);*/
        color:#67e1f5;
}

/*===== Border Color =====*/
.thm-brd-clr,
.pillar-box > span:before,
.pillar-box > span span,
.video-box > a:hover,
.video-box > a:focus,
.about-video > a:hover,
.about-video > a:focus,
.post-share:hover > i,
.pillar-box2 > span:before,
.pillar-box2 > span:after,
ul.pagination > li.page-item.active a.page-link, 
ul.pagination > li.page-item a.page-link:hover, 
ul.pagination > li.page-item a.page-link:focus,
.sermons-btns2 > a i,
.prod-detail-tabs ul.nav-tabs li.nav-item a.nav-link:hover,
.prod-detail-tabs ul.nav-tabs li.nav-item a.nav-link:focus,
.prod-detail-tabs ul.nav-tabs li.nav-item a.nav-link.active
{
	border-color: var(--theme-color);
}


{
	border-top-color: var(--theme-color);
}


{
	border-bottom-color: var(--theme-color);
}

.prod-detail-tabs ul.nav-tabs li.nav-item a.nav-link::before
{
	border-left-color: var(--theme-color);
}


{
	border-right-color: var(--theme-color);
}