body{
    font-family: Montserrat;
}

.bg-navbar{
    background-color: #363636;
    min-height: 70px;
}

.navbar .navbar-brand{
    color: #fff;
    font-family: Viga;
    text-transform: uppercase;
}

.navbar .nav-item .nav-link{
    color: #fff;
    font-family: Montserrat;
    text-transform: uppercase;
    font-weight: 300;
}

.navbar .nav-item .nav-link:hover{
    color: rgb(0, 154, 154);
}

.navbar .nav-item .active{
    color: rgb(0, 154, 154);
}

.navbar .navbar-toggler{
    color: #fff;
    border: 1px solid #fff;
    border-color: #fff;
}

.navbar .dropdown-item:hover{
    background-color: rgb(0, 154, 154);
    color: #fff;
}

.navbar .d-flex{
    display: block !important;
}

.navbar .d-flex .btn-search{
    color: #fff;
    background-color: rgb(0, 154, 154);
    border: 1px solid rgb(0, 154, 154);
}

.navbar .d-flex .btn-search:hover{
    color: rgb(0, 154, 154);
    background-color: #363636;
    border: 1px solid rgb(0, 154, 154);
}


@media (min-width: 1200px) {
    .navbar .d-flex{
        display: none !important;
    }
}




/* Heading Capt */
.heading-capt{
    margin-top: 100px;
    padding-bottom: 50px;
}

.heading-capt .heading-capt-text{
    color: #363636;
    text-align: center;
    font-family: Montserrat;
    font-weight: 400;
    padding-bottom: 20px;
}

.heading-capt .brd{
    border-bottom: 2px solid #ddd;
}




/* Layout Display */
.layout-display{
    padding-bottom: 50px;
}

.layout-display .heading{
    color: #363636;
    font-family: Viga;
}

.layout-display .direct-link{
    color: rgb(0, 154, 154);
    text-decoration: none;
}

.layout-display .direct-link:hover{
    text-decoration: underline;
}

.layout-display .author{
    color: #818181;
}

.layout-display .brd-smpg{
    border-left: 1px solid #c8c8c8;
    border-right: 1px solid #c8c8c8;
    padding-left: 20px;
    padding-right: 20px;
}

.layout-display .headirect{
    color: #363636;
    text-decoration: none;
}

.layout-display .headirect:hover{
    color: rgb(0, 154, 154);
}

.layout-display .description{
    color: #363636;
    margin-top: 20px;
}

.layout-display .page-item .page-link{
    color: #fff;
    background-color: #363636;
    border: 0;
}

.layout-display .page-item .page-link:hover{
    background-color: rgb(0, 154, 154);
}

.layout-display .active{
    background-color: rgb(0, 154, 154) !important;
}

.layout-display form .btn-search{
    color: #fff;
    background-color: rgb(0, 154, 154);
    border: 1px solid rgb(0, 154, 154);
}

.layout-display .artikel-terbaru{
    margin-top: 70px;
}

.layout-display .langganan{
    margin-top: 50px;
}

.layout-display .langganan .btn-email{
    background-color: #000;
    border: 1px solid #000;
    width: 100%;
    color: #fff;
}

.layout-display .langganan .btn-email:hover{
    color: #fff;
    background: rgb(0, 154, 154);
    border: 1px solid rgb(0, 154, 154);
}

.layout-display .kategori{
    margin-top: 50px;
}

.layout-display .medsos-circle{
    background-color: #363636;
    color: #fff;
    text-align: center;
    border-radius: 100%;
    width: 50px;
    height: 50px;
}

.layout-display .medsos{
    margin-top: 70px;
}

.layout-display .mrg-circle{
    margin-top: 14px;
}

.layout-display .medsos-link{
    color: #fff;
    text-decoration: none;
}

.layout-display .medsos-circle:hover{
    background-color: rgb(0, 154, 154);
}

.layout-display .dm-none{
    display: none;
}

@media (min-width: 1200px) {
    .layout-display .dm-none{
        display: block;
    }
}


.layout-display .pertama{
    display: block;
}

.layout-display .kedua{
    display: block;
}

.layout-display .terakhir{
    display: block;
}

.layout-display .kiri{
    display: none;
}

.layout-display .tengah{
    display: none;
}

.layout-display .kanan{
    display: none;
}

@media (min-width: 1200px) {
    .layout-display .pertama{
        display: none;
    }

    .layout-display .kedua{
        display: none;
    }

    .layout-display .terakhir{
        display: none;
    }

    .layout-display .kiri{
        display: block;
    }

    .layout-display .tengah{
        display: block;
    }

    .layout-display .kanan{
        display: block;
    }
}


.layout-display .btn-facebook{
    background-color: #4267B2;
    border: 1px solid #4267B2;
    padding: 5px;
    font-size: 12px;
    color: #fff;
}

.layout-display .btn-x{
    background-color: #000;
    border: 1px solid #000;
    padding: 5px;
    font-size: 12px;
    color: #fff;
}

.layout-display .btn-linkedin{
    background-color: #0077B5;
    border: 1px solid #0077B5;
    padding: 5px;
    font-size: 12px;
    color: #fff;
}

.layout-display .btn-kirim{
    background-color: #363636;
    color: #fff;
    border: 1px solid #363636;
}


.layout-display .email-box{
    background-color: rgb(219, 219, 219);
    min-height: 50px;
    padding: 20px;
}

.layout-display .btn-mail{
    background-color: #000;
    width: 100%;
    border: 1px solid #000;
    color: #fff;
}

.layout-display .btn-mail:hover{
    background-color: rgb(0, 154, 154);
    width: 100%;
    border: 1px solid rgb(0, 154, 154);
    color: #fff;
}


.layout-display .quote-box{
    background-color: #000;
    min-height: 100px;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
}

.layout-display .img-quote{
    padding-top: 20px;
}

.layout-display .link-name{
    color: rgb(0, 154, 154);
    text-decoration: none;
}

.layout-display .link-name:hover{
    text-decoration: underline;
}




/* Footer Top */
.footer-top{
    margin-top: 100px;
    background-color: #000;
    padding-bottom: 50px;
}

.footer-top .heading{
    color: #fff;
    font-family: Viga;
}

.footer-top .under-text{
    color: #bababa;
}

.footer-top .title-link{
    color: rgb(0, 154, 154);
    text-decoration: none;
}

.footer-top .title-link:hover{
    text-decoration: underline;
}



/* Copyright */
.copyright{
    margin-top: 100px;
    padding-bottom: 50px;
}

.copyright .copy-text{
    text-align: center;
    color: #363636;
}

.copyright .copy-text .flex-link{
    color: rgb(0, 154, 154);
    text-decoration: none;
}

.copyright .copy-text .flex-link:hover{
    text-decoration: underline;
}