/* 
    Created on : 20/12/2022 21:00:00
    Author : mariz a.m rol
    Update 10/08/2023 15:00:00
    REPUBLIKA.ID(NEW VERSION)
*/

/*reset heading*/
h1{
    padding: 0;
    margin: 0;
}


@font-face {
    font-family: 'Futura-Bold';
    src: url('fonts/FuturaBT-Bold.woff') format('woff'),
        url('fonts/FuturaBT-Bold.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Roboto-Light';
    src: url('fonts/roboto-light-webfont.woff') format('woff'),
        url('fonts/roboto-light-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto-Regular';
    src: url('fonts/roboto-regular-webfont.woff') format('woff'),
        url('fonts/roboto-regular-webfont.woff2') format('woff2'),
        url('fonts/roboto-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Roboto-Bold';
    src: url('fonts/roboto-bold-webfont.woff') format('woff'),
        url('fonts/roboto-bold-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Roboto-Bold';
    src: url('fonts/roboto-bold-webfont.woff') format('woff'),
        url('fonts/roboto-bold-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Roboto-light-italic';
    src: url('fonts/roboto-light-webfont.woff') format('woff'),
        url('fonts/roboto-lightitalic-webfont.woff2') format('woff2'),
        url('fonts/roboto-lightitalic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Roboto-slab-bold';
    src: url('fonts/robotoslab-bold-webfont.woff') format('woff'),
        url('fonts/robotoslab-bold-webfont.woff2') format('woff2'),
        url('fonts/robotoslab-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Roboto-Slab-Regular';
    src: url('fonts/RobotoSlab-Regular.woff') format('woff'),
        url('fonts/RobotoSlab-Regular.woff2') format('woff2'),
        url('fonts/RobotoSlab-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Roboto-Slab-Light';
    src: url('fonts/RobotoSlab-Light.woff') format('woff'),
        url('fonts/RobotoSlab-Light.woff2') format('woff2'),
        url('fonts/RobotoSlab-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Roboto-Slab-Light';
    src: url('fonts/RobotoSlab-Light.eot');
    src: url('fonts/RobotoSlab-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/RobotoSlab-Light.woff') format('woff'),
        url('fonts/RobotoSlab-Light.woff2') format('woff2'),
        url('fonts/RobotoSlab-Light.ttf') format('truetype'),
        url('fonts/RobotoSlab-Light.svg#Roboto-Slab-Light') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Bodoni-MTCondensed-Bold';
    src: url('fonts/BodoniMTCondensed-Bold.eot');
    src: url('fonts/BodoniMTCondensed-Bold?#iefix') format('embedded-opentype'),
        url('fonts/BodoniMTCondensed-Bold.woff') format('woff'),
        url('fonts/BodoniMTCondensed-Bold.ttf') format('truetype'),
        url('fonts/BodoniMTCondensed-Bold#Bodoni-MTCondensed-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Bodoni-MT-Bold';
    src: url('fonts/BodoniMT-Bold.eot');
    src: url('fonts/BodoniMT-Bold?#iefix') format('embedded-opentype'),
        url('fonts/BodoniMT-Bold.woff') format('woff'),
        url('fonts/BodoniMT-Bold.ttf') format('truetype'),
        url('fonts/BodoniMT-Bold#Bodoni-MT-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Droid-Serif-Italic';
    src: url('fonts/DroidSerif-Italic.eot');
    src: url('fonts/DroidSerif-Italic.woff') format('woff'),
        url('fonts/DroidSerif-Italic.woff2') format('woff2'),
        url('fonts/DroidSerif-Italic.ttf') format('truetype'),
        url('fonts/DroidSerif-Italic#Droid-Serif-Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Droid-Serif-Bold-Italic';
    src: url('fonts/DroidSerif-BoldItalic.eot');
    src: url('fonts/DroidSerif-BoldItalic.woff') format('woff'),
        url('fonts/DroidSerif-BoldItalic.woff2') format('woff2'),
        url('fonts/DroidSerif-BoldItalic.ttf') format('truetype'),
        url('fonts/DroidSerif-BoldItalic#Droid-Serif-Bold-Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Droid-Serif-Bold';
    src: url('fonts/DroidSerif-Bold.eot');
    src: url('fonts/DroidSerif-Bold.woff') format('woff'),
        url('fonts/DroidSerif-Bold.woff2') format('woff2'),
        url('fonts/DroidSerif-Bold.ttf') format('truetype'),
        url('fonts/DroidSerif-Bold#Droid-Serif-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Droid-Serif-Bold';
    src: url('fonts/DroidSerif-Bold.eot');
    src: url('fonts/DroidSerif-Bold.woff') format('woff'),
        url('fonts/DroidSerif-Bold.woff2') format('woff2'),
        url('fonts/DroidSerif-Bold.ttf') format('truetype'),
        url('fonts/DroidSerif-Bold#Droid-Serif-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Droid-Serif';
    src: url('fonts/DroidSerif.eot');
    src: url('fonts/DroidSerif.woff') format('woff'),
        url('fonts/DroidSerif.woff2') format('woff2'),
        url('fonts/DroidSerif.ttf') format('truetype'),
        url('fonts/DroidSerif#Droid-Serif') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Light-Italic';
    src: url('fonts/NunitoSans-Light-Italic.eot');
    src: url('fonts/NunitoSans-Light-Italic.woff') format('woff'),
        url('fonts/NunitoSans-Light-Italic.woff2') format('woff2'),
        url('fonts/NunitoSans-Light-Italic.ttf') format('truetype'),
        url('fonts/NunitoSans-LightItalic#Nunito-Sans-Light-Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Regular';
    src: url('fonts/NunitoSans-Regular.eot');
    src: url('fonts/NunitoSans-Regular.woff') format('woff'),
        url('fonts/NunitoSans-Regular.woff2') format('woff2'),
        url('fonts/NunitoSans-Regular.ttf') format('truetype'),
        url('fonts/NunitoSans-Regular#Nunito-Sans-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Light';
    src: url('fonts/NunitoSans-Light.eot');
    src: url('fonts/NunitoSans-Light.woff') format('woff'),
        url('fonts/NunitoSans-Light.woff2') format('woff2'),
        url('fonts/NunitoSans-Light.ttf') format('truetype'),
        url('fonts/NunitoSans-Light#Nunito-Sans-Light') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Italic';
    src: url('fonts/NunitoSans-Italic.eot');
    src: url('fonts/NunitoSans-Italic.woff') format('woff'),
        url('fonts/NunitoSans-Italic.woff2') format('woff2'),
        url('fonts/NunitoSans-Italic.ttf') format('truetype'),
        url('fonts/NunitoSans-Italic#Nunito-Sans-Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Extra-Light-Italic';
    src: url('fonts/NunitoSans-ExtraLightItalic.eot');
    src: url('fonts/NunitoSans-ExtraLightItalic.woff') format('woff'),
        url('fonts/NunitoSans-ExtraLightItalic.woff2') format('woff2'),
        url('fonts/NunitoSans-ExtraLightItalic.ttf') format('truetype'),
        url('fonts/NunitoSans-ExtraLightItalic#Nunito-Sans-Extra-Light-Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Extra-Light';
    src: url('fonts/NunitoSans-ExtraLight.eot');
    src: url('fonts/NunitoSans-ExtraLight.woff') format('woff'),
        url('fonts/NunitoSans-ExtraLight.woff2') format('woff2'),
        url('fonts/NunitoSans-ExtraLight.ttf') format('truetype'),
        url('fonts/NunitoSans-ExtraLight#Nunito-Sans-Extra-Light') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Extra-Bold-Italic';
    src: url('fonts/NunitoSans-ExtraBoldItalic.eot');
    src: url('fonts/NunitoSans-ExtraBoldItalic.woff') format('woff'),
        url('fonts/NunitoSans-ExtraBoldItalic.woff2') format('woff2'),
        url('fonts/NunitoSans-ExtraBoldItalic.ttf') format('truetype'),
        url('fonts/NunitoSans-ExtraBoldItalic#Nunito-Sans-Extra-Bold-Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Extra-Bold';
    src: url('fonts/NunitoSans-ExtraBold.eot');
    src: url('fonts/NunitoSans-ExtraBold.woff') format('woff'),
        url('fonts/NunitoSans-ExtraBold.woff2') format('woff2'),
        url('fonts/NunitoSans-ExtraBold.ttf') format('truetype'),
        url('fonts/NunitoSans-ExtraBold#Nunito-Sans-Extra-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Bold-Italic';
    src: url('fonts/NunitoSans-BoldItalic.eot');
    src: url('fonts/NunitoSans-BoldItalic.woff') format('woff'),
        url('fonts/NunitoSans-BoldItalic.woff2') format('woff2'),
        url('fonts/NunitoSans-BoldItalic.ttf') format('truetype'),
        url('fonts/NunitoSans-BoldItalic#Nunito-Sans-Bold-Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Bold';
    src: url('fonts/NunitoSans-Bold.eot');
    src: url('fonts/NunitoSans-Bold.woff') format('woff'),
        url('fonts/NunitoSans-Bold.woff2') format('woff2'),
        url('fonts/NunitoSans-Bold.ttf') format('truetype'),
        url('fonts/NunitoSans-Bold#Nunito-Sans-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Black-Italic';
    src: url('fonts/NunitoSans-BlackItalic.eot');
    src: url('fonts/NunitoSans-BlackItalic.woff') format('woff'),
        url('fonts/NunitoSans-BlackItalic.woff2') format('woff2'),
        url('fonts/NunitoSans-BlackItalic.ttf') format('truetype'),
        url('fonts/NunitoSans-BlackItalic#Nunito-Sans-Black-Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Black-Italic';
    src: url('fonts/NunitoSans-BlackItalic.eot');
    src: url('fonts/NunitoSans-BlackItalic.woff') format('woff'),
        url('fonts/NunitoSans-BlackItalic.woff2') format('woff2'),
        url('fonts/NunitoSans-BlackItalic.ttf') format('truetype'),
        url('fonts/NunitoSans-BlackItalic#Nunito-Sans-Black-Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Nunito-Sans-Black';
    src: url('fonts/NunitoSans-Black.eot');
    src: url('fonts/NunitoSans-Black.woff') format('woff'),
        url('fonts/NunitoSans-Black.woff2') format('woff2'),
        url('fonts/NunitoSans-Black.ttf') format('truetype'),
        url('fonts/NunitoSans-Black#Nunito-Sans-Black') format('svg');
    font-weight: normal;
    font-style: normal;
}
html{}
body {
    position: relative;
    overflow-x: hidden;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    background: #fff;
    font-family: 'Newsreader', serif;
    background: #EFEDDE;
}

.wrapper{
    padding: 0;
    width: 100%;
    height: 100%;
    
}
/*HEADER*/
/*header-menu*/


.navbar{padding: 0!important;}

.header {
    padding: 0;
    width: 100%;
    margin: auto;
    background: #EFEDDE;
    display: inline-block;
    z-index: 999!important;
    border-bottom: 1px #000 solid;
}


.header .header-logo{
    padding:0;
    margin: initial;
    
}
.logo-rid{
    text-align: center;
    padding-top: 8px;
}

.header2 .header-logo img,
.header .header-logo img{
    width: auto;
}
.header-menu-nav{
    position: relative;
    padding-top: 8px;
}

.header-menu-nav a i:hover{
    color: #9F0707;
}
/*headerlogo*/
.headline-fixed{
    position: fixed;
    z-index: 1;
    top: 8px;
    left: 0;
    right: 0;
}
.header-logo{
    margin: auto;
    text-align: center;
    padding-left: 10px;
}
.header-logo a{
    list-style: none;
    text-decoration: none!important;
}
.header-logo h1{
    margin: 0;
    margin-top: 14px;
    font-size: 35px;
    font-family: 'Futura';
    color: #fff;
    padding-left: 16px;
    text-align: left;
    width: 290px;
}
.header-edisi{
    padding: 0;
    float: right;
    position: relative;
}
/*.header-content{
    border-radius: 30px;
    padding-left: 4px;
    float: right;
    text-align: centerp
    right: 0;
    background:#E01415;
    max-width: 170px!important;
    padding-right: 40px!important;
    height: 54px;
    display: block;
}*/
.header-kanal{
    
}
.header-kanal-logo{
    padding-left: 7%;
    float: left;
    text-align: left;
}
.header-kanal-category{
    padding-right: 7%;
    float: right;
    text-align: right;
}
.header-kanal-category h2{
    margin-top: 10px;
    font-family: Nunito-Sans-Bold;
    color: #A8092B;
}
.ctg-head{
    margin-top: 14px;
    padding-left :20px;
    padding-right: 20px;
    border-radius: 30px;
    text-align: center;
    color: #000;
    height: 42px;
    float: left;
    /*background: #56d4f9;*/
    color: #fff;
    font-family: Nunito-Sans-Bold;
    line-height: 42px;
    display: inline-block;
}
.ctg-head a{
    text-align: center;
    font-size: 16px;
    color: #fff;
    font-family: Nunito-Sans-Bold;
}


.literasi-umat a{
    text-align: center;
    color: #000;
    font-size: 18px;
    font-family: Nunito-Sans-Bold;
}
.header-content{
    border-radius: 30px;
    padding-left: 4px;
    float: right;
    text-align: center;
    right: 0;
    padding-right: 40px!important;
    height: 54px;
    display: block;
    padding-top:8px!important; 
}
.header-content b{
    font-weight: normal;
}

.navbar-nav li img {border-radius: 50%;margin-top: -8px!important;margin-left: 2px;width: 25px;height: 25px;}

.navbar-right li a{
    text-align: center;
    line-height: 36px;
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    color: #fff;
    font-size: 14px;
}
.navbar-right li.member{
    padding-right: 20px;
}
.navbar-nav .dropdown-menu a{font-family: Roboto-Light; font-size: 14px;letter-spacing: 1px;}
.dropdown-menu i{color:#212121;width: 10px;}
.header-content .navbar-nav>li>.dropdown-menu{
    padding: 10px;
    background: #fff;
    
}
.header-content .dropdown.open .dropdown-toggle:after{
    left: 33%;
    display: none;
}
.dropdown-toggle::after{
    display: none;
}
.header-content a{
    list-style: none;
    text-decoration: none;
    cursor: pointer;
}
.header-content h1{
    margin: 0;
    text-align: center;
    color: #fff;
}
.header-content p{
    text-align: center;
    color: #fff;
}
.headline{
    margin-top: 108px;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    position: relative;
    background: rgba(0, 0, 0, 0.9);
}

/*mobile animasi*/
.head-mob{
   height: 270px!important;
   transition:5s !important;
   position: relative; 
}
.head-content-mob video,
.head-content-mob img{
    width: 100%;
    margin-left: 80%!important;
    left: 0!important;
    position: relative!important;
}

.head-caption-detail{
    position: relative!important;
    background: #fff!important;
    padding: 2px;
}
.head-caption-detail small{
    color: #000!important;
    padding: 2px;
}
.head-desc-news h1, .head-desc h1{
    font-size: 21px;
    line-height: 25px;
}

.headline-content{
    background-size:cover;
    background-attachment: fixed;
    height: 100%;
}
.swiper-button-next, .swiper-button-prev{
    /*display: none;*/ 
}

.headline-content img{
    width: 100%;
    transform: scale(1.1);

}
.headline-content audio, 
.headline-content video{
    height: auto;
    width: 100%;
    background-size: cover !important;
    z-index: -100;
}
.headline video{
    height: 100%;
    width: 100%;
    background-size: cover !important;
    z-index: -100;
    object-fit: cover;
}

.headline
.gradient-headline{
    background: transparent linear-gradient(to bottom, transparent 0px, rgba(0, 0, 0, 0.9) 50%) repeat scroll 0 0;
    padding-top: 53px;
    padding-bottom: 53px;
    padding-top: 0px;
    padding-bottom: 12px;
    position: absolute;
    bottom: 110px;
    padding: 120px;
    width: 100%;
    z-index: 99;

}
.header-menu-nav .sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    overflow-x: hidden;
    transition: 0.8s;
    display: none;
    padding-top: 5px;
    padding-bottom: 30px;
}

.header-menu-nav .sidenav span{
    color: #E86289 !important;
}
.header-menu-nav span img{
    width: 20px;
    height: 20px;
}
.header-menu-nav ul{
    padding: 0;margin: 0;
}
.header-menu-nav ul li{
    list-style: none;
    width: 300px;
}
.header-menu-nav ul li.active{
    width: 35px;
    border-left: 5px #fff solid;
}
.header-menu-nav ul li a{
    font-size: 20px;
    font-family: roboto-bold;
    color: #FFFFFF;
    letter-spacing: 1px;
}
.header-menu-nav ul li ul li a{
    font-size: 14px;
    padding: 0 !important;
    padding-left: 11% !important;
    padding-top: 10px;
    line-height: 22px;
    font-family: roboto-light;
    letter-spacing: 1px;
}
.header-menu-nav .sidenav a {
    padding: 8px 8px 8px 16px;
    text-decoration: none;
    color: #fff;
    display: block;
    text-align: left;
}
.header-menu-nav .sidenav a:hover {
    color: #9F0707 !important;
}
.headline-desc{
    
    position: absolute;
    z-index: 9;
    bottom: 10%;
    left: 12.5%;
    right: 12.5%;
    width: 70%;
    height: auto;
}

.headline-desc h2 a{
    list-style: none;
    text-decoration: none;
    color: #fff;
    font-family: 'Nunito-Sans-Regular';
    letter-spacing: 3px;
}
.headline-desc label{
    font-family: 'montserrat', sans-serif;
    letter-spacing: 2px;
    color: #fff;
}

.head-desc{
    left: 10px;
    bottom: 15px!important;
    z-index: 99;
}

.headline-desc-news h1,
.headline-desc h1{
    color: #fff;
    font-size: 48px;
    font-family: Nunito-Sans-Black;
    line-height: 50px;
}
.headline-desc span{
    
}

.head-desc h1,
.head-desc-news h1{
    font-size: 18px!important;line-height: 24px!important;
}

.headline .gradient-headline-mob{
    padding: 40px!important;
}
.btn-selengkapnya-mob{
    font-size: 13px!important;
    padding: 4px!important;
}
.head-desc-news label, .head-desc label{
        padding: 4px 4px 4px 4px;
        font-size: 13px;
        
}

/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.headline-desc-news{
    position: absolute;
    z-index: 9;
    bottom: 10%;
    left: 22%;
    right: 22%;
    height: auto;
}

.bg-gray{
    /*background-image: url(img/bg-gray.jpg);*/
    background: #ccc;
    min-height: 200px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
/*E-HEADLINE*/
.bg-category{
    margin-top: 100vh;
    background: #EFEDDE;
    position: relative;
    z-index: 99;
}
.category{
    padding: 0;
    display: block;
}
.category-wrap{
    padding-left:5%;padding-right: 5%;
    margin-top: 60px;
    margin-bottom: 60px;
}
.category-list{
    position: relative;
    margin-top: 151px;
    height: 175px;
}
.category-list p{
    position: absolute;
    font-size: 32px;
    font-weight: 600;
    text-align: center;
    bottom: 0;
    font-family: roboto-light;
    opacity: 0.5;
}
.category-desc{
    /*padding-left: 3%;padding-right: 3%;*/
}
.category-desc a{
    list-style: none;
    text-decoration: none;
    color: #000;
}
.category-desc a:hover{
    color: #9F0707;
}
.category-desc h1{
    font-size: 36px;
    margin: 0;
    margin-bottom: 22px;
    font-family: roboto-bold;
    color: #9F0707;
}
.category-desc p{
    margin-top: 30px;
    font-size: 20px;
    font-family: roboto-light;
}
.category-list span,
.category-desc span{
    color: #9F0707;
    text-transform: uppercase;
    font-family: roboto-light;
    letter-spacing: 1px;
}
.category-desc span{
    display: table;
    border-bottom: 2px solid #9f0707;
    padding: 10px 0; margin-bottom: 10px;
}
.category-img{

}
.category-img img{
    width: 100%;
    height: auto;
}

.footer-copyright a{
    color: #000;
}
/*READ*/
.read{
    padding-left: 5%;
    padding-right: 5%;
}
.read-artikel{
   float: right;
}
.read-artikel h3{
    margin: 0;
    font-family: Nunito-Sans-Regular;
    font-size: 16px;
    color: #000;
    letter-spacing: 3px;
}
.read-artikel time{
    color: #A39797;
    font-family: Nunito-Sans-Regular;
    font-size: 13px;
    
}
.read-artikel span{
    
}

.read-artikel span.published{
    font-family: 'Nunito-Sans-Regular';
    color: #aaa;
    font-size: 19px;

}
.read-artikel h1{
    font-size: 32px;
    font-family: Nunito-Sans-Black;
    margin-top: 30px;
}
.read-news{

}
.read-news p{
    font-size: 17px;
    line-height: 32px;
    font-family: Droid-Serif;
    
}
.read-news h3{
    font-size: 30px;
    font-family: Nunito-Sans-Bold;
    margin-top: 40px;
    margin-bottom: 20px;
}
.read-news h4{
    font-size: 30px;
    color: #000;
    font-family: Nunito-Sans-Bold;
    margin-top: 40px;
    margin-bottom: 20px;
}

.read-related{
    
}
.read-related{
    
}
.read-related li{
    margin: 5px;
    list-style: none;
}
.read-related-img{
    float:left;
    text-align: center;
}
.read-related-img img{
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 4px;
}
.read-related h2{
    font-family: Nunito-Sans-Bold;
    font-size: 16px;
    color: #A39797;
    letter-spacing: 3px;
    font-size: 10px;
}
/*kutipan*/
.read-kutipan{
    border-bottom: 2px #eee solid;
    margin-bottom: 10px;
}
.read-kutipan span img{
    float: left;
    padding-right: 10px;
}
.read-kutipan h1{
    padding-left: 10px;
    font-size: 32px;
    font-weight: 600;
}
.share-sosmed label{
    color: #aaa;
    font-size: 32px;
}
.share-sosmed{
    display: block;
    margin-top: 5px;
    margin-bottom: 50px
}
.share-sosmed i{
    color: #aaa;
    font-size: 32px;
    padding-left: 10px;
}
.share-sosmed a i{

}
.share_it .fa{
    padding: 0!important;
    margin: 0px 10px 0px 0px;
}
/*E-KUTIPAN*/

.share-open-click{
    position: fixed;
    bottom: 30px;
    right: 2%;
    z-index: 999;
    width: 50px;
    height: 50px;
    border-radius: 50px;
    background: #9F0707;
    text-align: center;
    line-height: 50px;
    cursor: pointer;
}
.share-open-click span{
    color: #fff;
}
.share-open-fix{
    position: fixed;
    bottom: 120px;
    right: 2%;
    display: none;
}
.share-open-fix ul{


}
.share-open-fix ul li{
    width: 50px;
    height: 50px;
    background: red;
    border-radius: 50px;
    margin-bottom: 10px;
    list-style: none;
    text-align: center;
    line-height: 50px;
}
.share-open-fix ul li i{
    font-size: 18px;
}
.share-open-fix ul li.mail{
    background: #F5FE00;
    color: #000;
}
.share-open-fix ul li.fb{
    background: #3B5998;
    color: #fff;
}
.share-open-fix ul li.twt{
    background: #6FAEDC;
    color: #fff;
}
.share-open-fix ul li.ytb{
    background: #FF0000;
    color: #fff;
}
.footer-sosmed .follow-text{
    background: gray;
}
/*berita terkait*/
.berita-terkait{
    width: 60%;
    margin-bottom: 30px;
}
.berita-terkait h1{
     font-family: Roboto-bold;
     font-size: 26px;
}
.berita-terkait ul{
    
}
.berita-terkait ul li{
    list-style-type: none;
    border-bottom: 1px #aaa solid;
    padding: 10px;
}
.berita-terkait ul li a{
    font-family: Roboto-Bold;
    list-style: none;
    font-size: 16px;
    text-decoration: none;
}

/*tagging*/
.tagging {
    margin-top: 20px;
    margin-bottom: 100px;
}

.tagging label{
    float: left;
    margin-right: 10px;
    font-family: Roboto-slab-bold;
    display: block;
}
.tagging ul{

}
.tagging ul li {
    float: left;
    padding: 2px 18px 2px 18px;
    text-decoration: none;
    list-style: none;
    margin-right:0px;
    color: #000;
    text-align: center;
    margin-bottom: 6px;
}
.tagging ul li a{
    font-size: 14px;
    color: #fff;
    text-shadow: 1px 1px #000;
    font-family: Roboto-Light;
}

.button-selengkapnya{
   margin-top: -70px;
   opacity: 0.9;
   border-top: 100px #EFEDDE solid;
    
}

.disc-member{
    text-align: center;
    
}
.disc-member-circle{
    margin: auto;
    width: 100px;
    height: 100px;
    background: #000;
    border-radius: 50%;
    padding-top: 25px;
    text-align: center;
}
.disc-member h2{
    margin: 0;
    text-align: center;
    color: #fff;
    font-family: Nunito-Sans-Bold;
    font-size: 21px;
}
.disc-member h3{
    margin: 0;
    text-align: center;
    font-family: Nunito-Sans-Bold;
    color:#fff;
    font-size: 21px;
}
.disc-member p{
    font-family: Nunito-Sans-Regular;
    color:#757171;
    font-size: 15px;
}
.disc-member a{
    font-family: Nunito-Sans-Regular;
    color: #A12E2E;
    font-size: 15px;
}
/*footer*/
.footer-desc{
    padding:0;
    margin-bottom: 20px;
    
}
.footer-comment{
    padding: 0;
    margin-top: 50px;margin-bottom:0px;
}
.footer-sosmed{
    float: left;
    padding-left: 5px;
}
.profile-list{
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    float: left;
    margin-bottom: 10px
}
.profile-list img{
    width: 50px!important;
    height: 50px!important;
}
.profile-desc{
    float: left;
    margin-bottom: 30px;
}
.profile-desc a{
    list-style: none;
    text-decoration: none;
    color: #fff;
    font-family: Nunito-Sans-Bold;
}
.profile-desc h1{
    color: #000;
    font-size: 20px;
    font-family: Nunito-Sans-Regular;
}
.profile-follow{
    float: left;
    margin-left: 10px;
}
.profile-follow span{
    font-family: Nunito-Sans-Bold;
    font-size: 16px;
    color: #fff;
}
.show-info-writter{cursor: pointer;}
.show-info-desc{
    display: none;
    background: #000;
    padding: 18px;
    border-radius: 10px;
}
.show-info-desc p{
    color:#fff!important;
    font-size: 13px;
}
.share_itx a{
    list-style: none;
    text-decoration: none;
    color: #fff; 
    padding: 6px;
    border-radius: 15px;
    background: gray;
    padding-left: 10px
}



/*copyright*/
.footer-copyright{
    padding: 0;margin: 0;
    position: relative;
    background: #a8092b;
    display: grid;
    font-family: roboto-light;
    z-index: 2;
}
.footer-copyright h1{
    font-size: 14px;
    font-family: roboto-light;
    color: #FFF;
    letter-spacing: 1px;
    padding: 20px;
}
.footer-copyright h1 a{
    color: #000;
    cursor: pointer;
}
.footer-copyright span{
    font-size: 28px;
    margin-bottom: 10px;
    cursor: pointer;
}
.footer-copyright p{
    font-size: 11px;
    font-family: roboto-light;
    letter-spacing: 1px;
    display: none;
}

 #comments .text-center a {font-size: 15px!important;font-family: Nunito-Sans-Regular!important;}
 #comments small {font-family: Nunito-Sans-Regular;}

/*MARGIN GLOBAL*/
/*margintop*/
.mt30{
    margin-top: 30px;
}
.mt20{
    margin-top: 20px;
}
.mt10{
    margin-top: 10px;
}
.mt5{
    margin-top: 5px;
}
.mt2{
    margin-top: 2px;
}
/*marginbottom*/
.mb30{
    margin-bottom: 30px;
}
.mb20{
    margin-bottom: 20px;
}
.mb10{
    margin-bottom: 10px;
}
.mb5{
    margin-bottom: 5px;
}
.mb2{
    margin-bottom: 2px;
}
/*marginleft*/
.ml30{
    margin-left: 30px;
}
.ml20{
    margin-left: 20px;
}
.ml10{
    margin-left: 10px;
}
.ml5{
    margin-left: 5px;
}
.ml2{
    margin-left: 2px;
}
/*marginright*/
.m530{
    margin-right: 30px;
}
.mr20{
    margin-right: 20px;
}
.mr10{
    margin-right: 10px;
}
.mr5{
    margin-right: 5px;
}
.mr2{
    margin-right: 2px;
}

/*PADDING GLOBAL*/
/*paddingtop*/
.pt40{
    padding-top: 40px;
}
.pt30{
    padding-top: 30px;
}
.pt25{
    padding-top: 25px;
}
.pt20{
    padding-top: 20px;
}
.pt15{
    padding-top: 15px;
}
.pt10{
    padding-top: 10px;
}
.pt5{
    padding-top: 5px;
}
.pt2{
    padding-top: 2px;
}
/*paddingbottom*/
.pb30{
    padding-bottom: 30px;
}
.pb20{
    padding-bottom: 20px;
}
.pb10{
    padding-bottom: 10px;
}
.pb5{
    padding-bottom: 5px;
}
.pb2{
    padding-bottom: 2px;
}
/*paddingleft*/
.pl30{
    padding-left: 30px;
}
.pl20{
    padding-left: 20px;
}
.pl10{
    padding-left: 10px;
}
.pl5{
    padding-left: 5px;
}
.pl2{
    padding-left: 2px;
}
/*paddingright*/
.pr30{
    padding-right: 30px;
}
.pr20{
    padding-right: 20px;
}
.pr10{
    padding-right: 10px;
}
.pr5{
    padding-right: 5px;
}
.pr2{
    padding-right: 2px;
}

.submitBtn{
    color: #fff;
}
/*buttongolbal*/
.btn-selengkapnya{
    background: #A12E2E!important;
    border: 1px solid #AAAAAA;
    padding: 7px 15px 7px 15px;
    border-radius: 20px;
    font-size: 12px;
    font-family: Nunito-Sans-Regular;
    color: #fff;
    font-weight: 400;
    letter-spacing: 3px;
}
.btn-selengkapnya-news{
    background: transparent;
    border: 1px #000 solid;
    padding: 7px 7px 10px 10px;
    border-radius: 19px;
    color: #000;
    font-family: 'Nunito-Sans-Regular';
    font-size: 16px;
    letter-spacing: 3px;
}

.swiper-container {
    width: 100%;
    height: 100%;
}
.swiper-slide {
    font-size: 18px;
    background: #fff;
    display: block;
    width: 100%!important;
    overflow: hidden;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    background-position:center;
}

.category:nth-child(odd) {
    /*background: #eee;*/
}
.category:nth-child(even) {
    /*background: #fff;*/
}
.share_it .fa{
    display: table-cell;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    text-align: center;
    line-height: 40px;
    font-size: 20px;
    color: #fff;
}
.share_it .fa-facebook{
    background: #4267B2;
}
.share_it .fa-twitter{
    background: #1B95E0;
}
div.datedropper.picker-fxs .pick-btns .pick-submit,
div.datedropper .picker ul.pick li.pick-sl{
    background: #9F0707;
}
div.datedropper.primary:before, div.datedropper.primary .pick-submit, div.datedropper.primary .pick-lg-b .pick-sl:before, div.datedropper.primary .pick-m, div.datedropper.primary .pick-lg-h{
    background-color: #9F0707;
}
div.datedropper{
    right:0!important;
    top: 75px;
}
div.datedropper .picker ul.pick li span,
div.datedropper .picker ul.pick .pick-arw.pick-arw-l,
div.datedropper.picker-fxs ul.pick li,
div.datedropper .picker ul.pick li.pick-sl{
    color: #fff;
}
.read-news img
.read-news iframe,
.read-news video{
    width: 100%;
    height: 100%;
}
.read-news .blog-post-bottom .pull-left{
    width: 50%;
    float: left!important;
    margin-top: 20px;margin-bottom: 20px;
    display: block;
}
.read-news .blog-post-bottom .pull-right{
    width: 50%;
    float: right!important;
    margin-top: 20px;margin-bottom: 20px;
    display: content;
}
.read-news .blog-post-bottom{
    margin-top: 20px;margin-bottom: 20px;
    font-family: 'Nunito-Sans-Regular';
    color: #aaa;
    letter-spacing: 1px;
    font-size: 12px;
    font-weight: 400;
    padding-bottom: 10px;
    margin-right: 6px;
    display: content;
}
.read-news .blog-post-actions{
    display: table;
    margin-top: 40px;
}
.navigation-fix{
    background: yellow;
    position: fixed;
    top:50%;
    left: 0;
    right: 0;
    z-index: 999;
}

div.datedropper.primary{
    left: 0!important;
    right:0!important;
}

/*datepicker*/
@font-face {
    font-family: "datedropper";
    src: url("src/datedropper.eot");
    src: url("src/datedropper.eot?#iefix") format("embedded-opentype"), url("src/datedropper.woff") format("woff"), url("src/datedropper.ttf") format("truetype"), url("src/datedropper.svg#datedropper") format("svg");
    font-weight: normal;
    font-style: normal;
}
[class^="pick-i-"]:before,
[class*=" pick-i-"]:before {
    font-family: "datedropper" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.pick-i-lng:before {
    content: "\6a";
}
.pick-i-lkd:before {
    content: "\62";
}
.pick-i-ckd:before {
    content: "\65";
}
.pick-i-r:before {
    content: "\66";
}
.pick-i-l:before {
    content: "\68";
}
.pick-i-min:before {
    content: "\61";
}
.pick-i-exp:before {
    content: "\63";
}
.picker-input {
    cursor: text;
}
.picker-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 9998;
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 0.4s ease, visibility 0.4s ease;
    -moz-transition: opacity 0.4s ease, visibility 0.4s ease;
    -ms-transition: opacity 0.4s ease, visibility 0.4s ease;
    -o-transition: opacity 0.4s ease, visibility 0.4s ease;
}
.picker-modal-overlay.tohide {
    opacity: 0;
    visibility: hidden;
}
div.datedropper {
    position: absolute;
    top: 92px!important;
    right: 0!important;
    z-index: 99;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    line-height: 1;
    font-family: sans-serif;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    opacity: 0;
    visibility: hidden;
    margin-top: -8px;
    transform-style: preserve-3d;
    -webkit-perspective: 1000;
    -moz-perspective: 1000;
    -ms-perspective: 1000;
    perspective: 1000;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
}
div.datedropper:before {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: -8px;
    left: 50%;
    -webkit-transform: translateX(-50%) rotate(45deg);
    -moz-transform: translateX(-50%) rotate(45deg);
    -ms-transform: translateX(-50%) rotate(45deg);
    -o-transform: translateX(-50%) rotate(45deg);
    border-top-left-radius: 4px;
}
div.datedropper.picker-focus {
    opacity: 1;
    visibility: visible;
}
div.datedropper.picker-modal {
    top: 50%!important;
    left: 50%!important;
    -webkit-transform: translate(-50%, -50%) !important;
    -moz-transform: translate(-50%, -50%) !important;
    -ms-transform: translate(-50%, -50%) !important;
    -o-transform: translate(-50%, -50%) !important;
    position: fixed!important;
    margin: 0!important;
}
div.datedropper.picker-modal:before {
    display: none;
}
div.datedropper .picker {
    overflow: hidden;
}
div.datedropper .picker ul {
    margin: 0;
    padding: 0;
    list-style: none;
    cursor: pointer;
}
div.datedropper .picker ul.pick {
    position: relative;
    overflow: hidden;
    max-height: 100px;
}
div.datedropper .picker ul.pick:nth-of-type(2) {
    box-shadow: 0 1px rgba(0, 0, 0, 0.06);
}
div.datedropper .picker ul.pick li {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    opacity: .5;
    display: block;
}
div.datedropper .picker ul.pick li.pick-afr {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
}
div.datedropper .picker ul.pick li.pick-bfr {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
}
div.datedropper .picker ul.pick li.pick-sl {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    z-index: 1;
}
div.datedropper .picker ul.pick li span {
    font-size: 16px;
    position: absolute;
    left: 0;
    width: 100%;
    line-height: 0;
    bottom: 24px;
}
div.datedropper .picker ul.pick .pick-arw {
    position: absolute;
    top: 0;
    height: 100%;
    width: 25%;
    font-size: 10px;
    text-align: center;
    display: block;
    z-index: 10;
    cursor: pointer;
    background-size: 24px 24px;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    opacity: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
}
div.datedropper .picker ul.pick .pick-arw i {
    line-height: 0;
    top: 50%;
    position: relative;
    display: block;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
div.datedropper .picker ul.pick .pick-arw.pick-arw-s1:hover {
    opacity: 1;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
}
div.datedropper .picker ul.pick .pick-arw.pick-arw-r {
    right: 0;
    font-size: 14px;
    color: #fff;
}
div.datedropper .picker ul.pick .pick-arw.pick-arw-r i {
    right: 0;
}
div.datedropper .picker ul.pick .pick-arw.pick-arw-l {
    left: 0;
}
div.datedropper .picker ul.pick .pick-arw.pick-arw-l i {
    left: 0;
    font-size: 14px;
    color: #fff;
}
div.datedropper .picker ul.pick .pick-arw.pick-arw-s2.pick-arw-r {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
}
div.datedropper .picker ul.pick .pick-arw.pick-arw-s2.pick-arw-l {
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
}
@media only screen and (max-width: 480px) {
    div.datedropper .picker ul.pick .pick-arw {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        opacity: 0.4;
    }
}
div.datedropper .picker ul.pick.pick-m,
div.datedropper .picker ul.pick.pick-y,
div.datedropper .picker ul.pick.pick-l {
    height: 60px;
    line-height: 60px;
}
div.datedropper .picker ul.pick.pick-m {
    font-size: 32px;
}
div.datedropper .picker ul.pick.pick-y {
    font-size: 24px;
}
div.datedropper .picker ul.pick.pick-y.pick-jump .pick-arw.pick-arw-s1.pick-arw-r i {
    right: 16px;
}
div.datedropper .picker ul.pick.pick-y.pick-jump .pick-arw.pick-arw-s1.pick-arw-l i {
    left: 16px;
}
div.datedropper .picker ul.pick.pick-y.pick-jump .pick-arw.pick-arw-s2.pick-arw-r,
div.datedropper .picker ul.pick.pick-y.pick-jump .pick-arw.pick-arw-s2.pick-arw-l {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
}
div.datedropper .picker ul.pick.pick-y.pick-jump .pick-arw:hover {
    -webkit-transform: scale(1.6);
    -moz-transform: scale(1.6);
    -ms-transform: scale(1.6);
    -o-transform: scale(1.6);
}
div.datedropper .picker ul.pick.pick-d {
    height: 100px;
    line-height: 80px;
    font-size: 64px;
    font-weight: bold;
}
div.datedropper .picker ul.pick.pick-l {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    font-size: 18px;
    font-weight: bold;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(32px);
    -moz-transform: translateY(32px);
    -ms-transform: translateY(32px);
    -o-transform: translateY(32px);
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
}
div.datedropper .picker ul.pick.pick-l.visible {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
}
div.datedropper .picker ul.pick:hover .pick-arw {
    opacity: 0.6;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
}
div.datedropper .picker ul.pick.pick-d:hover,
div.datedropper .picker ul.pick.pick-y:hover {
    background-color: rgba(0, 0, 0, 0.02);
}
div.datedropper .picker .pick-lg {
    z-index: 1;
    margin: 0 auto;
    max-height: 0;
    overflow: hidden;
}
div.datedropper .picker .pick-lg.down {
    animation: down .8s ease;
}
div.datedropper .picker .pick-lg .pick-h {
    opacity: 0.4;
}
div.datedropper .picker .pick-lg ul:after {
    content: "";
    display: table;
    clear: both;
}
div.datedropper .picker .pick-lg ul li {
    float: left;
    text-align: center;
    width: 14.285714286%;
    line-height: 36px;
    height: 36px;
    font-size: 14px;
}
div.datedropper .picker .pick-lg ul.pick-lg-h {
    padding: 0 16px;
}
div.datedropper .picker .pick-lg ul.pick-lg-b {
    padding: 16px;
}
div.datedropper .picker .pick-lg ul.pick-lg-b li {
    cursor: pointer;
    position: relative;
    z-index: 1;
}
div.datedropper .picker .pick-lg ul.pick-lg-b li:before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 48px;
    height: 48px;
    box-shadow: 0 0 32px rgba(0, 0, 0, 0.1);
    border-radius: 32px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) scale(0);
    -moz-transform: translate(-50%, -50%) scale(0);
    -ms-transform: translate(-50%, -50%) scale(0);
    -o-transform: translate(-50%, -50%) scale(0);
}
div.datedropper .picker .pick-lg ul.pick-lg-b li.pick-v:hover {
    text-decoration: underline;
}
div.datedropper .picker .pick-lg ul.pick-lg-b li.pick-lk:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 4px;
    right: 4px;
    height: 1px;
    background: rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
}
div.datedropper .picker .pick-lg ul.pick-lg-b li.pick-sl {
    font-size: 24px;
}
div.datedropper .picker .pick-lg ul.pick-lg-b li.pick-sl:before {
    -webkit-transform: translate(-50%, -50%) scale(1);
    -moz-transform: translate(-50%, -50%) scale(1);
    -ms-transform: translate(-50%, -50%) scale(1);
    -o-transform: translate(-50%, -50%) scale(1);
}
div.datedropper .picker .pick-btns {
    margin: -1px;
    position: relative;
    z-index: 2;
    height: 56px;
}
div.datedropper .picker .pick-btns div {
    cursor: pointer;
    line-height: 0;
}
div.datedropper .picker .pick-btns .pick-submit {
    margin: 0 auto;
    width: 56px;
    height: 56px;
    line-height: 64px;
    border-radius: 56px;
    font-size: 24px;
    cursor: pointer;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    text-align: center;
    position: relative;
    top: 0;
}
div.datedropper .picker .pick-btns .pick-submit:after {
    font-family: "datedropper" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 60px;
    content: "\65";
}
div.datedropper .picker .pick-btns .pick-submit:hover {
    top: 4px;
    box-shadow: 0 0 0 16px rgba(0, 0, 0, 0.04), 0 0 0 8px rgba(0, 0, 0, 0.04);
}
div.datedropper .picker .pick-btns .pick-btn {
    position: absolute;
    width: 32px;
    height: 32px;
    bottom: 0;
    text-align: center;
    line-height: 38px;
    font-size: 16px;
    margin: 8px;
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.03);
}
div.datedropper .picker .pick-btns .pick-btn:hover {
    background: #FFF;
    -webkit-box-shadow: 0 0 32px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 32px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 32px rgba(0, 0, 0, 0.1);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
}
div.datedropper .picker .pick-btns .pick-btn:after {
    font-family: "datedropper" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
div.datedropper .picker .pick-btns .pick-btn.pick-btn-sz {
    right: 0;
    transform-origin: right bottom;
}
div.datedropper .picker .pick-btns .pick-btn.pick-btn-sz:after {
    content: "\63";
}
div.datedropper .picker .pick-btns .pick-btn.pick-btn-lng {
    left: 0;
    transform-origin: left bottom;
}
div.datedropper .picker .pick-btns .pick-btn.pick-btn-lng:after {
    content: "\6a";
}
div.datedropper.picker-lg {
    width: 300px!important;
}
div.datedropper.picker-lg ul.pick.pick-d {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    max-height: 0!important;
}
div.datedropper.picker-lg .pick-lg {
    max-height: 320px;
}
div.datedropper.picker-lg .pick-btns .pick-btn.pick-btn-sz:after {
    content: "\61";
}
@media only screen and (max-width: 480px) {
    div.datedropper.picker-lg {
        position: fixed;
        top: 50%!important;
        left: 50%!important;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        margin: 0;
    }
    div.datedropper.picker-lg:before {
        display: none;
    }
}
@-moz-keyframes picker_locked {
    0%,
    100% {
        -webkit-transform: translateX(-50%) translate3d(0, 0, 0);
        -moz-transform: translateX(-50%) translate3d(0, 0, 0);
        -ms-transform: translateX(-50%) translate3d(0, 0, 0);
        -o-transform: translateX(-50%) translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-50%) translate3d(-2px, 0, 0);
        -moz-transform: translateX(-50%) translate3d(-2px, 0, 0);
        -ms-transform: translateX(-50%) translate3d(-2px, 0, 0);
        -o-transform: translateX(-50%) translate3d(-2px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(-50%) translate3d(2px, 0, 0);
        -moz-transform: translateX(-50%) translate3d(2px, 0, 0);
        -ms-transform: translateX(-50%) translate3d(2px, 0, 0);
        -o-transform: translateX(-50%) translate3d(2px, 0, 0);
    }
}
@-webkit-keyframes picker_locked {
    0%,
    100% {
        -webkit-transform: translateX(-50%) translate3d(0, 0, 0);
        -moz-transform: translateX(-50%) translate3d(0, 0, 0);
        -ms-transform: translateX(-50%) translate3d(0, 0, 0);
        -o-transform: translateX(-50%) translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-50%) translate3d(-2px, 0, 0);
        -moz-transform: translateX(-50%) translate3d(-2px, 0, 0);
        -ms-transform: translateX(-50%) translate3d(-2px, 0, 0);
        -o-transform: translateX(-50%) translate3d(-2px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(-50%) translate3d(2px, 0, 0);
        -moz-transform: translateX(-50%) translate3d(2px, 0, 0);
        -ms-transform: translateX(-50%) translate3d(2px, 0, 0);
        -o-transform: translateX(-50%) translate3d(2px, 0, 0);
    }
}
@keyframes picker_locked {
    0%,
    100% {
        -webkit-transform: translateX(-50%) translate3d(0, 0, 0);
        -moz-transform: translateX(-50%) translate3d(0, 0, 0);
        -ms-transform: translateX(-50%) translate3d(0, 0, 0);
        -o-transform: translateX(-50%) translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-50%) translate3d(-2px, 0, 0);
        -moz-transform: translateX(-50%) translate3d(-2px, 0, 0);
        -ms-transform: translateX(-50%) translate3d(-2px, 0, 0);
        -o-transform: translateX(-50%) translate3d(-2px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(-50%) translate3d(2px, 0, 0);
        -moz-transform: translateX(-50%) translate3d(2px, 0, 0);
        -ms-transform: translateX(-50%) translate3d(2px, 0, 0);
        -o-transform: translateX(-50%) translate3d(2px, 0, 0);
    }
}
@-moz-keyframes picker_locked_large_mobile {
    0%,
    100% {
        -webkit-transform: translate(-50%, -50%) translate3d(0, 0, 0);
        -moz-transform: translate(-50%, -50%) translate3d(0, 0, 0);
        -ms-transform: translate(-50%, -50%) translate3d(0, 0, 0);
        -o-transform: translate(-50%, -50%) translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
        -moz-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
        -ms-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
        -o-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
        -moz-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
        -ms-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
        -o-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
    }
}
@-webkit-keyframes picker_locked_large_mobile {
    0%,
    100% {
        -webkit-transform: translate(-50%, -50%) translate3d(0, 0, 0);
        -moz-transform: translate(-50%, -50%) translate3d(0, 0, 0);
        -ms-transform: translate(-50%, -50%) translate3d(0, 0, 0);
        -o-transform: translate(-50%, -50%) translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
        -moz-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
        -ms-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
        -o-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
        -moz-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
        -ms-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
        -o-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
    }
}
@keyframes picker_locked_large_mobile {
    0%,
    100% {
        -webkit-transform: translate(-50%, -50%) translate3d(0, 0, 0);
        -moz-transform: translate(-50%, -50%) translate3d(0, 0, 0);
        -ms-transform: translate(-50%, -50%) translate3d(0, 0, 0);
        -o-transform: translate(-50%, -50%) translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
        -moz-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
        -ms-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
        -o-transform: translate(-50%, -50%) translate3d(-2px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
        -moz-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
        -ms-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
        -o-transform: translate(-50%, -50%) translate3d(2px, 0, 0);
    }
}
div.datedropper.picker-rmbl {
    -webkit-animation: picker_locked 0.4s ease;
    -moz-animation: picker_locked 0.4s ease;
    animation: picker_locked 0.4s ease;
}
@media only screen and (max-width: 480px) {
    div.datedropper.picker-rmbl.picker-lg {
        -webkit-animation: picker_locked_large_mobile 0.4s ease;
        -moz-animation: picker_locked_large_mobile 0.4s ease;
        animation: picker_locked_large_mobile 0.4s ease;
    }
}
div.datedropper.picker-lkd .pick-submit {
    background-color: rgba(0, 0, 0, 0.04) !important;
    color: rgba(0, 0, 0, 0.2) !important;
}
div.datedropper.picker-lkd .pick-submit:hover {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}
div.datedropper.picker-lkd .pick-submit:after {
    content: "\62" !important;
}
div.datedropper.picker-fxs {
    -webkit-transition: width 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), opacity 0.2s ease, visibility 0.2s ease, margin 0.2s ease;
    -moz-transition: width 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), opacity 0.2s ease, visibility 0.2s ease, margin 0.2s ease;
    -ms-transition: width 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), opacity 0.2s ease, visibility 0.2s ease, margin 0.2s ease;
    -o-transition: width 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), opacity 0.2s ease, visibility 0.2s ease, margin 0.2s ease;
}
div.datedropper.picker-fxs ul.pick.pick-d {
    -webkit-transition: top 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), transform 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), max-height 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), background-color 0.4s ease;
    -moz-transition: top 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), transform 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), max-height 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), background-color 0.4s ease;
    -ms-transition: top 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), transform 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), max-height 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), background-color 0.4s ease;
    -o-transition: top 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), transform 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), max-height 0.8s cubic-bezier(1, -0.55, 0.2, 1.37), background-color 0.4s ease;
}
div.datedropper.picker-fxs ul.pick.pick-y {
    -webkit-transition: background-color 0.4s ease;
    -moz-transition: background-color 0.4s ease;
    -ms-transition: background-color 0.4s ease;
    -o-transition: background-color 0.4s ease;
}
div.datedropper.picker-fxs ul.pick li {
    -webkit-transition: transform 0.4s ease, opacity 0.4s ease;
    -moz-transition: transform 0.4s ease, opacity 0.4s ease;
    -ms-transition: transform 0.4s ease, opacity 0.4s ease;
    -o-transition: transform 0.4s ease, opacity 0.4s ease;
}
div.datedropper.picker-fxs ul.pick .pick-arw {
    -webkit-transition: transform 0.2s ease, opacity 0.2s ease;
    -moz-transition: transform 0.2s ease, opacity 0.2s ease;
    -ms-transition: transform 0.2s ease, opacity 0.2s ease;
    -o-transition: transform 0.2s ease, opacity 0.2s ease;
}
div.datedropper.picker-fxs ul.pick .pick-arw i {
    -webkit-transition: right 0.2s ease, left 0.2s ease;
    -moz-transition: right 0.2s ease, left 0.2s ease;
    -ms-transition: right 0.2s ease, left 0.2s ease;
    -o-transition: right 0.2s ease, left 0.2s ease;
}
div.datedropper.picker-fxs .pick-lg {
    -webkit-transition: max-height 0.8s cubic-bezier(1, -0.55, 0.2, 1.37);
    -moz-transition: max-height 0.8s cubic-bezier(1, -0.55, 0.2, 1.37);
    -ms-transition: max-height 0.8s cubic-bezier(1, -0.55, 0.2, 1.37);
    -o-transition: max-height 0.8s cubic-bezier(1, -0.55, 0.2, 1.37);
}
div.datedropper.picker-fxs .pick-lg .pick-lg-b li:before {
    -webkit-transition: transform 0.2s ease;
    -moz-transition: transform 0.2s ease;
    -ms-transition: transform 0.2s ease;
    -o-transition: transform 0.2s ease;
}
div.datedropper.picker-fxs .pick-btns .pick-submit {
    -webkit-transition: top 0.2s ease, box-shadow 0.4s ease, background-color 0.4s ease;
    -moz-transition: top 0.2s ease, box-shadow 0.4s ease, background-color 0.4s ease;
    -ms-transition: top 0.2s ease, box-shadow 0.4s ease, background-color 0.4s ease;
    -o-transition: top 0.2s ease, box-shadow 0.4s ease, background-color 0.4s ease;
}
div.datedropper.picker-fxs .pick-btns .pick-btn {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
}
@media only screen and (max-width: 480px) {
    div.datedropper.picker-fxs {
        -webkit-transition: opacity 0.2s ease, visibility 0.2s ease, margin 0.2s ease;
        -moz-transition: opacity 0.2s ease, visibility 0.2s ease, margin 0.2s ease;
        -ms-transition: opacity 0.2s ease, visibility 0.2s ease, margin 0.2s ease;
        -o-transition: opacity 0.2s ease, visibility 0.2s ease, margin 0.2s ease;
    }
    div.datedropper.picker-fxs ul.pick.pick-d,
    div.datedropper.picker-fxs .pick-lg {
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
    }
}
div.datedropper.vanilla {
    border-radius: 6px;
    width: 180px;
}
div.datedropper.vanilla .picker {
    border-radius: 6px;
    box-shadow: 0 0 32px 0 rgba(0, 0, 0, 0.1);
}
div.datedropper.vanilla .pick-l {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
div.datedropper.vanilla:before,
div.datedropper.vanilla .pick-submit,
div.datedropper.vanilla .pick-lg-b .pick-sl:before,
div.datedropper.vanilla .pick-m,
div.datedropper.vanilla .pick-lg-h {
    background-color: #feac92;
}
div.datedropper.vanilla .pick-y.pick-jump,
div.datedropper.vanilla .pick li span,
div.datedropper.vanilla .pick-lg-b .pick-wke,
div.datedropper.vanilla .pick-btn {
    color: #feac92;
}
div.datedropper.vanilla .picker,
div.datedropper.vanilla .pick-l {
    background-color: #ffffff;
}
div.datedropper.vanilla .picker,
div.datedropper.vanilla .pick-arw,
div.datedropper.vanilla .pick-l {
    color: #9ed7db;
}
div.datedropper.vanilla .pick-m,
div.datedropper.vanilla .pick-m .pick-arw,
div.datedropper.vanilla .pick-lg-h,
div.datedropper.vanilla .pick-lg-b .pick-sl,
div.datedropper.vanilla .pick-submit {
    color: #faf7f4;
}
div.datedropper.vanilla.picker-tiny:before,
div.datedropper.vanilla.picker-tiny .pick-m {
    background-color: #ffffff;
}
div.datedropper.vanilla.picker-tiny .pick-m,
div.datedropper.vanilla.picker-tiny .pick-m .pick-arw {
    color: #9ed7db;
}
div.datedropper.leaf {
    border-radius: 6px;
    width: 180px;
}
div.datedropper.leaf .picker {
    border-radius: 6px;
    box-shadow: 0 0 32px 0 rgba(0, 0, 0, 0.1);
}
div.datedropper.leaf .pick-l {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
div.datedropper.leaf:before,
div.datedropper.leaf .pick-submit,
div.datedropper.leaf .pick-lg-b .pick-sl:before,
div.datedropper.leaf .pick-m,
div.datedropper.leaf .pick-lg-h {
    background-color: #1ecd80;
}
div.datedropper.leaf .pick-y.pick-jump,
div.datedropper.leaf .pick li span,
div.datedropper.leaf .pick-lg-b .pick-wke,
div.datedropper.leaf .pick-btn {
    color: #1ecd80;
}
div.datedropper.leaf .picker,
div.datedropper.leaf .pick-l {
    background-color: #fefff2;
}
div.datedropper.leaf .picker,
div.datedropper.leaf .pick-arw,
div.datedropper.leaf .pick-l {
    color: #528971;
}
div.datedropper.leaf .pick-m,
div.datedropper.leaf .pick-m .pick-arw,
div.datedropper.leaf .pick-lg-h,
div.datedropper.leaf .pick-lg-b .pick-sl,
div.datedropper.leaf .pick-submit {
    color: #fefff2;
}
div.datedropper.leaf.picker-tiny:before,
div.datedropper.leaf.picker-tiny .pick-m {
    background-color: #fefff2;
}
div.datedropper.leaf.picker-tiny .pick-m,
div.datedropper.leaf.picker-tiny .pick-m .pick-arw {
    color: #528971;
}
div.datedropper.primary {
    border-radius: 6px;
    width: 180px;
    right: 0!important;
    left: 50%!important;
    right: 50%!important;
}
div.datedropper.primary .picker {
    border-radius: 6px;
    box-shadow: 0 0 32px 0 rgba(0, 0, 0, 0.1);
}
div.datedropper.primary .pick-l {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
div.datedropper.primary:before,
div.datedropper.primary .pick-submit,
div.datedropper.primary .pick-lg-b .pick-sl:before,
div.datedropper.primary .pick-m,
div.datedropper.primary .pick-lg-h {
    background-color: #fd4741;
}
div.datedropper.primary .pick-y.pick-jump,
div.datedropper.primary .pick li span,
div.datedropper.primary .pick-lg-b .pick-wke,
div.datedropper.primary .pick-btn {
    color: #fd4741;
}
div.datedropper.primary .picker,
div.datedropper.primary .pick-l {
    background-color: #ffffff;
}
div.datedropper.primary .picker,
div.datedropper.primary .pick-arw,
div.datedropper.primary .pick-l {
    color: #4d4d4d;
}
div.datedropper.primary .pick-m,
div.datedropper.primary .pick-m .pick-arw,
div.datedropper.primary .pick-lg-h,
div.datedropper.primary .pick-lg-b .pick-sl,
div.datedropper.primary .pick-submit {
    color: #ffffff;
}
div.datedropper.primary.picker-tiny:before,
div.datedropper.primary.picker-tiny .pick-m {
    background-color: #ffffff;
}
div.datedropper.primary.picker-tiny .pick-m,
div.datedropper.primary.picker-tiny .pick-m .pick-arw {
    color: #4d4d4d;
}
div.datedropper .null {
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
}
form.form-date {
    width: 100%;
    position: relative;
}
input#dtpck {
    width: 100%;
    background: rgba(0,0,0,0);
    border: none;
    color: rgba(0,0,0,0);
    position: absolute;
    left: 0;
}
div.datedropper.primary:before, div.datedropper.primary .pick-submit, div.datedropper.primary .pick-lg-b .pick-sl:before, div.datedropper.primary .pick-m, div.datedropper.primary .pick-lg-h{
    background-color: #9F0707!important;
}

.swiper-button-prev, .swiper-container-rtl{
    background-image: url(img/icon-prev.png)!important;

}
.swiper-button-next, .swiper-container-rtl{
    background-image: url(img/icon-next.png)!important; 
}
.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 38px;
    height: 38px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    background-size: 40px 40px;
    background-position: center;
    background-repeat: no-repeat;
    background-color: RGBA(255,255,255,0.07);
    border-radius: 50%;
}
.read-news blockquote{
    font-weight: 600;
    padding: 0;
}
.read blockquote{
    margin-top: 30px;
    margin-bottom: 30px;
}
.blok_quot .sound {
    width: 16%;
    height: 80px;
    background-image: url(../img/kutipan.png);
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    background-position: left;
    float: left;
}
.quote-text{
    font-size: 26px;
    font-family: Nunito-Sans-Bold;
    border-left: 1px solid #A39797 ;
}
.quote-box{
    border: none!important;
    
}
.header-content iframe{
    height: auto!Important;
}
span.kutipan-img{
    float: left;
    width: auto;
    padding-right: 20px;
}

.museBGSize .scroll_effect {
    width: 100%!important;
    height: 100%!important;
    left: 0!important;
    top:0!important;
}
#u606 {
    z-index: 2;
    opacity: 0.92;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=92)";
    filter: alpha(opacity=92);
    position: fixed;
    top: 0px;
    background-size: cover;
    width: 100%!important;
    height: 100%!important;
    left: 0!important;
    right: 0!important;
    bottom: 0;
}

.edisikoran img{
    width: 70%;
    height: auto;
    text-align: center;
    margin: auto;
    display: block;
}
.edisikoran .edisikoran-cover{
    text-align: center;
    height: 770px;
}
.edisikoran span{
    text-align: center;
    margin: auto;
}
.edisikoran-cover a{
    font-size: 26px;
    color: #000;
}
audio{
    background: #F1F3F4;
    border-radius: 0!Important;
    outline: 0;
    width: 100%;
}
.wrapper-media{
    padding: 0;
}
.wrapper-media img{
    width: 100%;
    height: 100%;
}
iframe{
    width: 100%;
}
.sub-rubrik{
    padding-left: 14%;
    padding-right: 14%;
}
.rubrik-img{
    padding: 0;
    padding-right: 16px;
}
.rubrik-desc{
    padding: 0;
}
.rubrik-desc label{
    padding: 0;
    margin: 0;
    font-family: 'Roboto-Light';
    color: #fff;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    background: #9F0707;
    padding: 4px;
    font-weight: 300!important;
}
.rubrik-desc h2{
    font-family: 'Roboto-Slab-Regular';
    margin-top: 4px;
}
.rubrik-desc h2 a{
    font-family: 'Roboto-Slab-Regular';
    color: #fff;
    text-decoration: none;
    cursor:pointer;
}
.rubrik-desc p{
    font-family: 'Roboto-Light';
    font-size: 16px;
}
.quote-box{
}
.blok_quot{
    padding: 0;margin: 0;
}
.quote-box span{
    float: left;
    
    margin-top: 30px;
    opacity: 0.5;
    margin-bottom: 10px;
    width: 100%!important;
}

form.form-date {
    width: 100%;
    position: relative;
}

input#dtpck {
    width: 100%;
    background: rgba(0,0,0,0);
    border: none;
    color: rgba(0,0,0,0);
    position: absolute;
    left: 0;
}

* {
    margin: 0px;
    padding: 0px;
}
.row {
    margin-right: 0;
    margin-left: 0; 
}
.grayscale
{
    filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -webkit-filter:grayscale(100%);
    -webkit-filter: grayscale(1);
    -o-filter:grayscale(100%);
    -ms-filter:grayscale(100%);
    filter: gray;
}
.swiper-container {
    width: 100%;
    height: 100%;
    position: relative;
}
.swiper-slide {
    overflow-x: hidden ; 
    overflow-y: visible ; 
}

/*black background*/
blockquote.block-caption {
    font-size: 12px;
    font-style: italic;
    width: 88% !important;
}
.wrapper-media {
    padding:0;
    margin-top: 20px;
    margin-bottom: 20px;
}
.wrapper-media img {
    width: 100%;
}
.wrapper-media .EmbeddedTweet {
    width: 100% !important;
}

.wrapper-media blockquote {
    width: 100%;
}

.wrapper-media .twitter-tweet {
    width: 100% !important;
}

.wrapper-media .EmbeddedTweet {
    width: 100% !important;
}

.wrapper-media iframe {
    width: 100%;
}

.read-artikel table {
    width: 100%;
    padding: 2px;
    border: 1px solid #c0c0c0;
}

.read-artikel td {
    border: 1px solid #c0c0c0;
}

.headline-caption-detail{
    padding: 1%;
    background: #fff;
}
.headline-caption-detail small{
    font-size: 16px;
    font-family: Nunito-Sans-Regular;
    color: #000;
}

.read-artikel hr {
    width: 100%;
    background: #000000;
    height: 1px;
}
.read-artikel blockquote{
    border-left:none
}

.block-caption {
    font-size: 15px;
    text-align: left;
    margin: 8px 0;
    padding: 0;
    line-height: 18px;
    color: #767676;
    float: left;
    margin-bottom: 20px;
    font-style: italic;
    width: 100%;
}

.read-artikel blockquote.quote-box {
    margin: 6px 0px;
    color: #000000;
    width: 100%;
    float: left;
    padding: 0;
    margin-top: 10px;
}

.quotation-mark{
    /* margin-top: -10px; */
    font-weight: bold;
    font-size:100px;
    float: left;
    color: #000000;

    width: 100%;
}

.quote-text {
    margin-bottom: 20px;
    display: flow-root;
    padding-left: 16px;
}
.share_it{margin-bottom: 15px;}
.share_it span{
    font-family: roboto-bold;
    opacity: 0.5;
}
.share_it a{list-style: none; text-decoration: none;}
.blog-post-bottom.pull-left {

    margin: 0;

    width:100%!important;
}
.blog-post-bottom.pull-right{
    margin: 0;

    width: 100%;
}
.caption {
    font-family: "robotolight";
    font-style: italic;
    font-size: 12px;
    text-align: left;
    color: gray;
    margin-bottom: 4px;
    width: 510px;
    height: auto;
    display: block;
    line-height: 22px;
}

.row-header{
    padding: 0;
    margin: 0!important;
}
.headline-content {
    height: 110%!important;
    background: #c0c0c0;
    z-index: -100;
}
.headline-content img {
    height:auto;
    width: 100%;
    background-size: cover !important;
    z-index: -100;
}
.header-menu-nav li ul li {
    padding: 2px 0px;
}
.category-sub{
    background: #000!important; margin-top: 0; padding-top: 20px; padding-bottom: 20px; color: #fff;
}
.my-gallery {
    width: 100%;
    float: left;
}
.my-gallery img {

}
.my-gallery figure {
    float: right;
    width: 30%;
    border: thin silver solid;
    margin: 0.5em;
    padding: 0.5em;
    text-align: center;
    font-style: italic;
    font-size: smaller;
    text-indent: 0;


}
.my-gallery figcaption {
    display: none;
}
figure figcaption{
    background: red!important;
    position: absolute;
    bottom: 0;
    left: 0;
    color:red
}
.lightbox{
    width: 45%;
    background: #eee;
    position: relative;
    margin: 150px auto;

}
.lightbox .title-lightbox{
    padding: 5px;
}
.lightbox .title-lightbox h1{
    margin: 0;
    font-size: 18px;
    font-family: roboto-light;
    line-height: 22px;
}
.lightbox .title-lightbox p{
    font-size: 18px;
    font-family: Roboto-slab-bold;
    line-height: 22px;
}

.open-share{
    color: #FFF;
    font-size: 22px;
    position: absolute;
    right: 40px;
    top: 6px;
    cursor: pointer;
}
.light-close{
    color: #FFF;
    font-size: 24px;
    position: absolute;
    right: 10px;
    top: 4px;
    z-index: 9999;
    cursor: pointer;
}
.light-category{
    margin: 0;padding:0;padding: 10px;
    background: #9F0707;margin-bottom: 20px;
}
.light-category h1{
    color: #fff;
    margin: 0;
    font-size: 24px;
    font-family: Roboto-slab-bold;
}
.light-category span{
    padding-top: 2px;
    padding-right: 10px;
    float: left;
    font-size: 24px;
    color: #fff;
    opacity: 0.5;
}
.show-lightbox {
    width: 100%;
    height: 100%;
    left: 0;right: 0;top: 0;bottom: 0;
    position: fixed;
    z-index: 999999;
    background:rgba(0,0,0,0.7);
    display: none;
}
.light-box-news{
    
}
.light-box-news video{
    width: 100%;;
    height: auto;
}

.light-bottom{margin-top: 50px;}
.light-bottom h2{
    font-family: 'Futura-Bold';
    text-align: center;
    margin: 0;
}

.blogShort{ }
.add{background: #333; padding: 10%; height: 300px;}

.nav-sidebar { 
    width: 100%;
    padding: 30px 0; 
    border: 1px solid #ddd;
}
.nav-sidebar a {
    color: #333;
    -webkit-transition: all 0.08s linear;
    -moz-transition: all 0.08s linear;
    -o-transition: all 0.08s linear;
    transition: all 0.08s linear;
    font-size: 18px;
    font-family: Roboto-slab-bold;
}
.tab-content>.active{
    border: none;
}
.nav-sidebar .active a { 
    cursor: default;
    background-color: #9F0707; 
    color: #fff;
    font-size: 18px;
    padding: 6px;
    font-family:Roboto-Slab-Regular;
}
.nav>li>a:hover{
    background-color: #9F0707; 
}
.nav>li>a:focus, .nav>li>a:hover{
    background-color: #9F0707; 
    color: #fff;
}

.nav-sidebar .active a:hover {
    background-color: #9F0707;   
}
.nav-sidebar .text-overflow a,
.nav-sidebar .text-overflow .media-body {
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis; 
}

.btn-blog {
    color: #ffffff;
    background-color: #9F0707;
    border-color: #9F0707;
    border-radius:0;
    margin-bottom:10px
}
.btn-blog:hover,
.btn-blog:focus,
.btn-blog:active,
.btn-blog.active,
.open .dropdown-toggle.btn-blog {
    color: white;
    background-color:#9F0707;
    border-color: #9F0707;
}
article h2{color:#333333;}
h2{color:#0b56a8;}
.margin10{margin-bottom:10px; margin-right:10px;}

.container .text-style
{
    text-align: justify;
    line-height: 23px;
    margin: 0 13px 0 0;
    font-size: 19px;
}
.about{
    padding-left: 6.5%;
    padding-right: 6.5%; 
    min-height: 400px;
    margin-top: 100px;
}
.about-list{
    padding: 0;
    padding-right: 2%;
    margin: 0;
}
.about h2{
    font-family: Roboto-slab-bold;
    font-size: 24px;
    color: #9F0707;
}
.about p{
    font-size: 18px;
    line-height: 32px;
    font-family: roboto-light;
    display: flex;
}

.about-list li{
    line-height: 3;
}
.about-list li:hover{
    background: #9F0707;
}

.wanifra{
    padding: 0;
    padding-right: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    width: 232px;
    height: auto;
}
.wanifra img{
    width: 100%;
    height: auto;
}

/*progressbar*/
.progress{
    float: right;
    width: 60px;
    height: 60px;
    line-height: 60px;
    background: none;
    margin: 0 auto;
    box-shadow: none;
    position: relative;
}
.progress:after{
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 12px solid #fff;
    position: absolute;
    top: 0;
    left: 0;
}
.progress > span{
    width: 50%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    z-index: 1;
}
.progress .progress-left{
    left: 0;
}
.progress .progress-bar{
    width: 100%;
    height: 100%;
    background: none;
    border-width: 12px;
    border-style: solid;
    position: absolute;
    top: 0;
}
.progress .progress-left .progress-bar{
    left: 100%;
    border-top-right-radius: 80px;
    border-bottom-right-radius: 80px;
    border-left: 0;
    -webkit-transform-origin: center left;
    transform-origin: center left;
}
.progress .progress-right{
    right: 0;
}
.progress .progress-right .progress-bar{
    left: -100%;
    border-top-left-radius: 80px;
    border-bottom-left-radius: 80px;
    border-right: 0;
    -webkit-transform-origin: center right;
    transform-origin: center right;
    animation: loading-1 1.8s linear forwards;
}
.progress .progress-value{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: transparent;
    font-size: 12px;
    color: #fff;
    line-height: 55px;
    text-align: center;
    position: absolute;
    top: 5%;
    left: 2%;
    font-family: Roboto-slab-bold;
}
.progress.blue .progress-bar{
    border-color: #5BC0DE;
}
.progress.blue .progress-left .progress-bar{
    animation: loading-2 1.5s linear forwards 1.8s;
}

@keyframes loading-1{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}
@keyframes loading-2{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(144deg);
        transform: rotate(144deg);
    }
}
@keyframes loading-3{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }
}
@keyframes loading-4{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(36deg);
        transform: rotate(36deg);
    }
}
@keyframes loading-5{
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100%{
        -webkit-transform: rotate(126deg);
        transform: rotate(126deg);
    }
}
@media only screen and (max-width: 990px){
    .progress{ margin-bottom: 20px; }
}


/*newstyle*/
/*category*/
.category-page{
    padding: 30px;
}
.category-page a:hover{
    color: #000;
}
.category-link{
    padding: 0;
    margin-top: 30px;
}
.category-link label{
    font-family: 'montserrat', sans-serif!important;
    letter-spacing: 2px;
}
.category-link span{
    margin-right: 5px;
    margin-left: 5px;
    font-size: 18px;
    color: #aaa;
    cursor: pointer;
}
.category-link i{
    color: #aaa;
}
.category-page a{
    list-style: none;
    text-decoration: none;
    color: #000;
    font-family: Roboto-slab-bold;
}
.category-page:nth-child(odd){
    border-right: 0.5px #aaa solid;
}
.category-page:nth-child(even){

}

.category-page img{
    width: 100%;
    height: auto;
    border-radius: 10px;
}
.categor-link span{
    font-size: 18px;
}
.page-img{
    position: relative;
}
.header-content span{
    padding: 0;
    margin: 0;
    color: #fff;
    
}
.header-content span i{
    font-size: 24px;
    margin-right: 18px;
    color: #fff!important;
}
.header-content i{
    font-size: 24px;
    margin-right: 18px;
    color: #fff!important;
}
.header-content span.profile{
    padding: 0;margin: 0;
}
.header-content span.profile img{
    width: 28px;
    height: 28px;
}
.dropdown-toggle::after{
    display: none!important;
}

/*gloabal button*/
.btn-top{
    background: #fff;
    padding: 8px 14px 8px 14px;
    position: absolute;
    z-index: 9;
    top: 0;
    left: 0;
    border: none;
    border-radius: 0;
    font-family: Roboto-Light;
    font-size: 28px;
    color: #000;
}
.category-index {
    padding-left: 8.5%;
    padding-right: 8.5%;
    display: flex;
}
/*timeline*/
.category-timeline{
    margin-top: 50px;
}
.category-timeline .index-desc{
    border-left: 1px #aaa solid;
}
.category-timeline .index-post{
    border-left: none;
}
.category-timeline .index-wrap{
    border-bottom: none;
    margin: 0;
}
.index-wrap {
    margin-top: 40px;
    margin-bottom: 40px;
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 30px;
    padding-bottom: 30px;
    border-bottom: 1px #aaa;
    background: #fff;
    display: flex;
    border-radius: 10px;
}
.category-timeline .index-desc{
    margin: 0;
}
.index-desc{
    padding: 0;
    margin-bottom: 10px;
    display: inline-block;
}
.index-post{
    padding-left: 10px;
    
}
.index-post a{
    list-style: none;
    text-decoration: none;
}
.index-post h2{
    font-size: 26px;
    color: #000;
    margin-top: 10px;
    font-family: 'Nunito-Sans-Bold';
    
}
.index-post time{
    font-family: Roboto-Light;
    letter-spacing: 1px;
    color: #aaa;
}
.index-desc p{
    padding-left: 28px;
    font-size: 18px;
    color: #000;
    font-family: 'Nunito-Sans-Regular';
    font-size: 16px;
    padding-right: 2px;
    margin-bottom: 22px;
    border-left: 1px #aaa solid;
    margin-left: 40px;
}
.category-timeline .index-img{
    margin-bottom: 0;
}
.index-img{
    margin-bottom: 0;
    width: 550px;
}
.index-img img{
    width: 100%;
    object-fit: cover;
    height: 300px;
    border-radius: 10px;
}
.index-thumb{
    padding-left: 8px;
}
.index-thumb h2{
    margin: 0;
    font-size: 16px;
    letter-spacing: 3px;
    font-family: Nunito-Sans-Regular;
    color: #A39797;
}
.index-thumb label{
    
}
.index-desc span{
    margin-right: 10px;
    color: #aaa;
    font-size: 21px;
    float: right;
}
.index-member{
    padding-right: 10px;
}
.banner-category{
    height: 250px;
    overflow: hidden;
    background: red;
}
.index-member a{
    color: #aaa;
    font-size: 14px;
    font-family: Nunito-Sans-Regular;
    letter-spacing: 2px;
}
/*categoryheadline*/
.category-headline{

}
.category-headline h1{
    height: 90px;
    font-size: 28px;
    font-family: 'montserrat', sans-serif;
    font-weight: 600;
    margin-top: 10px;
}
.headline-content h2{
   
    margin: 0;
    font-family: 'montserrat', sans-serif!important;
    font-size: 16px;
    font-weight: normal;
    letter-spacing: 2px;
    color:#fff;
}
.category-headline h2{
    margin: 0;
    font-family: 'Roboto' , sans-serif;
    color: gray;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 2px;
}

.headline-wrap{

}
.headline-img{
    padding: 0;
    width: 265px;
    height: 390px;
    margin: 10px;
    box-shadow: 3px 3px 3px 3px #eee;
    border : 0.3px #eee solid;
    border-radius: 6px;
}
.headline-list{
    border-radius: 6px 6px 0px 0px;
}
.headline-list p{
    margin: 0;
    text-align: center;
    color: #000;
    font-family: Roboto-Light;
    font-size: 16px;
    letter-spacing: 1px;
    padding-bottom: 15px;    
}

.headline-img a{
    list-style: none;
    text-decoration: none;
}
.headline-img img{
    padding-bottom: 20px;
    width: 100%;
    height: 255px;
    object-fit: cover;
    border-radius: 6px;
}
.headline-img h1{
    margin: 0;
    font-size: 22px;
    font-family: Nunito-Sans-Regular;
    color: #000;
    padding-top:3px;
    padding-left: 6px;
    padding-right: 6px;
    letter-spacing: 0!important;

}
.headline-wrap fieldset{
    border: 0;border-top: 1px red solid;
}
.headline-wrap legend{
    width: 100%; 
    text-align: center; 
    border-bottom: 0;
    padding-left: 10px;padding-right: 10px; 
    font-family: Roboto-Light;
    font-size: 18px;
    letter-spacing: 1px;
    /*border-bottom: 1px red solid!Important;*/
}
/*news*/
.category-latest {
    padding-left: 7.5%;
    padding-right: 7.5%;
}
.news-title-category{
    border-top: 5px #A12E2E solid;
    padding-top: 10px;
}
.news-title-category h1{
    font-family: 'Nunito-Sans-Bold';
    color: #A12E2E;
    font-size: 21px;
    padding-bottom: 10px;
}
.news-category{
    
}
.news-category-list{
    float: left;
}

.news-category-list h3{
    margin: 0;
    font-family: 'Nunito-Sans-Bold';
    font-size: 14px;
    letter-spacing: 3px;
    color: #000;
}
.news-category-list h2{
    font-family: 'Nunito-Sans-Regular';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    color: #000;
}
.news-category-img{
    
}
.news-category-img img{
    width: 100%;
    height: 150px;
    object-fit: cover;
}

.news-category-list h3 a{
    font-family: 'Nunito-Sans-Regular';
    font-size: 13px;
    letter-spacing: 3px;
    color: #000;
}
.news-wrap{

}
.news-wrap h1.follow{
    padding-bottom: 10px;
    text-align: center;
    font-family: Roboto-Light;
    font-size: 18px;
    color: red;
    letter-spacing: 1px;
    border-bottom: 1px #000 solid;
}
h1.news-title{
   
}
.news-desc{
    padding: 0;
    margin: 0;
}
.news-desc a{
    list-style: none;
    text-decoration: none;
}
.news-desc h2{
    font-size: 18px;
    letter-spacing: 2px;
    padding-right: 15px;
    text-decoration: none;
    margin-bottom: 0;
    font-family: 'montserrat', sans-serif
}
.news-desc h4{
    font-family: 'montserrat', sans-serif;
    letter-spacing: 2px;
    font-size: 18px;
}
.news-desc time{
    color: #aaa;
    font-family: Roboto-Light;
    font-size: 14px;
}
.news-desc h1{
    font-size: 20px;
    color: gray;
    text-align: left;
    font-family: 'Roboto' , sans-serif;
    font-weight: 600;
    margin-top: 5px;
    margin-bottom: 10px;
    padding-right: 6px;
}
.news-desc span{
    color: #aaa;
    font-size: 16px;
    font-family: Roboto-Light;
    letter-spacing: 1px;
    margin-right: 12px;
}
.news-desc span i{
    color: #aaa;
}
.news-img{
    margin: 0;
    padding: 0;
}
.news-img-list{
    width: 220px;
    height: 196px;
    overflow: hidden;
}


/*category trend*/

.category-trend .container{
    margin-top: 20px;
    border-top: 1px #000 solid;
}
.category-trend-list{
    float: left;
    background: #fff;
    padding: 15px;
    border-radius: 10px;
    border: 5px #EFEDDE solid;
}

.category-trend-list iframe,
.category-trend-list video,
.category-trend-list img{
    width: 100%;
    height: 220px;
    object-fit: cover;
}
.category-trend-list h3{
    margin: 0;
    margin-top: 6px;
    font-family: 'Nunito-Sans-Regular';
    font-size: 13px;
    color: #A39797;
    letter-spacing: 3px;
}
.category-trend-list h2{
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 21px;
}
.category-trend-list a.res-head{
    display: block;
    font-family: 'Nunito-Sans-Regular!important';
    font-size: 16px;
    letter-spacing: 3px;
}
.category-trend-list a{
    display: block;
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 21px;
}
.category-trend-list a:hover{
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 21px;
    display: block;
}
/*hikmah*/
.hikmah{
    
}
.hikmah .container{
    
}


h1.rehat-title{
    border-top: 5px #A12E2E solid;
    padding-top: 10px;
}
h1.rehat-title a{
    
}
   
h1.hikmah-title{
    border-top: 5px #A12E2E solid;
    padding-top: 10px;
}
h1.hikmah-title a{
    font-family: 'Nunito-Sans-Bold';
    color: #A12E2E;
    font-size: 21px;
    padding-top: 10px;
}
h1.hikmah-title span{
    font-size: 21px;
    
}

.hikmah-list{
    float: left;
}
.hikmah-list h2{
    margin: 0;
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 26px;
}
.hikmah-list{
    margin-top: 20px;
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 26px;
}
.hikmah-list a{
    font-family: 'Nunito-Sans-Regular';
    color: #000;
    font-size: 26px;
}
.hikmah-img{
    
}
.hikmah-img img{
    width: 100%;
    height: 120px;
    object-fit: cover;
}
.hikmah-list small{
    font-family: 'Nunito-Sans-Regular';
    color: #000;
    font-size: 16px;
}

.news-terbaru span{
    margin-right: 14px;
}

.news-trends{
    padding: 15px;
    background: #fff;
    border: 6px gray solid; 
    height: 520px;
    border-radius: 10px;
}
.news-trends img{
    width: 100%;
    height: 310px;
    object-fit: cover;
    margin-bottom: 10px;
}
.news-trends a{
    text-decoration: none;
    list-style: none;
}
.news-trends a h2{
    font-size: 18px;
    margin-bottom: 20px;
    color: gray;
    font-family: 'montserrat', sans-serif;
    font-weight: 600;
}
.news-trends h2{
    font-size: 16px;
    letter-spacing: 2px;
    padding-right: 15px;
    text-decoration: none;
    margin-bottom: 0;
    font-family: 'montserrat', sans-serif;
}
.category-bisnis{
    background: #808080;
}
.news-bisnis{
    padding: 15px;
    min-height: 460px;
    margin-top: 10px;
    margin-bottom: 30px;
    background: #fff;
    border-radius:10px; 
    border: 6px #cccccb solid;
}
.news-bisnis img{
    width: 100%;
    height: 310px;
    object-fit: cover;
    margin-bottom: 10px;
}
.news-bisnis a{
    list-style: none;
    text-decoration: none;
}
.news-bisnis h1{
    font-size: 24px;
    font-family: Roboto-Bold;
    color: #000;
    height: 100px;
}
.news-bisnis h2{
    font-size: 13px;
    font-family: Roboto-Light;
    color: #000;
    display: inline-block;
    padding-bottom: 5px;
    letter-spacing: 1px;
}
.news-bisnis span{
    background: #a8092b;
    padding: 5px 15px 5px 15px;
    font-family: Roboto-Light;
    color: #fff;
    border-radius: 10px;
    letter-spacing: 1px;
    font-size: 16px;
}
.news-bisnis a{
    color: #fff;
}

.bg-isu{
    margin: auto;
    height: 220px;
    position: relative;
    display: inline-block;
}
.bg-isu .banner-thumb{
    display: inline-block;
    position: absolute;
    z-index: 9;
    left: 50px;right: 0;
    top: 30px;

}
.bg-isu img{
    width: 100%;
    height: 220px;
}
.viral-slider .owl-controls .owl-page, .owl-controls .owl-buttons div{
    top:0;
    font-size: 24px!important;
}
.viral-slider .owl-next,
.viral-slider .owl-prev{
    top:10px!important;
    font-size: 40px!important;
}
.cek-viral{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #1DADEB;
    padding-top: 22px;
    float: left;
}
.viral-slider{
    width: 80%;
    margin-left: 10%;

}
.viral-slider a{
    list-style: none;
    text-decoration: none;
    color: #000;
    font-family: Roboto-Slab-Bold;
    font-size: 21px;
    text-shadow: 2px 2px #FFF!important;
}
.viral-slider .owl-controls .owl-page, .owl-controls .owl-buttons div{
    font-size: 38px;
}
.viral-slider h1{
    padding-left: 8px;
    padding-right: 8px;
    color: #000;
    font-size: 26px;
    text-shadow: 2px 2px #FFF!important;
    font-family: Roboto-Slab-Bold;
    padding-top: 6px;
    line-height: 40px;
    padding-left: 39px;
}
.viral-slider .owl-prev span, 
.viral-slider .owl-next span{color: #000;}
.cek-viral span{
    color: #fff;
    font-size: 16px;
    font-family: Roboto-Slab-Bold;
    display: block;
}
.bg-categroy{
    margin: auto;
    position: relative;
    display: inline-block;
}
.bg-categroy img{
    text-align: center;
    position: relative;
}
.bg-analisis{
    margin: auto;
    height: 120px;
    position: relative;
    display: inline-grid;
}
.bg-analisis .banner-thumb{
    display: inline-block;
    position: absolute;
    z-index: 9;
    left: 60px;right: 0;
    top: 85px;
}
.analisis{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #1DADEB;
    padding-top: 22px;
    float: left;
}
.analisis span{
    color: #fff;
    font-size: 16px;
    font-family: Roboto-Slab-Bold;
    display: block;
    text-transform: uppercase;
}
.analisis-category{
    width: 60%;
    margin-left: 10%;
    float: left;
}
.analisis-category h1{
    color: #1DADEB;
    padding: 0;margin: 0;
    text-align: left;
    font-size: 26px;
}
/*konten yg saya ikuti*/

.follow-content{
    
}
.follow-content .container{
    
}
.follow-content-title{
    font-family: 'Nunito-Sans-Bold';
    color: #A12E2E;
    font-size: 21px;
    padding-bottom: 10px;
    border-top: 5px #A12E2E solid;
    padding-top: 10px;
}
.follow-content-list{
    float:left;
    background: #fff;
    padding: 15px;
    border-radius: 10px;
    border: 5px #EFEDDE solid;
}
.follow-content-list h3{
    margin: 0;
    margin-top: 6px;
    font-family: 'Nunito-Sans-Regular';
    font-size: 13px;
    color: #A39797;
    letter-spacing: 3px;
}
.follow-content-list img{
    width: 100%;
    height: 220px;
    object-fit: cover;
    margin-bottom: 5px;
}
.follow-content-list h2{
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 21px;
}
.follow-content-title-h2{
    display: inline-block;
}
.follow-me{
    margin-top: 6px;
}


/*rehat*/
.rehat{
    padding-bottom: 30px;
}
.rehat .container{
    border-bottom: 1px #000 solid;
}

h1.rehat-title{
    border-top: 5px #A12E2E solid;
    padding-top: 10px;
}
h1.rehat-title a{
    font-family: 'Nunito-Sans-Bold';
    color: #A12E2E;
    font-size: 21px;
    padding-bottom: 10px;
    padding-top: 10px;
}
h1.rehat-title span{
    font-size: 21px;
}
.rehat-content{
    margin-top: 20px;
    float: left;
    
}

.rehat-emoticon{
    float: left;
    margin-right: 20px;
}
.rehat-desc{
   display: flow-root;
}
.rehat-desc h2{
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 21px;
}
.rehat-desc p{
    font-family: 'Nunito-Sans-Regular';
    color: #000;
    font-size: 16px;
}

/*edisi*/
.catergory-edisi {
    /*background: red;*/

}

/*READ-NEWS*/
.google-assist{
    border-left: 1px #000 solid;
    padding-left: 30px;
}
.google-assist h1{
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 21px;
}
.berlangganan{
    margin-bottom: 30px;
}
.berlangganan h2{
    font-family:  Roboto-Bold;
    line-height: 1.5em;
    display: grid;
    background-color: #a8092b;
    padding: 28px;
    color: #fff!important;
    font-size: 20px;
    
}
.berlangganan span{
    padding: 0;
    font-family:  Roboto-Bold;
    display: contents;
}
.berlangganan .btn-berlangganan {
    background: #fff;
    color: #000;
    cursor: pointer;
    border-radius: 7px;
}
.berlangganan a {
    border: 1px solid #dedede;
    padding: 0.5em;
    font-family: "roboto", sans-serif;
    font-size: 14px;
    font-weight: 300;
    color: #fff;
    text-align: center;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.2em;
}
/*page follow*/
.page-follow{
    margin-top: 70px;    
    padding-left: 2.5%;
    padding-right: 2.5%;
}
.page-follow span{
    font-family: Roboto-Slab-Bold;
    color: #9F0707;
}
.page-follow h1{
    font-family: Roboto-Slab-Bold;
}

.page-category h1{
    font-family: Roboto-Slab-Bold;
    color: #9F0707;
}
.title-page{
    margin: auto;
    width: 90%;
    border-left: 2px #000 solid;
    padding-left: 10px;
}
.title-page p{
    font-family: Roboto-regular;
    letter-spacing: 1px;
    font-style: italic;
    font-size: 16px;
}

/*gloabal button*/
.btn-category{
    border: none;
    border-radius: 0;
    color: #fff;
    font-size: 18px;
    font-family: Roboto-Light;
    letter-spacing: 1px!important;
    text-transform: uppercase;
    
     
}

#owl-demo .item{
    background: #000;
    padding: 5px 5px;
    margin: 10px;
    color: #FFF;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-align: center;
}
.cover-edisi{
    background: #000;
    margin-bottom: 10px;
}

.item-box h1{
    color: #fff;
    font-size: 32px;
    text-align: center;
    line-height: 120px;
}
.button-category{
    text-transform: uppercase;
}

.button-seacrh{
    background: #a8092b;
    width: 100%;
    height: 40px;
    font-family: Roboto-Bold;
    color: #fff;
    margin-top: 4px;
    letter-spacing: 1px;
    font-size: 16px;
}

.button-follow{
    background: #a8092b;
    padding: 10px 40px 10px 40px;
    font-family: Roboto-Light;
    color: #fff;
    margin-top: 4px;
    border-radius: 10px;
    letter-spacing: 1px;
    font-size: 16px;
}
.button-sub{
    background: #4267B2;
    padding: 2px 10px 2px 10px;
    font-family: Roboto-Light;
    color: #fff;
    margin-top: 4px;
    border-radius: 10px;
    letter-spacing: 1px;
    font-size: 12px;
    cursor: pointer;
}


.col-carousel {
    margin: 70px 0;
}

/* owl nav */
.owl-prev span, .owl-next span {
    color: #FFF;
}

.owl-prev span:hover, 
.owl-next span:hover {
    color: #8199A3;
}

.owl-prev, .owl-next {
    position: absolute;
    top: 0;
    height: 100%;
}

.owl-prev {
    left: 7px;
}

.owl-next {
    right: 7px;
}

/* removing blue outline from buttons */
button:focus, button:active {
    outline: none;
}

/*login*/
.login{width: 60%;margin: auto;position: relative;display: flex;}
.login-form{

}
.login-form h1{
    font-family: Futura-Bold;
}
.login-form .modal-dialog{
    margin: 90px auto;
}
.login-form .modal-backdrop{
    z-index: 9;
}
.modal-login{
    padding: 5%;
}
.login-form h4{
    font-family: Roboto-Light;
    letter-spacing: 1px;
}
.login-form span{
    font-family: Futura-Bold;
}
.modal-login label{ font-family: Roboto-Light;font-weight: normal;letter-spacing: 1px;}
.button-login{
    margin-bottom: 50px;
    font-family: Roboto-Light;font-weight: normal;
}
.login-fb{
    background: yellow;
    text-align: center;
    float: left;
    margin-right: 10px;
}
.login-google{
    background: yellow;
    text-align: center;;
    float: left;
}
.btn-fb{background: #3B5999; color:#fff; border:none; font-family: Roboto-Light;font-weight: normal;letter-spacing: 1px;}
.btn-google{background:#D93025 ; color: #fff; border:none; font-family: Roboto-Light;font-weight: normal;letter-spacing: 1px;}

.form-control{border-radius: 0;box-shadow: none!important;-webkit-box-shadow:none!Important;}
.modal-login{}

/*slider*/
#owl-slider-headline .owl-next,
#owl-slider-headline .owl-prev{
    position: absolute;
    z-index: 1;
    top: 40%;
    width: 25px;
    right:-0px;
    font-size: 46px!important;
   
}

/*edisi*/
.category-edisi{
    padding-left: 9%;
    padding-right: 9%;
    padding-bottom: 30px;
    position: relative;
}
.category-edisi img{

}
.edisi-img img{
    width: 95%;
    height: 315px;
}
.thumb-edisi{
    width: 69.5%;
    position: absolute;
    z-index: 9;
    top:0;
    left: 24.5%;
    right: 0;
    bottom: 5px;
    background: RGBA(0,0,0,0.70);
}
.catergory-edisi .owl-controls .owl-page, .owl-controls .owl-buttons div{
    position: absolute;
    right:-18px;
}

.category-edisi .owl-item > div img{
    cursor: pointer;
    opacity: 1;
    border: 6px #000 solid;
}
#owl-slider-edisi .owl-next,
#owl-slider-edisi .owl-prev{
    position: absolute;
    top: 30%;
    bottom: 30%;
    padding: 6px;
    border-radius: 4px;
    border: 1px #fff solid;
    background: #A8092B;
    font-size: 48px!important;
    height: 68px;
    line-height: 10px;
}
.category-edisi .owl-item.center > div{
    cursor: auto;
    margin: 0;
    opacity: 1.0!important;
}
.category-edisi .owl-item:not(.center) > div:hover {
    opacity: 10;
}
.edisi-logo{
    background: #000;
    width: 220px;
    height: 340px;
    line-height: 340px;
    text-align: center;
    z-index: 9999999;
}
.edisi-logo img{
    width: 100%;
}
.edisi-img{

}
.edisi-png img{

    width: auto;
    height: auto;
}

.edisi-cover{
    text-align: center;
}
#owl-slider-edisi p{
    margin: auto;
    text-align: center;
}
.category-edisi h1{
    font-family: Roboto-Light;
    text-align: center;
    font-size: 18px;
    letter-spacing: 1px;
}

/*SEARCH*/
.search-form{

}
.modal-backdrop{
    z-index: 9!important;
}
.search-form .modal-dialog{
    width: 80%;
    margin: 10% auto;
}
search-container .search-container-input {
    height: 100%;
    display: block;
}
.search-container-input .input-group {
    border: none;
    box-shadow: 1px 1px 5px rgba(0,0,0,0.5);
    -moz-box-shadow: 1px 1px 5px rgba(0,0,0,0.5);
    -webkit-box-shadow: 1px 1px 5px rgba(0,0,0,0.5);
}
.search-container.page .input-group {
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
}
.search-container-input .input-group .input-group-addon {
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    -o-border-radius: 0;
    background: #FFF;
    border: none;
}
.search-container-input .input-group .input-group-addon.search-icon {
    width: 8%;
    font-size: 3vw;
    color: #CCD6E0;
}
.search-container-input input[type=text] {
    height: 6vw !important;
    min-height: 42px;
    font-size: 3vw;
    border: none;
    outline: none;
    font-family: "Roboto-Bold";
    text-transform: uppercase;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    color: #411F1F;
}
.search-container-input input[type=text]:focus,
.search-container-input input[type=text]:active {
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    border: none;
}
.search-container-input .input-group .input-group-addon.search-button .btn-search {
    background: #FFCE00;
}
/*parralax
.bg-fixed{
    z-index: 99;
    position: fixed;
}*/
.setting{
    position: fixed;
    z-index: 9;
    top: 13%;
    right: 0;
    padding: 5px;
    z-index: 999;
    width: 300px;
    height: auto;
    box-shadow: 2px 2px 0 2px #000;
}
.setting:after{
    content: '0';
    width: 0;
    text-align: center;
    height: 0;
    color: #eee;
    position: fixed;
    z-index: 9;
    top: 12%;
    font-size: 6px;
    right: 2.8%;
    z-index: 9999999;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #eee transparent;
}
.setting-wrap{
    padding: 10px;
    background: #eee;
}
.setting-wrap ul{

}
ul.bookmark{
    background: #fff;
    height: 100px;
    overflow-x: hidden;
}
ul.bookmark span{
    padding-right: 10px;
}
.setting-wrap ul li{
    padding: 10px;
    text-decoration: none;
    list-style: none;
    font-family: Roboto-Light;
}
.setting-wrap ul li a{
    color: #000;
    text-decoration: none;
    list-style: none;

}
#show_notif_collapse{
    background: #000;
    height: 180px;
    overflow-y: scroll;
    display: none;
}
.notification-list{
    width: 230px;
}
#show_notif_collapse span{
    padding-left: 10px;
    font-size: 13px;
    color: #fff;
}
#show_notif_collapse i{
    margin-right: 10px;
}
.notification{
    position: fixed;
    right: 2.8%;
    top: 4px;
    width: 16px;
    height: 16px;
    border-radius: 50px;
    z-index: 9999999;
    background: #fff;
}
.notification p{
    font-size: 11px;
    line-height: 16px;
    text-align: center;
}
.notification-show{

}
.notification-show{

}
.modal-notif{
    padding: 0;
}
.notification-list{
    padding-bottom: 10px;
    border-bottom: 1.5px #fff solid; 
}
.notification-list h1{
    padding-left: 10px;
    padding-right: 10px;
    font-family: Roboto-Light;
    font-size: 14px;
    display: block;
    color: #fff;
}
.notification-show span{
    padding-left: 10px;
    padding-right: 10px;
    font-family: Roboto-Light;
}
.notification-show i{
    margin-right: 6px;
}

/*profileautor*/
.footer-wrap{
    height: 100%;
    margin-top: 50px;
}
.profile-title {

}
.profile-wrap{
    margin-top: 30px;
}
.profile-autor{
    /*background: red;*/
}
.profile-title h1{
    font-size: 32px;
    font-family: Roboto-Slab-Bold;
}
.profile-desc{
    width: 40%;
}
.profile-desc h1{
    margin: 0;
    font-size: 12px;
    font-family: Nunito-Sans-Bold;
    color: #757171;
    white-space: pre-line;
}
.profile-desc p{
    font-family: Nunito-Sans-Regular;
    font-size: 13px;
    line-height: 24px;
    display: inline-block;
    letter-spacing: 1px;
}
#show-info-writter{
    cursor: pointer;
}

.profile-news{
    margin-top: 30px;
    padding-left: 10px;
}
.profile-news p{
    margin: 0;
    color: #A8092B;
    font-family: Roboto-Light;
    font-size: 16px;
    letter-spacing: 1px;
}
.profile-news h1{
    margin-top: 2px;
    font-family: Roboto-Bold;
    font-size: 21px;
}
.profile-news span,
.profile-news small{
    font-size: 18px;
    font-family: Roboto-Light;
}
.share_itx a{
    margin-right: 6px;
}
.desc-autor{

}
.desc-autor .footer-comment{
    padding: 0;margin: 0;
}

.footer{
    margin: auto;
    text-align: center;
    background: #A8092B;
    padding-top: 4%;
    position: relative;
    z-index: 9;
}

.footer i{
    text-align: center;
    margin: auto;
    font-size: 14px;
    color: #fff;
    float: left;
    padding-right: 10px;
    cursor: pointer;
}
.footer-about{
    float: left;
    border-right: 1px #fff solid;
}
.footer-about h1{
    margin: 0;
    text-align: left;
    font-family: Roboto-Bold;
    font-size: 16px;
    color: #fff;
}
.footer-about h2{
    font-family: Roboto-Bold;
    font-size: 16px;
    text-align: left;
    color: #fff!important;
}
.footer-about p{
    font-family: Roboto-light;
    font-size: 14px;
    line-height: 14px;
    text-align: left;
    color: #fff;
    letter-spacing: 1px
}
.footer-menu{

}
.footer-menu ul {
    float:left;
    padding-left: 2.5%;padding-right: 2.5%;
}
.footer-menu span{
    font-size: 14px;
    margin-right: 6px;
}
.footer-menu ul li.menu{
    margin-bottom: 15px;
    width: 265px;
    list-style: none;
    text-decoration: none;
    text-align: left;
    font-size: 15px;
    color: #fff;
    float: left;
}
.footer-menu ul li a{
    list-style: none;
    text-align: left;
    color: #fff;
    font-size: 14px;
    line-height: 14px;
    font-family: Roboto-Bold;
    letter-spacing: 1px;
    display:flex;
}
ul.show-menu{
    padding-top: 10px;
    padding-left: 22px;
}

.footer-menu ul.show-menu{
    list-style: none;
    text-decoration: none;
    padding:13px;
}
footer-menu ul.show-menu li a{
    list-style: none;
    text-decoration: none;
    font-family: Roboto-Light!important;
}

.footer-menu ul li.menu a{
    color: #fff;
    font-family: 'Nunito-Sans-Regular';
    font-size: 14px;
    padding: 2px;
}

/*newmenu*/

.navmenu-nav li img{
    width: 24px;height: auto;
    float: left;
}

.navmenu-default, .navbar-default .navbar-offcanvas{
    background-color: #000!important;
}
/*ul.navmenu-nav li{border: none;line-height: 0;padding-left: 20px;}*/
ul.navmenu-nav {margin-top: 40px;}
ul.navmenu-nav li{border: none;line-height: 0;padding-left: 20px;display: grid}
.navbar-custom .nav li a{padding: 0!important;}
.navbar-custom .nav li a:active{background: none;}
.nav>li>a:focus, .nav>li>a:hover{background:none!important; }
ul.navmenu-nav li a{
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 19px;
    letter-spacing: 1px;
    list-style: none;
    line-height: 8px;
    text-decoration: none;
    text-transform: none;
    padding-bottom: 10px;
    float: left;
   
}
ul.navmenu-nav li ul li a{
    font-family: 'Nunito-Sans-Regular';
    font-size: 15px ;
    letter-spacing: 1px;
    list-style: none;
    padding-left: 12px;
    text-decoration: none;
    text-transform: none;
}
.navbar-custom .nav li a{padding: 0;}
.navbar-custom .nav li a:hover{
    background: none;
}

.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child>.btn, .input-group-btn:first-child>.btn-group>.btn, .input-group-btn:first-child>.dropdown-toggle, .input-group-btn:last-child>.btn-group:not(:last-child)>.btn, .input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle){
    font-family: Roboto-Light;
    letter-spacing: 1px;
    height: 45px;
    border: none;
}
.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:first-child>.btn-group:not(:first-child)>.btn, .input-group-btn:first-child>.btn:not(:first-child), .input-group-btn:last-child>.btn, .input-group-btn:last-child>.btn-group>.btn, .input-group-btn:last-child>.dropdown-toggle{
    border: 4px #A8092B solid;
    height: 45px;
}

/*login*/
.modal-header{
    background: #fff;
}
.alert-danger{
    font-family: Roboto-Light;
    letter-spacing: 1px;
}
.modal-header h3, .modal-header h4{
    font-family: Roboto-Bold;
}
.modal-footer .text-center{
    font-family: Roboto-Light;
    letter-spacing: 1px;
}
#login .btn{
    font-family: Roboto-Light;
}
.submitBtn{
    background: #A8092B;
    border:none;
    color:#fff!important;
}
.modal-open .modal{
    overflow-x: hidden;
    overflow-y: scroll!important;
}
.button-news{background: #A8092B;}
#share_sosmed_mingguan a,
#share_sosmed a {
    text-align: center;
    margin-bottom: 5px;
}
#share_sosmed_mingguan a span.fa-facebook,
#share_sosmed a span.fa-facebook{
    background:#3B5998;
    width: 35px;height: 30px;
    line-height: 25px;
    color: #fff;
    padding: 4px;
}
#share_sosmed_mingguan a span.fa-twitter,
#share_sosmed a span.fa-twitter{
    background:#55ADEE;
    width: 35px;height: 30px;
    line-height: 25px;
    color: #fff;
    padding: 4px;
}
#share_sosmed_mingguan a span.fa-google-plus,
#share_sosmed a span.fa-google-plus{
    background:#DD4B39;
    width: 35px;height: 30px;
    line-height: 25px;
    color: #fff;
    padding: 4px;
}
.share-sosmed-i{
    display: none;
}

