html {
    scroll-behavior: smooth;
}
body{
    background-color: #FFFFFF;
    /* font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif !important ; */
    font-family: Arial, Helvetica, sans-serif !important;
}
a,a:hover{
    color: inherit;
    text-decoration: none;
}

.social svg{
    font-size: 10pt;
    margin: 0 3px;
}
.social svg:hover{
    color: red;
    cursor: pointer;
}

/* start section ads */
header .top-logo{
    margin: 10px 0;
}
.ads{
    width: 100%;
    height: 150px;
    margin: 10px 0;
}
.ads .bg{
    height: inherit;
    position: relative;
    background-color: #EEEEEE;
}
.ads .bg img{
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: 0 0;
}
.ads .bg i{
    float: right;
    font-size: 10pt;
}
/* end section ads */

header{
    position: relative;
    box-shadow: 0 0 15px rgba(0, 0, 0, .15);
}
header .top-header{
    background-color: antiquewhite;
    padding: 3px 0;
}

header .top-logo .logo .logo-one,
header .top-logo .logo .logo-two,
.logo-one,
.logo-two{
    position: relative;
    top: 35%;
    font-size: 33pt;
}
header .top-logo .logo-two,
.logo-two{
    background-color: #F00F00;
    color: #FFFFFF;
}

header .menu a{
    color: inherit;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 600;
    padding: 10px 5px;
    float: left;
    margin-right: 1px;
    margin-bottom: 2px;
}
header .menu a:hover,
header .menu a.active{
    background-color: #F00F00;
    color: white;
    border-radius: 3px 3px 0 0;
    
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
}

section .font-shared{
    font-size: 15pt;
}
section .font-shared .tw{
    color: rgb(29, 155, 240);
}
section .font-shared .wa{
    color: #00a884;
}
section .font-shared .fb{
    color: #1b74e4;
}

section .section-latest{
    height: 50vh;
    background-color: #EEEEEE;
    margin-bottom: 20px;
}


.image {
    display: block;
    max-width: 100%;
    height: auto;
}

.loading {
    filter: blur(10px);
    clip-path: inset(0);
}

.loaded {
    filter: blur(0px);
    transition: filter 0.5s linear;
}

section .content,
section .tab-content{
    /* width: 100%; */
    overflow: hidden;
}
section .content img,
section .most-img img{
    transition: transform .3s ease;
}
section .content img:hover,
section .most-img img:hover{
    transform: scale(1.1);
}
section .most-img img{
    width: 100%;
    height: 100px;
    object-fit: cover;
    object-position: 50% 0;
}

/* start template-1 */
section .template-1{
    margin-top: 10px;
    margin-bottom: 20px;
}
section .template-1 .col-md-6{
    margin-bottom: 10px;
}
section .template-1 .title-template{
    border-bottom: 2px solid rgb(0, 42, 255);
    margin: 0 0 5px 0;
}
section .template-1 .title-template .head{
    font-size: 18pt;
    padding-left: 0 !important;
    text-transform: uppercase;
}
section .template-1 .title-template .read-more{
    color: #F00F00;
    font-weight: bolder;
    font-style: oblique;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-size: 10pt;
    padding-right: 0 !important;
}
section .template-1 .content-head{
    /* text-transform: capitalize; */
    font-weight: bold;
    font-size: 14pt;
    /* margin: 10px 0; */
    height: 100px;
}
section .template-1 .content-head:hover{
    color: #F00F00;
}

section .template-1 .content img{
    width: 100%;
    height: 200px;
    object-fit: cover;
    object-position: 50% 0;
    transition: all 0.5s;
}
section .template-1 .content-date{
    font-size: 9pt;
    padding: 2px 0;
}
section .template-1 .content-date .icon{
    margin-right: 5px;
}

section .template-1 .content-desc{
    font-size: 10pt;
    text-align: justify;
}

section .template-1 .content-desc i{
    color: #0033FF;
    margin-left: 5px;
    float: right;
    /* margin-top:-10%; */
}
section .template-1 .content-desc p{
    height: 50px;
}
/* end template-1 */

/* start template-2 */
section .template-2{
    margin-top: 10px;
    margin-bottom: 20px;
}
section .template-2 .col-md-4{
    margin-bottom: 20px;
}

