/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 09/03/2022 14:00:00
    Author : mariz a.m rol
    Update 26/03/2023 05:40:00
    REPUBLIKA.ID(NEW VERSION)
*/

.headline-caption-detail {
    padding: 1%;
    background: #fff;
}
.countdown-desktop {
    display: none;
}
.wrapper {
    background-color: #494740 !important;
}

.button-selengkapnya {
    margin-top: -70px;
    opacity: 0.9;
    border-top: 100px #494740 solid;
    background: #494740 !important;
}

.header-new {
    background: #000 !important;


}

.header-search {}

.header-login span,
.header-login i,
.header-search i {
    color: #fff;
}



.header {
    /* Create the parallax scrolling effect */

}

.gradient-headline {}

/* .headline-desc {
    top: -100px;


} */
.headline-desc {
    position: absolute;
    z-index: 9;
    top:-50px!important;
    left: 8%;
    right: 8%;
    width: 70%;
    height: auto;
}
.headline-desc h1 {
    background: #fff;
    color: #1DA599;
    display: inherit;
}

.headline-countup {
    bottom: -70px;
    position: relative;
    /*    position: absolute;
    left: 12.5%;
    right: 12.5%;*/
}

.headline-countup img {
    width: 120px;
    height: auto;
    position: relative !important;
}

span.countup-ramadhan {
    position: absolute;
    z-index: 999;
    bottom: 18px;
    left: 5.5%;
    color: #fff;
    font-family: Nunito-Sans-Bold;
    font-size: 32px;
}

.bg-category {
    background: #494740 !important;

}

.top-headline .container {
    padding-left: 2.5%;
    padding-right: 2.5%;
}

.top-headline-list {}

.top-headline-list label {
    margin-left: 0;
}

.top-headline-list h2 {
    font-family: Nunito-Sans-Regular;
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    letter-spacing: 2px;
    text-align: left;
    color: #D9D9D9;

}

.top-headline-list p {
    font-size: 19px;
    font-family: Nunito-Sans-Regular;
    color: #fff;
    font-style: italic;
    letter-spacing: 2px;
}

.tips-number {
    float: left;
    font-size: 55px;
    font-family: Nunito-Sans-Bold;
    color: #A39797;
    padding-right: 4px;
}

.tips-number-list {
    font-size: 24px;
    font-family: Nunito-Sans-Regular;
    color: #000;
}

.top-headline-list ul li {
    list-style: none;
    margin-top: 20px;
    width: 100%;
    float: left;
}

.top-headline-list ul li a {
    text-decoration: none;
}

.top-headline-img {
    padding-left: 4%;
    border-left: 0px #000 solid;
}

.top-headline-img p {
    font-size: 19px;
    font-family: Nunito-Sans-Regular;
    color: #fff;
    letter-spacing: 2px;
}

.top-headline-img:nth-child(2) {
    border-left: 0px #000 solid;
}

.top-headline-content-ramadhan img {
    width: 150px;
    height: 150px;
    border-radius: 50%;

}

.top-headline-desc-ramadhan h2 {
    font-family: Nunito-Sans-Regular;
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    letter-spacing: 2px;
    text-align: left;
    color: #D9D9D9;
}

.top-headline-desc-ramadhan h3 {
    margin-top: 10px;
    font-size: 18px;
    font-family: Nunito-Sans-Bold;
    color: #D9D9D9;
}

.top-headline-desc-ramadhan small {
    margin-top: 10px;
    font-family: Nunito-Sans-Regular;
    font-size: 16px;
    font-weight: 400;
    line-height: 14px;
    letter-spacing: 2px;
    text-align: left;
    color: #D9D9D9;
}

.top-headline-content {
    float: left;
}

.coundown-list {
    margin-top: 10px;
    text-align: center;
    padding: 10px;
    background: #1DA599;
}

.coundown-list img {
    width: 15px !important;
    height: 25px !important;
    border-radius: 0 !important;
}

.coundown-list span {

    color: #fff;
    font-size: 16px;
    font-family: Nunito-Sans-Bold;
}