#share_sosmed_p1_pl{
    position: absolute;
    padding: 6px;
    z-index: 99;
    left: 0%;
    margin-top: 6px;
    background: #000;
}

#share_sosmed_p1_{
    position: absolute;
    padding: 6px;
    z-index: 99;
    right: 2%;
    background: #000;
}
#share_sosmed_p1{
    padding: 6px;
    position: absolute;
    z-index: 99;
    right: 4%;
    bottom: 30px;
    background: #000;
}
#share_sosmed_p1 a{
    float: left;
}

.hover-x a{
    text-align: center;
    list-style: none;
    text-decoration: none;
    cursor: pointer;
    color: #eee;
}
.hover-x span.fa-facebook{
    margin: 0;
    background:#3B5998;
    width: 35px;height: 30px;
    line-height: 25px;
    color: #fff;
    padding: 4px;
}
.hover-x span.fa-twitter{
    margin: 0;
    background:#55ADEE;
    width: 35px;height: 30px;
    line-height: 25px;
    color: #fff;
    padding: 4px;
}
.hover-x span.fa-google-plus{
    margin: 0;
    background:#DD4B39;
    width: 35px;height: 30px;
    line-height: 25px;
    color: #fff;
    padding: 4px;
}

.hover-x:hover > div {
    opacity: 1;
    visibility: visible;
    margin-top: 0px;
    position: relative;
    display: block !important;
}

