/* 
    Created on : 2020
    Author     : mariz rep 24/02/2020
    Author     : mariz rep 15/03/2020
    REPDAERAh(NEW VERSION)
*/

@media (min-width: 1920px) {

    /*info*/

    #rule_css:after { content: "more than big col-lg" }
}

@media (min-width: 1440px) {
    

    #rule_css:after { content: "more than big col-lg" }
}
/*


*/
@media (min-width: 1366px) {

    #rule_css:after { content: "more than col-lg" }
}

/*
*/
/* col-lg */
/* Large devices (large desktops, 1200px and up) */


@media (min-width: 1280px) { 
    
    /*info*/
    #rule_css:after { content: " col-md" }
}

/* col-md */
/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) { 
    

    /*info*/
    #rule_css:after { content: " col-md" }
}

/* col-sm */
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) { 
    
    /*info*/
    #rule_css:after { content: " col-sm" }
}

/* col-xs */
/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */
@media (max-width: 768px) { 
    
    
    /*info*/
    #rule_css:after { content: " col-xs" }
}



@media (max-width: 720px) { 
    

    /*info*/
    #rule_css:after { content: " col-xs1" }
}


/* col-xxs */
/*  */
/* custom col extras small */
@media (max-width: 620px) {
    

    /*info*/
    #rule_css:after { content: " col-xxs" }
}


/* col-xxxs */
/*  */
/* custom col extras small */
@media (max-width: 460px) {
    .group-network {
    display: none;
}
    .header{height: auto;}
    .header .navbar{padding: 0;}
    .navbar-light .navbar-toggler{top: 0px!important}
    .header-left .logo img{width: 100%;}
    .follow-sosmed{display: none;}
    .nav-menu li a{font-size: 14px;}
    .dropdown-menu-mobile {margin-top: 10px;margin-bottom: 10px;}
    .sign-in{display: none;}
    .headline{margin-top:100px;}
    .headline-active img{width: 100%;height: auto;}
    .headline-list img{width: 100%;height: 150px;}
    .gradient-headline h1{font-size: 16px;}
    .gradient-headline-list h1{font-size: 14px;}
    
    
    .banner-side{float: none;text-align: center;}
    
    .index-latest img{height: 105px;}
    .index-top-list{height: 250px;}
    .index-top-list h2 {font-size: 15px;margin-top: 6px;}

    .index-list{padding: 0;padding-left: 4px;}
    
    .index-list h3{font-size: 14px;}
    .index-list h2{font-size: 14px;}
    .index-noactive {margin-bottom: 0;height: 130px;}
    .index-top-list img {height: 130px;}


    .side-bar {padding: 0;float: none;margin-top: 20px;}
    .sidebar-wrap{padding: 0;margin-top: 20px;}
    
    /*popular*/
    .popular{position: relative!important; display: block;}
    
    
    
    /*article*/
    .article{margin-top: 100px;}
    .article-content h1{font-size: 21px;}
    .article-content img{height: auto;}
    .banner-article{display: none;}
    .article-read{padding: 0;}
    .article-sidebar{padding: 0;}
    
    /*galeri*/
    .galery-list img{height: 140px;}
    .overplay-gallery h2{font-size: 14px;}
    
    /*foot*/
    .group-rol h2 {font-size: 36px;}
    .logo-rol,
    .logo-rol-id,
    .logo-ihram,
    .logo-janna{margin-bottom: 20px;}
    .foot-sosmed{margin-bottom: 20px;}
    
    .logo-rol img {width: 100%;}
    .logo-rol-id img {width: 74%;}
    .logo-ihram img {width: 75%;}
    .logo-janna img{width: 70%; }
    .logo-republikaid img{width: 100%;}
    .logo-gerai img {width: 70%;}




    /*footer*/
    .foot-category{padding: 0}

    /*info*/
    #rule_css:after { content: " col-xxxs" }
}


/* col-xxxs */
/*  */
/* custom col extras super small */
@media (max-width: 380px) {
    
    .header{height: auto;}
    .header-left .logo img{width: 100%;}
    .header-right{text-align: right;margin-top: 0;}
    
    .headline{margin-top:100px;}
    .headline-active img{width: 100%;height: auto;}
    .headline-list img{width: 100%;height: 150px;}
    .gradient-headline h1{font-size: 16px;}
    .gradient-headline-list h1{font-size: 13px;}
    .gradient-headline-list {padding: 6px;}

    
    
    .banner-side{float: none;text-align: center;margin-bottom: 30px;}
    
    .index-latest img{height: 105px;}
    .index-top-list h2 {font-size: 15px;margin-top: 6px;}

    .index-list{padding: 0;padding-left: 8px;}
    .index-list h3{font-size: 14px;}
    .index-list h2{font-size: 14px;}
    .index-noactive {margin-bottom: 0;height: 130px;}
    .index-top-list img {height: 130px;}


    .side-bar {padding: 0;float: none;margin-top: 20px;}
    .sidebar-wrap{padding: 0;margin-top: 20px;}
    
    /*popular*/
    .popular{position: relative!important; display: block;}
    
    
    
    /*article*/
    .article{margin-top: 100px;}
    .article-content h1{font-size: 21px;}
    .article-content img{height: auto;}
    .banner-article{display: none;}
    .article-read{padding: 0;}
    .article-sidebar{padding: 0;}
    
    /*galeri*/
    .galery-list img{height: 140px;}
    .overplay-gallery h2{font-size: 14px;}
    .topic-selected-list h3{font-size: 15px;}
    
    /*foot*/
    .group-rol h2 {font-size: 28px;}
    .logo-rol,
    .logo-rol-id,
    .logo-ihram,
    .logo-janna{margin-bottom: 20px;}
    .foot-sosmed{margin-bottom: 20px;}

    .logo-rol-id img{width: 65%;}
    .logo-rolimg{width: 80%;}

    
    /*footer*/
    .foot-category{padding: 0}
   
    /*info*/
    #rule_css:after { content: " col-xxxxs" }
}

@media (max-width: 320px) {

    


    /*info*/
    #rule_css:after { content: " col-xxxxxs" }
}