.coundown-list small {
    font-size: 12px;
    font-family: Nunito-Sans-Regular;
}

.countdown-mobile {
    display: none;
}

.read {
    background: #494740 !important;
}

.article-related ul li a {
    color: #fff;
}

.article-related-title {
    color: #fff;
    border-bottom: 1px #fff solid;
}

.ramadhan-news-title {
    background: #1DA599;
    padding-top: 10px;
    padding-bottom: 10px;
}

.read-artikel {}

.read-artikel h3 {
    color: #fff;
}

.lbl {
    border-bottom: 5px #fff solid;
}

.headline-caption-detail small {}

.headline-caption-detail {}

.read-artikel .share_it span,
.read-artikel .read-news .blog-post-bottom,
.read-artikel blockquote.quote-box,
.read-artikel .read-news p,
.read-artikel span.published,
.read-artikel time,
.read-artikel h1 {
    color: #fff !important;
}


.tips {
    background: black;
}


.ramadhan-tips {
    background: #F3ECDC;
    padding-top: 30px;
}

.news-tips-title h2 {
    color: #000;
    font-size: 19px;
    font-family: Nunito-Sans-Regular;
}

.news-tips-title span {
    color: #000;
    font-size: 19px;
    font-family: Nunito-Sans-Bold;
}

.news-tips-title h3 {
    font-size: 26px;
    font-family: Nunito-Sans-Bold;

}

.ramadhan-tips {}

.ramadhan-tips ul li {
    list-style: none;
    margin-top: 20px;
    margin-bottom: 20px;
}

.ramadhan-tips ul li div.no {
    width: 30px !important;
    height: 30px !important;
    border-radius: 30px;
    background: #1DA599;
    float: left;
    text-align: center;
    line-height: 30px;
    color: #1DA599;
    margin-right: 5px;
}

.ramadhan-tips ul li h2 {
    font-family: 'Nunito-Sans-Regular';
    font-size: 26px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0em;
    margin-bottom: 44px;
    color: black;
}

.news-ramadhan {
    padding-top: 20px;
    background-color: #ffffff;
    color:#000000;
}

.news-list {}

.news-list h2 {
    font-size: 19px;
    font-family: Nunito-Sans-Regular;
    color: #000;
    letter-spacing: 2px;
}

.news-list p {
    font-size: 19px;
    font-family: Nunito-Sans-Regular;
    color: #000;
    letter-spacing: 2px;
}

/*fiqih-ramadhan ramadhan*/
.fiqih-ramadhan {
    padding-top: 50px;
    background: #494740 !important;
}

.fiqih-ramadhan-title {
    text-align: left;
}

.fiqih-ramadhan-title h2 {
    font-size: 20px;
    color: #fff;
    font-family: Nunito-Sans-Regular;
    letter-spacing: 0.1em;
}

.fiqih-ramadhan-title span {
    color: #FFF;
    font-size: 19px;
    font-family: Nunito-Sans-Bold;
}

.fiqih-content {
    text-align: left;
}

.fiqih-content img {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    object-fit: cover;
}

.fiqih-content h3 {
    color: #FFF;
    font-size: 28px;
    font-family: Nunito-Sans-Bold;
}

.fiqih-content span {
    font-size: 16px;
    letter-spacing: 2px;
    color: #fff;
    font-family: Nunito-Sans-Regular;
}

.fiqih-content p {
    margin-top: 10px;
    font-size: 16px;
    letter-spacing: 2px;
    color: #fff;
    font-family: Nunito-Sans-Regular;
}

.fiqih-content .quote-text {
    color: #fff;
}

.news-countdown {}

.countdown-wrap {
    padding: 0;
    text-align: center;
}

.countdown-content {
    float: left;
}

.countdown-content img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
}

.countdown-list {}

.countdown-list ul {}

.countdown-list ul li {
    padding: 30px 30px 30px 30px;
    background: #D9D9D9;
    list-style: none;
    border-radius: 20px;
}