/*multimedia*/
.lbl-foto{
    padding: 7px 7px 10px 10px;
    color: #fff;
    font-family: roboto-light!important;
    font-weight: normal!important;
    font-size: 15px;
    letter-spacing: 1px!important;
    background: #b4b9bl!important;
}
.label-foto{
    padding-left: 6px!important;
    border-left: 20px #b4b9bl solid;
    text-transform: uppercase;
}
.category-foto,
.button-foto{
    background: #b4b9bl!important;
    color: #fff!important;
}


/*dashboard*/
#page-content{
    overflow-x: hidden;
    overflow-y: hidden;
}

#page-content .first-child{
    margin-top: 80px;
}
.dashboard-following{
    padding: 0;
}
.dashboard-following .list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover{

}
.dashboard-following .list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover{
    background-color: #A8092B;
    border-color: #A8092B;
}
.tab-follow{
    padding: 0;
}
.tab-follow i {
    width: 20px;
}
#page-content .list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover{
    background-color: #9F0707;
    color: #fff;
}

#page-content h3{
    padding-right: 2px;
    margin: 0;
}
#page-content h2{
    padding-right: 2px;
   
}
.dashboard-following .list-group a{
    font-family: roboto-light; 
    font-size: 16px;
    letter-spacing: 1px;
}
.dashboard-following th{
    font-family: roboto-light; 
    font-weight: normal;
    letter-spacing: 1px;
}
#listHolder small{
    font-family: roboto-bold; 
    font-weight: normal;
    font-size: 16px;
    font-weight: normal;
}
#listHolder {
    margin-top: 10px;
}
#listHolder .news-bisnis{
    border: 6px#A8092B solid;
}
#listHolder img{
    margin-top: 0!important;
    padding: 0;
}
#listHolder .text-right a{
    list-style: none;
    text-decoration: none;
    color: #fff;
    padding: 6px;
    font-family: roboto-light; 
    letter-spacing: 1px;
    background: #9F0707;
}
#listHolder share_itx,
#listHolder em{
    width: 25px;
    text-align: center;
}
#page-content h4{
    font-family: roboto-light; 
    font-size: 16px;
    font-weight: normal;
    letter-spacing: 1px;
    margin-left: 24px;
}
#page-content label{
    font-family: roboto-light; 
    font-size: 16px;
    font-weight: normal;
    letter-spacing: 1px;
}
.dashboard-following .news-bisnis img{
    margin-bottom: 10px;
}
#notify8 .text-right{
    padding-top: 20px;
}
.share_itx em{
    width: auto;
    text-align: center;
}
.modal_table h4{
    font-family: roboto-Bold; 
    font-size: 16px;
    font-weight: normal;
}
.modal-body{  
    font-family: Roboto-Light;
    font-size: 16px;
    letter-spacing: 1px;
}
#listHolder .text-right{
    padding-top: 22px;
}
#listHolder .text-right a{

}
#owl-banner-slider a{
    color: #fff;
    list-style: none;
    text-decoration: none;
}