section .template-2 .title-template{
    border-bottom: 2px solid rgb(0, 42, 255);
    margin: 0 0 10px 0;
}
section .template-2 .title-template .head{
    font-size: 18pt;
    padding-left: 0 !important;
    text-transform: uppercase;
}
section .template-2 .title-template .read-more{
    color: #F00F00;
    font-weight: bolder;
    font-style: oblique;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-size: 10pt;
    padding-right: 0 !important;
}
section .template-2 .content-head{
    /* text-transform: capitalize; */
    font-weight: bold;
    font-size: 13pt;
    margin-bottom: 5px;
    height: 100px;
}
section .template-2 .content-head:hover{
    color: #F00F00;
}
section .template-2 .content img{
    width: 100%;
    height: 8rem;
    object-fit: cover;
    object-position: 50% 0;
}
section .template-2 .content-date{
    font-size: 9pt;
    padding: 2px 0;
}
section .template-2 .content-date .icon{
    margin-right: 5px;
}

section .template-2 .content-desc{
    font-size: 9pt;
    text-align: justify;
}

section .template-2 .content-desc i{
    color: #0033FF;
    margin-left: 5px;
    float: right;
    /* margin-top:-15%; */
}
section .template-2 .content-desc p{
    height: 55px;
}
/* end template-2 */

/* start template-3 */
section .template-3{
    margin-top: 10px;
    margin-bottom: 20px;
}

section .template-3 .title-template{
    border-bottom: 2px solid rgb(0, 42, 255);
    margin: 0 0 10px 0;
}
section .template-3 .title-template .head{
    font-size: 18pt;
    padding-left: 0 !important;
    text-transform: uppercase;
}
section .template-3 .title-template .read-more{
    color: #F00F00;
    font-weight: bolder;
    font-style: oblique;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-size: 10pt;
    padding-right: 0 !important;
}
section .template-3 .content-head{
    /* text-transform: capitalize; */
    font-weight: bold;
    font-size: 14pt;
    /* margin: 10px 0; */
    height: 100px;
}

section .template-3 .content{
    width: 100%;
}
section .template-3 .content img.parent{
    width: 100%;
    height: 200px;
    object-fit: cover;
    object-position: 50% 0;
}
section .template-3 .content.child img{
    /* width: 100%; */
    /* height: 6.5rem; */

    width: 100%;
    height: 6.5rem;
    object-fit: cover;
    object-position: 50% 0;
}
section .template-3 .content-head:hover{
    color: #F00F00;
}
section .template-3 .content-date{
    font-size: 8pt;
    padding: 2px 0;
}
section .template-3 .content-date .icon{
    margin-right: 5px;
}

section .template-3 .content-desc{
    font-size: 9pt;
    text-align: left;
}

section .template-3 .content-desc i{
    color: #0033FF;
    margin-left: 5px;
    float: right;
}
section .template-3 .content-desc b{
    /* text-transform: capitalize; */
}
/* end template-3 */


/* start template-4 */
section .template-4{
    margin-top: 10px;
    margin-bottom: 20px;
}

section .template-4 .title-template{
    border-bottom: 2px solid rgb(0, 42, 255);
    margin: 0 0 5px 0;
}
section .template-4 .title-template .head{
    font-size: 18pt;
    padding-left: 0 !important;
    text-transform: uppercase;
}
section .template-4 .title-template .read-more{
    color: #F00F00;
    font-weight: bolder;
    font-style: oblique;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-size: 10pt;
    padding-right: 0 !important;
}
section .template-4 .col-md-12{
    margin-top: 15px;
}
section .template-4 .content-head{
    /* text-transform: capitalize; */
    font-weight: bold;
    font-size: 15pt;
    margin: 10px 0;
    height: 100px;
}
section .template-4 .content-head:hover{
    color: #F00F00;
}
section .template-4 .content-date{
    font-size: 9pt;
    padding: 2px 0;
}
section .template-4 .content-date .icon{
    margin-right: 5px;
}
section .template-4 .content h5:hover{
    color: #F00F00;
}
section .template-4 .content img{
    width: 100%;
    height: 125px;
    object-fit: cover;
    object-position: 50% 0;
}
section .template-4 .content-desc{
    font-size: 10pt;
    text-align: justify;
}

