*,html,:before,:after{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-family:inherit;-moz-box-sizing:border-box;box-sizing:border-box;font-size:100%;text-align:left}img{color:transparent;font-size:0;vertical-align:middle;-ms-interpolation-mode:bicubic}ol,ul{list-style:none}li{display:list-item}a img{border:0}a{text-decoration:none}b,strong{font-weight:900}i,em{font-style:italic}img{max-width:100%}.btn,input[type=button],select,button{-webkit-appearance:none;cursor:pointer;background-color:transparent}.content_center{display:flex;justify-content:center;align-items:center}.hide{display:none}



:root, :before, :after{
  --site-container:1280px;
  --size-1:5px;
  --size-2:8px;
  --size-3:13px;
  --size-4:21px;
  --size-5:34px;
  --size-6:55px;
  --size-7:89px;
  --max-zindex:2147483648;
  --fontsize:14px;
  --bg-1:#231F20;
  --bodypadding:var(--size-4);
  --header-height:var(--size-6);
}



body, html{font-family:'Montserrat',sans-serif; font-size:var(--fontsize); font-weight:normal; font-optical-sizing:auto; font-style:normal; letter-spacing:0.13px; 
font-feature-settings:'lnum' 1; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; -webkit-font-smoothing:antialiased; 
-moz-osx-font-smoothing:grayscale; text-rendering:optimizeSpeed;}
html, body{background-color:var(--bg-1);}
html{scroll-behavior:smooth; min-height:100vh;}
body{overflow-x:hidden;}
a, button{font-weight:bold;}
.btn, a.btn, button.btn{padding:var(--size-3) var(--size-4); font-weight:bold; -webkit-appearance:none; text-transform:capitalize; 
display:flex; text-align:center; align-items:center; justify-content:center;}
.rancak-popup{display:none;}
.width-max{position:relative; width:100%; max-width:var(--site-container); margin:0 auto;}