/*.collapse {
    display: block!important;
}*/


/*#mobilebanner*/
.bg-hikmah{
    position: relative;
    text-align: center;
    padding-left: 14px;
    padding-right:14px;
    border-radius: 10px;
}
.bg-hikmah img{
    border-radius: 6px;
}
.bg-hikmah h1,
.bg-hikmah h2{
    text-align: center;
}
.bg-hikmah h2{
    color: #000;
    font-family: Roboto-Slab-Bold;
    font-size: 16px;
}
.bg-hikmah a{
    color: #000;
    font-family: Roboto-Slab-Bold;
    font-size: 24px;
}
._hikmah{
    position: absolute;
    z-index: 9;
    top: 0;
    left: 10%;
    right: 10%;
    top:20%;
    text-align: center;
}
.analisis-mb{
    position: relative;
    padding-left: 14px;
    padding-right:14px;
    border-radius: 10px;
}
.analisis-mb img{
    border-radius: 6px;
}
._analisis-mb{
    position: absolute;
    z-index: 9;
    top: 0;
    left: 10%;
    right: 10%;
    top:65%;
    text-align: center;
}
._analisis-mb a{
    color: #000;
    font-family: Roboto-Slab-Bold;
    font-size: 24px;
}
._analisis-mb h1{
    color: #000;
    font-family: Roboto-Slab-Bold;
    font-size: 22px;
}