section .template-4 .content-desc i{
    color: #0033FF;
    margin-left: 5px;
    float: right;
    /* margin-top:-10%; */
}
/* end template-1 */

/* start most section */
section .section-bg .most{
    /* height: 50vh; */
    background-color: #EEEEEE;
    padding: 20px;
}
section .section-bg .plugins{
    /* background-color: #EEEEEE; */
    padding: 5px;
    height: 400px;
}
section .section-bg .plugins iframe{
    border: none;
    border-bottom: 1px solid;
}
/* .content{
    width: 450px;
    height: auto;
    margin: 0 auto;
    padding: 30px;
    background-color: rgb(96, 96, 96);
}
.nav-pills{
    width: 450px;
}
.nav-item{
    width: 50%;
} */
.nav-pills .nav-link{
    color: #999999;
    font-weight: bolder;
    border-radius: 0;
}
.nav-pills .nav-link.active{
    background: none;
    color: #000000;
    border-bottom: solid 1px #F00F00;
}
.tab-content{
    position: relative;
    height: auto;
    color: #000000;
    z-index: 2;
}
.tab-content button{
    margin: 0 auto;
    float: right;
}
.most-row{
    margin-top: 15px;
}
.most-content b{
    font-size: 10pt;
}
.most-content b.sport,
.most-content b.news,
.most-content b.tech{
    background-color: #F00F00;
    color: #FFFFFF;
    padding: 2px 5px;
}
.most-content b.politic,
.most-content b.crypto,
.most-content b.otomotif{
    background-color: #5c8503;
    color: #FFFFFF;
    padding: 2px 5px;
}
.most-content b.movie,
.most-content b.travel,
.most-content b.music{
    background-color: #009f0b;
    color: #FFFFFF;
    padding: 2px 5px;
}
.most-content b.seleb,
.most-content b.novel,
.most-content b.game,
.most-content b.food{
    background-color: #0033FF;
    color: #FFFFFF;
    padding: 2px 5px;
}

.most-content .title{
    font-size: 8pt;
}
.most-content .date{
    font-size: 8pt;
}
.most-content .date .icon{
    margin-right: 5px;
}
/* end most section */

/* start section search */
section .search{
    margin: 10px 0;
}
/* end section search */

.detail .detail-head{
    /* text-transform: capitalize; */
    margin: 20px 0 0 0;
}
.detail .detail-head .datetime{
    font-size: 10pt;
    color: #999999;
}
.detail .detail-content{
    margin: 20px 0;
}
.detail .detail-desc,
.detail .detail-desc p,
.__se__float-none{
    text-align: justify;
    overflow: hidden;
}
.detail .detail-desc table{
    width: 100%;
    text-align: left;
}
.detail .detail-desc table th{
    background-color: #EEEEEE;
    font-weight: bolder;
    border: 1px solid;
    padding: 5px;
}
.detail .detail-desc table th div span{
    background: rgba(0, 0, 0, 0.0) !important;
}
.detail .detail-desc table td{
    font-weight: lighter;
    border: 1px solid;
    padding: 5px;
}
.detail .detail-desc ul li{
    text-align: left;
}
figure img,
.detail-desc img {
    max-width: 100% !important;
    height: auto !important;
}

