@charset "utf-8";
 body {margin:0 auto; font-family: 'Open Sans', sans-serif; background:#fff;}
 * {
  box-sizing: border-box;
}
.wraper_bottom { margin-bottom:10px; }
  .wrapper {width:1280px; height:auto;  margin:0 auto;  position: relative;}
    #halaman { width:1280px; margin:0 auto; padding:0; }
#top_header {border-bottom:1px solid #f6f6f6;  text-align:center;padding:10px; width:100%; position:fixed;left:0; clear:both; top:0; z-index:500; color:#333; font-weight:600; background:#fdfdfd;}
.top_header2 { width:680px; margin:0 auto; height:100%; text-align:center; z-index:500; }
#top_cari {width:280px; color:#333; padding-top:5px;float:left; text-align:left; margin:0 auto;} 
#top_medsos {width:170px;  color:#333; float:left;  margin-top:5px; }
 #top_redaksi {width:230px;  color:#333;  text-align:left; margin-top:7px; float:right;  text-decoration:none; text-transform: capitalize;}
 .top_title_redaksi {color:#333;  float:left; font-size:100%; padding-right:10px; text-align:left; text-decoration:none; text-transform: capitalize;}
  .top_title_redaksi a {color:#333; float:left; font-size:100%;  padding-right:10px; text-align:left; text-decoration:none; text-transform: capitalize;}
  
   .header {width:100%; height:auto; margin:0 auto;  top:50; position:absolute;   left:0; right:0; background:none;}
	.header_tgh {width:1280px;  height:155px; margin:0 auto; text-align:center; background:none;}
	.logo {
	background-position:center;
	background-repeat:no-repeat;
	width:200px;
	margin:0 auto;
	padding-top:20px;
  }
  
.header2 {height:90px; }
.header_tgh2 {height:100%; margin-top:80px;}


#jam_top { margin-top:10px; font-weight:700; color:#666; text-align:center; padding-left:20px; font-size:80%; }
	.navigation {width:100%; height:50px; margin-top:20px;   position:absolute; background:#000; left:0; right:0}
	 .navigation_isi {height:100%; width:1280px; margin:0 auto; background:#000;}
	
	 #news_top { height:110px; margin-top:150px; margin-bottom:30px; }
    #news_top { height:110px; margin-top:150px; margin-bottom:30px;}
	
  #kiri{width:350px; height:auto;float:left;}

.kanan {width:330px; height:auto; right:0; float: right;  margin-bottom:120px;}

 .two_colloum {width:920px; height:500px; font-size:10px; border:1px solid #666; padding-bottom:40px; margin-bottom:50px; margin-top:180px; }

#conten {margin:0px 360px 0 380px;   margin-bottom:40px; height:auto; margin-top:-10px; }
 

.col_sub_rubrik {padding:10px;  border:1px solid #f6f6f6; margin-bottom:40px; margin-top:40px; border-radius:10px; }
 	 #col_sub_editorial {border:2px solid #f5f5f5; border-radius:10px; padding:10px; background:#f6f6f6; margin-top:-10px; margin-bottom:35px;}
	#txt_title { color:#333; float:left; width:100%; padding-left:20px; line-height:1.5; text-decoration:none; word-spacing: normal;  }
		#txt_title a { color:#333; float:left; width:100%; line-height:1.5; text-decoration:none; word-spacing: normal; }
	
	.col_txt {font-size:95%; float:left; line-height:1.5; width:100%; padding-left:20px; color:#555; text-decoration:none; padding-bottom:20px;} 
	.col_txt a {font-size:95%; float:left; line-height:1.5; width:100%; color:#555; text-decoration:none; padding-bottom:20px;} 
	#col_img {float:right;  width:100%;  clear: both;}
	
	.rubrik {font-size:110%; color:#fff;  margin-top:-29px; text-transform: uppercase; font-weight:600; background:#666; width:150px; padding:2px 0 4px 15px; border-radius:10px; }
	.rubrik-populer {font-size:110%; color:#fafafa;  margin-top:-29px; border-bottom:6px solid #ddd;  border-left:2px solid #ddd; text-transform: uppercase; font-weight:600; background:#F66; width:200px; padding:2px 0 4px 15px; border-bottom-left-radius:10px; }
	
	#tanggal {font-size:70%; font-weight:600; color:#999; margin-top:20px;}
	#tanggal2 {font-size:70%; font-weight:600; color:#333; margin-top:20px;}



<!---- Headline---->

.headline {width:920px; height:auto; overflow:hidden;}

.container_head {
  position: relative;
  font-family: Arial;
  width:920px;
  margin-bottom:60px;
  
}

.text-block {
  position: absolute;
  bottom: 20px;
  left: 0px;
   right: 0px;
  background-color: black;
  color: white;
  padding-left: 20px;
  padding-right: 20px;
  width:auto;
 
}

h2 {font-size:22px; text-decoration:none; text-transform: capitalize; color:#fafafa; padding-top:20px;}
h2 a {font-size: 22px;text-decoration:none; text-transform: capitalize; color:#fafafa; padding-top:20px;}

h5 { font-size:8px; color:#F93;text-transform: capitalize;   }
 

.two_colloum {width:920px; height:auto; border:none; padding:20px;}
 	
	#border-kolom {padding:20px 0 10px 0; border-bottom:1px solid #d6d6d6;  box-sizing: border-box;}

	 
	
      .flex-container-top {
         display: flex;
         height:120px;
         width:auto;
         flex-flow: column wrap;
         align-content: flex-start;
       }
       
      .flex-item-top {
         flex-basis: 20%;
	     border-radius:5px;
 		 width: 305px;
		 height:115px;
		 max-height:115px;
		 overfow:hidden;
         margin:0px;
         text-align: left;
		 padding:5px;
 		 margin-right:20px;
	 
		 box-shadow: 1px 1px 5px rgba(0, 0, 0, .2)
   
     }
			  
		.text-top { font-size:90%;color:#000; padding-right:10px; margin-right:10px; text-decoration:none; text-transform: capitalize;}
		.text-top a { font-size:90%;color:#000; margin-right:10px; padding-right:10px;  text-decoration:none; text-transform: capitalize;}
 
        
    	.bawah {width:1280px; clear:both; height:auto; margin-top:650px; margin:0 auto; margin-bottom:20px;  position: relative ; left:0; right:0;}     
      .rubrik-bawah-col { font-size:130%; font-weight:600; color:#f00; margin-bottom:10px; text-transform: capitalize;}
          	.bawah_col { width:300px; margin-right:10px; height:270px; left:0; right:0; margin:10px auto; font-weight:600;}
	.bawah_col a {  font-weight:600; text-decoration:none; color:#666;}
.conten_isi {width:1280px; clear:both; height:auto;  margin:0 auto; text-align:center;}
.conten_video {width:1280px; clear:both; height:550px; margin-bottom:30px; margin:0 auto;   background:#000; left:0; right:0;}

.col_video_top { width:100%; height:200px; margin-bottom:20px; background:#000;}
.conten_isi-video {width:1280px; clear:both; height:550px;  margin:0 auto; text-align:center;  background:#000;}
  #video_index  {  width:350px;  height:100%; overflow:hidden; background-color:#000; float:right; clear:both;  }
	#video_isi  { height:100%; width:930px;  float:left; background-color:#000; }
  	 #title_video { color:#fafafa; line-height:1.5; font-size:90%; float:left; width:100%; padding-top:20px; padding-left:20px; text-decoration:none; text-transform: capitalize;}
  	  #title_video a { color:#fafafa; line-height:1.5; font-size:90%; float:left; width:100%;  text-decoration:none; text-transform: capitalize;}
	 #tanggal_video {color:#FC3; font-size:70%;}
	  
	  .judul_video_view { font-size:30px; font-weight:600;}
	  
 <!---------------------------->
 
	.banner_left_right { width:100%; height:auto; border:1px solid #f6f6f6; margin:20px; margin-left:0;}
	.iklan_tengah_lebar {width:1280px; clear:both; height:auto; margin:0 auto; margin-bottom:20px;   left:0; right:0;  background-image:url(../iklan/download.jpg)}     
	

.footer {width:100%; clear:both;height:350px; background:#000; left:0; right:0;   position:absolute ;} 
.footer_tgh {width:1280px; clear:both;  background:#0F0; margin:0 auto; text-align:center;} 
   

  /* Mobile Desktop */

.mobile {display:none;}

  
  /* Mobile */
   @media only screen and (max-width:920px) {
  
  /* For tablets: */
  
  .wraper_bottom  {display:none;}
.wrapper  {display:none;}
.bawah  {display:none;}
.footer  {display:none;}
.conten_video  {display:none;}
#halaman{display:none;}
#top_header {display:none; }
.top_header2 {display:none;}
.navigation {display:none;}
.header  {display:none;}
#top_medsos   {display:none;}
#top_redaksi   {display:none;}
#top_cari   {display:none;}

#jam_top   {display:none;}
.header_tgh   {display:none;}
.bawah  {display:none;}
.conten_isi  {display:none;}
.col_video_top  {display:none;}
.conten_video  {display:none;}
.footer  {display:none;}
.footer_tgh  {display:none;}



 body {background:#fff; margin:0; padding:0;}
  
 
 .wrapper_mobile {background:#fff; width:100%; color:#333; margin:0 auto; }
 .container_mobile {background:#fff; width:80%; color:#0f0;}

.logos   {display:block; padding-top:20px;padding-bottom:20px;}

    .header_mobile
{width:100%; display:block;  background:#fafafa; height: auto; position: fixed; top:0 ;margin:0; padding:0;  box-sizing: border-box; }

    .mobile{ display:block;}   
       
       
   /*-----------Video --------------------*/



.headline_mobile {width:100%; height:auto; margin-top:250px; margin-bottom:20px; clear:both; border:1px solid #ddd; left:0; right:0; box-shadow: 1px 2px 19px rgba(0, 0, 0, .2)}
 .text_title_mobile { font-size:16.5px;  font-weight:600; margin:10px;  color:#fafafa; padding-bottom:20px; text-align:left; text-decoration:none; text-transform: capitalize;}
 .text_title_mobile a { font-size:16.5px; font-weight:600; color:#fafafa; text-align:left;   text-decoration:none; text-transform: capitalize;}
#tanggals {font-size:60%; color:#333; margin-bottom:-30px;} 

.col_txt { font-weight:600; color:#000;font-size:12.5px;}
.col_txt a { font-weight:600; color:#000;font-size:12.5px;}

#col_txt_video {font-weight:600; color:#fafafa;font-size:12px;  text-decoration:none; text-transform: capitalize;}
#col_txt_video a {font-weight:600; color:#fafafa;font-size:12px;  text-decoration:none; text-transform: capitalize;}
  
 .nama_category {font-size:13.5px; color:#f30;}
   /*-----------Video --------------------*/
   .videowrapper { float: none; clear: both; width: 100%; position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0;} 
   .videowrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
         
         
     } 
   
   
    


   
     @media only screen and (max-width:660px) {
 .wrapper_mobile{ display:block;}   
    
wrapper  {display:none;}
.bawah  {display:none;}
.footer  {display:none;}
.conten_video  {display:none;}
#halaman{display:none;}
#top_header {display:none; }
.top_header2 {display:none;}
.navigation {display:none;}
.header  {display:none;}
#top_medsos   {display:none;}
#top_redaksi   {display:none;}
#top_cari   {display:none;}
#jam_top   {display:none;}
.header_tgh   {display:none;}
.bawah  {display:none;}
.conten_isi  {display:none;}
.col_video_top  {display:none;}
.conten_video  {display:none;}
.footer  {display:none;}
.footer_tgh  {display:none;}


  /* Mobile Versi */
  
  
  
  .mobile {display:block;}

 body {background:#fff; margin:0 auto; padding:0; font-family: 'Open Sans', sans-serif;}
 .logos   {display:block; padding-top:10px;padding-bottom:20px;}
 .header_mobile {background:#fafafa; height: auto; position: fixed; top:0 ;margin:0; padding:0; left:0;}

<!-----headline-->



.headline_mobile {width:100%; height:auto; margin-top:130px; margin-bottom:20px; clear:both; border:1px solid #ddd; left:0; right:0; box-shadow: 1px 2px 19px rgba(0, 0, 0, .2)}
 .text_title_mobile { font-size:16.5px;  font-weight:600; margin:10px;  color:#fafafa; padding-bottom:20px; text-align:left; text-decoration:none; text-transform: capitalize;}
 .text_title_mobile a { font-size:16.5px; font-weight:600; color:#fafafa; text-align:left;   text-decoration:none; text-transform: capitalize;}
#tanggals {font-size:60%; color:#333; margin-bottom:-30px;} 

.col_txt { font-weight:600; color:#000;font-size:13.5px; font-family: 'Open Sans', sans-serif; text-decoration:none; text-transform: capitalize;}
.col_txt a { font-weight:600; color:#000;font-size:13.5px; font-family: 'Open Sans', sans-serif; text-decoration:none; text-transform: capitalize;}

#col_txt_video {font-weight:600; color:#fafafa;font-size:13px;  text-decoration:none; text-transform: capitalize;}
#col_txt_video a {font-weight:600; color:#fafafa;font-size:13px;  text-decoration:none; text-transform: capitalize;}
  
 .nama_category {font-size:13.5px; color:#f30;}
   /*-----------Video --------------------*/
   .videowrapper { float: none; clear: both; width: 100%; position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0;} 
   .videowrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
    .menu_bottom { width:100%; background:#f00; height:30px; }     
         
     }
   