/*resonansi*/
.resonansi{
   
}
.resonansi .container{
    
}
.resonansi-title{
    border-top: 5px #A12E2E solid;
    padding-top: 10px;
}
h2.resonansi-title a{
    font-family: 'Nunito-Sans-Bold';
    color: #A12E2E;
    font-size: 21px;
    padding-bottom: 10px;
}
.resonansi-profile{
    margin-top: 30px;
    float: left;
    margin-right: 10px;
}
.resonansi-profile img{
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 50%;
}
.resonansi-list{
    margin-top: 60px;
}
.resonansi-list h3{
    margin: 0;
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 21px;
}
.resonansi-list a{
    font-family: 'Nunito-Sans-Bold';
    color: #000;
    font-size: 21px;
}
.resonansi-list a:hover{
    color: #000;
}

.resonansi-list small{
    font-family: 'Nunito-Sans-Regular';
    color: #000;
    font-size: 16px;
}
/*prokontra*/
.prokontra{
    position: relative;
    padding-left: 2px;
    padding-right: 2px;
    border-radius: 10px;
}
.prokontra img{
    width: 100%;
    height: 330px;
    overflow-x: hidden;
    border-radius: 6px;
}
._prokontra{
    position: absolute;
    z-index: 9;
    bottom: 2%;
    left: 6%;
    right: 6%;
}
.__prokontra{
    padding-left: 2px;
}
.__prokontra img{
    width: 100%;
    height: 120px;
}
.__prokontra h1{
    text-align: left;
    color: #fff;
    font-family: Roboto-Slab-Bold;
    font-size: 14px;
}
.viral{
    position: relative;
    padding-left: 14px;
    padding-right:14px;
    border-radius: 10px;
}
.viral img{
    border-radius: 6px;
}
._viral{
    position: absolute;
    z-index: 999;
    top: 40%;
    left: 4%;
    right: 4%;
}
.__viral h1{
    text-align: center;
    color: #fff;
    font-family: Roboto-Slab-Bold;
    font-size: 16px;
    padding-left: 20px;
    padding-top: 5px;
    padding-right: 20px;
}
.__viral a{
    list-style: none;
    text-decoration: none;
}