.countdown-list ul li:before {
    content: '1';
    color: transparent;
    position: absolute;
    left: -20px;

    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 30px 15px 0;
    border-color: transparent #D9D9D9 transparent transparent;

}

.countdown-list li a {
    color: #000;
    font-size: 28px;
    font-family: Nunito-Sans-Bold;
}

/*footer*/
.footer {}

.tag {
    background: #A39797;
}

.btn {
    opacity: 0;
    background: none !important;
}

.read-artikel .label {}

.read-artikel h3 {
    margin-top: 0 !important;
}
.top-headline-img h3 {
    font-size: 18px;
}

.top-headline-img h3 a {
    margin-top: 10px;
    font-size: 18px;/*
    To change this license header, choose License Headers in Project Properties.
    To change this template file, choose Tools | Templates
    and open the template in the editor.
    */
    /* 
        Created on : 09/03/2022 14:00:00
        Author : mariz a.m rol
        Update 26/03/2023 05:40:00
        REPUBLIKA.ID(NEW VERSION)
    */
    
    .headline-caption-detail {
        padding: 1%;
        background: #fff;
    }
    .countdown-desktop {
        display: none;
    }
    .wrapper {
        background-color: #494740 !important;
    }
    
    .button-selengkapnya {
        margin-top: -70px;
        opacity: 0.9;
        border-top: 100px #494740 solid;
        background: #494740 !important;
    }
    
    .header-new {
        background: #000 !important;
    
    
    }
    
    .header-search {}
    
    .header-login span,
    .header-login i,
    .header-search i {
        color: #fff;
    }
    
    
    
    .header {
        /* Create the parallax scrolling effect */
    
    }
    
    .gradient-headline {}
    
    /* .headline-desc {
        top: -100px;
    
    
    } */
    .headline-desc {
        position: absolute;
        z-index: 9;
        top:-50px!important;
        left: 8%;
        right: 8%;
        width: 70%;
        height: auto;
    }
    .headline-desc h1 {
        background: #fff;
        color: #1DA599;
        display: inherit;
    }
    
    .headline-countup {
        bottom: -70px;
        position: relative;
        /*    position: absolute;
        left: 12.5%;
        right: 12.5%;*/
    }
    
    .headline-countup img {
        width: 120px;
        height: auto;
        position: relative !important;
    }
    
    span.countup-ramadhan {
        position: absolute;
        z-index: 999;
        bottom: 18px;
        left: 5.5%;
        color: #fff;
        font-family: Nunito-Sans-Bold;
        font-size: 32px;
    }
    
    .bg-category {
        background: #494740 !important;
    
    }
    
    .top-headline .container {
        padding-left: 2.5%;
        padding-right: 2.5%;
    }
    
    .top-headline-list {}
    
    .top-headline-list label {
        margin-left: 0;
    }
    
    .top-headline-list h2 {
        font-family: Nunito-Sans-Regular;
        font-size: 12px;
        font-weight: 400;
        line-height: 14px;
        letter-spacing: 2px;
        text-align: left;
        color: #D9D9D9;
    
    }
    
    .top-headline-list p {
        font-size: 19px;
        font-family: Nunito-Sans-Regular;
        color: #fff;
        font-style: italic;
        letter-spacing: 2px;
    }
    
    .tips-number {
        float: left;
        font-size: 55px;
        font-family: Nunito-Sans-Bold;
        color: #A39797;
        padding-right: 4px;
    }
    
    .tips-number-list {
        font-size: 24px;
        font-family: Nunito-Sans-Regular;
        color: #000;
    }
    
    .top-headline-list ul li {
        list-style: none;
        margin-top: 20px;
        width: 100%;
        float: left;
    }
    
    .top-headline-list ul li a {
        text-decoration: none;
    }
    
    .top-headline-img {
        padding-left: 4%;
        border-left: 0px #000 solid;
    }
    
    .top-headline-img p {
        font-size: 19px;
        font-family: Nunito-Sans-Regular;
        color: #fff;
        letter-spacing: 2px;
    }
    
    .top-headline-img:nth-child(2) {
        border-left: 0px #000 solid;
    }
    
    .top-headline-content-ramadhan img {
        width: 150px;
        height: 150px;
        border-radius: 50%;
    
    }
    
    .top-headline-desc-ramadhan h2 {
        font-family: Nunito-Sans-Regular;
        font-size: 12px;
        font-weight: 400;
        line-height: 14px;
        letter-spacing: 2px;
        text-align: left;
        color: #D9D9D9;
    }
    
    .top-headline-desc-ramadhan h3 {
        margin-top: 10px;
        font-size: 18px;
        font-family: Nunito-Sans-Bold;
        color: #D9D9D9;
    }
    
    .top-headline-desc-ramadhan small {
        margin-top: 10px;
        font-family: Nunito-Sans-Regular;
        font-size: 16px;
        font-weight: 400;
        line-height: 14px;
        letter-spacing: 2px;
        text-align: left;
        color: #D9D9D9;
    }
    
    .top-headline-content {
        float: left;
    }
    
    .coundown-list {
        margin-top: 10px;
        text-align: center;
        padding: 10px;
        background: #1DA599;
    }
    
    .coundown-list img {
        width: 15px !important;
        height: 25px !important;
        border-radius: 0 !important;
    }
    
    .coundown-list span {
    
        color: #fff;
        font-size: 16px;
        font-family: Nunito-Sans-Bold;
    }
    
    .coundown-list small {
        font-size: 12px;
        font-family: Nunito-Sans-Regular;
    }
    
    .countdown-mobile {
        display: none;
    }
    
    .read {
        background: #494740 !important;
    }
    
    .article-related ul li a {
        color: #fff;
    }
    
    .article-related-title {
        color: #fff;
        border-bottom: 1px #fff solid;
    }
    
    .ramadhan-news-title {
        background: #1DA599;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    
    .read-artikel {}
    
    .read-artikel h3 {
        color: #fff;
    }
    
    .lbl {
        border-bottom: 5px #fff solid;
    }
    
    .headline-caption-detail small {}
    
    .headline-caption-detail {}
    
    .read-artikel .share_it span,
    .read-artikel .read-news .blog-post-bottom,
    .read-artikel blockquote.quote-box,
    .read-artikel .read-news p,
    .read-artikel span.published,
    .read-artikel time,
    .read-artikel h1 {
        color: #fff !important;
    }
    
    
    .tips {
        background: black;
    }
    
    
    .ramadhan-tips {
        background: #F3ECDC;
        padding-top: 30px;
    }
    
    .news-tips-title h2 {
        color: #000;
        font-size: 19px;
        font-family: Nunito-Sans-Regular;
    }
    
    .news-tips-title span {
        color: #000;
        font-size: 19px;
        font-family: Nunito-Sans-Bold;
    }
    
    .news-tips-title h3 {
        font-size: 26px;
        font-family: Nunito-Sans-Bold;
    
    }
    
    .ramadhan-tips {}
    
    .ramadhan-tips ul li {
        list-style: none;
        margin-top: 20px;
        margin-bottom: 20px;
    }
    
    .ramadhan-tips ul li div.no {
        width: 30px !important;
        height: 30px !important;
        border-radius: 30px;
        background: #1DA599;
        float: left;
        text-align: center;
        line-height: 30px;
        color: #1DA599;
        margin-right: 5px;
    }
    
    .ramadhan-tips ul li h2 {
        font-family: 'Nunito-Sans-Regular';
        font-size: 26px;
        font-weight: 400;
        line-height: 30px;
        letter-spacing: 0em;
        margin-bottom: 44px;
        color: black;
    }
    
    .news-ramadhan {
        padding-top: 20px;
        background-color: #ffffff;
        color:#000000;
    }
    
    .news-list {}
    
    .news-list h2 {
        font-size: 19px;
        font-family: Nunito-Sans-Regular;
        color: #000;
        letter-spacing: 2px;
    }
    
    .news-list p {
        font-size: 19px;
        font-family: Nunito-Sans-Regular;
        color: #000;
        letter-spacing: 2px;
    }
    
    /*fiqih-ramadhan ramadhan*/
    .fiqih-ramadhan {
        padding-top: 50px;
        background: #494740 !important;
    }
    
    .fiqih-ramadhan-title {
        text-align: left;
    }
    
    .fiqih-ramadhan-title h2 {
        font-size: 20px;
        color: #fff;
        font-family: Nunito-Sans-Regular;
        letter-spacing: 0.1em;
    }
    
    .fiqih-ramadhan-title span {
        color: #FFF;
        font-size: 19px;
        font-family: Nunito-Sans-Bold;
    }
    
    .fiqih-content {
        text-align: left;
    }
    
    .fiqih-content img {
        width: 150px;
        height: 150px;
        border-radius: 50%;
        object-fit: cover;
    }
    
    .fiqih-content h3 {
        color: #FFF;
        font-size: 28px;
        font-family: Nunito-Sans-Bold;
    }
    
    .fiqih-content span {
        font-size: 16px;
        letter-spacing: 2px;
        color: #fff;
        font-family: Nunito-Sans-Regular;
    }
    
    .fiqih-content p {
        margin-top: 10px;
        font-size: 16px;
        letter-spacing: 2px;
        color: #fff;
        font-family: Nunito-Sans-Regular;
    }
    
    .fiqih-content .quote-text {
        color: #fff;
    }
    
    .news-countdown {}
    
    .countdown-wrap {
        padding: 0;
        text-align: center;
    }
    
    .countdown-content {
        float: left;
    }
    
    .countdown-content img {
        width: 100px;
        height: 100px;
        border-radius: 50%;
    }
    
    .countdown-list {}
    
    .countdown-list ul {}
    
    .countdown-list ul li {
        padding: 30px 30px 30px 30px;
        background: #D9D9D9;
        list-style: none;
        border-radius: 20px;
    }
    
    .countdown-list ul li:before {
        content: '1';
        color: transparent;
        position: absolute;
        left: -20px;
    
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 15px 30px 15px 0;
        border-color: transparent #D9D9D9 transparent transparent;
    
    }
    
    .countdown-list li a {
        color: #000;
        font-size: 28px;
        font-family: Nunito-Sans-Bold;
    }
    
    /*footer*/
    .footer {}
    
    .tag {
        background: #A39797;
    }
    
    .btn {
        opacity: 0;
        background: none !important;
    }
    
    .read-artikel .label {}
    
    .read-artikel h3 {
        margin-top: 0 !important;
    }
    .top-headline-img h3 {
        font-size: 18px;
    }
    
    .top-headline-img h3 a {
        margin-top: 10px;
        font-size: 18px;
        font-family: Nunito-Sans-Bold;
        color: #D9D9D9;
    }
    .lbl-kabar-ramadhan {
        font-weight: normal;
        font-size: 16px;
        letter-spacing: 3px;
        width: 40px;
        color: #000;
        display: inline-flex;
        border: 4px solid #1DA599;
        border-radius: 10px;
    }
    .read-artikel .label {
        margin-bottom: 0;
        font-weight: normal;
        font-size: 16px;
        letter-spacing: 3px;
        width: 40px;
        color: #000;
        display: inline-flex;
        border: 4px solid #fff;
        border-radius: 10px;
    }
    
    .label {
        font-weight: normal;
        font-size: 16px;
        letter-spacing: 3px;
        width: 40px;
        color: #000;
        display: inline-flex;
        border: 4px solid #1DA599;
        border-radius: 10px;
    
    
    }
    
    font-family: Nunito-Sans-Bold;
    color: #D9D9D9;
}
.lbl-kabar-ramadhan {
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border: 4px solid #1DA599;
    border-radius: 10px;
}
.read-artikel .label {
    margin-bottom: 0;
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border: 4px solid #fff;
    border-radius: 10px;
}

.label {
    font-weight: normal;
    font-size: 16px;
    letter-spacing: 3px;
    width: 40px;
    color: #000;
    display: inline-flex;
    border: 4px solid #1DA599;
    border-radius: 10px;


}
