.bg-green{ background: #35a936; } .bg-purple{ background: #814997; } .bg-orange{ background: #f28b02; } .bg-blue{ background: #0d8fd1; } .bg-pink{ background: #da2b82; } .bg-grey{ background: #cccccc; } .bg-white{ background: #ffffff; } .bg-black{ background: #333333; } .bg-red{ background: #ff0042; }
a.cl-green,.cl-green{ color: #35a936 !important; } a.cl-purple,.cl-purple{ color: #814997 !important; } a.cl-orange,.cl-orange{ color: #f28b02 !important; } a.cl-blue,.cl-blue{ color: #0d8fd1 !important; } a.cl-pink,.cl-pink{ color: #da2b82 !important; }
.btn{ border-radius: 30px; } .relative{ position: relative; } .only-mobile{ display: none !important; } .is_mobile{ display: none !important; } .is_desktop{ display: block !important; }
.btn.btn-primary{ color: #fff; background-color: #1a71b2; border-color: transparent; font-size: 20px; padding: 8px 20px; border-radius: 0; margin: 40px 0; box-shadow: 4px 4px 0 rgba(0,0,0,0.1); }

body{ color: #000000; background: #fafafa; font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif; }
a{ text-decoration: none; margin: 0; padding:0; color: #222222; }
a:hover{ color: #f28b02; text-decoration: none; }
ul.gabung-genpi{ min-width: 250px; z-index: 1001 }
a.LogoGenPI{ width: 200px; height: 62px; overflow: hidden; float: left; }
.logo-login{ position: relative; display: block; background: #ffffff; }
.logo-login .logo{ float: left; margin: 5px 0; }
.logo-login .search{ float: right; vertical-align: middle; margin: 20px 0; }
.logo-login .login{ float: right; vertical-align: middle; margin: 20px 0; }
.logo-login .login a:hover{ color: #814997; }
.navbar-nav>li>a{ padding-left: 8px; padding-right: 8px; }
.navbar-nav>li:hover{ background: #000; }
.owl-foto .owl-nav{ color: #ffffff; font-size: 40px; }
.owl-foto .owl-nav .owl-prev, .loop .owl-nav .owl-next{ margin: 0; background: inherit; }
.owl-foto .owl-nav .owl-next{ position: absolute; right: 0; top: 40%; background: rgba(0,0,0,0.8) !important; outline: none; margin: 0; }
.owl-foto .owl-nav .owl-prev{ position: absolute; left: 0; top: 40%; background: rgba(0,0,0,0.8) !important; outline: none; margin: 0; }
.owl-foto .owl-nav .owl-prev span, .owl-foto .owl-nav .owl-next span{ padding: 15px; }
.owl-foto .owl-nav .owl-prev:hover, .owl-foto .owl-nav .owl-next:hover{ background: inherit; color: #ff0042; border-radius: 0; }
form.form-search{ border: 1px solid #ccc; margin-right: 15px; }
form.form-search input.input-search{ border: none; border-radius: 0; padding: 6px 12px; font-weight: 400; outline: none; min-width: 250px; text-align: left; vertical-align: middle; white-space: nowrap; }
form.form-search button.button-search{ background: none; border: none; padding: 6px 12px; }
ul#gStory{ text-align: center; vertical-align: middle; font-size: 12px; }
ul#gStory li img{ border-radius: 50%; }
.story-user{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.batas{ height: 3px; overflow: hidden; }
.batas > div{ width: 20%; height: 3px; display: inline-block; margin-right: -4px; margin-bottom: 13px; }
.heading-border{ position: relative; border-bottom: 1px solid #ddd; margin-bottom: 15px; }
.heading-border:before{ position: absolute; bottom: -1px; width: 50px; height: 4px; background-color: inherit; content: ''; }
.heading-border:after{ position: absolute; bottom: -1px; width: 15px; height: 4px; background-color: inherit; content: ''; left: 53px; }
.overlay{ position: absolute; top:0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4) }
.editor-post{ position: absolute; bottom: 0; left: 0; right: 0; color: #ffffff; }
.editor-post h1{ position: relative; padding: 0 10px; color: #ffffff; font-size: 24px; }
.editor-post .post-date{ color: #CCCCCC; padding: 10px; font-size: 12px; float: left; }
.editor-post .readmore-button{ float: right; background: #ff0042; border-radius: 4px 0 0 0; color: #ffffff; padding: 7px 15px; font-size: 18px;  -webkit-transition: all 0.5s ease;  -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
.editor-post .readmore-button:hover{ padding-left:30px; }
.content-left{  float: left; margin: 15px 0; padding: 0; position: relative; }
.content-right{ float: right; margin: 15px 0; padding: 0; position: relative; }
.content-right h3 a{ font-size:18px; }
.content-center{ float: none; margin: 0; padding: 0; position: relative; }
.content-banner{ padding: 15px 0; text-align: center; }
.artikel-list .post-vlist a{ position: relative; }
.artikel-list .post-vlist{ display: table; width: 100%; margin: 10px 0 20px; }
.artikel-list .post-vlist .post{ display: table-cell; padding-left: 30px; vertical-align: middle; }
.artikel-list .post-vlist a img{ display: table-cell; vertical-align: middle; }
.artikel-list .post-vlist .post h1{ margin: 0; padding: 0 0 15px; font-size: 28px; }
.artikel-list .post-vlist .post .post-date{ font-size: 13px; color: #595959; padding-bottom: 10px; }
.artikel-list .post-vlist .post p{ padding-bottom: 10px; color: #585858; }
.artikel-list .post-vlist .post .readmore-button{ background: #0a8fd1; padding: 10px; border-radius: 5px; color: #fff; font-size: 12px; }
.widget ul.fa-ul li{ padding-left: 0; }
.widget ul.fa-ul li h1{ font-size: 18px; }
.widget ul.fa-ul li a{ color: #444; }
.widget ul.fa-ul li a span.fa-li{ color: #35a936; }
.owl-kuliner h1{ font-size: 18px; color: #111111; }
.owl-kuliner p{ font-size: 14px; color: #585858; }
.block-image{ display: block; position: relative; }
.block-image h1{ background: #ffffff; font-size: 16px; position: absolute; top: 80px; padding:10px 15px; margin-bottom: 5px; color: #222; }
ul.list-news, ul.terpopuler{ list-style: none; margin: 0; padding: 0; }
ul.list-news li:first-child{ padding-bottom: 0; }
ul.list-news li:first-child img{ display: block; width: 100%; float: none; }
ul.list-news li:first-child h1{ margin: 10px 0 0; font-size: 18px; }
ul.list-news li h1{ font-size: 16px; margin: 0;  }
ul.list-news li img{ width: 40%; float: left; margin-right: 10px;  }
ul.list-news li{ width: 100%; padding:10px 0; clear: both; }
ul.list-news li .post-date{ color: #999999; padding: 10px 0; font-size: 12px; }
ul.list-news li:last-child{ padding-bottom: 0; }
ol.terpopuler { list-style: none; counter-reset: item; margin: 0; padding: 0; }
ol.terpopuler li{ padding:0; width: 100%; clear: both; counter-increment: item; margin-bottom: 5px; font-size: 16px; font-weight: 700; min-height: 70px; }

ol.terpopuler li.pop_0{ background:rgba(39,139,54,0.1); }
ol.terpopuler li.pop_1{ background:rgba(100,47,123,0.1); }
ol.terpopuler li.pop_2{ background:rgba(229,110,33,0.1); }
ol.terpopuler li.pop_3{ background:rgba(26,113,178,0.1); }
ol.terpopuler li.pop_4{ background:rgba(199,28,100,0.1); }

ol.terpopuler li.pop_0:before{ margin-right: 10px; content: counter(item); background:#278b45; color: #ffffff; width: 1.2em; text-align: center; float: left; font-size: 38px; line-height: 38px; padding: 15px 0; }
ol.terpopuler li.pop_1:before{ margin-right: 10px; content: counter(item); background:#642f7b; color: #ffffff; width: 1.2em; text-align: center; float: left; font-size: 38px; line-height: 38px; padding: 15px 0; }
ol.terpopuler li.pop_2:before{ margin-right: 10px; content: counter(item); background:#e56e22; color: #ffffff; width: 1.2em; text-align: center; float: left; font-size: 38px; line-height: 38px; padding: 15px 0; }
ol.terpopuler li.pop_3:before{ margin-right: 10px; content: counter(item); background:#1a71b2; color: #ffffff; width: 1.2em; text-align: center; float: left; font-size: 38px; line-height: 38px; padding: 15px 0; }
ol.terpopuler li.pop_4:before{ margin-right: 10px; content: counter(item); background:#c71c64; color: #ffffff; width: 1.2em; text-align: center; float: left; font-size: 38px; line-height: 38px; padding: 15px 0; }

ol.terpopuler li .post-date{ padding:0; font-size: 12px; color: #999999; font-weight: 300; }
.block-full-content .post-date{ color: #999999; padding: 10px 0; font-size: 12px; }
.block-full-content p{ padding-bottom: 10px; color: #585858; }
.big-full-post h1{ font-size: 22px; }
.small-full-post h1{ font-size: 15px; margin: 10px 0 0; height: 50px; overflow: hidden; }
.small-full-post .relative a, .big-full-post .relative a{ position: relative; }
.headline{ position: relative; margin: 15px 0; padding: 0; }
#bigHeadline .nav a small { display: block; }
#bigHeadline { background: #fff; border: #eee 1px solid; }
#bigHeadline .item h3{ padding: 0 15px; }
#bigHeadline .item p{ height: 42px; overflow: hidden;  padding: 0 15px; }
#bigHeadline .small-headline{ margin-bottom: 4px; }
#bigHeadline .small-headline .img-head{ float: left; width: 55%; }
#bigHeadline .small-headline .title-head{ float: left; width: 40%; }
#bigHeadline .small-headline .title-head h3{ height: inherit; overflow: inherit; font-size: 30px; font-weight: 800; margin-top: 0;  }
#bigHeadline .small-headline .title-head p{ height: inherit; overflow: inherit; }
#bigHeadline ul.list-headline{ list-style: none; margin: 0; padding: 0; }
#bigHeadline ul.list-headline li{ width: 24.68%; display: inline-block; vertical-align: top;  }
#bigHeadline ul.list-headline li .title{ font-size: 14px; font-weight: bold; padding: 4px 8px; }
#bigHeadline .carousel-control{ opacity: 0; transition: 0.3s; width: inherit; }
.carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev{ margin-left: 10px; }
.carousel-control .glyphicon-chevron-right, .carousel-control .icon-next{ margin-right: 10px; }
#bigHeadline:hover .carousel-control{ opacity: 1; }
#bigHeadline .rubrik{ padding: 4px 15px; color: #db2b82; }

#bigHeadline .carousel-indicators{ position: relative; bottom: inherit; left: inherit; margin: inherit; width: inherit; font-size: 12px; }
#bigHeadline .carousel-indicators li{ width: inherit; height: inherit; text-indent: inherit; border-radius: 5px; margin: 6px 4px; padding: 10px 40px; }
#bigHeadline .carousel-indicators li.active { width: inherit; height: inherit; font-weight: bold; }
#bigHeadline .carousel-indicators>li[data-slide-to="0"].active{ border-color: #35a936; color: #35a936; }
#bigHeadline .carousel-indicators>li[data-slide-to="1"].active{ border-color: #814997; color: #814997; }
#bigHeadline .carousel-indicators>li[data-slide-to="2"].active{ border-color: #f28b02; color: #f28b02; }
#bigHeadline .carousel-indicators>li[data-slide-to="3"].active{ border-color: #0d8fd1; color: #0d8fd1; }
#bigHeadline .carousel-indicators>li[data-slide-to="4"].active{ border-color: #0d8fd1; color: #0d8fd1; }

.m-bt-15{ margin-bottom: 15px; }
.countdown{ background:#fff url('../img/asian-para-games-2018.png') left top no-repeat; background-size: 100%; height: 80px; }
.countdown p#demo{ padding-left:85px; padding-top: 40px; font-size: 14px; font-family: 'Lato', 'Helvetica Neue', Arial, sans-serif; }
.countdown p#demo .dhms { margin: 6px 0;}
.countdown p#demo .dhms span{ font-family: 'Oswald', 'Helvetica Neue', Arial, sans-serif; font-size: 22px; }
.sponsored ul.list-news li:first-child{ padding-top: 0; }
.sponsored ul.list-news li:first-child img{ display: block; width: 100%; float: none; }
.sponsored ul.list-news li:first-child h1{ margin:0; font-size: 18px; }
.sponsored ul.list-news li h1{ font-size: 16px; margin: 0;  }
.sponsored ul.list-news li img{ width: 40%; float: left; margin-right: 10px;  }
.sponsored ul.list-news li{ width: 100%; padding:10px 10px 0 10px; clear: both; }
.sponsored ul.list-news li .post-date{ color: #999999; padding: 10px 0; font-size: 12px; }
.sponsored ul.list-news li:last-child{ padding-bottom: 0; }
.ramadhan ul.list-news li h1{ font-size: 14px; margin: 0; font-weight: 700;line-height: 18px;  }
.ramadhan ul.list-news li img{ width: 40%; float: left; margin-right: 10px;  }
.ramadhan ul.list-news li{ width: 100%; padding:10px 0px 0 0px; clear: both; }
.ramadhan ul.list-news li .post-date{ color: #999999; padding: 10px 0; font-size: 12px; }
.ramadhan ul.list-news li:last-child{ padding-bottom: 0; }
.owl-video .owl-nav{ color: #ffffff; font-size: 40px; }
.owl-video .owl-nav .owl-prev, .loop .owl-nav .owl-next{ margin: 0; background: inherit; }
.owl-video .owl-nav .owl-next{ position: absolute; right: 0; top: 40%; background: rgba(0,0,0,0.8) !important; outline: none; margin: 0; }
.owl-video .owl-nav .owl-prev{ position: absolute; left: 0; top: 40%; background: rgba(0,0,0,0.8) !important; outline: none; margin: 0; }
.owl-video .owl-nav .owl-prev span, .owl-video .owl-nav .owl-next span{ padding: 15px; }
.owl-video .owl-nav .owl-prev:hover, .owl-video .owl-nav .owl-next:hover{ background: inherit; color: #ff0042; border-radius: 0; }
footer{ border-top: 1px solid #dddddd; padding: 10px 0; font-size: 12px; color: #444444; padding-bottom: 75px; }
.artikel-video{ position: absolute; bottom: 10px; left: 10px; z-index: 1; font-size: 28px; line-height: 28px; color: #ffffff; border: 3px solid #ffffff; padding: 10px 10px 10px 15px; border-radius: 50%; text-shadow: 0px 0px 10px #080808; box-shadow: 0px 0px 10px #080808; }

.signup-signin{ padding: 30px 0; position: relative; }
.kanal h1 { font-weight: 700; text-align: center; padding: 15px 0; }
.signup-signin sup{ color: #ff0042; }
.signup-signin label{ font-weight: normal; margin: 15px 0 10px; display: block; color: #797986; }
.signup-signin .btn.btn-info{ min-width: 150px; }
.signup-signin .forgot a{ color: #ff0042; margin: 10px 0; display: block; }
.signup-signin #register-form label{ margin: 0; display: block; color: #000; font-weight: 700; }
.signup-signin #register-form label span{ color: red; }
.signup-signin #register-form .form-control{ height: 40px; border-radius: 0; }
.signup-signin #register-form input[type=checkbox]{ float: left; margin-right: 10px; }

.modal-header h3{ margin: 0; padding: 0; }
.modal-header .close{ margin: 0; top: 0; right: 15px; font-size: 48px; position: absolute; }

.social_icon_box.fb{ background-color: #516eab; }
.social_icon_box.tw { background-color: #29c5f6; }
.social_icon_box.ig{ background-image: linear-gradient(45deg, #fac53b, #d32ba3); }
.social_icon_box.yt { background-color: #d71f25; }
.social_icon_box { position: relative;  cursor: pointer; display: block; padding: 10px 24px; }
.social_icon_box .fab{ color: #ffffff; font-size: 24px;  }
.social-share{ list-style: none; margin: 0; padding: 0; }
ul.social-share li{ display: inline-block; margin-bottom: 15px; }

.form-box { padding-top: 40px; }
.f1 { padding: 25px; background: #fff; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
.f1 h3 { margin-top: 0; margin-bottom: 5px; text-transform: uppercase; }
.f1-steps { overflow: hidden; position: relative; margin-top: 20px; }
.f1-progress { position: absolute; top: 24px; left: 0; width: 100%; height: 1px; background: #ddd; }
.f1-progress-line { position: absolute; top: 0; left: 0; height: 1px; background: #f35b3f; }
.f1-step { position: relative; float: left; width: 25%; padding: 0 5px; }
.f1-step-icon { display: inline-block; width: 40px; height: 40px; margin-top: 4px; background: #ddd; font-size: 16px; color: #fff; line-height: 40px; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; text-align: center; margin-left: 40%; }
.f1-step.activated .f1-step-icon { background: #fff; border: 1px solid #f35b3f; color: #f35b3f; line-height: 38px; }
.f1-step.active .f1-step-icon { width: 48px; height: 48px; margin-top: 0; background: #f35b3f; font-size: 22px; line-height: 48px; }
.f1-step p { color: #ccc; margin: 10px 0; }
.f1-step.activated p { color: #f35b3f; }
.f1-step.active p { color: #f35b3f; }
.f1 fieldset { display: none; text-align: left; }
.f1-buttons { text-align: right; }
.f1 .input-error { border-color: #f35b3f; }
.f1 .form-check{ padding: 15px 0; position: relative; }
.f1 input.form-check-input{ position: absolute; margin-top: .25rem; margin-left: 0; }
.f1 label.form-check-label{ display: inline-block; padding-left: 2.25rem; margin: 0; }
.upload-foto-button{ position: relative; background-color: #259dab; color: #fff; margin: 0; padding: 10px 0; text-align: center;  }
.upload-foto-button:before { color: #fff; content: "Upload Photo"; }
.upload-foto-button input[type=file]{ bottom: 0; cursor: pointer; height: 100%; left: 0; opacity: 0; position: absolute; right: 0; top: 0; width: 100%; }

article.content{ position: relative; }
.breadcrumb{ padding-left: 0; background: transparent; font-size: 13px; border-bottom: 1px dotted #ddd; }
.breadcrumb a { color: #f28b02; }
article.content .caption{ padding: 10px 0; text-align: center; color: #999999; font-weight: 300; }
article.content .post-date-editor-rate{ font-size: 13px; padding-bottom: 10px; }
article.content .post-date-editor-rate .date .fa, article.content .post-date-editor-rate .editor .fa{ color: #f28b02; font-size: 14px; vertical-align: top; }
article.content .post-date-editor-rate .date{ color: #595959; }
article.content .post-date-editor-rate .editor{ color: #595959; }
article.content .post-date-editor-rate .rate .fa{ color: #f28b02; font-size: 14px; vertical-align: top; }
article.content .post-thumb iframe{ width: 100%; min-height: 460px; }
article.content .post-thumb img{ width: 100%; height: auto; }
article.content .post-text{ padding: 10px 0; }
article.content .post-text p{ font-size: 16px; }
article.content .post-text p img{ max-width: 100%; width: 100%; height: auto; }
article.content .post-text p a{ color:#f28b02; }
article.content .post-text p span video{ width:100%; height:auto; }
article.content .post-text p iframe{ min-width: 100%; min-height: 460px; position: relative; }
article.content .icon-repub{ float: left; width: 40px; height: 40px; position: relative; margin-right: 10px; }
article.content .text-repub { float: left; position: relative; }
article.content .tags{ margin: 40px 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 20px 0 15px; }
article.content .tags ul { margin: 0; padding: 0; list-style: none; }
article.content .tags ul li{ display: inline-block; margin: 0 5px 5px 0; line-height: 1; }
article.content .tags ul li a { color: #222; background-color: transparent; padding: 6px 12px; white-space: nowrap; display: inline-block; font-size: 13px; border-radius: 25px; border: 1px solid #ddd;}
article.content h1{ font-weight: 700; }
article.content h4{ margin-bottom: 0; padding-bottom: 0; font-weight: 500; }
article.content h6{ font-style: italic; color: #333; font-size: 16px; font-weight: 400; padding-bottom: 12px; }
.detail-album{ padding-top: 15px; padding-bottom: 15px; }
.album-foto{ margin-left: -5px; margin-right: -5px; }
.album-foto .list-album-foto{ padding-left: 5px; padding-right: 5px; margin-bottom: 10px; }
.album-foto .list-album-foto h4{ height: 45px; overflow: hidden; font-size: 14px; }
.album-foto .list-album-foto.besar h3{ color:#ffffff; font-weight: 400; height:70px; overflow: hidden; font-size: 16px; position: absolute; bottom: 0; margin: 0; padding: 10px; background: rgba(0, 0, 0, 0.7);  background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.7)), color-stop(100%, transparent));  background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.7)), to(transparent));  background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000',GradientType=0 ); }
.album-foto .list-album-foto.kecil h3{ height: 65px; color: #ffffff; overflow: hidden; font-size: 12px; position: absolute; bottom: 0; margin: 0; padding: 10px; background: rgba(0, 0, 0, 0.7);  background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.7)), color-stop(100%, transparent));  background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.7)), to(transparent));  background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, transparent 100%);  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000',GradientType=0 ); }
.album-foto .list-album-foto .mt-5{ margin-top: 10px; }
.rate-artikel{ float: right; position: relative; }
.box{ background: #ffffff; padding:10px 15px; border-radius: 0; border: 1px solid #cdcdcd; position: relative; margin-bottom: 15px; }
.register-login{ margin: 15px 0; }
.register-login a.register{ background: #CCCCCC; display: block; padding: 10px; border: 1px solid #999; font-size: 18px; text-align: center; }
.register-login a.register.aktip{ background: #ffffff; border-bottom: none; }

.slider-container{ position: relative; margin: 0; padding: 20px 20px 0 20px; background: #fafafa; border:1px solid #ddd; }
.slider-container h3{ margin: 0; padding: 10px 0;  }
.slider-container p { border-bottom: 1px dotted #ddd; padding: 0 0 10px; margin: 0; color: #555 }
.thumbnail-slider-container{ position: relative; margin: 0; padding: 20px; background: #fafafa; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; }
.thumbnail-slider-container .owl-item{ cursor: pointer; }
.thumbnail-slider-container .owl-item.active.center{ border: 3px solid #f28b02; }
.thumbnail-slider-container .owl-nav{ color: #ffffff; font-size: 28px; }
.thumbnail-slider-container .owl-nav .owl-prev, .loop .owl-nav .owl-next{ margin: 0; background: inherit; }
.thumbnail-slider-container .owl-nav .owl-next{ position: absolute; right: 0; top: 20%; background: rgba(0,0,0,0.8) !important; outline: none; margin: 0; }
.thumbnail-slider-container .owl-nav .owl-prev{ position: absolute; left: 0; top: 20%; background: rgba(0,0,0,0.8) !important; outline: none; margin: 0; }
.thumbnail-slider-container .owl-nav .owl-prev span, .thumbnail-slider-container .owl-nav .owl-next span{ padding: 10px; }
.thumbnail-slider-container .owl-nav .owl-prev:hover, .thumbnail-slider-container .owl-nav .owl-next:hover{ background: inherit; color: #ff0042; border-radius: 0; }

.vod-video { position: relative; margin-bottom: 10px; }
.vod-video .overlay{ position: absolute; top:0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.5); color: #ffffff; vertical-align: middle; overflow: hidden; }
.vod-video .overlay.small{ height: 50%; background: rgba(0, 0, 0, 1); background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, transparent 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 1)), color-stop(100%, transparent));  background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, transparent 100%);  background: -o-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, transparent 100%);  background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, transparent 100%);  background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 1)), to(transparent));  background: linear-gradient(to top, rgba(0, 0, 0, 1) 0%, transparent 100%);  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000',GradientType=0 ); top: inherit; }
.vod-video .overlay a.text{ text-align: center; font-weight: 400; position: absolute; bottom: 13%; width: 100%; font-size: 42px; color: #ffffff; }
.vod-video .overlay h2 { font-size: 16px; height: 40px; overflow: hidden; width: 100%; margin: 0 auto; font-weight: 400; }

.video .list-video{ position: relative; margin-bottom: 30px; padding: 0; }
.video .list-video a{ display: block; }
.video .list-video .text{ position: absolute; top:0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.5); color: #ffffff; vertical-align: middle; overflow: hidden; }
.video .list-video .text h1{ position: absolute; bottom: 0; padding: 20px 55px 20px 10px; font-size: 16px; width: 100%; margin: 0 auto; font-weight: 400; transition: all ease 0.3s; }
.video .list-video .text i { position: absolute; z-index: 3; bottom: 10px; right: 10px; padding: 10px 12px; font-size: 20px; background: rgba(0, 0, 0, 0.5); color: #FFFFFF; border-radius: 50%; }
.video .list-video a:hover .text h1{ background: #f28b02; }

.video-detail{ position: relative; margin: 0; padding: 20px 20px 0 20px; background: #fafafa; border: 1px solid #ddd; }
.video-detail h3{ margin: 0; padding: 10px 0;  }
.video-detail p {  padding: 0 0 10px; margin: 0; color: #555 }

.streaming { position: relative; padding-bottom: 56.25%; padding-top: 10px; height: 0; }
.streaming iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

label.error { color: #ff0000 !important; font-weight: 400 !important;}

ul.forum{ padding: 10px 15px; display: block;}
ul.forum span.fa-li{ font-size: 34px; color: #35a936; }
ul.forum h5{ font-size: 18px; }
.date-comment{ float: none; display: block; color: #ccc; border-bottom: 1px solid #dddddd; height: 24px; font-size: 12px; font-weight: 300; }
.date-comment .date{ float: left; }
.date-comment .comment{ float: right; }

.date-responden{ border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; padding: 10px 0; color: #999999; font-size: 12px; margin-bottom: 10px; }
.comment-private{ border-top: 1px solid #ddd; margin-top: 10px; margin-bottom: 10px; }
.comment { margin-top: 15px; border-bottom: 1px solid #dddddd; min-height: 120px; position: relative; padding-bottom: 10px; }
.comment .foto{ float: left; margin-right: 15px; }
.comment .user .name{ font-weight: 700; font-size: 16px; margin-bottom: 0; }
.comment .user .location{ font-size: 14px; font-weight: 400; }
.comment .user .date{ color: #999; font-size: 12px; }
.box-comment{ margin-top: 15px; }
.box-comment a{ color:#f28b02; }
.box-comment textarea{ width: 100%; outline: none; border: 1px solid #dddddd; }
.likeus{ border: 1px solid #dddddd; position: absolute; bottom: 0; right: 0; font-size: 12px; padding: 5px 15px; }
.likeus.active { background: #999; color: #fff; cursor: not-allowed}

article.content .post-text .reporter-redaktur{ padding: 15px 0 0; color: #444; }
article.content .post-text .reporter-redaktur p{ font-size: 14px; }

#back-to-top { position: fixed; bottom: 15px; right: 15px; z-index: 9999; font-size: 40px; text-align: center; line-height: 30px; background: #fff; border-radius: 50%; cursor: pointer; border: 0; text-decoration: none; transition: opacity 0.2s ease-out; opacity: 0; color: #da2b82; }
#back-to-top.show { opacity: 0.85; }

.border-box-nt .block-image h1{ border-right: 1px solid #ddd; border-bottom:  1px solid #ddd; border-left:  1px solid #ddd; }
a.close-modal{ position: absolute; top: 0; right: -25px; font-size: 30px; background: #fff; padding: 0 7px; font-weight: 700; }

.mts .by{ font-size: 14px; font-style: italic; font-weight: 400;  margin: 15px 0 10px; padding: 0 10px; color: #ffffff; }
.mts .name{ font-size: 18px; font-weight: 500; line-height: 24px; padding: 0 10px; color: #ffffff; }
.mts .jab{ font-size: 16px; font-weight: 400; color: #ffffff; padding: 0 10px; }

.sponsored-content1{ margin: 0; padding: 10px; background: #ffffff; }
.sponsored-content1 h3{ margin: 0; padding-bottom:10px; }
.sponsored-content1 .sponsored ul.list-news li:first-child h1{ padding-top: 5px; }
.sponsored-content1 .sponsored ul.list-news li{ padding-left: 0; padding-right: 0; }
.sponsored-content1 .widget.sponsored.bg-white ul.list-news:after{ clear: both; display: block; content: ''; }

.dropdown-menu>li>a{ padding-top: 10px; padding-bottom: 10px; }

.adsnya-footerfix{ display: none; }

video{ width: 100%; height: auto; }

.border-middle{width:100%;text-align:center;border-bottom:1px solid #ddd;line-height:.1em;margin:10px 0 20px}.border-middle span{background:#fff;padding:0 10px;color:#c1c1c1}
.bottom-sky{ position:fixed; bottom: 0; left: 0; right: 0; z-index: 10; }

/* Widget Horor */
.widget-horor{ width: 100%; position:relative; margin: 0; padding: 0; }
.widget-horor h3{ font-size: 18px; font-family: "Roboto", Helvetica Neue, Helvetica, Arial, sans-serif; margin: 10px 0 5px; letter-spacing: -0.5px; color: #454545; font-weight: 400; }
.widget-horor h3 span{ color:#f28b02; text-transform: uppercase; font-weight: 700; letter-spacing: -0.2px; }
.widget-horor h1, .widget-horor h2{ font-size: 14px; font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-weight: 600; margin: 8px 0; line-height: 16px; }
.widget-horor p{ font-size: 12px; line-height: 14px; margin:0; }
.widget-horor ul { margin: 0; padding: 0; position: relative; list-style: none; }

/* Cross Content*/
.cc{ padding-top: 5px; padding-bottom: 5px; background: #ffffff; position: relative; }
.cc .logo-cc{ margin: 0; padding:5px; background: #020a31; border-bottom:1px solid #fad940; position: relative; height: 40px; }
.cc .logo-cc img{ position: absolute; bottom:-6px; z-index: 1; }
.cc .sponsored ul.list-news li:first-child h2{ font-size: 16px; background: #fff; width: 95%; margin-top: -20px; display: block; z-index: 1;  position: relative; margin-left: auto; margin-right: auto; padding: 5px 10px; }
.cc .sponsored ul.list-news li h2{ font-size: 14px; line-height: 18px; padding: 0; margin: 0; }
.cc .sponsored ul.list-news li{ padding-left: 0; padding-right: 0; }
.cc .widget.sponsored.bg-white ul.list-news:after{ clear: both; display: block; content: ''; }

/* Event */
.c-event{ font-size: 16px; }
.c-event h1{ color: #444444; }
.c-event h2{ font-size: 18px; text-transform: uppercase; background: #da2b82; color: #fff; padding: 10px; display: inline-block; }
.c-event h3{ font-size: 18px; }
.c-event p{ border-bottom: none; }
.c-event a{ color: #da2b82; font-weight: bold; font-size: 16px; }
.box-event{ padding:10px 20px; background: #fafafa; margin-bottom: 20px; text-align: center; }

@media (max-width: 480px){
    #jpnn_iframe {
        max-width: 100%;
        height: 500px;
    }
}

.ramadan{ background: transparent url("../img/bg-imsakiyah.jpg") center center no-repeat; }
.imsakiyah{ padding: 10px 30px; float: left; }
.imsakiyah .title{ float: left; margin-top: 3px; padding-right: 6px; }
.imsakiyah table{ float: left; width: auto; }
.imsakiyah table td{ padding: 4px 10px; text-align: center; border: 1px solid #ccc; font-size: 16px; font-weight: 700; }
.imsakiyah table thead td{ font-weight: 400; font-size: 14px; background: rgba(255,255,255,0.6); }

.badge-success { color: #fff; background-color: #28a745; }
.badge-warning { color: #212529; background-color: #ffc107; }
.badge-danger { color: #fff; background-color: #dc3545; }

.sponsor-content-horizontal { position: relative; background: #f2f2f2; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; margin-top: 10px; }
.sponsor-content-horizontal h3 { margin: 0; padding: 10px 0; font-size: 18px; }
.sponsor-content-horizontal.cc h3 { margin: 0; padding: 6px 0 0; }
.sponsor-content-horizontal h1 { padding: 10px 0; margin: 0; font-size: 14px; font-weight: 400; }
.sponsor-content-horizontal h2 { padding: 0; margin: 0; font-size: 14px; font-weight: 400; }
.sponsor-content-horizontal ul { list-style: none; margin: 0; padding: 0; white-space: nowrap; overflow-x: scroll; }
.sponsor-content-horizontal ul li { display: inline-block; vertical-align: top; position: relative; width: 200px; margin-right: 8px; }
.sponsor-content-horizontal ul li h1 { white-space: normal; margin-bottom: 15px; line-height: 18px; }
.sponsor-content-horizontal ul li h2 { white-space: normal; margin-bottom: 15px; }
.btn-show { padding: 6px 12px;white-space: nowrap;display: inline-block;font-size: 13px;border-radius: 25px;border: 1px solid #ddd;color: #fff;background: #02d0c4;}
.download_apps{font-family:Lato,Arial,'Helvetica Neue',Helvetica,sans-serif;font-weight:600;font-size:14px;padding:5px 0;background:#29cacb}.close-x{font-size:16px;float:left;width:24px;margin-top:10px}.icon_apps{width:45px;height:45px;float:left}.content_apps{float:left;line-height:14px}.content_apps .desc_1{font-size:12px;font-weight:400}.content_apps .desc_2{font-size:10px;font-weight:400;color:#136569}.btn_download{float:right;padding:8px;font-size:18px;font-family:Oswald,Arial,'Helvetica Neue',Helvetica,sans-serif}

/*share button */
.at-resp-share-element .at-share-btn .at-icon-wrapper{float:left}a .at-icon-wrapper{cursor:pointer}.at-icon-wrapper{display:inline-block;overflow:hidden;padding:5px;height:42px;width:42px}.at4-share-container{display:table-cell;vertical-align:middle;padding-left:20px}.at-resp-share-element{position:relative;padding:0;margin:0;font-size:0;line-height:0}.at-share-btn{padding:10px}.at-share-btn{display:inline-block;margin:0 2px 5px;padding:0;overflow:hidden;line-height:0;text-decoration:none;text-transform:none;color:#fff;cursor:pointer;transition:all .2s ease-in-out;border:0;font-family:helvetica neue,helvetica,arial,sans-serif;background-color:transparent}