body {font-family:"Roboto Condensed", sans-serif;font-size:20px;background:#fff;color:#222;font-weight:normal;overflow-x:hidden;}
h1, h2, h3, h4, h5, h6 {font-family:"Roboto Condensed", sans-serif;margin-bottom:0;font-size:16px;line-height:20px;}
a {color:#222;text-decoration:none;}
a:hover {text-decoration:none;color:#000;}
p {margin-bottom:0;font-size:16px;line-height:22px;}
.container {padding-right:10px;padding-left:10px;max-width:1230px;}
.container-fluid {padding:0;}
.img100 {width:100%;}

/* common */

.sticky {position:fixed;background:#292929;top:0 !important;z-index:999;margin-top:0;left:0;right:0;}
.navbar-toggler:focus {box-shadow:none;}

/* back-to-top */

#button {display:inline-block;color:#fff;border:2px solid #2b6802;background-color:#fff;width:50px;height:50px;text-align:center;border-radius:4px;position:fixed;bottom:30px;right:30px;transition:background-color 0.3s, opacity 0.5s, visibility 0.5s;opacity:0;visibility:hidden;z-index:1000;}
#button::after {font-weight:normal;font-style:normal;font-size:2em;line-height:50px;color:#fff;}
#button:hover {cursor:pointer;background-color:#0fa135;}
#button:active {background-color:#fff;}
#button.show {opacity:1;visibility:visible;}
#button i {font-size:20px;line-height:50px;color:#555;}

/* css styles */

/* header */

.main-menu {background-color:#006938;}
.main-menu .navbar {padding:0;}
.header-btn {background-color:#006938;color:#fff;border:2px solid #fff;padding:3px 10px;font-size:18px;border-radius:5px;transition:all.3s ease }
.header-btn:hover {background-color:#0fa135;color:#fff;border:2px solid #fff;}
.logo img {height:63px;} 
.main-menu .navbar ul li a {line-height:45px;padding:0 12px;font-size:18px;}
.main-menu .navbar ul li span {line-height:45px;padding:0 12px;font-size:18px;}
.main-menu .navbar-light .navbar-nav .nav-link.active {color:#f9f905;}
.main-menu .navbar-light .navbar-nav .nav-link {color:#fff;margin-right:10px;}
.main-menu .navbar-light .navbar-nav .nav-link i {padding-left:10px;padding-bottom:4px;}
.main-menu .navbar-light .nav-item > a:hover {color:#f9f905;}
.navbar-light .navbar-toggler-icon {background-image:none;}
.navbar-light .navbar-toggler-icon i {color:#fff;padding-top:5px;}
.collapse ul li {display:inline-block;position:relative;line-height:21px;text-align:center !important;}
.collapse ul li a {display:block;color:#333;font-weight:500;text-decoration:none;text-align:start !important;border-right:1px solid rgba(0, 0, 0, 0.05);}
.collapse ul li li a:hover {color:#000;background-color:#d8d6d6;}
.collapse ul li ul.dropdown {min-width:200px;/* Set width of the dropdown */ display:none;position:absolute;z-index:999;transition:all 0.5s ease-in;}
.collapse ul li:hover ul.dropdown {display:block;padding-top:15px;}
ul li ul.dropdown li {display:block;background-color:#e0dfdf;margin-left:-45px;border-bottom:1px solid rgba(0, 0, 0, 0.05);}
div#video_player_box {width:100%;height:100%;}


/* vedio section */

.video-area {padding:20px 0;}
.video-wrapper {width:100%;margin:0; height: 600px;}
.vjs-theme-fantasy {background-color:#fff;}
.vjs-control-bar {background-color:#006938 !important;margin-top:50px;position:static;}
.vjs-live-display {display:none;}
.video-js .vjs-tech {position:absolute;top:-20px;left:0;width:100%;height:100%;}

/* about us */

.about-us-area {width:100%;background:url("../../media/imgAll/bg/bg-18.jpg");background-repeat:no-repeat;background-size:cover;background-position:center center;margin:0px 0;padding:30px 0;}
.about-us-wrapper {text-align:start;padding:50px 0;}
/* .section-header {color:#f9f905;padding-bottom:30px;font-weight:600;text-align:center;} */
.about-us-content .section-header h2 {font-size:28px;color:#f9f905;padding-bottom:30px;font-weight:600;text-align:start;}
.about-us-content h3 {font-size:18px;color:#fff;font-weight:600;padding-bottom:20px;}
.about-us-content { color: #fff; margin-bottom: 0; font-size: 18px; line-height: 30px; display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; margin-bottom: 20px; min-height: 60px; }
.btn-outline {background-color:transparent;color:#0fa135;border:2px solid #0fa135;padding:5px 20px;font-size:18px;margin-top:30px;} .btn-outline:hover {background-color:#0fa135;color:#fff;border:2px solid #0fa135;}

/* sponsor */

.sponsor-area {background-color:#006938;padding:50px;}
.sponsor-area .section-header h2{color:#f9f905;padding-bottom:30px;font-weight:600;text-align:center; font-size: 28px;}
.sponsor-wrapper .img-container {position:relative;display:inline-block;}
.img-top {opacity:0;position:absolute;overflow:hidden;width:0;height:100%;transition:0.5s ease;top:50%;left:0%;transform:translate(0%, -50%);}
.img-container:hover .img-top {opacity:1;width:100%;}

/* Quran and sunnah */

.q-s-section {padding:50px 0;background-color:#2599ac;}
.q-s-wrapper .img-wrapper {position:relative;overflow:hidden;border:8px solid #fff;}
/* .q-s-section h2 {color:#fff;} */
.q-s-section .section-header h2{color:#fff;padding-bottom:30px;font-weight:600;text-align:center; font-size: 28px;}
.img-wrapper img {width:100%;/* position:relative;top:0;transition:top ease 0.5s;margin-bottom:-15px !important;*/ }
.img-wrapper:hover img {top:-10px;}
.q-s-wrapper .img-wrapper {position:relative;}
.img-wrapper .overlay {position:absolute;bottom:0;left:0;right:0;background:rgb(0, 0, 0);background:rgba(0, 0, 0, 0.5);/* Black see-through */ width:100%;transition:0.5s ease;height:0;color:white;font-size:20px;text-align:center;}
.q-s-wrapper .img-wrapper .overlay:hover {color:#f9f905;background-color:rgba(255, 255, 255, 0.6);}
.q-s-wrapper .img-wrapper:hover .overlay {height:40%;}
.text {position:absolute;top:50%;bottom:0;transform:translate(-50%, -50%);overflow:hidden;text-align:center;}

/* kYW section */

.KYW-section {padding:50px 0;background-color:#562568;}
/* .KYW-section h2 {color:#fff;} */
.KYW-section .section-header h2{color:#fff;padding-bottom:30px;font-weight:600;text-align:center; font-size: 28px;}

/* entertainment */

.entertainment-section {background-color:#94193d;padding:50px 0;}
/* .entertainment-section h2 {color:#fff;} */
.entertainment-section .section-header h2{color:#fff;padding-bottom:30px;font-weight:600;text-align:center; font-size: 28px;}

/* channel */

.youtube-section {padding:50px 0;}
.youtube-section .section-header h2 {
    position: relative;
    font-size: 30px;
    z-index: 1;
    overflow: hidden;
    text-align: center;
    padding:50px;
    line-height: 30px;
}
.youtube-section .section-header h2:before, .youtube-section .section-header h2:after {
    position: absolute;
    top: 51%;
    overflow: hidden;
    width: 50%;
    height: 1px;
    content: '\a0';
    background-color: #000;
}
.youtube-section .section-header h2:before {
    margin-left: -52%;
    text-align: right;   
}

.color {
    background-color: #ccc;
}
/* .decorated {overflow:hidden;text-align:center;color:#000;padding:10px 0;}
.youtube-section h2 {padding-bottom:30px;}
.decorated > span {position:relative;display:inline-block;}
.decorated > span:before, .decorated > span:after {content:"";position:absolute;top:50%;border-bottom:1px solid;width:100vw;margin:0 20px;}
.decorated > span:before {right:100%;}
.decorated > span:after {left:100%;} */
.iframe-wrapper {overflow:hidden;padding-top:56.25%;/* 16:9 */ position:relative;}
.iframe-wrapper iframe {position:absolute;top:0;left:0;width:100%;height:100%;}
.link-btn {background-color:#e11218;color:#fff;padding:2px 10px;text-align:center;display:inline-block;border-radius:5px;margin:20px 0;}
.link-btn:hover {color:#fff;}
.link-btn i {background-color:#e11218;color:#fff;padding-right:10px;font-size:20px;}
.paging {padding:20px 0;}
.paging p {font-size:20px;padding-right:20px;}
.paging i {font-size:10px;padding-left:5px;}
.paging-btn {background:transparent;color:#000;padding:5px;}
.paging-btn:hover {color:#000;}
.img-container {position:relative;}
.img-bg {height:0;width:100%;padding-top:56.25% !important;overflow:hidden !important;background-size:cover !important;background-position:center !important;}
.play-hover {opacity:0;position:absolute;top:-10px;left:0;width:100%;height:100%;vertical-align:middle;text-align:center;transition:all 0.5s ease;}
.play-hover:hover {opacity:1;position:absolute;padding-top:60px;left:0;}
.play-hover .play-img {height:auto !important;max-width:15% !important;padding:0 !important;margin:0 !important;min-width:30px !important;vertical-align:middle !important;display:inline-block !important;width:auto;border:0;box-sizing:border-box;}
.video-title p {font-size:20px;text-align:start;padding-top:10px;line-height:25px;}
.ad-image {margin-top:10px;margin-bottom:20px;}

/* events section */

.e-p-section {margin-bottom:50px;}
/* .e-p-section h2 {color:#000;line-height:1;padding-bottom:0;} */
.e-p-section .section-header h2{color:#000;padding-bottom:30px;font-weight:600;text-align:center; font-size: 28px;}
.e-p-section hr.hr_narrow {width:10%;margin:6px;}
.hr_color {color:#fff200;background:#fff200;}
.e-p-section hr:not([size]) {height:4px;}
.e-p-section .q-s-wrapper {padding-top:30px;}
.e-p-section .q-s-wrapper .img-wrapper {border:8px solid #eee;}

/* footer */

.footer-contents {background-color:#006938;color:#fff;padding:30px 0;}
.footer-content-2 {background-color:#006938;color:#fff;padding:20px 0;}
.footer-info h4 {font-size:22px;padding-top:20px;}
.footer-info h5 {font-size:22px;margin-bottom:10px;padding-right:70px;line-height:28px;}
.footer-info a {color:#ffff;font-size:16px;}
.footer-info address p {font-size:16px;padding-top:10px;}
.icons a > i {margin-right:15px;height:35px;width:35px;line-height:35px;font-size:15px;border-radius:50%;text-align:center;}
.fb {background-color:#3e5b98;}
.fb:hover {filter:blur(0.5px);background-color:rgba(62, 91, 152, 0.6);}
.insta:hover {filter:blur(0.5px);background-color:rgb(156, 124, 110, 0.6);}
.twitter:hover {filter:blur(0.5px);background-color:rgb(77, 167, 222, 0.6);}
.youtube:hover {filter:blur(0.5px);background-color:rgb(224, 42, 32, 0.6);}
.twitter {background-color:#4da7de;}
.insta {background-color:#9c7c6e;}
.youtube {background-color:#e02a20;}
.icons {padding-top:10px;}
.share-section {padding:8px 0;}
.get-it {padding-left:20px;}
.get-it img:first-child {padding-bottom:10px;}
.footer-links a {color:#fff;}
.footer-links a p {padding:0 10px;color:#fff;padding-bottom:0;}
.footer-links a:first-child p {padding-left:0;}
.footer-links p {font-size:16px;}
.footer-links a p:hover {color:#f9f905;text-decoration:underline;}
.share-section img {width:100px;}
hr {padding:0;margin:0;}

/* about us */

.about-area {padding:50px 0;}
.about-area .section-header {padding-bottom:0;}
.about-area h2 {font-size:28px;color:#000;text-align:start;}
.about-area h3 {font-size:20px;color:#000;text-align:start;padding:20px 0;}
.about-wrapper p {font-size:18px;line-height:28px;font-weight:400;padding:10px 0;letter-spacing:0px;}

/* news  */

.news-area h1 {font-size:28px;color:#000;line-height:35px;}
.news-area .section-header {text-align:start;padding-top:50px;padding-bottom:0;}
.news-area-2 .section-header {text-align:start;padding:50px 10px 20px 10px;}
.line-post h2 {font-size:18px;color:#000;}
.news-area-2 ul {list-style:none;padding-left:0;line-height:21px;}
.news-area-2 ul li {border-right:4px solid #0fa135;background:#fff;position:relative;margin-bottom:20px;margin-left:10px;}
.blog-wrapper {margin-bottom:24px;}
.news-area-2 ul li a { display: inline-block; color: #000; background: linear-gradient(to right, #fff 50%, #0fa135 50%) left; background-size: 200%; transition: 0.2s ease-out; padding: 4px 7px 4px 6px; border-bottom: 1px solid #d8d6d6; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; margin-bottom: 20px; min-height: 81px; line-height: 24px; }
.news-area-2 ul li:hover a {background-position:right;color:#fff;}
.news-area-2 {border-left:1px solid #eee;height:99%;}
/* .line-post {padding:0 33px;} */
.news-wrapper {padding-top:10px;}
.news-wrapper p {font-size:18px;color:#a8a8a8;}
.news-wrapper p span {padding-right:10px;}
.news-text {padding:50px 0;border-bottom:1px solid #4d4d4d;padding-right:10px;}
.news-text p {font-size:18px;line-height:28px;}
.news-text .img-container img {padding:20px 0;}
.news-text ul {list-style:disc outside !important;}
.news-text ul li {color:#737e86;font-size:18px;line-height:28px;}
.news-text ul li {color:#737e86;font-size:18px;line-height:28px;}
.news-text h2 {color:#000;font-size:28px;padding-top:30px;padding-bottom:5px;line-height:30px;}
.related-post {padding:30px 0;}
.related-content {padding:10px;border-left:1px solid #ededed;border-right:1px solid #ededed;border-bottom:1px solid #ededed;}
.related-post h2 {font-size:28px;}
.all-post {margin:20px 0;}
.all-post .img-container {border:8px solid #e2e2e2;}
.all-post p {font-size:14px;color:#afacac;padding:5px 0;}
.all-post h4 {font-size:22px;line-height:28px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;margin-bottom:20px;min-height:84px;}
.read-btn {border:1px solid #2b6802;border-radius:3px;display:inline-flex;justify-content:center;align-items:center;padding:2px 10px;font-size:16px;transition:0.3s ease-in;}
.read-btn:hover {background-color:#2b6802;color:#fff;}
.read-btn i {font-size:10px;padding-right:10px;}
.link-border {border-bottom:1px dotted #a8a8a8;font-size:18px;color:#a8a8a8;}
.options {padding:0 15px;}
.options i {padding:0 15px;}
.share-wrapper {margin-top:20px;}
.fb-share {border:1px solid #ededed !important;margin:0 20px;}
.counter {height:44px;margin:0;margin-top:5px;margin-bottom:2px;background-repeat:no-repeat;color:#4d4d4d;width:60px;overflow:hidden;line-height:16px;text-align:center;padding-top:10px;}
.img-setting {width:15%;height:15%;margin-top:-4px;margin-left:5px;}
.share-pic {width:60px;}
.gaping {padding-right:20px;position:relative;}
.youtube-plugin{padding-left:10px;}

/* program */

.program-area {padding:90px 0;}
.program-area .section-header {margin-bottom: 20px;}
.program-area .section-header h2 {font-size:28px;color:#000;text-align: center;}
.program-area hr:not([size]) {height:4px;}
.program-area hr.hr_narrow {width:5%;margin-top:20px;}
.program-area .img-wrapper {border:8px solid #ededed;}

/* event */

.event-area {padding:50px 0;}
.event-area .q-s-wrapper {padding:20px 0;}
.event-area .section-header h1 {font-size:28px;color:#000; text-align: center;}
.event-area .img-wrapper {border:8px solid #ededed;}
.event-area .img-wrapper img {overflow:hidden;}

/* schedule */

.schedule-area {padding:50px 0;}

/* contact */

.contact-area {padding:50px 0;}
.contact-area form input {margin-top:5px;width:100%;margin-bottom:15px;padding-bottom:10px;border:1px solid #81d742;outline:none;transition:0.5s;}
.contact-area form input:focus {border:1px solid #4d4d4d;}
.contact-area form label {font-size:20px;}
.contact-area form textarea {width:100%;margin-bottom:15px;border:1px solid #81d742;outline:none;transition:0.5s;}
.contact-area form textarea:focus {border:1px solid #4d4d4d;}
.send-btn {border:1px solid #0fa135;border-radius:3px;padding:5px 30px;font-size:20px;color:#0fa135;transition:0.3s ease-in;}
.send-btn:hover {background-color:#0fa135;color:#fff;}
.address-wrapper h2 {font-size:28px;padding-bottom:14px;}
.address-wrapper p {font-size:18px;line-height:20px;padding-bottom:12px;}

/* donation */

.donation-area {background:url("../../media/imgAll/bg/d-bg.jpg");background-repeat:no-repeat;background-position:center top;padding-top:90px;}
.donation-area .section-header h1 {color:#fff; text-align: center; font-size: 28px; margin-bottom: 20px;}
.donate-box iframe{width:400px;}
.tv-info {background:rgb(0, 0, 0, 0.6) url("../../media/imgAll/bg/d-bg-2.jpg");background-repeat:repeat;background-position:center top;padding:70px 0;}
.tv-info-text h4 {font-size:24px;padding:20px 0;color:#fff;}
.tv-info-text p {font-size:18px;line-height:28px;color:#fff;}


/* partner */

.partner-area {padding:100px 0 50px 0;}
.box-width {width:18%;display:flex;justify-content:center;padding:10px 15px;margin:10px;background:rgba(0, 0, 0, 0.01);text-align:center;height:100px;line-height:75px;position:relative;}
.box-width::before {content:"";display:block;width:100%;height:1px;background:rgba(0, 0, 0, 0.08);position:absolute;left:0;bottom:0;}
.box-width:after {content:"";display:none;position:absolute;left:50%;margin-left:-4px;bottom:0;width:0;height:0;border-style:solid;border-width:0 4px 5px;border-color:transparent;border-bottom-color:#0fa135;}
.box-width:hover::before {background:#0fa135;height:2px;}
.box-width:hover:after {display:block;bottom:2px;}
.wrapper {animation:Zoomin 0.7s;animation-timing-function:cubic-bezier(0.645, 0.045, 0.355, 1);@include transform-style(preserve-3d);z-index:1;}

/* publication */

.publication-area {padding:50px 0;}
.publication-area .img-wrapper {border:8px solid #ededed;}
.publication-area .section-header h1 {font-size:28px;color:#000;text-align:center; margin-bottom: 20px;}

/* direction */
.direction-area {padding:50px 0;}

/* privacy */
.privacy-area {padding:50px 0;}
.privacy-area .section-header h2{padding-bottom:0;font-size:28px;color:#000;text-align:start;}
.privacy-wrapper p {font-size:18px;line-height:28px;font-weight:400;padding:10px 0;letter-spacing:0px;}

/* terms */
.terms-area {padding:50px 0;}
.terms-area .section-header h2{padding-bottom:0;font-size:28px;color:#000;text-align:start;}
.terms-wrapper p {font-size:18px;line-height:28px;font-weight:400;padding:10px 0;letter-spacing:0px;}
.terms-area h5 {font-size:20px;color:#000;text-align:start;padding:20px 0;}


/* animation */

@keyframes Zoomin {from {@include transform-origin(50% 50%);@include transform(scale(0.9));opacity:0;@include box-shadow(rgba(0, 0, 0, 0.8) 0px 0px 50px inset);} to {opacity:1;@include transform(scale(1));@include box-shadow(rgba(0, 0, 0, 0) 0 0 0 inset);} }

/* media query */

/* XL Device :1200px. */
@media (min-width:1200px) and (max-width:1500px) {
}

/* LG Device :992px. */
@media (min-width:992px) and (max-width:1200px) {
}

/* MD Device :768px. */
@media (min-width:768px) and (max-width:991px) {
.navbar-collapse {padding:20px 0;}
.main-menu .navbar ul li span{text-align: start;}
.footer-info h4 {font-size:18px;}
.footer-info address p {font-size:14px;padding-top:10px;}
.footer-info h5 {font-size:18px;}
.footer-info a {font-size:14px;}
.footer-info h5 {font-size:18px;padding-right:55px;}
.footer-links p {font-size:15px;}
.box-width {width:25%;}
.contact-area iframe{width:100%;}
.fb-plugin-share iframe{width:100% !important;margin:0 16px;}
.ad-image iframe{width:100%;}
}

/* Extra small Device. */
@media (max-width:767px) {
.navbar-collapse {padding:20px 0;}
.main-menu .navbar ul li span{text-align: start;}
.video-wrapper {width: 100%;margin: 0;height:240px;}
.youtube-section {padding: 10px 0;}
.ad-img-gap {margin:20px 0;font-size:18px;}
.footer-info address p {font-size:14px;padding-top:10px;}
.footer-links p {font-size:11px;}
.footer-content-2 p{font-size:11px;}
.footer-info h5 {font-size:18px;}
.footer-info a {font-size:14px;}
.footer-info{margin-top:10px;}
.footer-info h5 {font-size:18px;padding-right:65px; }
.section-header {font-size:22px;line-height:24px;}
.address-wrapper{margin-top:30px;}
.line-post h2 {font-size:24px;color:#000;}
.box-width {width:43%;}
.fb-plugin-share iframe{margin:0;}
.contact-area iframe{width:100%;}
.news-area-2 {border-left:none;}
}

/* SM Small Device :550px. */
@media only screen and (min-width:576px) and (max-width:767px) {
.footer-content-2 p{font-size:14px;}
}
@media only screen and (max-device-width: 480px) {
   .donate-box iframe{
      width:240px !important;
    }
     .youtube-section .section-header h2:after {
        position: absolute;
        top: 51%;
        overflow: hidden;
        width: 30%;
        height: 1px;
        content: '\a0';
        background-color: #000;
        margin-left: 74px;
    }
}