
body{font-family: 'Roboto', sans-serif;background:#fff;}
a{color:#000;}

.title-news-link {
    display:block;
    color:#000;
    text-shadow:none;
}
.title-news-link:hover {
    text-decoration:none;
    color:red;
}

.title-news-link-white {
    display:block;
    color:#fff;
    text-shadow:none;
}
.title-news-link-white:hover {
    text-decoration:none;
    color:red;
}

.title-news-link-gold {
    display:block;
    color:gold;
    text-shadow:none;
}
.title-news-link-gold:hover {
    text-decoration:none;
    color:red;
}


@media (min-width: 1025px) and (max-width: 1366px) {
  
#navbar ul.nav li a{font-size:16px;color:#fff;padding:8px 27px;}
#navbar ul.nav li:hover a{color:#000;}
ul.dropdown-menu li a{color:#000;padding:8px 30px;}
ul.dropdown-menu li:hover a{color:#000;}
#navbar_bottom ul li a{font-size:16px;color:#000;padding:8px 15;font-size:14px;}
#navbar_bottom ul li:hover a{color:#333;} 
}
@media (max-width: 1025px) {
  
#navbar ul.nav li a{color:#fff;padding:8px 45px;}
#navbar ul.nav li:hover a{color:#000;}
ul.dropdown-menu li a{color:#000;padding:8px 15px;}
ul.dropdown-menu li:hover a{color:#000;}
#navbar_bottom ul li a{color:#000;padding:8px 35;font-size:14px;}
#navbar_bottom ul li:hover a{color:#333;} 
}
.background_transparent{background:transparent;}
.background_red{background:red;}
.background_blue{background:#10397c;}
.background_grey{background:grey;}
.background_fafafa{background:#fafafa;}
.background_e2e2e2{background:#e2e2e2;}
.color_red{color:red;}
.color_blue{color:#10397c;}
.color_white{color:#fff;}
.flare {width:100%;height: 14px;margin-bottom:8px;} 
.center{text-align:center;}
.right{text-align:right;}
.left{text-align:left;}
.padding_0{padding:0;}
.borderradius_0{border-radius:0;}
.border_0{border:0;}
.borderbottom_1{border-bottom:1px solid #eaeaea;}
.marginbottom_10{margin-bottom:10px;}
.margintop_12{margin-top:12px;}
.padding_fokus{padding:10px 0;}
.center_block{margin-right:auto;margin-left:auto;}
.sparator{margin-right:auto;margin-left:auto;width:100%;height:10px;}
.num{font-size:29px;}
#main{margin-top:10px;min-height:280px;}
#sliding{min-height:400px;margin-bottom:-60px;}
#heading_rekomendasi, #heading_terkini, #heading_terpopuler, #heading_pilihan, #heading_channel{font-size:19px;}
#heading_terkini{padding-left:10px;}
#heading_pilihan{margin-top:10px;border-top:2px solid red;padding-left:10px;}
#banner_top_right{min-height:400px;}
#banner_bottom_right{min-height:438px;}
#valas_bca{min-height:100px;}
.link_footer{position:relative;display:block;
    padding: 8px 15px;
  border: none;
  color: #88b4fc;
  font-size:13px;
}
.link_footer:hover{
  color: #fafafa;
}
@font-face {
font-family: "KozMinPro-Heavy";
src: url('fonts/KozMinPro-Heavy.otf');
}
.kozMinPro-heavy {
    margin-top:25px;
font-family: "KozMinPro-Heavy";
font-size:59px;
font-weight: 600;
}
@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 100;
  src: local("Lato Regular"), local("Lato-Regular"), url("https://fonts.gstatic.com/s/lato/v14/S6uyw4BMUTPHjx4wXg.woff2") format("woff2");
  unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.lato {
font-family: "Lato";
font-weight: 100;

}



.nav > li.dropdown.open {
  position:static;
}

.nav > li.dropdown.open .dropdown-menu {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:space-around;
  width:100%;
  text-align:center;
  left:0;
  right:0;
}

@media (max-width:767px) {
  .nav > li.dropdown.open .dropdown-menu {
    flex-direction:column;
    text-align:left;
  }
}

/* To Dropdown navbar dropdown on hover 
.dropdown-menusub {
    display: none;
}
*/


/*
.dropdown-submenu:hover > .dropdown-menusub {
    display:block;
  position:absolute;z-index:999;
  background:#fafafa;
  width:100%;
  left:0;
  right:0;
  padding:20px 25px;
  border-top:1px solid #eaeaea;
  border-bottom:1px solid #eaeaea;
}
.dropdown-submenu:hover > .dropdown-menusub li{
   float:left;
   width:25%;
  
}*/

/*terpopuler list*/
.faq {
			counter-reset: my-badass-counter;
		}
		.faq dt {
			position: relative;
			padding: 4px 0 4px 0;
		}
		.faq dt:before {
			content: counter(my-badass-counter);
			counter-increment: my-badass-counter;
			position: absolute;
			right: 96%;
			top: 5px;
			font: normal 25px/1 roboto;color:#e2e2e2;
		}
		.faq dd {
			margin: 0 0 15px 0;color:#aaa;font-style: italic;font-size: small;
		}	
		.faq dt, .faq dd {
			padding-left: 40px;
		}
		
/**
 * Social Media Icons Styling
 * Example CSS file 
 **/

/* Resets default styling */
.social-media-icons {
    list-style: none;
    margin 0;
    padding: 0;
}

/* Displays the list-items in a row */
.social-media-icons li {
    display: inline-block;
}

/* Set up the social media icons and enable transitioning for a smooth hovering effect */
.social-media-icons a {
    background-image: url(../images/social-icons.png);
    background-image: url(../images/social-icons.svg), none; /* IE8 does not support multiple backgrounds (even when it is empty), so reverts to the former rule with the .png */
    background-repeat: no-repeat;
    display: block;
    height: 58px;
    transition: all 350ms ease-out;
    -webkit-transition: all 350ms ease-out;
    -o-transition: all 350ms ease-out;
    width: 50px;
}

.social-media-icons a:hover {
    background-position-y: 2px; /* Bonus image movement, no support by Firefox and Opera. Requires images with similar y position. */
    filter: alpha(opacity=80); /* Fallback for older versions of IE */
    opacity: 0.8;
}

/* Move the background to the right position for each social network */
.twitter {
    background-position: 0 0; /* Obviously, this is obsolete to use here, but it illustrates the fact the twitter image is the first image */
}

.facebook {
    background-position: -53px 0;
}

.dribbble {
    background-position: -106px 0;
}

.pinterest {
    background-position: -159px 0;
}

.deviantart {
    background-position: -212px 0;
}
/*search button*/
.search-container {
  position:relative;border-top:0;border-bottom:0;
  border-left:1px solid #e2e2e2;
  border-right:1px solid #e2e2e2;
  padding:7px 10px;
  width:100%;
}
/*halaman redaksi kabkota*/
.box_team_editor{position:relative;float:left;width:31%;margin:1%;}
.box_team_editor_img{position:relative;float:left;width:28%;height:125px;background:#eaeaea;overflow:hidden;}
.box_team_editor_img img{height:125px;object-fit:cover;}
.box_team_editor_txt{position:relative;float:left;width:70%;color:#333;margin:1%;}
.box_team_editor_txt td{padding:3px;}
/*--============================ LOGIN ==============================*/
.login {
  margin-top: 50px;
  width: 100%;
}

.login-heading {
  font: 1.7em/47px "Tenor Sans", sans-serif;
  color:#111;
}

.input-txt {
  width: 100%;
  padding: 20px 10px;
  background: #fff;
  border: none;
  font-size: 1em;
  color: #222;
  border-bottom: 1px dotted #222;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-transition: background-color 0.5s ease-in-out;
  -o-transition: background-color 0.5s ease-in-out;
  -webkit-transition: background-color 0.5s ease-in-out;
  transition: background-color 0.5s ease-in-out;
}
.input-txt:-moz-placeholder {
  color: #81aac9;
}
.input-txt:-ms-input-placeholder {
  color: #81aac9;
}
.input-txt::-webkit-input-placeholder {
  color: #81aac9;
}
.input-txt:focus {
  background-color: #fafafa;
}

.login-footer {
  margin: 10px 0;
  overlow: hidden;
  float: left;
  width: 100%;
}

.btn {
  padding: 15px 30px;
  border: none;
  color: #fff;
}



.btn--right {
  float: right;
}

.icon {
  display: inline-block;
}

.icon--min {
  font-size: .9em;
}

.lnk {
  font-size: .8em;
  line-height: 3em;
  color: white;
  text-decoration: none;
}