.detail .detail-desc .__se__float-center figure,
.detail .detail-desc .__se__float-center figure img{
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto;
}
.detail .detail-desc .__se__float-none figure img,
.detail .detail-desc .__se__float- figure img{
    max-width: 100%;
    height: auto !important;
}
.detail .detail-desc .__se__float-left figure{
    float: left;
}
.detail .detail-desc .se-video-container figure{
    padding-bottom: 0 !important;
}
/* start section error 404 */
section .error404{
    margin: 150px 0;
}
section .error404 h1{
    font-size: 150pt;
    color: #999999;
}
section .error404 h2{
    font-size: 50pt;
}
/* end section error 404 */
footer{
    margin-top: 20px;
    color: #FFFFFF;
}
footer .top-footer{
    padding: 30px 0 50px 0;
    background-color: rgb(31, 31, 31);
    box-shadow: 0 0 15px rgba(226, 221, 221, 0.15);
}
footer .top-footer h5{
    text-transform: uppercase;
    border-bottom: 3px red solid;
}
footer .top-footer b{
    color: #999999;
    background-color: rgb(55, 55, 55);
    padding: 5px 10px;
    border-radius: 50px;
    margin: 0 5px 5px 0;
    cursor: pointer;
    float: left;
}
footer .top-footer b:hover{
    color: #F00F00;
}
footer .top-footer .footer-category ul{
    margin: 0px;
    list-style: outside none none;
    box-shadow: none;
    padding: 0px;
}
footer .top-footer .footer-category ul li{
    color: #999999;
    text-align: left;
    margin-left: 0px;
    line-height: 30px;
    list-style: outside none none;
}
footer .top-footer .footer-category ul li svg{
    font-size: 8pt;
    margin-right: 5px;
}
footer .top-footer .footer-category ul li a:hover{
    border-bottom: 1px solid #F00F00;
}
footer .top-footer .contact svg{
    width: 5%;
    margin-right: 5px;
}

footer .top-footer .footer-line{
    -webkit-box-shadow: 0 0 2px 1px #333333;
    box-shadow: 0 0 2px 1px #333333;
    margin: 20px 0;
}
footer .top-footer .footer-subscribe h4{
    margin-bottom: 10px;
    text-transform: uppercase;
}
footer .top-footer .footer-subscribe .subscribe input{
    color: #FFFFFF;
    background: none;
    border: none;
}
footer .top-footer .footer-subscribe .subscribe input:focus{
    border-bottom: 1px solid #F00F00;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}
footer .top-footer .footer-subscribe .subscribe button{
    margin-top: 10px;
    font-weight: bolder;
}
footer .top-footer .footer-subscribe .subscribe button:hover{
    background: none;
    color: #F00F00;
    -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -ms-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
}
footer .bottom-footer{
    padding: 10px 0;
    color: #FFFFFF;
    background-color: rgb(0, 0, 0);
}

@media only screen and (max-device-width: 425px){
    /* section .template-2 .content img {
        height: auto;
    } */
    .content img {
        height: 200px !important;
    }
    .detail .detail-desc .se-video-container figure iframe{
        width: 100% !important;
    }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 575px){
    /* header .top-logo .logo, header .top-logo .ads-banner {
    } */
    /* .ads{
        margin: 0;
    }
    .ads .bg{
        padding: 0;
    } */
    /* section .template-1 .content img {
        height: auto;
    } */
}

@media only screen and (min-device-width: 768px) and (max-device-width: 991px){
    section .template-1 .content img {
        height: 185px;
    }
}

@media only screen and (min-device-width: 576px){
    /* .social{
        display: inline-block;
        text-align: center;
    } */
}


.sticker{width:inherit;height: 30px;overflow: hidden;padding: 3px;position: relative;}
ul.news-demo-down-auto{padding:0;float: left;-webkit-animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite;-moz-animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite;-ms-animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite;animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite}
ul:hover{-webkit-animation-play-state: paused;-moz-animation-play-state: paused;-ms-animation-play-state: paused;animation-play-state: paused; cursor: pointer;}
.sticker li{line-height: 25px;list-style: outside none none;text-align: left;}
.sticker a{color: #000000;text-decoration: none;font-size: 10pt}
@-webkit-keyframes ticker{0%{margin-top: 0}25%{margin-top: -26px}50%{margin-top: -52px}75%{margin-top: -78px}100%{margin-top: 0}}
@-moz-keyframes ticker{0%{margin-top: 0}25%{margin-top: -26px}50%{margin-top: -52px}75%{margin-top: -78px}100%{margin-top: 0}}
@-ms-keyframes ticker{0%{margin-top: 0}25%{margin-top: -26px}50%{margin-top: -52px}75%{margin-top: -78px}100%{margin-top: 0}}
@keyframes ticker{0%{margin-top: 0}25%{margin-top: -26px}50%{margin-top: -52px}75%{margin-top: -78px}100%{margin-top: 0}}