#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    counter-reset: step;
}

#progressbar li:first-child:after {
    content: none;
}

#progressbar li.active:before, #progressbar li.active:after {
    background: #ee0979;
    color: #000;
}

#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    counter-reset: step;
    font-family: Roboto;

}

#progressbar li {
    list-style-type: none;
    color: #000;
    text-transform: uppercase;
    font-size: 9px;
    width: 33.33%;
    float: left;
    position: relative;
    letter-spacing: 1px;
    text-align: center;
    font-size: 14px;
    font-family: Roboto;
}

#progressbar li:before {
    content: counter(step);
    counter-increment: step;
    width: 40px;
    height: 40px;
    line-height: 40px;
    display: block;
    color: #fff;
    background: #aaa;
    border-radius: 40px;
    margin: 0 auto 10px auto;
}
#progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: #aaa;
    position: absolute;
    left: -50%;
    top: 18px;
    z-index: -1; 
}

#progressbar li:first-child:after {
    content: none;
}

#progressbar li.active:before, #progressbar li.active:after {
    background: #A8092B;
    color: #fff;
}
.payment{
    border: 6px #A8092B solid;
    position: relative;
    text-align: center;
}
#msform{
    padding-top: 30px;
}
.payment-title{

}
.payment-title p{
    font-family: Roboto;
    font-size: 18px;
    padding: 10px;
}
.label-payment{
    border: 2px #aaa solid;
    width: 40%;  
    text-align: center;
    padding-top: 8px;
    font-family: Roboto;
    font-weight: 700;
    font-size: 16px;
    margin: auto;
}
.radio-list{
    display: inline-block;
    width: 65%;
    margin-left: 10px;
    margin-right: 10px;
    border-bottom: 1px #eee solid;
}
.payment-gold,
.payment-platinum{
    display: inline-block;
}
.payment i.platinum{
    color: #aaa;
    font-size: 28px;
    text-align: center;
    margin: auto;
}
.payment i.gold{
    color: goldenrod;
    font-size: 28px;
    text-align: center;
    margin: auto;
}
.payment-platinum a{
    margin: auto;
    text-align: center;
}
.payment-gold p,
.payment-platinum p{
    font-family: Roboto;
    font-size: 16px;
}
.payment label.label-platinum{
    text-align: center;
    cursor: pointer;
    padding: 10px;
    background: #aaa;
    font-size: 19px;
    font-family: Roboto-Light;
    color: #fff;
    text-transform: uppercase;
}
.payment label.label-gold{
    text-align: center;
    cursor: pointer;
    padding: 10px;
    background: goldenrod;
    font-size: 19px;
    font-family: Roboto-Light;
    color: #fff;
    text-transform: uppercase;
}
.payment-voucher .form-control{
    text-align: center;
    margin: auto;
    width: 150px;
}
.btn-payment{
    background: #A8092B;
    width: 150px;
    padding: 10px 30px 10px 30px;
    border: 1px #A8092B solid;
    color: #fff;
}
.btn-payment-close{
    background: #fff;
    padding: 10px 30px 10px 30px;
    border: 1px #000 solid;
    width: 150px;
    color: #000;
}
.panel-style{
    padding-top:10px; padding-bottom: 4px; text-align: left;
}

.badge {
    position: absolute;
    display: inline-block;
    padding: 3px 7px;
    font-size: 12px;
    color: #fff;
    background-color: #777;
    border-radius: 30px;
    padding: 38px;
    line-height: 28px;
    background-color: transparent!important;
    left: 18px;
}
/*gerai*/
.modal-body{border: none;}
.detailPhoto {padding: 0;background: #ffffff; font-size: 14px; text-align: left; border: 1px solid #333;margin-bottom: 10px;}
.mainPhoto {max-width: 400px; margin: 0 auto;}
.photoPrice {margin-bottom: 1em; text-align: left; border-top: 1px solid #e8e8e8; padding-top: 1em;}
.right {float: right;}  

.wizard-steps-panel .step-number.doing .number, .wizard-steps-panel .step-number.doing .number:after, .wizard-steps-panel .step-number.doing .number:before {
    background-color: #A8092B;
    border: 4px solid #A8092B;
    color: white;
    font-family: Roboto-Light;
}
.wizard-steps-panel {
    position: relative;
    height: 4em;
}
.wizard-steps-panel.steps-quantity-3 .step-number {
    width: 32%;
}
.wizard-steps-panel .step-number {
    display: inline-block;
    text-align: center;
    font-size: 22px;
    position: relative;
}
.wizard-steps-panel .step-number .number {
    width: 1.7em;
    height: 1.7em;
    background-color: #dedede;
    color: #5a5a5a;
    margin-left: calc(50% - 1.7em / 2 );
    border: 4px solid #dedede;
    border-radius: 1.7em;
}
.wizard-steps-panel .step-number .number:before {
    content: ' ';
    position: absolute;
    border: 4px solid #dedede;
    border-radius: 4px;
    left: -4px;
    right: calc( 50% + 1.4em/2 );
    top: calc( 1.4em / 2 );
}
.wizard-steps-panel .step-number .number:after {
    content: ' ';
    position: absolute;
    border: 4px solid #dedede;
    border-radius: 4px;
    left: calc( 50% + 1.4em/2 );
    right: -4px;
    top: calc( 1.4em / 2 );
}
#geraiEpaper label.label-platinum{
    font-family: Roboto-Light;
    color: #333;
    padding: 10px;
    cursor: pointer;
    font-weight: normal;
    border: 1px #eee solid;
}
#geraiEpaper label.label-platinum:hover{
    background:#aaa;
    color: #fff;
}
#geraiEpaper label.label-gold{
    font-family: Roboto-Light;
    color: #333;
    padding: 10px;
    cursor: pointer;
    font-weight: normal;
    border: 1px #eee solid;
    padding: 10px;
}
#geraiEpaper label.label-gold:hover{
    background:#DAA520;
    color: #fff;
}
.wizard-step label {
    font-family: Roboto-Light;
    font-weight: normal;
}

/*menunew*/

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    background-color: #000!important;
    overflow-x: hidden;
    transition: .6s;
    padding-top: 60px;
}

.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    transition: 0.3s;
}

.sidenav a:hover {
    color: #f1f1f1;
}

.sidenav .closebtn {
    position: absolute;
    top: -5px!important;
    right: 25px;
    font-size: 48px;
    color: #fff;
    margin-left: 50px;
    line-height: inherit!important;
}
.closebtn a{
    list-style: none;
    text-decoration: none;
}
#header-fix,
#main {
    transition: margin-left .6s;
}
.dropdown-menu-nav-right{
    float: right;
}

.show-submenu1,
.show-submenu2,
.show-submenu3,
.show-submenu4,
.show-submenu5,
.show-submenu6,
.show-submenu7,
.show-submenu8,
.show-submenu9{
    display: none;
    padding-left: 23px;
}


.footer-sub1,
.footer-sub2,
.footer-sub3,
.footer-sub4,
.footer-sub5,
.footer-sub6,
.footer-sub7,
.footer-sub8,
.footer-sub9{
    display: none;

    
}

.footer-sub2 ul{
    
}
.footer-menu .menu li::marker{
    list-style: none;
    text-decoration:none;
}
@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
}

.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #A8092B;
    border-color: #A8092B;
}
.pagination>li>a, .pagination>li>span{
    color: #000 ;
}
.nav{
    
}
.navbar-custom .nav .dropdown-menu.notifications .notifications-footer a{
    background: #000;
}
.showplus i{
    float: left;
    color: #fff;
    line-height: 16px;
    padding-right: 5px;
    cursor: pointer;
    font-size: 16px;
}
.showplus i.fa fa-plus,
.showplus i.fa fa-minus {
    font-size: 16px;
}

/*eppaper*/
.middle {
    margin-top: 20px;
}
/*epaper*/
#mycart h2{
    color:#000;
    font-family: Roboto-Light;
    font-weight: normal;
}
.btn-secondary:hover{
    background: transparent;
}
a#next{
    padding: 4px 38px!important;
}
.btn-secondary:active:hover, .btn-secondary:active:focus, .btn-secondary:active.focus, .btn-secondary.active:hover, .btn-secondary.active:focus, .btn-secondary.active.focus, .open > .btn-secondary.dropdown-toggle:hover, .open > .btn-secondary.dropdown-toggle:focus, .open > .btn-secondary.dropdown-toggle.focus{
    background: transparent;
    border: none;
    outline: 0;
    box-shadow: none;
}
.pagination-nav{margin-bottom: 30px;}
/*epaper*/
.page-thumb .page-number{
    background: #A8092B;
    color: #fff;
    border: none;
}
button.cart {
    background: #A8092B;
}
button.btn-success{
    border-color: #A8092B; 
}
.update-article{
    float: left;
    width: 400px;
    font-size: 16px;
    border-left: 2px #aaa solid;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 15px;
    margin-bottom: 15px;
    margin-left: 50px;
    margin-right: 20px;
}
.update-title{
    padding: 4px;
    background: #B31233;
}
 h1.update-title{
    margin: 0; 
    font-family: Roboto-Bold;
    color: #fff;
    font-size: 18px;
    margin-bottom: 10px;
}
.update-article ul{
    
}
.update-article li{
    list-style: none;
    margin-bottom: 10px;
}
.update-article li a{
    color: #000;
    font-family: Roboto-Bold;
    font-weight: normal;
}
/*produk*/
.product{
    margin-top: 40px;
    margin-bottom: 40px;
    padding-left: 4%;
    padding-right: 4%;
}
.product-gerai{
    padding-left: 2%;
    padding-right: 2%;
}
h1.product-title{
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 21px;
    letter-spacing: 2px;
    color: red;
    text-align: left;
}
.product-list{
    margin-top: 20px;
}
.product-list img{
    width: 100%!important;
    height: 265px;
    /*object-fit: cover;*/
    border-radius: 6px;
    margin-bottom: 20px;
}
.product-list h2{
    font-size: 22px;
    font-family: 'montserrat', sans-serif;
    font-weight: 600;
    color: #000;
}
.product-list p{
    font-size: 18px;
    font-family: Nunito-Sans-Regular;
}

.product-list h3{
    font-size: 16px;
    font-family: Roboto-Light;
    color: #aaa;
}
/*jadwal imsakiyah*/

ul.jadwal-imsakiyah {
    padding: 1em;
    box-shadow: -1px 2px 10px -4px rgba(0,0,0,0.5);
    border-radius: 10px;
    background: #3883B4;
    color: #fff;
    z-index: 9999999;
}

ul.jadwal-imsakiyah li {
    margin-right: 1em;
    border-right: 1px solid rgba(0,0,0,.1);
    padding-right: 1em;   
    display: inline-block;
}
ul.jadwal-imsakiyah li.title{
    font-weight: 700;
}

ul.jadwal-imsakiyah li.imsak{
    border: 1px #fff solid;
    border-radius: 4px;
    padding: 8px;
    color: #fff;
    float: left;
    text-align: center;
}
ul.jadwal-imsakiyah li.days{
    border: 1px #fff solid;
    border-radius: 4px;
    padding: 8px;
    color: #fff;
    float: left;
    text-align: center;
}

.imsakiyah{
    border: 1px #fff solid;
    float: right;
    width: 100%;
    
}
.time-imsak{
    text-align: right;
    /*background: #26A5D8;*/
    margin: 10px;
    background: #2ECC71;
    background: url(img/jadwal-sholat.png) no-repeat no-repeat;
    height: 130px;
}
.time-imsak h1{
    text-align: center;
    border-bottom: 1px #fff solid;
    color: #fff;
    margin: 0;
    text-transform: uppercase;
    font-size: 24px;
    font-family: Futura-Bold;
    letter-spacing: 1px;
}

.time-imsak ul{
    padding: 0;
    display: contents;
}
.time-imsak ul li{
    float: left;
    list-style: none;
    text-decoration: none;
    color:#fff;
    text-align: center;

    padding: 8px
}
.time-imsak ul li p{
    color: #fff;
    padding: 20px;
    padding: 0;
    margin: 0;
    font-size: 14px;
    font-family: Futura-Light;
    letter-spacing: 1px;
}
.time-imsak ul li span{
    display: list-item;
    color: #fff;
    font-size: 14px;
    font-family: Futura-Light;
    letter-spacing: 1px;
}
.parameter-setting{
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
}
.parameter-setting .kota{
    color: #fff;
}
.parameter select{
    border: none;
    outline: 0;
}#timer{
    background: #40B1DC; 
    bottom: 0;
    width: 100%;
    z-index: 999999;
    width: 970px;
    height: 90px;
    text-align: center;
    font-size: 26px;
    margin: auto;
    border :2px #fff solid;
    background: url(img/bannertime.png) no-repeat no-repeat;
    left: 0;
    margin-top: 60px;
    padding-top: 10px;
}

/*--jadwal sholat--*/
.jadwal-sholat{
    width: 100%;
    background: url(img/banner-imsak.png) no-repeat no-repeat;
    padding: 0;
    margin-top: 1em;
    font-family: Futura-Light;
    border: 4px #13A89E solid;
}

jadwal-sholat-wrap {
    padding: 25px;
    height: 196px
}
.jadwal-sholat-wrap span {
    margin: 10px;
    display: inline-block;
    color: #fff;
    font-size: 18px;
    font-family: Montserrat;
    font-weight: 600
}
.jadwal-sholat-wrap .select-group {
    background-color: #fff;
    position: relative;
    width: 166px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1);
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-borderradius: 3px;
    -o-border-radius: 3px;
    display: inline-block;
    vertical-align: top;
    float: right
}
.jadwal-sholat-wrap .select-group::before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 40px;
    background-color: #1ba0e2;
    border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px
}
.jadwal-sholat-wrap .select-group .select-form {
    width: 100%;
    background-color: transparent;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    z-index: 2;
    height: 30px;
    color: #000;
    padding-left: 10px;
    padding-right: 40px;
    font-size: 14px;
    cursor: pointer;
    outline: 0!important
}
.jadwal-sholat-inner-wrap table {
    width: 100%
}
.jadwal-sholat-inner-wrap td {
    font-size: 18px;
    color: #000;
    font-family: Futura-Light;
    padding: 10px 0 0;
    text-align: left;
}
.jadwal-sholat-inner-wrap thead td {
    color: #000;
    text-align: center;
    background: rgba(255, 255, 255, .9);
    font-family: Futura-Light;

    padding: 14px;
}
.jadwal-sholat i {
    color: #fff;
    font-size: 24px;
    position: absolute;
    right: 12px;
    top: 2px
}
.table-jadwal a{
    color: #000;   
}

.jadwal-sholat-wrap {
    padding: 1em;
    height: auto;
    width: 100%;
}
.jadwal-sholat-wrap span {
    margin: 10px 0;
    display: inline-block;
    color: #000;
    font-size: 18px; 
    font-weight: 600;
    font-family: Futura-Light;
}

.jadwal-sholat-inner {
    margin-bottom: 10px;
    /*border-bottom: 2px #F8E6C5 solid;*/
}

.jadwal-sholat-inner-wrap td {
    font-size: 15.8px;
    font-family: Futura-Light;
    padding: 10px 0 0;
    text-align:center;
    font-weight: bold;
}
.jadwal-sholat-inner-wrap thead td {
    color: #000;
    text-align:center;
    font-family: Futura-Light;
    padding: 0px;
    width: 17.9%;
    /*background: #E83066;*/
    /*border: 1px #Eee solid;*/
}
.table-jadwal a {
    color: #000;
    font-weight: bold;
}
.bg-quran{
    margin-top: 40px;
}

.quran{
    /*background: #13A89E;*/
    margin-top: 30px;
    padding-left: 5%;
    padding-right: 5%;
}
.logo-ramadhan{
    padding-top: 20px;
}

/*donasi*/
    .banner-atas {
    background-color: #000;
    line-height: 10px;
    text-align: left;
    letter-spacing: 1px;
    color: #fff;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    padding-right: 5px;
    object-position: bottom;
        
}

#ltumatp h3 {
    font-family: Roboto, sans-serif;
    
}

.btn-cls {
    font-size: 30px;
    padding-top: 15px;
    float: right;
    color: #fff;
    text-decoration: none;
    font-style: normal
}

.hero-unit .back {
    background-color: #f4eb12
}

.back {
    background-color: #f4eb12;
    padding-bottom: 15px;
    padding-top: 10px
}

.hero-unit h2{
    color: #8C7914;
    font-family: Monserrat;
    font-weight: 600;
}
.contribute{
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}
.contribute a{
    text-align: center;
    padding: 10px 10px 10px 10px;
    background:#8C7914;
    color: #aaa;
    border-radius: 5px;
}
a.btn-pay{
    text-align: center;
    background:#8C7914;
    width: 200px!important;
    color: #aaa;
    border-radius: 5px;
    display: inline-block;
}
.hero-unit p {
    color: #8C7914;
    font-family: Monserrat;
    font-size: 18px!important;
    font-weight: 600!important;
}
.select-donasi{
    
}
.select-donasi-list label{
    color: #8C7914;
    font-family: Monserrat;
    font-size: 18px!important;
    font-weight: 600!important;
}
.bg-isi {
    
}

.garis {
    border-left: 1px solid rgba(20, 19, 19, .59);
    padding-right: 10px
}

.halaman-nominal {
    height: auto;
}
.banner-atas h3{
    float: left;
}

#ltumat{
    display: none;
}
#ltumat1{
    display: block;
    
}
#ltumatp {
    font-family: Roboto, sans-serif;
    font-size: 16px;
    line-height: 25px
}
.wrapper-ltumat{
    position: fixed;
    z-index: 9999999;
    bottom: 0;
    margin: auto;
    left: 0;
    right: 0;
    background-color: #000;
    width: 373px;
    height: auto;
    border-radius: 15px;
}
.bglt-umat{
    padding: 10px;
}
.bglt-umat img{
    float: right;
}
.tombol {
    font-family: Roboto, sans-serif
}

.tombolkonten {
    font-family: Roboto, sans-serif;
    font-size: 16px;
    padding-top: 15px
}

.blok {
    background-color: #fff;
    font-weight: 700
}

.ket {
    font-size: 13px;
    letter-spacing: .9px;
    opacity: .5;
    line-height: 16px
}

#ltumatp .checkbox {
    font-size: 20px;
    -moz-appearance: none;
    -webkit-appearance: none;
    transform: scale(1);
    line-height: 30px
}

.besaran {
    transform: scale(1.2)
}

.ukuran {
    -moz-appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px
}

.tom_ngikut {
    float: right;
    -moz-appearance: none;
    -webkit-appearance: none
}
.halaman-nominal {
    padding-top: 0;
}

#ltumat .photoPrice {
    margin-bottom: 0em;
    text-align: left;
    border-top: 1px solid #e8e8e8;
    padding-top: 0em;

}
#ltumat label {
    display: block;
    margin-bottom: .375rem;
    font-weight: normal;
    font-size: 12px;
}
/*new*/

.button-jurnal-foto,
.lbl-jurnal-foto,
.label-jurnal-foto,
.button-rana,
.lbl-rana,
.label-rana,
.button-fotografi,
.button-galeri-foto,
.lbl-galeri-foto,
.label-galeri-foto,
.button-fotografi,
.lbl-fotografi,
.label-fotografi{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px #065FD4 solid;
    border-radius: 10px;
}


.lbl-fikih-muslimah,
.lbl-mujahidah,
.lbl-sepak-bola,
.lbl-nostalgia,
.lbl-kronik,
.button-ziarah,
.lbl-ziarah,
.label-ziarah,
.button-kosmetik,
.lbl-kosmetik,
.label-kosmetik,
.button-fashion,
.lbl-fashion,
.label-fashion,
.button-filantropi,
.lbl-filantropi,
.label-filantropi,
.button-perencanaan,
.lbl-perencanaan,
.label-perencanaan,
.button-kuliner-halal,
.lbl-kuliner-halal,
.label-kuliner-halal,
.button-belanja-halal,
.lbl-belanja-halal,
.label-belanja-halal,
.button-ziarah,
.lbl-ziarah,
.label-ziarah,
.button-madeena,
.lbl-madeena,
.label-madeena{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px #CE3F3B solid;
    border-radius: 10px;
}

.button-arsitektur,
.lbl-arsitektur,
.label-arsitektur,
.button-dunia-islam,
.lbl-dunia-islam,
.label-dunia-islam,
.button-oase,
.lbl-oase,
.label-oase,
.button-mujadid,
.lbl-mujadid,
.label-mujadid,
.button-tema-utama,
.lbl-tema-utama,
.label-tema-utama{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px orange solid;
    border-radius: 10px;
}


.button-kitab,
.lbl-kitab,
.label-kitab,
.button-wawancara,
.lbl-wawancara,
.label-wawancara,
.button-wawasan,
.lbl-wawasan,
.label-wawasan,
.button-bincang-kreatipreneur,
.lbl-kreatipreneur,
.label-bincang-kreatipreneur,
.button-bincang-bisnis,
.lbl-bincang-bisnis,
.label-bincang-bisnis,
.button-hiwar,
.lbl-hiwar,
.label-hiwar,
.button-konsultasi-syariah,
.lbl-konsultasi-syariah,
.label-konsultasi-syariah{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px #3BC9F7 solid;
    border-radius: 10px;
}
.button-bodetabek,
.lbl-bodetabek,
.label-bodetabek,
.button-urbana,
.lbl-urbana,
.label-urbana,
.button-jakarta,
.lbl-jakarta,
.label-jakarta{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border-bottom: 6px #3BC9F7 solid;
    border-radius: 10px;
}

