html {
scroll-behavior: smooth;
}
body{
}
/* Scrollbar */
#ntvblock::-webkit-scrollbar {
width: 8px; /* width of the entire scrollbar */
}
#ntvblock {
scrollbar-width: thin; /* "auto" or "thin" */
scrollbar-color: #152035 #ccc; /* scroll thumb and track */
}
#ntvblock::-webkit-scrollbar-track {
background: orange; /* color of the tracking area */
}
#ntvblock::-webkit-scrollbar-thumb {
background-color: blue; /* color of the scroll thumb */
border-radius: 20px; /* roundness of the scroll thumb */
border: 3px solid orange; /* creates padding around scroll thumb */
}
/* Scrollbar */
h1, h2, h3, h4, h5, h6 {
color: #152035;
}
/* testing sticky */
.container{
max-width: none !important;
width: 980px;
}
#menuwrap {
background: #fff;
position: relative;
margin: 0 auto 20px auto;
padding: 0;
}
#menu {
width:100%;
z-index: 99;
}
#menu.fixed {
position: fixed;
top: 0;
z-index: 99;
}
/* Back to top */
.back-to-top {
visibility: hidden;
background-color: #444;
width: 50px;
height: 50px;
text-align: center;
line-height: 48px;
position: fixed;
bottom: 65px;
right: 35px;
z-index: 1001;
cursor: pointer;
border-radius: 1px;
opacity: 0;
-webkit-transform: translateZ(0);
transition: all .6s
}
.back-to-top .fa {
font-size: 18px;
color: #fff;
vertical-align: middle;
}
.back-to-top:hover {
background-color: #fc4f3f;
opacity: 1
}
.back-to-top.show {
visibility: visible;
bottom: 35px;
opacity: 1;
}
/* testing sticky */
.underline{
position: relative;
}
.underline::before{
content: '';
position: absolute;
bottom: 0;
right: 0;
width: 0;
height: 2px;
background-color: #002171;
transition: width 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}
a:hover, a:hover h4{
color: #002171 !important;
transition: width .35s ease-in-out;
}
h1.h1_title{
font-size: 24px !important;
text-transform: capitalize !important;
font-weight: 800 !important;
line-height: 19px !important;
}
/* Paging */
.paging-area{
border: 1px solid #ccc;
border-radius: 8px;
padding: 20px 0 0 10px;
background: #efefef;
}
.pagination > li:first-child,.pagination > li:last-child { visibility: hidden; }
.pagination li{
margin-right: 10px;
}
.page-link{
background-color:#ddd;
border-radius: 50% !important;
}
@media (hover: hover) and (pointer: fine) {
.underline:hover::before{
left: 0;
right: auto;
width: 100%;
}
}
.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
}
ul {
list-style-type: none;
padding-left: 0 !important;
}
.head{
display: block;
height: 30px;
background-color: #002171 !important;
}
.head li a{
color:#FFF !important;
}
.poweredby{
color: #fff !important;
font-size: 9px !important;
float: left !important;
margin-top: 8px !important;
font-weight: 400 !important;
text-transform: uppercase;
}
#posts img{
width: 100%;
height: 110px;
border: 1px solid #ccc;
border-radius: 4px;
}
.logo img{
width:100%;
max-width: 100%;
}
.ke-03 {
width: 15px !important;
margin-right: 5px;
float: left;
}
.ke-04 {
padding: 0px 15px 0px 0px !important;
color: #fff !important;
font-size: 8px !important;
margin-top: 7px !important;
font-family: 'Poppins',sans-serif !important;
float: left !important;
line-height: 3px !important;
font-weight: 800 !important;
text-transform: uppercase;
}
.ke-202{
position: relative !important;
top: 3px !important;
}
.widget-bg {
font-size: 20px;
margin-left: 0 !important;
background-color: #12133d !important;
}
.ke-213 {
color: white !important;
margin-left: 15px;
padding-top: 5px !important;
padding-bottom: 5px !important;
}
.panel-body{
background: #fff;
border-radius: 0px !important;
overflow-y: scroll;
height: 250px;
padding-top: 15px !important;
padding-left: 15px !important;
padding-right: 15px !important;
padding-bottom: 0px !important;
scrollbar-color: #12133d #e0e0e0;
scrollbar-width: thin;
border: 1px solid #12133d !important;
}
::-webkit-scrollbar {
width: 12px;
}
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
.panel-body::-webkit-scrollbar {
width: 3px;
}
a {
text-decoration: none;
color: #152035 !important;
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
-ms-transition: all 0.3s ease-in-out 0s;
-o-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}
div.top-news{
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
}
.top-news .news-item{
display: inline-block;
width: 200px;
height: 220px;
margin: 10px;
overflow: hidden;
white-space: normal !important;
}
.top-news::-webkit-scrollbar, ul::-webkit-scrollbar{
width: 0px; /* remove scrollbar space */
background: transparent; /* optional: just make scrollbar invisible */
display: none; /* Safari and Chrome */
width: 0;
height: 0;
}
.caraousel-title{
font-family: "Montserrat";
font-weight: 800;
font-size: 25px;
line-height: 30px
}
.news-item__title{
font-family: "Montserrat";
font-size: 16px;
white-space: normal !important;
line-height: 1.2 !important;
max-height: 73px;
font-weight: 700;
}
p.subjudul, .tgl{
margin-bottom: 0!important;
}
.judulpanel{
font-family: "Montserrat";
display: relative;
text-transform: uppercase;
font-size: 16px;
line-height: 1.3;
max-height: 73px;
font-weight: 600;
border-bottom: 3px solid #002171;
display: inline-block;
}
#carouselExampleCaptions{
min-height: 450px;
}
.menu-item{
min-width: 10%;
}
/* SKELETON */
.skeleton {
position: relative;
}
.skeleton::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10;
background: linear-gradient(90deg, #eee, #f9f9f9, #eee);
background-size: 200%;
animation: skeleton 1s infinite reverse;
}
@keyframes skeleton {
0% {
background-position: -100% 0;
}
100% {
background-position: 100% 0;
}
}
/* SKELETON */
/* Bagian Search */
ul.livesearch li, ul.tag li{
display: inline-block;
}
ul.livesearch li a, .stroke a{
color: #12133d !important;
font-weight: 800!important;
padding: 10px 2px;
display: block;
font-size: 12px;
text-transform: uppercase;
-webkit-transition: all .2s ease-out 0s;
-moz-transition: all .2s ease-out 0s;
-ms-transition: all .2s ease-out 0s;
-o-transition: all .2s ease-out 0s;
transition: all .2s ease-out 0s;
font-family: 'Roboto',sans-serif;
line-height: 1;
cursor: pointer;
}
ul.livesearch li a.nav-link{
background-color: #cd1f43;
border-radius: 3px;
padding: 6px 10px;
margin: auto;
color: #fff !important;
}
ul.tag li {
margin-left: 5px;
padding-left: 1.3em;
}
ul.tag li:before {
content: "\f02c"; /* FontAwesome Unicode */
font-family: FontAwesome;
display: inline-block;
margin-left: -1.3em; /* same as padding-left set on li */
width: 1.3em; /* same as padding-left set on li */
}
.search-box{
z-index: 100;
display: none;
}
.search-box .search-form-icon {
position: absolute;
z-index: 2;
display: block;
width: 2.375rem;
height: 2.375rem;
line-height: 2.375rem;
text-align: center;
pointer-events: none;
color: #aaa;
opacity: 0.6;
}
.search-box input[type="text"]{
width: 100%;
padding-left: 2.375rem;
outline: none;
text-overflow: ellipsis;
white-space: nowrap;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
background-color: transparent;
border-radius: 5px;
display: inline-block;
font-size: 11px;
font-weight: 600;
margin: 0;
padding: 9px 0 9px 50px;
text-align: left;
width: 100%;
background: #fff;
border: 1px solid #dfe0e6;
box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.05);
}
/* bagian online TV */
.live-box{
text-align: center;
padding: 2px;
}
.live-box span{
display: block;
}
.live-box span::before{
content: "";
width: 10px;
height: 10px;
border-radius: 50px;
display: inline-block;
background: #fff;
margin-right: 5px;
animation: blink 1.5s ease-in-out infinite;
}
@keyframes blink {
0%, 100%{
opacity: 0;
}
40%, 70%{
opacity: 1;
}
}
.tgl{
font-size: 8px;
text-transform: uppercase;
-webkit-transition: all .2s ease-out 0s;
-moz-transition: all .2s ease-out 0s;
-ms-transition: all .2s ease-out 0s;
-o-transition: all .2s ease-out 0s;
transition: all .2s ease-out 0s;
}
/* Main menu */
.stroke {
margin: 0 auto;
background: #fff;
box-shadow: 0px 2px 0px #dedede;
}
.stroke ul{
margin-bottom: 0 !important;
}
/* By Dominik Biedebach @domobch */
.stroke ul li {
display: inline-block;
}
.stroke ul li a,
.stroke ul li a:after,
.stroke ul li a:before {
transition: all .5s;
}
.stroke ul li a:hover {
color: #555;
}
nav.stroke ul li a {
position: relative;
}
.stroke ul li a:after {
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 0%;
content: '.';
color: transparent;
background: #333;
height: 1px;
}
nav.stroke ul li a:hover:after {
width: 100%;
}
/* utk sub MPR */
.mprlink{
display: block;
position: relative;
}
.logo_mpr {
width: 15px!important;
position: relative!important;
top: -2px!important;
margin-right: 3px;
}
.logo_mpr_nav {
margin-right: 5px;
width: 15px!important;
position: relative!important;
top: -2px!important;
}
.new-badge {
position: absolute;
top: 2px;
right: -22px;
margin: auto;
font-size: 8px;
line-height: 13px;
padding: 1px 4px;
font-weight: 800;
text-align: center;
color: #fff;
background-color: #ff0505;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
border-radius: 3px;
font-size: 7px!important;
}
.margin-mpr {
margin-left: 20px!important;
}
.ukuran-mpr {
width: 15px!important;
margin-right: 5px!important;
position: relative!important;
top: -2px!important;
}
/* streaming */
.vs_display {
background: #e9ecef!important;
}
.vs_display h5{
color:#12133d;
weight:900;
text-align: center;
padding: 10px;
}
.logo_grid{
padding-left: 20px;
}
.tvlain{
width: 75%!important;
padding: 15px!important;
text-align: center!important;
margin: 0 auto;
}
.tvapp{
margin: 0 auto;
}
.font-weight-ultra {
font-weight: 900;
}
.ke-28{
font-size: 27px !important;
font-weight: 900 !important;
font-family: 'Roboto',sans-serif !important;
}
.ke-29{
font-size: 14px !important;
font-weight: 400 !important;
font-family: 'Source Sans Pro',sans-serif !important;
}
.ke-47 {
float: left !important;
width: 300px !important;
height: 250px !important;
text-align: center !important;
vertical-align: middle !important;
border-radius: 0px !important;
margin-right: 15px !important;
margin-bottom: 10px !important;
font-family: 'Nunito Sans',sans-serif !important;
font-weight: 800 !important;
color: #fff !important;
line-height: 250px !important;
}
.ke-209 {
width: 300px !important;
margin-right: 10px !important;
overflow: hidden;
}
.ke-132 {
left: 0 !important;
width: 250px !important;
}
.ke-139 {
padding-right: 10px !important;
padding-bottom: 5px !important;
padding-left: 0 !important;
float: left !important;
}
.entry-main-content p {
font-size: 16px;
font-family: "Source Sans Pro",sans-serif;
color: #000;
padding: 5px;
margin-bottom: 2px !important;
}
.entry-main-content p {
line-height: 23px;
}
.detail_konten_sort {
float: left;
width:100%;
}
.ke-141 {
background: rgba(255,255,255,0.8) !important;
box-shadow: 5px 5px 0 0 #dee2e6 !important;
}
.ke-143 {
padding-left: 0 !important;
padding-right: 0px !important;
width: 270px !important;
height: 80px !important;
margin-top: 20px !important;
float: left !important;
background: black !important;
box-shadow: 5px 5px 0 0 #dee2e6 !important;
overflow: hidden !important;
}
.ke-148 {
padding: 0!important;
background: #fff!important;
padding-left: 0!important;
padding-right: 0!important;
padding-top: 0!important;
padding-bottom: 0!important;
}
.ke-154 {
background: #f2f2f2 !important;
padding-right: 10px;
}
.ke-156 {
font-size: 17px !important;
text-transform: capitalize !important;
font-weight: 700 !important;
line-height: 19px !important;
}
.ke-157 {
font-size: 12px !important;
font-weight: 400 !important;
line-height: 14px !important;
color: #999 !important;
}
.ke-177 {
text-align: center;
}
.ke-197 {
text-transform: capitalize !important;
font-size: 30px !important;
font-weight: 800 !important;
font-family: 'Roboto',sans-serif !important;
}
.entry-meta.meta-1 span {
margin-right: 10px;
font-family: 'Poppins',sans-serif;
}
.color-grey {
color: #889097;
}
.pr-5 {
padding-right: 5px !important;
}
.mt-10 {
margin-top: 5px !important;
}
.entry-meta {
line-height: 1;
}
.font-x-small {
font-size: 11px;
}
span.has-dot {
position: relative;
padding-left: 6px;
}
/*streaming video */
/* utk sub MPR */
/* CSS Comment */
#post-comment img{
max-width: 50px;
}
#post-comment a{
color: #000!important;
}
/* CSS Comment */
/* Untuk Slick */
#posts .news-item{
position: relative;
display: inline-block;
padding: .3rem .5rem;
background-color: #f9f9f9;
border-radius: 4px;
margin: 0 5px;
}
#posts .post-kategori{
text-align: left;
}
#posts p, #posts a{
line-height: 16px;
}
/* Untuk Slick */
/* Main Menu */
.carousel-caption{
background-color: #000;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* IE 8 */
filter: alpha(opacity=50); /* IE 5-7 */
-moz-opacity: 0.5; /* Netscape */
-khtml-opacity: 0.5; /* Safari 1.x */
opacity: 0.5; /* Good browsers */
padding: 10px;
width: 100%;
left: 0 !important;
}
.carousel-caption h3{
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */
filter: alpha(opacity=100); /* IE 5-7 */
-moz-opacity: 1; /* Netscape */
-khtml-opacity: 1; /* Safari 1.x */
opacity: 1;
}
.carousel-indicators{
margin-left: 0 !important;
}
/** footer **/
ul.social_icon {
// float: right;
// padding-top: 8px;
}
ul.social_icon li {
display: inline-block;
margin: 0 4px;
}
ul.social_icon li a{
color: #fff !important;
background: #002171;
width: 30px;
height: 30px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
//border-radius: 105px;
font-size: 14px;
}
ul.social_icon li a:hover {
color: #fff;
}
footer{
background: #dee2e6;
border-top: 3px solid rgba(206,210,214,0.5);
padding-bottom: 50px !important;
padding-top: 30px !important;
}
.ke-94 {
float: left !important;
font-size: 15px !important;
margin-left: 0px !important;
font-weight: 700 !important;
margin-top: 0px !important;
width: 100% !important;
}
.color1 {
color: #12133d;
}
.ke-95 {
float: left !important;
font-size: 10px !important;
margin-left: 0 !important;
font-weight: 400 !important;
margin-bottom: 10px !important;
width: 100% !important;
}
li.cat-item a {
padding: 5px;
display: block;
font-size: 11px;
text-transform: uppercase;
-webkit-transition: all .2s ease-out 0s;
-moz-transition: all .2s ease-out 0s;
-ms-transition: all .2s ease-out 0s;
-o-transition: all .2s ease-out 0s;
transition: all .2s ease-out 0s;
font-family: 'Roboto',sans-serif;
line-height: 1;
}
.follow {
text-align: center;
}
.follow h3 {
color: #fff;
font-size: 31px;
font-weight: 500;
line-height: 30px;
padding-bottom: 25px;
}
.follow ul li {
display: inline-block;
margin: 0 4px;
}
.follow ul li a {
color: #252525;
background: #fff;
width: 45px;
height: 45px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
border-radius: 105px;
font-size: 27px;
}
.follow ul li a:hover {
color: #4ac9f0;
}
.copyright {
background: #4ac9f0;
padding: 15px 0px;
margin-top: 50px;
}
.copyright p {
color: #fff;
font-size: 18px;
line-height: 22px;
text-align: center;
}
.copyright a {
color: #fff;
}
.copyright a:hover {
color: #000;
}
.smalldisplay{
display: none !important;
}
.video p.playicon {
position: absolute;
display: block;
background: url(../images/video.png);
height: 100%;
width: 100%;
top: 50px;
left: 100px;
background-size: 50px 50px;
background-repeat: no-repeat;
}
.panel-judul{
border-bottom: 1px solid #ddd !important;
}
#terpopuler .nav-tabs .nav-item.show .nav-link, #terpopuler .nav-tabs .nav-link.active{
background: #152035;
color: #fff !important;
}
#terpopuler .nav-tabs .nav-link{
display: block;
padding: 6px 13px;
border-radius: 3px;
line-height: 1;
margin: 0 3px;
border: none;
}
#terpopuler .nav-tabs .nav-link.hover{
background: #152035;
color: #fff !important;
}
#terpopuler-desc{
display: block;
position: relative;
}
.ke-127 {
font-size: 10px !important;
}
.ke-128 {
font-size: 13px !important;
line-height: 16px !important;
color: #152035;
}
.ke-161 {
margin-top: -20px !important;
border-top-left-radius: 7px;
background: #fff !important;
z-index: 9 !important;
position: relative !important;
margin-left: 15px !important;
padding: 7px 10px !important;
}
/** end footer **/
/* Fixed end .top-news .news-item {
display: inline-block;
width: 236px;
height: 220px;
margin: 10px;
overflow: hidden;
white-space: normal !important;
}*/
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {}
@media (max-width: 870px) {
.head, .iklan-tengah, .live-item, .live-box, .bigdisplay{
display: none !important;
}
.smalldisplay{
display: block !important;
}
.middle-header{
padding: 10px;
}
.stroke ul{
white-space:nowrap;
overflow-x:auto;
}
.stroke ul li {
//display: inline;
}
.video p.playicon {
top: 25px;
left: 50px;
}
#carouselExampleCaptions {
min-height: 350px;
}
.carousel-control-next-icon, .carousel-control-prev-icon{
display: none !important;
}
label #sign-one{
display: block;
}
nav ul{
position: fixed;
width: 100%;
height: 100vh;
background: crimson;
top:50px;
left:-100%;
text-align: center;
transition: .5s;
z-index: 300;
}
.nav__link {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex-grow: 1;
min-width: 50px;
overflow: hidden;
white-space: nowrap;
font-family: sans-serif;
font-size: 13px;
color: #444444;
text-decoration: none;
-webkit-tap-highlight-color: transparent;
transition: background-color 0.1s ease-in-out;
}
.nav__link:hover {
background-color: #eeeeee;
}
.nav__link--active {
color: #009578;
}
.nav__icon {
font-size: 18px;
}
}
.bacajuga{
margin: 5px 20px;
padding: 10px;
border-left:4px solid #002171;
}
/* Fixed End */
/* Order list terkait */
ol.terkait {
list-style: none;
counter-reset: steps;
margin-left: 0 !important;
padding-left: 0 !important;
}
ol.terkait li {
counter-increment: steps;
}
ol.terkait li::before {
content: counter(steps);
margin-right: 0.5rem;
background: #12133d;
color: white;
width: 1.2em;
height: 1.2em;
border-radius: 50%;
display: inline-grid;
place-items: center;
line-height: 1.2em;
}
/* Iklan */
/* Iklan */
.adsfloatleft {
position: relative;
display: block;
float: left;
top:100;
max-width: 160px!important;
z-index: 10000;
}
.stopfloatleft{
position: fixed;
left: 0;
top:-150;
}
.adsfloatright{
position: relative;
display: block;
float: right;
top:100;
max-width: 160px!important;
z-index: 10000;
}
.stopfloatright{
position: fixed;
right:0;
top:-150;
}