.flex_ori{display:block; overflow:hidden; position:relative; line-height:0;}
.flex_ori:before{content:''; display:block; padding-top:calc(100% / calc(var(--aspect-ratio)));}
.flex_ori img, .flex_ori iframe{position:absolute; z-index:2; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.flex_ori img:not([src]){visibility:hidden;}



header{position:relative; position:-webkit-sticky; position:sticky; z-index:calc(var(--max-zindex) - 9000); top:0;}
.header-container{display:grid; grid-template-columns:auto 1fr; width:100%;}
.header-left, .header-right{display:flex;}
.header-right{justify-content:flex-end;}
.header-box{height:var(--header-height); padding:0 var(--size-3);}
.header-box svg{width:auto; height:calc(var(--fontsize) + 2px);}
.logo{padding-left:var(--size-4);}



.nav-link{display:flex;}
.nav-link-label, .nav-link-toggle{height:var(--header-height); display:flex; align-items:center;}
.nav-link-label{width:100%;}
.nav-link-toggle svg{width:auto; height:calc(var(--fontsize) - 8px);}
.nav-sub{display:none;}
.nav-sub > .nav-box{border-top:1px dashed;}



.rancak-column{display:grid; grid-gap:var(--size-5); margin:var(--size-5) 0;}
.rcb-container{display:grid; grid-gap:var(--size-6);}
.rancak-column-big{min-height:200vh;}
.section-title{font-weight:bold; text-transform:uppercase; font-size:calc(var(--fontsize) + 6px); margin-bottom:var(--size-4);
display:grid; grid-gap:var(--size-3); grid-template-columns:auto 1fr; align-items:center;}
.section-title svg{width:auto; height:calc(var(--fontsize) + 2px);}



.article-list-container{display:grid; grid-gap:var(--size-4);}
.article-box{display:grid; grid-gap:var(--size-3); grid-template-columns:auto 1fr; padding-bottom:var(--size-4); border-bottom:1px dashed;}
.article-title-detail{line-height:160%; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.article-misc{display:flex; font-size:calc(var(--fontsize) - 4px)}
.article-misc > *{margin-top:var(--size-2); margin-right:var(--size-1); padding:var(--size-1); border:1px solid;}
.article-time{border:0; padding-left:0;}
.article-desc{margin-top:var(--size-2); font-size:calc(var(--fontsize) - 2px); line-height:160%; 
display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.article-thumb{--aspect-ratio:1/1; width:var(--size-7);}
.article-thumb-icon{position:absolute; z-index:10; top:0; left:0; width:100%; height:100%;}
.article-list .iklan-retangle{margin-top:var(--size-4);}

.video-playlist{--aspect-ratio:16/9;}
.video-list .article-list-container{display:grid; grid-gap:var(--size-2); margin-bottom:var(--size-4);}
.video-list .article-thumb{--aspect-ratio:16/9; width:100% !important;}



.trending-section .section-title{margin-bottom:var(--size-2);}
.trending-link{display:grid; grid-template-columns:var(--size-5) 1fr; padding:var(--size-4) 0; border-bottom:1px dashed;
font-size:calc(var(--fontsize) + 4px); line-height:150%;}
.trending-title{}



.hero-image-frame{--aspect-ratio:16/9;}
.hero-image-info{margin-top:var(--size-2); position:relative; padding-left:var(--size-3); display:grid; grid-gap:var(--size-1); 
font-family:'Bitter',sans-serif; font-size:calc(var(--fontsize) - 2px); font-style:italic; line-height:140%;}
.hero-image iframe, .hero-image:before{display:block; position:absolute; bottom:0; left:0; width:100%; height:100%;}
.hero-image-info:before{content:'';}



.detail-container{display:grid; grid-gap:var(--size-4);}

.detail-top, .detail-info, .detail-info-list{display:grid;}
.detail-top{grid-gap:var(--size-3);}
.detail-title{font-size:calc(var(--fontsize) + 10px); line-height:130%; font-weight:800;}
.detail-desc{font-family:'Bitter',sans-serif; line-height:150%; font-style:italic;}
.detail-info{grid-gap:var(--size-2);}
.detail-info-list{grid-template-columns:80px auto 1fr; grid-gap:var(--size-1);}
.detail-info-topic .detail-info-link{display:inline-flex;}
.detail-info-topic .detail-info-link:not(:last-child):after{content:',';}

.detail-content{font-size:calc(var(--fontsize) + 4px); font-family:'Bitter',sans-serif; line-height:150%; display:grid; grid-row-gap:var(--size-4);
word-wrap:break-word; word-break:break-word; hyphens:auto;}
.detail-content h2, .detail-content h3, .detail-content h4, .detail-content b{font-weight:bold;}
.detail-content h2, .detail-content h3, .detail-content h4{font-size:calc(var(--fontsize) + 6px);}
.detail-content > ul, .detail-content > ol{padding-left:var(--size-4);}
.detail-content > ul{list-style:square;}
.detail-content > ol{list-style:decimal;}
.detail-content > ul > li, .detail-content > ol > li{padding:2px 0;}



.embed-socmed iframe{min-width:299px !important; max-width:300px !important;}
.embed-socmed .instagram-media, .embed-socmed .tiktok-embed{margin:0 !important; padding:0 !important;}



.share-box, .share-list{display:flex; align-items:center;}
.share-box{justify-content:space-between;}
.share-label{padding-left:var(--size-3);}
.share-link{padding:0 var(--size-3); height:48px;}
.share-other{padding-right:var(--size-4);}
.share-link svg{width:auto; height:var(--size-4);}



.article-loadmore-button{display:grid; grid-gap:var(--size-3); align-items:center; grid-template-columns:auto 1fr; 
margin-top:var(--size-4); padding:var(--size-4) var(--size-5) !important; font-weight:500;}
.alb-icon{line-height:0;}



.search-box{position:relative;}
.search-field{border:1px solid; width:100%; padding:var(--size-4); padding-right:calc(var(--size-2) + var(--size-7));}
.search-button{position:absolute; top:0; right:0; height:100%; width:var(--size-7);}
.search-result{display:grid; grid-gap:var(--size-1); margin-top:var(--size-3);}
.search-result-info{font-weight:bold; color:var(--color-2); line-height:160%;}



.iklan-retangle-container{width:300px; height:250px;}







@media screen and (min-width:0px) and (max-width:1023px){
  :root, :before, :after{
    
  }
  
  
  
  .desktop-only, .share-box-static{display:none !important; visibility:hidden; content-visibility:hidden;}
  .desktop-only iframe[loading=lazy]{content-visibility:hidden !important;}
  
  
  
  .header-togglenav{padding-right:var(--size-4); width:var(--size-6);}
  .header-nav-mobile, .header-togglenav .svgicon-close{display:none;}
  
  
  
  .nav-box{border-top:1px solid;}
  
  
  
  .rancak-section-box{padding:0 var(--size-4);}
  
  
  
  .hero-image-info{margin-left:var(--size-4); margin-right:var(--size-4);}
  .detail-content .hero-image-info{margin-left:0; margin-right:0;}
  
  
  
  .detail-top, .detail-content{padding:0 var(--size-4);}
  
  
  
  .share-page{padding:0 var(--size-4);}
  
  
  
  .iklan-mobile-top-container{width:320px; height:100px;}
}