.lbl-muhibah,
.lbl-zakat,
.button-sedekah-soal,
.lbl-sedekah-soal,
.label-sedekah-soal,
.button-silaturahim,
.lbl-silaturahim,
.label-silaturahim,
.button-uswah,
.lbl-uswah,
.label-uswah,
.button-tasawuf,
.lbl-tasawuf,
.label-tasawuf,
.button-laporan-utama,
.lbl-laporan-utama,
.label-laporan-utama,
.button-muhibah,
.lbl-muhibah,
.label-muhibah,
.button-komunitas,
.lbl-komunitas,
.label-komunitas,
.button-fatwa,
.lbl-fatwa,
.label-fatwa,
.button-rehal,
.lbl-rehal,
.label-rehal{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px rosybrown solid;
    border-radius: 10px;
}

.lbl-indeks{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width:40px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px #D31C1C solid;
    border-radius: 10px;
}

.button-iqtishodia,
.label-iqtishodia,
.lbl-iqtishodia,
.button-dialektika,
.label-dialektika,
.lbl-dialektika,
.button-islamia,
.label-islamia,
.lbl-islamia,
.button-suplement,
.label-suplement,
.lbl-suplement,
.button-suplemen,
.label-suplemen,
.lbl-suplemen{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px #2ECC71 solid;
    border-radius: 10px;
}

.button-iqtishodia,
.label-iqtishodia,
.lbl-iqtishodia,
.button-dialektika,
.label-dialektika,
.lbl-dialektika,
.button-islamia,
.label-islamia,
.lbl-islamia{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px #2ECC71 solid;
    border-radius: 10px;
}
.lbl-nostalgia,
.lbl-tuntutan,
.lbl-tokoh,
.button-jalanjalan,
.lbl-jalanjalan,
.label-jalanjalan,
.button-pustaka,
.lbl-pustaka,
.label-pustaka,
.button-sastra,
.lbl-sastra,
.label-sastra,
.button-geni,
.lbl-geni,
.label-geni,
.button-senggang,
.lbl-senggang,
.label-senggang{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 45px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px #707272 solid;
    border-radius: 10px;
}
.button-sudut-pandang,
.lbl-sudut-pandang,
.label-sudut-pandang,
.button-refleksi,
.lbl-refleksi,
.label-refleksi,
.button-fokus-publik,
.lbl-fokus-publik,
.label-fokus-publik,
.button-surat-pembaca,
.lbl-surat-pembaca,
.label-surat-pembaca,
.button-rehat,
.lbl-rehat,
.label-rehat,
.button-hikmah,
.lbl-hikmah,
.label-hikmah,
.button-resonansi,
.lbl-resonansi,
.label-resonansi,
.button-tajuk,
.lbl-tajuk,
.label-tajuk,
.button-opini,
.lbl-opini,
.label-opini{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inine-flex;
    border-bottom: 8px #707272 solid;
    border-radius: 10px;
}


.button-internasional,
.lbl-internasional,
.label-internasional,
.button-khazanah,
.lbl-khazanah,
.label-khazanah,
.button-nasional,
.lbl-nasional,
.label-nasional,
.button-olahraga,
.lbl-olahraga,
.label-olahraga,
.button-ekonomi,
.lbl-ekonomi,
.label-ekonomi{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border-bottom: 8px #afe2d0 solid;
    border-radius: 10px;
}

.button-podium,
.label-podium,
.lbl-podium,
.button-teraju,
.label-teraju,
.lbl-teraju,
.button-fokus-internasional,
.label-fokus-internasionalu,
.lbl-fokus-internasional,
.label-pareto,
.lbl-pareto,
.button-narasi,
.label-narasi,
.lbl-narasi,
.button-in-depth,
.label-in-depth,
.lbl-in-depth{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #4F75F2 solid;
    border-radius: 10px;
}


.button-kisah-mancanegara,
.label-kisah-mancanegara,
.lbl-kisah-mancanegara,
.button-kisah-dalam-negri,
.label-kisah-dalam-negeri,
.lbl-kisah-dalam-negeri,
.button-ficer,
.label-ficer,
.lbl-ficer{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #4F75F2 solid;
    border-radius: 10px;
}


.button-analisis,
.lbl-analisis,
.label-analisis{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #707272 solid;
    border-radius: 10px;
}


.button-hikmah,
.lbl-hikmah,
.label-hikmah,
.button-kabar-utama,
.lbl-kabar-utama,
.label-kabar-utama{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #065FD4 solid;
    border-radius: 10px;
    
}

 .lbl-rana{   
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #065FD4 solid;
    border-radius: 10px;
}
 .button-otomotif,   
 .label-otomotif,   
 .lbl-otomotif,   
 .button-keluarga,   
 .label-keluarga,   
 .lbl-keluarga,   
 .label-sehat,   
 .lbl-gaya-sehat,   
 .button-sehat,   
 .label-sehat,   
 .lbl-gaya-sehat,   
 .button-hidup,   
 .label-gaya-hidup,   
 .lbl-gaya-hidup,   
 .button-inovasi,   
 .label-inovasi,   
 .lbl-inovasi{   
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #9F74A4 solid;
    border-radius: 10px;
    
}

 .button-otomotif,   
 .lbl-otomotif,   
 .label-otomotif,  
 .button-keluarga,   
 .button-sehat,   
 .lbl-sehat,   
 .label-sehat,  
 .button-keluarga,   
 .lbl-keluarga,   
 .label-keluarga,  
 .button-family,   
 .label-family,  
 .lbl-family{   
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #9F74A4 solid;
    border-radius: 10px;
}
 .lbl-rubrikasi{   
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px red solid;
    border-radius: 10px;
}
.lbl-islam-diggest{   
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px red solid;
    border-radius: 10px;
}
.button-urbana,
.label-urbana,
.lbl-urbana{   
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px red solid;
    border-radius: 10px;
}
.button-berita,
.label-berita,
.lbl-berita{   
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px red solid;
    border-radius: 10px;
}
.lbl-rekor{   
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 35px;
    color: #000;
    display: inline-flex;
    border-bottom: 6px red solid;width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px red solid;
    border-radius: 10px;
}
.lbl-islam-digest,
.lbl-dialog-jumat{   
    font-weight: normal;
    font-size: 16px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px red solid;
    border-radius: 10px;
}
.button-diy,
.label-diy,
.lbl-diy,   
.button-jawa-tengah,
.label-jawa-tengah,
.lbl-jawa-tengah,   
.button-jawa-barat,
.label-jawa-barat,
.lbl-jawa-barat,   
.button-jawa-timur,
.label-jawa-timur,
.lbl-jawa-timur,   
.button-jalan-jalan,
.label-jalan-jalan,
.lbl-jalan-jalan,   
.button-nusantara,
.label-nusantara,
.lbl-nusantara,   
.button-daerah,
.label-daerah,
.lbl-daerah{   
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #F00657 solid;
    border-radius: 10px;
    
}

.lbl-jurnal-foto,
.lbl-rana,
.lbl-foto,
.lbl-fotografi,
.lbl-interaktif,
.label-interaktif,
.button-multimedia,
.lbl-multimedia,
.label-multimedia{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #B381CE solid;
    border-radius: 10px;
    
}
.button-interaktif,
.lbl-interaktif,
.label-interaktif,
.button-multimedia,
.lbl-multimedia,
.label-multimedia{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #FFB149 solid;
    border-radius: 10px;
    
}
.button-kisah-ficer,
.lbl-kisah-ficer,
.label-ficer,
.button-kisah-mancanegara,
.lbl-kisah-mancanegara,
.label-kisah-mancanegara{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #4CAF50 solid;
    border-radius: 10px;
}
.button-kuliner-halal,
.lbl-kuliner-halal,
.label-kuliner-halal,
.label-kosmetik,
.button-kosmetik,
.lbl-kosmetik,
.label-kosmetik,
.button-filantropi,
.lbl-filantropi,
.label-filantropi,
.button-perencanaan,
.lbl-perencanaan,
.label-perencanaan,
.button-belanja-halal,
.lbl-belanja-halal,
.label-belanja-halal,
.button-ziarah,
.lbl-ziarah,
.label-ziarah,
.button-madeena,
.lbl-madeena,
.label-madeena{
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 1px;
    width: 40px;
    color: #000;
    display: inline-flex!important;
    border-bottom: 8px #4CAF50 solid;
    border-radius: 10px;
}


.news-trends .follow-text{color: #fff;background:#A8092B;padding: 8px; border-radius: 5px; margin-top: 20px; }
.article-related{
    margin-top: 20px;
    width: 300px;
    display: inline-block;
    height: auto;
    position: relative;
}
.article-related.related-sticky {
    position: fixed;
    position: -webkit-sticky;
    top: 140px;
    z-index: 10;
}

.title-related{
     text-align: center;
     line-height: 10px;
     letter-spacing: 1px;
}
.title-related h3{
     margin: 0;
}

.article-related ul{margin-top: 20px;}
.article-related ul li{list-style: none;text-decoration: none;margin-bottom: 10px;}
.article-related ul li a{
    color:#A8092B;
    font-size: 18px;
    font-family: 'Roboto' , sans-serif;
    font-weight: 700;
}
.article-related-title{
    font-family: 'Nunito-Sans-Bold';
    color: #A12E2E;
    font-size: 21px;
    border-bottom: 1px #000 solid;
    padding-bottom: 10px;
}

.ctg-family{
     background: #9f74a4;
     
     padding: 12px;
     -moz-border-radius-topleft: 0px;
     -moz-border-radius-topright:59px;
     -moz-border-radius-bottomleft:0px;
     -moz-border-radius-bottomright:59px;
     -webkit-border-top-left-radius:0px;
     -webkit-border-top-right-radius:59px;
     -webkit-border-bottom-left-radius:0px;
     -webkit-border-bottom-right-radius:59px;
     border-top-left-radius:0px;
     border-top-right-radius:59px;
     border-bottom-left-radius:0px;
     border-bottom-right-radius:59px;
}

.tag{
   
    border-radius: 9px;
}

/*read literasi*/

.read-literasi{
    padding-top: 20px;
    padding-bottom: 20px;
    border-top: 5px #8C7914 solid;
    width: 100%;
    background: #000;
}
.read-literasi h2{
    color: #8C7914;
    border-bottom: 2px #8C7914 dotted;
    font-size: 28px;
    font-family: monserrat;
    font-weight: 600;
}
.literasi-list{
    margin-bottom: 10px;
    display: flex;
}

.literasi-name{width: 60%;float: left;}
.literasi-name h3{
    color: #8C7914;
    font-size: 21px;
    font-family: monserrat;
}
.literasi-price {width: 40%;float: right;}
.literasi-price p{
    color: #8C7914;
    font-size: 21px;
    font-family: monserrat;
}
.select-donasi-news{
    margin-top: 10px;
}
.select-donasi-news label{
    display: block;
    font-family: monserrat;
}

.desc-literasi-umat{
    background: #fff;
    padding: 2%;
    text-align: center;
}
.literasi-border{
    margin: auto;
    width: 80px;
    height: 6px;
    background: #8C7914;
    text-align: center;
}
.desc-literasi-umat h2{
    color: #aaa;
    font-size: 32px;
    font-style: italic;
    font-weight: 600;
    font-family: monserrat;
}


.more-active img{
    width: 100%;
    object-fit: cover;
    height: 400px;
}
.more-active-list{
    background: #fff;
    border-radius: 10px;
    padding-left: 2.5%;
    padding-top: 30px;
    padding-bottom: 40px;
}
.more-noactive-list{
    background: transparent!important;
    border-radius: 10px;
    padding-left: 2.5%;
    padding-top: 30px;
    padding-bottom: 40px;
}
.more-active-list h2{
    margin-top: 20px;
    font-family: 'Nunito-Sans-Bold';
    color:#000;
    font-size: 21px;
}
.more-active-list p{
    margin-top: 30px;
    color:#000;
    font-family: 'Nunito-Sans-Regular';
    font-size: 16px;
    line-height: 32px;
    margin-bottom: 30px;
    
}

.tag-family{
    background: #9F74A4;
    /*background: yellow;*/
}
.tag-kabar-utama{
    background: #065FD4;
}
.tag-kisah-dalam-negeri,
.tag-kisah-mancanegara,
.tag-ficer{
    background: #9F74A4;
}
.tag-khazanah,
.tag-internasional,
.tag-ekonomi,
.tag-olaharaga,
.tag-nasional,
.tag-berita{
    background: #AFE2D0;
}
.tag-opioni,
.tag-resonansi,
.tag-hikmah,
.tag-analisis,
.tag-refleksi,
.tag-fokus-public,
.tag-surat-pembaca,
.tag-rehat{
    background: #707272;
}


.tag-teraju,
.tag-podium,
.tag-pareto,
.tag-fokus-internasional,
.tag-narasi,
.tag-in-depth{
    background: #A8092B;
}

.tag-konsultasi-syariah,
.tag-hiwar,
.tag-wawasan,
.tag-kreatipreneur,
.tag-bincang-bisnis,
.tag-wawancara{
    background: #3BC9F7;
}
.tag-jabodetabek,
.tag-jakaarta,
.tag-urbana{
    background: #9F74A4;
}
.tag-nusantara,
.tag-jawa-barat,
.tag-jawa-barat,
.tag-jawa-timur,
.tag-jawa-tengah,
.tag-diy,
.tag-daerah{
    background: #F00657 ;
}
.tag-tasawuf,
.tag-zakat,
.tag-uswah,
.tag-silahturahim,
.tag-muslimah,
.tag-rehal,
.tag-komunitas,
.tag-muhibah,
.tag-tuntutan,
.tag-fatwa,
.tag-laporan-utama,
.tag-dialog-jumat{
    background: #BC8F8F;
}
.tag-dunia-islam,
.tag-mujadid,
.tag-arsitektur,
.tag-oase,
.tag-kisah,
.tag-kitab,
.tag-tema-utama,
.tag-islam-digest{
    background: #FFA500;
}
.tag-pustaka,
.tag-jalan-jalan,
.tag-sastra,
.tag-geni,
.tag-senggang{
    background: #707272;
}
.tag-otomotif,
.tag-sehat,
.tag-kluarga,
.tag-inovasi,
.tag-gaya-hidup{
    background: #9F74A4;
}
.tag-ziarah,
.tag-kosmetik,
.tag-fashion,
.tag-fashion,
.tag-filantropi,
.tag-kuliner-halal,
.tag-kuliner-halal,
.tag-belanja-halal,
.tag-perencanaan,
.tag-madeena{
    background: #4CAF50;
}

.tag-galeri-foto,
.tag-rana,
.tag-jurnal-foto{
    background: #B381CE;
}
.tag-interaktif,
.tag-multimedia{
    background: #FFB149;
}
.tag-dialektika,
.tag-iqthisodia,
.tag-islamia,
.tag-suplemen{
    background: #2ECC71;
}
.tag-fun-science-and-math,
.tag-sedekah-soal,
.tag-komunitas{
    background: #BC8F8F;
}
.header-beranda{
    float: left;
    padding-left: 5%;
    margin-top: 25px;
}
.header-category{
    width: 60%;
    margin-top: 10px;
    float: left;
}
.header-category .owl-item{width: auto!important;padding-left: 30px;padding-right: 30px;}
.header-category-con{
    
}
.header-category-text h3{
    color: #B1B8BE; 
    font-family: 'Roboto' , sans-serif;
    letter-spacing: 1px;
}
#owl-slider-category .owl-prev,
#owl-slider-category .owl-prev{
    display: none;
}
.pagination{margin: auto;position: relative;text-align: center;margin-bottom: 30px;}
.pagination>li:last-child>a, .pagination>li:last-child>span,
.pagination>li:first-child>a, .pagination>li:first-child>span{
    border-radius: 50px;
}
.pagination>li>a, .pagination>li>span{
    border-radius: 50px;
}
span.name-tag{
    font-family: Droid-Serif;
    font-size: 17px;
}
/*.ctg-head-ltumat{
    display: none; 
}*/

.dropdown-menu{
    padding: 10px;
}
.dropdown-menu ul{
    width: 128px;
}
.dropdown-menu ul li{
    list-style: none;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    text-align: center;
    border-radius: 30px;
    height: 32px;
    line-height: 32px!important;
    width: auto;
    
}
.ctg-life-style{
/*    background: #A8092B;
    padding: 12px;
    -moz-border-radius-topleft: 0px;
    -moz-border-radius-topright: 59px;
    -moz-border-radius-bottomleft: 0px;
    -moz-border-radius-bottomright: 59px;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 59px;
    -webkit-border-bottom-left-radius: 0px;
    -webkit-border-bottom-right-radius: 59px;
    border-top-left-radius: 0px;
    border-top-right-radius: 59px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 59px;*/
}

.dropdown-menu ul li a{
    color: #FFF;
    letter-spacing: 1px;
    text-shadow: 1px 1px #000;
}
.dropdown-menu a:focus, a:hover{color: #fff;}
.dropdown-menu, .btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open>.dropdown-toggle.btn-primary{
    /*background-color: #9f74a4;*/
    /*border-radius: 30px;*/
    background-color: transparent;
    border:none;
}
.dropdown-category .dropdown-menu{
    border:none;
    padding: 0;
}
.btn-primary{
    border-color: transparent;
}

/*global function*/
.dropdown-menu ul li.ctg-menu-family{
    background-color: #9f74a4;
}
.dropdown-menu ul li.ctg-menu-berita{
    background-color: red;
}


/*category*/
.ctg-head-ltumat{
    margin-top: 12px;
    padding-left :20px;
    padding-right: 20px;
    border-radius: 30px;
    float: right;
    text-align: center;
    background:#DADD33;
    height: 48px;
    line-height: 48px;
    display: block;
}



.ctg-head-family{
    background: #9f74a4;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-kabar-utama{
    background: #065FD4;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-urbana{
    background: #3BC9F7;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
 
.ctg-head-olahraga,
.ctg-head-khazanah,
.ctg-head-ekonomi,
.ctg-head-internasional,
.ctg-head-nasional,
.ctg-head-berita{
    background: #AFE2D0;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-rehat,
.ctg-head-fokus-publik,
.ctg-head-surat-pembaca,
.ctg-head-analisis,
.ctg-head-refleksi,
.ctg-head-hikmah,
.ctg-head-resonansi,
.ctg-head-opini,
.ctg-head-tajuk,
.ctg-head-sudut-pandang{
    background: #707272;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-narasi,
.ctg-head-fokus-internasional,
.ctg-head-pareto,
.ctg-head-teraju,
.ctg-head-podium,
.ctg-head-in-depth{
    background: #A8092B;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }

 .ctg-head-hiwar,
 .ctg-head-konsultasi-syariah,
 .ctg-head-wawasan,
 .ctg-head-kreatipreneur,
 .ctg-head-bincang-bisnis,
 .ctg-head-wawancara{
    background: #3BC9F7;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
 
 
.ctg-head-jakarta,
.ctg-head-bodetabek,
.ctg-head-urbana{
    background: #3BC9F7;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-nusantara,
.ctg-head-jawa-tengah,
.ctg-head-diy,
.ctg-head-jawa-barat,
.ctg-head-jawa-timur,
.ctg-head-daerah{
    background: #F00657;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-tasawuf,
.ctg-head-mujahidah,
.ctg-head-uswah,
.ctg-head-fikih-muslimah,
.ctg-head-zakat,
.ctg-head-muhibah,
.ctg-head-silaturahim,
.ctg-head-rehal,
.ctg-head-komunitas,
.ctg-head-fatwa,
.ctg-head-tuntunan,
.ctg-head-laporan-utama,
.ctg-head-dialog-jumat{
    background: #BC8F8F;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-dunia-islam,
.ctg-head-oase,
.ctg-head-arsitektur,
.ctg-head-mujadid,
.ctg-head-tema-utama,
.ctg-head-kitab,
.ctg-head-kisah,
.ctg-head-islam-digest{
    background: #FFA500;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
 
.ctg-head-geni,
.ctg-head-jalan-jalan,
.ctg-head-jalanjalan,
.ctg-head-sastra,
.ctg-head-pustaka,
.ctg-head-senggang{
    background: #707272;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
 
.ctg-head-belanja-halal,
.ctg-head-kuliner-halal,
.ctg-head-filantropi,
.ctg-head-fashion,
.ctg-head-kosmetik,
.ctg-head-ziarah,
.ctg-head-madeena{
    background: #4CAF50;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-galeri-foto,
.ctg-head-rana,
.ctg-head-jurnal-foto,
.ctg-head-fotografi{
    background: #B381CE;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-multimedia{
    background: #FFB149;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-suplemen{
    background: #2ECC71;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
 
.ctg-head-ficer-dalam-negeri,
.ctg-head-kisah-mancanegara,
.ctg-head-ficer{
    background: #4CAF50;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-berita{
    background: blue;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
.ctg-head-sehat,
.ctg-head-otomotif,
.ctg-head-keluarga,
.ctg-head-inovasi,
.ctg-head-hidup{
    background: #9F74A4;
    color: #fff;
    font-family: Nunito-Sans-Bold;
 }
 
 /*subcribe*/
 .subcribe{
     width: 100%;
     height: 400px;
 }
 
 .news-subcribe{
     padding: 2%;
 }
 .news-content-subcribe{
     margin-top: 10px;
     margin-bottom: 30px;
 }
 
 .news-content-subcribe h2{
     font-size: 34px;
     color: #000;
     font-family: Nunito-Sans-Bold;
     
 }
 .news-content-subcribe p{
     font-family: Droid-Serif;
     font-size: 16px;
     
 }
 .news-content-pro{
     margin-top: 10px;
     margin-bottom: 30px;
 }
 .news-content-pro a{
     float: right;
     font-size: 16px;
     font-family: Nunito-Sans-Bold;
 }
 .news-content-pro a:hover{
     color: #000;
 }
 .btn-pro{
     width: 280px;
     height: 50px;
     border-radius: 50px;
     border: 2px #000 solid;
     font-size: 21px;
 }
 .star-content-pro{
    color: #000;
    display: flex;
    
 }
 .disc{
     float: left;
 }
span.disc-up{
    width: 100px;
    height: 100px;
    background: #000;
    border-radius: 100px;
    color: #fff;
    display: block;
    font-size: 16px;
    font-family: 'Roboto-Bold';
    text-align: center;
    line-height: 88px;
 }
 .qoute{
     padding-top: 20px;
 }
 .qoute span{
     line-height: 40px;
     font-size: 21px;
     font-family:  'Roboto-Bold';
     color: #aaa;
     position: relative;
    
     
 }
 .qoute span::before{
     position: absolute;
     content: "Rp 6000";
     color: transparent;
     border-bottom: 2px #aaa solid;
     z-index: 999;
     top: -26px;
 }
 .disc-next{
     padding: 0;
     padding-top: 20px;
 }
 .disc-next h2{
     padding: 0;
     font-size: 22px;
     font-family: 'Roboto-Bold';
     color: red;
 }
 .disc-next i{
     color: #000;
     padding-top: 20px;
     font-size: 26px;
 }
 .disc-next-up{
     
 }
 .disc-next-up a{
     font-size: 18px;
     font-family: 'Roboto-Bold';
 }
 .disc-next-up a:hover{
     color: #000;
 }
 .disc-next-up span{
     font-size: 16px;
     font-family: 'Roboto-Bold';
 }
 .page-subcribe{
     margin-top: 100px;
 }
 .page-subcribe h2{
     margin: auto;
     text-align: center;
     color: red;
     display: table;
     font-size: 38px;
     font-family: 'Roboto-Bold';
 }
 .page-subcribe h3{
     margin: auto;
     text-align: center;
     color: #000;
     font-size: 32px;
     font-family: 'Roboto-Bold';
 }
 .grid-subcribe{
     margin: auto;
     height: 380px;
     padding-top: 10px;
     text-align: center;
 }
 .grid-subcribe img{
     width: 160px;
     height: auto;
 }
 .grid-subcribe p{
     font-size: 21px;
     font-family: 'Roboto-Bold';
 }
 .bg-subcribe{
     background-image: url(img/bg-subcribe.png);
     min-height: 250px;
     background-attachment: fixed;
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
    
 }
 .bg-subcribe h2{
     padding-top: 100px;
     text-align: center;
     font-size: 36px;
     font-family: 'Roboto-Bold';
     color:#fff;
 }
 .subcribe-disc{
     padding-top: 30px;
    
     text-align: center;
 }
 .subcribe-list{
     border-top: #eee 8px solid;
     width: 140px;
     display: block;
     margin: auto;
     text-align: center;
 }
 
 .subcribe-disc h2{
     
     font-size: 38px;
     display: inline-block;
     font-family: 'Roboto-Bold';
     color: #000;
 }
 .subcribe-disc-up{
     border-radius: 10px;
     background: #000;
     padding-top: 30px;
     padding-bottom:30px;
 }
 .subcribe-disc-up h3{
     color: #56D4A7;
     font-family: 'Roboto-Bold';
     font-size: 36px;
 }
 .subcribe-disc-up h3, .subcribe-disc-up-gold h3{
     color: #FF7F23;
     font-family: 'Roboto-Bold';
     font-size: 36px;
 }
 .subcribe-disc-up p{
     color: #fff;
     font-family: 'Roboto-Bold';
     font-size: 21px;
 }
 .subcribe-disc-to{
     text-align: center;
     width: 100px;
     height: 100px;
     display: inline-block;
     font-size: 21px;
     text-align: center;
     padding-top: 18px;
 }
 .subcribe-disc-to-gold{
     background: #000;
     border-radius: 100px;
     border:1px #fff solid;
     color: #fff;
  }
 .subcribe-disc-to-silver{
     background: transparent;
     border-radius: 100px;
     border:1px #000 solid;
     color: #fff;
  }
 .subcribe-disc-to-silver{
     color: #000;
  }
 .subcribe-disc-to span{
     text-align: center;
 }
 .subcribe-disc-price{
     padding-top: 20px;
     
 }
 .subcribe-disc-price-silver{
     
     
 }
 
 .subcribe-disc-price small{
     position: relative;
 }
 
 .subcribe-disc-price-gold small:before{
    position: absolute;
    content: "Rp 6000";
    color: transparent;
    border-bottom: 2px #fff solid!important;
    z-index: 999;
    top: -15px;
    display: inline-block;
    width: -webkit-fill-available;
 }
 .subcribe-disc-price small:before{
    position: absolute;
    content: "Rp 6000";
    color: transparent;
    border-bottom: 2px #000 solid;
    z-index: 999;
    top: -15px;
    display: inline-block;
    width: -webkit-fill-available;
 }
 .subcribe-disc-price-gold p,
 .subcribe-disc-price-silver p{
     color: #939BA4!important;
     font-size: 21px;
     font-family: 'Roboto-Bold';
 }
 .subcribe-disc-price-silver small{
     color: #000;
     font-size: 18px;
     font-family: 'Roboto-Bold';
 }
 .subcribe-disc-price-gold small{
     color: #fff;
     font-size: 18px;
     font-family: 'Roboto-Bold';
 }
 .subcribe-disc-price span{
     color: #fff;
     font-size: 21px;
     font-family: 'Roboto-Bold';
 }
 .subcribe-disc-list{
     margin-top: 30px;
 }
 .subcribe-disc-list ul{
     
 }
 .subcribe-disc-list ul li{
     list-style: none;
     margin-top: 5px;
     margin-bottom: 5px;
         
 }
 .subcribe-disc-list ul{
     
 }
 .subcribe-disc-list i{
     color: #fff;
     font-size: 19px;
     display: contents;
 }
 .subcribe-disc-list span{
     color: #fff;
     font-family: 'Roboto-Light';
 }
 .btn-subcribe{
    width: 180px;
    height: 50px;
    line-height: 35px;
    background: #56D4A7;
    font-family: 'Roboto-Bold';
    font-size: 21px;
    border: 20px;
 }
 
 .subcribe-disc-up-platinum,
 .subcribe-disc-up-silver{
     background: #eee!important;
     padding-bottom:30px;
     
 }
 .subcribe-disc-up-silver h3{
     color:#000;
 }
 .subcribe-disc-up-silver P{
     color:#000;
 }
 .subcribe-disc-up-platinum span,
 .subcribe-disc-up-silver span{
     color:#000;
 }
 .subcribe-disc-up-platinum i,
 .subcribe-disc-up-silver i{
     color:#000;
 }
 .subcribe-sign{
     padding-top: 30px;
     text-align: center;
     margin: auto;
 }
 .subcribe-sign p{
     font-size: 21px;
     font-family: 'Roboto-Bold';
 }
 .subcribe-answer{
     margin-top: 30px;
 }
 .subcribe-answer h2{
     text-align: center;
     color: #000;
     font-size: 26px;
     font-family: 'Roboto-Bold';
 }
 .subcribe-payment{
     text-align: center;
     margin: auto;
 }
 .subcribe-payment h2{
     font-size: 26px;
     font-family: 'Roboto-Bold';
     color: #000;
 }
 .subcribe-payment ul{
     /*display: inline-block;*/
 }
 .subcribe-payment ul li{
     list-style: none;
     float: left;
     padding: 20px;
 }
 .subcribe-payment ul li span{
     
 }
 .subcribe-payment ul li img{
     width: 60px;
     height: auto;
 }
 
 
 .btn-subcribe{
     border-radius: 30px;
     margin-top: 10px;
 }
 .btn-subcribe-silver{
     background: #000;
     color: #fff;
 }
 .btn-subcribe-gold{
     background: #FF7F23;
     color: #fff;
 }
 .btn-subcribe-platinum{
     background: #636F7E;
     color: #fff;
 }
 .btn-subcribe-platinum:hover{
     background: #FF7F23;
     color: #fff;
 }
 .btn-subcribe-silver:hover{
     background: #FF7F23;
     color: #fff;
 }
 .btn-subcribe-gold:hover{
     background: #FF7F23;
     color: red;
 }
 .btn-member{
     font-family: Monserrat;
     font-size: 19px;
     padding: 4px 10px 4px 10px;
     width: 142px;
     height: 36px;
     background: #A12E2E;
     border-radius: 30px;
 }
 .btn-literasi{
     font-family: Monserrat;
     font-size: 19px;
     padding: 4px 10px 4px 10px;
     width: 142px;
     height: 36px;
     background: #A05108;
     border-radius: 30px;
 }
 .btn-follow-me{
     font-family: 'Nunito-Sans-Regular';
     font-size: 14px;
     text-transform: uppercase;
     padding: 3px 12px 3px 12px;
     background: #aaa;
     color: #fff;
     border-radius: 30px;
 }
 .btn-member-black{
     font-family: 'Nunito-Sans-Regular';
     font-size: 12px;
     text-transform: uppercase;
     padding: 6px 12px 6px 12px;
     background: #000;
     color: #fff;
     border-radius: 30px;
 }
 .btn-member-headline{
     font-family: 'Nunito-Sans-Regular';
     font-style: normal;
     letter-spacing: 3px;
     font-size: 12px;
     padding: 6px 12px 6px 12px;
     background: #000;
     border-radius: 30px;
     outline: 0;
     border:none;
 }
 
 
 /*top headline*/
 
 .top-headline{
     padding-top: 20px;
 }
 .top-headline .container{
    padding-bottom: 10px;
 }
 
 .top-headline-list a{
     color: #000;
     display: table;
 }
 .top-headline-list a:hover{
     color: #000;
 }
 .top-headline-list h3{
     margin: 0;
     padding-left: 10px;
     font-size: 16px;
     font-family: 'Nunito-Sans-Bold';
 }
 
 .top-headline-list:nth-child(1){
     float: left;
     margin-bottom: 30px;
 }
 .top-headline-list:nth-child(2){
     float: left;
     border-left: 1px #000 solid;
     margin-bottom: 30px;
 }
 
 .top-headline-list label{
     margin-left: 10px;
 }
 .top-headline-img{
     float: left;
 }
 .top-headline-img img{
     width: 100%;
     height: 220px;
     object-fit: cover;
     border-radius: 10px;
 }
 .top-headline-desc{
     
 }
 .top-headline-desc h2{
     font-family: 'Nunito-Sans-Bold';
     font-style: normal;
     font-size: 21px;
     color: #000;
 }
 .top-headline-desc a{
     font-family: 'Nunito-Sans-Bold';
     font-style: normal;
     font-size: 21px;
     color: #000;
 }
 a.isl-head{
     width: 100%;
     float: left;
 }
 
 .top-headline-desc a:hover{
     color: #000;
 }
 
 .index-thumb h2 a{
    font-family: 'Nunito-Sans-Regular';
    color: #000;

 }
 .top-headline-list h3 a{
     font-family: 'Nunito-Sans-Regular';
     letter-spacing: 3px;
     color: #000;
 }
 
 .line-double1{
     border-bottom: 1px #000 solid;
     margin-bottom: 10px;
 }
 .line-double2{
     border-bottom: 1px #000 solid;
 }
 .line-double img{
     width: 800px;
     height: auto;
 }
 /*bottom-headline*/
 .bottom-headline{
     margin-top: 15px;
 }
 
 .bottom-headline .container{
     
 }
 .bottom-headline-list{
     padding-top: 10px;
     float: left;
 }
 .bottom-headline-list img{
     width: 100%;
     height: 220px;
     object-fit: cover;
 }
 
 .category_{
     float: left;
 }
 .bottom-headline-list h2{
     margin-top: 4px;
     font-family: 'Nunito-Sans-Bold';
     font-style: normal;
     font-size: 21px;
     color: #000;
 }
 .bottom-headline-list h3{
     margin: 0;
     font-family: 'Nunito-Sans-Regular';
     font-style: normal;
     letter-spacing: 3px;
     font-size: 16px;
     color: #A39797;
 }
 .berlangganan_{
     float: right;
 }
 .berlangganan_ span{
     color: #aaa;
     margin-left: 12px;
 }
 /*opini*/
 .opini{
     background: #000;
     padding-top: 20px;
 }
 .opini h3{
     padding-left: 10px;
     color: #fff;
     font-family: 'Nunito-Sans-Regular';
     font-style: normal;
     font-weight: 400;
     font-size: 21px;
     
 }
 .opini-list{
     
 }
 .opini-list img{
     width: 100%;
     height: 320px;
     object-fit: cover;
 }
 .opini-list h2{
     margin-top: 5px;
     color: #fff;
     font-family: 'Nunito-Sans-Regular';
     font-style: normal;
     font-weight: 400;
     font-size: 21px;
 }
 .opini-list time{
     font-family: 'Nunito-Sans-Regular';
     font-style: normal;
     font-weight: 400;
     font-size: 11px;
     color: #fff;
 }
 .opini-list a{
     color: #fff;
     font-family: 'Nunito-Sans-Regular';
     font-style: normal;
     font-weight: 400;
     font-size: 21px;
 }
 .opini-list h2 a:hover{
     color: #000;
 }
 
 /*header new 2*/
 .header-new{
     background: #EFEDDE;
 }
 .header-logo{
     width: 100%;
     border-bottom: 1px solid;
 }
 .header-logo img{
     width: 20%;
 }
 .header-logo .container{
     width: 100%;
     border-bottom: 1px solid;
 }
 .header-member{
     margin: auto;
     position: relative;
     padding-left: 19%;
 }
 .join-member-mobile{text-align: center;margin-top: 16px;padding-right: 10px;}
 .join-member-mobile a{font-family: 'Nunito-Sans-Bold';font-size: 16px;color: #fff;}
 
 .join-member-mobile{
     float: left;
 }
 /*header*/
 .header-new .container{
     padding-bottom: 10px
 }
 .header-new{
     position: fixed;
     top:0;
     z-index: 99;
     width: 100%;
 }
 .header-new-top{
     width: 100%;
     background: #EFEDDE;
     border-bottom: 1px #000 solid;
 }
 .header-login{
     padding-top: 0px;
     text-align: right;
 }
 
 
 .header-login-in{
     padding-top: 3px;
     float: right;
     
 }
 .header-login-in img{
     width: 20px;
 }
 .header-login-in span{
     font-size: 19px;
     color: #2E3A59;
     cursor: pointer;
 }
 .header-login-in i{
     padding-left: 5px;
 }
 .header-search{
     padding-top: 4px;
     float: right;
     padding-right: 8px;
 }
 
 .header-search i{
     font-size: 21px;
     color: #2E3A59;
 }
 
 .header-new-bottom{
     background: #EFEDDE;
     padding-top: 15px;
     padding-bottom: 15px;
 }
 
 .join-member{
     padding-top: 10px;
     float: left;
 }
 .join-member a{
     font-family: 'Nunito-Sans-Regular';
     font-size: 16px;
     color: #fff;
 }
 
 .menu-category{
     padding-top: 16px;
 }
 .menu-category ul{
     
 }
 .menu-category li{
     background: #fff;
     margin: 2px;
     padding: 0 10px 0 10px;
     list-style: none;
     float: left;
     border-radius: 30px;
     opacity: 0.8;
 }
 .menu-category li a{
     color: #000;
     font-family: 'Nunito-Sans-Regular';
     font-size: 14px;
 }
 .member-join{
     margin-top: 150px;
 }
 .member-join-top{
     
 }
 .member-join-top{
     text-align: center;
 }
 .member-join-top h2{
     color: rgba(0,0,0,0.64);
     font-family: 'Nunito-Sans-Black';
     font-size: 21px;
     margin-bottom: 20px;
 }
 .member-join-top h3{
     color: rgba(0,0,0,0.64);
     font-family: 'Nunito-Sans-Regular';
     font-size: 16px;
 }
 .member-join-top h4{
     margin-top: 20px;
     color: rgba(0,0,0,0.64);
     font-family: 'Nunito-Sans-Bold';
     font-size: 21px;
 }
 .member-join-top p{
     margin-top: 20px;
     color: rgba(0,0,0,0.64);
     font-family: 'Nunito-Sans-Regular';
     font-size: 16px;
 }
 .member-join-top h4{
     margin-top: 20px;
     color: rgba(0,0,0,0.64);
 }
     
 .member-join-middle{
     margin: auto;
     width: 20%;
     text-align: center;
 }
 
 .member-years{
     background: #fff;
     width: 110px;
     height: 40px;
     float: left;
     border-radius: 30px;
     line-height: 40px
 }
 .member-month{
     background: #A22E2E;
     border-radius: 30px;
     float: right;
     width: 110px;
     height: 40px;
     line-height: 40px;
     color: #fff;
 }
 .member-select-join{
    margin-bottom: 30px;
   
 }
 .member-select-join-list{
     margin-top: 30px;
     text-align: center;
     padding: 0;
     background: #A12E2E;
     float: left;
     border-radius: 20px;
     border: 4px #EFEDDE solid;
 }
 
 .member-select-title{
     padding: 10px;
     color: #A12E2E;
     border-radius: 10px;
     background: #fff;
     font-family: 'Nunito-Sans-Bold';
     font-size: 21px;
     
 }
 .member-select-body{
     font-family: 'Nunito-Sans-Regular';
     font-size: 21px;
     color: #fff;
     border-bottom: 1px #fff dashed; 
     padding: 10px;
 }
 .member-select-bottom{
    
     font-family: 'Nunito-Sans-Regular';
     font-size: 21px;
     color: #fff;
     padding: 10px;
 }
 .member-join-bottom{
     text-align: center;
 }
 .member-join-bottom h2{
     font-family: 'Nunito-Sans-Bold';
     font-size: 21px;
     color: rgba(0,0,0,0.64);
 }
 .icon-join{
     height: 300px;
 }
 .icon-join img{
     width: 120px;
     height: 120px;
     
 }
 .icon-join h2{
     font-family: 'Nunito-Sans-Regular';
     font-size: 15px;
     color: rgba(0,0,0,0.64);
 }
 .member-join-bottom h3{
     font-family: 'Nunito-Sans-Bold';
     font-size: 21px;
     color: rgba(0,0,0,0.64);
 }
 .easy-member{
     text-align: center;
     
 }
 
 .easy-member img{
     width: 50px;
 }
 .easy-member h2{
     font-family: 'Nunito-Sans-Regular';
     font-size: 16px;
     color: rgba(0,0,0,0.64);
 }
 .member-answer{
     
 }
 .member-answer h2{
     font-family: 'Nunito-Sans-Bold';
     font-size: 21px;
     color: rgba(0,0,0,0.64);
 }
 .member-answer p{
     font-family: 'Nunito-Sans-Regular';
     font-size: 16px;
     color: rgba(0,0,0,0.64);
 }
 .payment-member{
     font-family: 'Nunito-Sans-Bold';
     font-size: 21px;
     color: rgba(0,0,0,0.64);
 }
 .payment-member img{
     padding: 10px;
 }
 
 /*login*/
 .login{
     margin-top: 120px;
 }
 .login-rid{margin-top:30px;text-align: center;}
 .login-rid a.btn-google{margin: 1%;width: 48%;color:#000;float: left}
 .login-rid a.btn-facebook{margin: 1%;width: 48%;color:#000;float: right;}
 .login-rid img{}
 .btn-google {margin: 5px;height: 40px;background: #fff;border-radius: 10px}
 .btn-facebook {margin: 5px;height: 40px;background: #fff;border-radius: 10px;padding-top: 10px}
 .login-rid h2{
     color: #000;
     font-family: 'Nunito-Sans-Regular';
     font-size: 18px;
 }
 .btn-google img{
     width: 40px;
     line-height: 20px;
 }
 .btn-facebook img{
     width: 22px;
     line-height: 25px;
 }
 .login-mail{
     
 }
 .login-mail .form-control{
     height: 40px;
     border-radius: 10px;
 }
 .opsi-login{
     padding-left: 10px;
     padding-right: 10px;
 }
 .opsi-login label{
     font-weight: 300;
 }
 .btn-login{
     margin-top: 30px;
     background: #A12E2E;
     color: #fff!important;
     font-size: 21px;
     border-radius: 20px;
     padding: 10px 40px 10px 40px;
 }
 .login-mail i{color: #aaa;}
 .show-bar{
     background: #000;
     padding: 20px;
     border-top-left-radius: 25px;
     border-bottom-left-radius: 25px;
 }
 .show-bar h2{
     font-family: 'Nunito-Sans-Bold';
     font-size: 14px;
     color: #fff;
     padding-right: 5px;
 }
 .show-bar span{
     font-family: 'Nunito-Sans-Regular';
     font-size: 13px;
     color: #FFE249;

}
.show-bar{
    position: absolute;
    z-index: 99;
    top: 40px;
    right:0;
    display: none;
}
.show-bar ul{
    text-align: left;
}
.show-bar ul li{
    list-style: none;
    text-decoration: none;
}
.show-bar ul li a{
    font-family: 'Nunito-Sans-Regular';
    font-size: 16px;
    color: #fff;
}

/*searc*/
.header-search{
    cursor: pointer;
}
.show-search{
    background: #000;
    padding: 4px 12px 4px 12px;
    border-radius: 10px;
    margin: 0;
    position: absolute;
    width: 100%;
    bottom: -50px;
    right: 5%;
    display: none;
    
}
.search-form{
    float: left;
}
.search-form form{
    width: 100%;
    
}
.search-form input[type=text] {
    height: 30px;
    font-size: 14px;
    border: 1px #fff solid;
    float: left;
    width: 86%;
    background: white;
    font-family: 'Nunito-Sans-Regular';
    outline: 0;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}
.search-form button{
    height: 30px;
    width: 14%;
    border: 1px #fff solid;
}


.modal-member .modal-dialog{
    margin: 10% auto 10%;
}
.modal-member img{
    padding-left: 30%;
}   
.modal-member h3{
    color: #A8092B;
    font-family: 'Nunito-Sans-Bold';
}
.modal-member p{
    color: #000;
    font-family: 'Nunito-Sans-Regular';
}
.profile-detil{
    
}

.profile-grid{
    
    padding-left: 2%;
    margin-top: 40px;
}
.profile-detil{
    float: left;
    margin-right: 20px;
}
.profile-detil img{
    width: 100px;
    height: 100px;
    object-fit: cover;
}
.profile-detil-desc{
    
}
.profile-detil-desc h2{
    color: #000;
    font-size: 24px;
    font-family: 'Nunito-Sans-Bold';
}
.profile-detil-desc  p{
    color: #000;
    font-family: 'Nunito-Sans-Regular';
    font-size: 16px;
}