
.page-width{max-width:1080px;}
a, a:hover{color:#d71a21}

#header{height:100px; border-top:solid 7px #d71a21}
	#header	.web-name .logo{width:70px; padding:13px 0; float:left}
	#header	.web-name .name{margin-left:15px; padding:20px 0; float:left}
		#header	.web-name .name .title{font-size:24px; font-weight:bold; text-transform:uppercase}
		#header	.web-name .name .desc{font-size:16px; font-weight:bold; line-height:1em;}
		#header	.web-name .name a{text-decoration:none; color:#000}
	
	#header	.web-search{text-align:right; padding-top:30px}
		#header	.web-search .search-box{width:220px; float:right}
		#header	.web-search .search-box .form-control{background:#f4f4f4}
	
#nav-header{background:#d71a21; border-color:#d71a21; box-shadow: 0px 5px 10px #DDD; border-radius:0; margin-bottom:0}
	.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover{
		background-color:#8e1115}
	.navbar-inverse .navbar-nav>li>a{color:#FFF}
	.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover{
		background-color:#8e1115
		}
	

#banner{background:#F4F4F4; border-bottom:solid 8px #b30b11}

#home-circle-menu{background:#d71a21; padding:55px 0; color:#FFF}
	#home-circle-menu a{color:#FFF; text-decoration:none}
	#home-circle-menu .item{text-align:center;}
	#home-circle-menu .item .menu-image{width:200px; height:200px; background:#FFF; border:solid 7px #f7df35; margin:auto; 
		border-radius:50%; cursor:pointer; transition: border 0.1s linear}
		#home-circle-menu .item .menu-image.logo{background:#348449}
		#home-circle-menu .item .menu-image:hover{border:solid 0px #f7df35}
	#home-circle-menu .item .menu-name{margin-top:30px; font-size:18px; font-weight:bold; line-height:1.4em; text-transform:uppercase}


section.home-pad{padding:65px 0}
	section.home-pad.grey{background:#f1f1f1}
	section.home-pad.soft-green{background:#9cc5a9}
	
	section.home-pad h1{font-size:30px; margin:0 0 20px 0}
	section.home-pad h1 strong{color:#d71a21}

#home-news .news-pad{background:#FFF; height:500px}
	#home-news .news-pad .main-news{position:relative}
		#home-news .news-pad .main-news .img{overflow:hidden}
			#home-news .news-pad .main-news .img img{height:500px}
		#home-news .news-pad .main-news .desc{position:absolute; width:100%; xbackground:#000; bottom:0; padding:20px; color:#FFF;
			background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,1));}
			#home-news .news-pad .main-news .desc .date{font-size:16px;}
			#home-news .news-pad .main-news .desc .title a{color:#FFF; font-size:26px;}

	#home-news .news-pad .news-list{background:#000; height:500px; overflow:hidden; border-left:1px solid #5f5f5f}
		#home-news .news-pad .news-list .item{padding:13px; font-size:16px; line-height:1.4em; border-bottom:1px solid #5f5f5f}
		#home-news .news-pad .news-list .item:last-child{border:none}
		#home-news .news-pad .news-list .item a{color:#FFF}

#home-agenda .agenda-items .item{background:#f1f1f1; padding:25px; margin-bottom:25px}
	#home-agenda .agenda-items .item .date-month{background:#d8d8d8; max-width:75px; min-height:75px; text-align:center; border:solid 1px #989898; 
		border-radius:10px; padding:10px;}
		#home-agenda .agenda-items .item .date-month .date{font-size:36px;line-height:1em}
		#home-agenda .agenda-items .item .date-month .month{font-size:20px; line-height:1em; text-transform:uppercase}
	#home-agenda .agenda-items .item .desc{}
		#home-agenda .agenda-items .item .desc .title{font-size:20px; line-height:1.2em}
			#home-agenda .agenda-items .item .desc .title a{color:#d71a21; font-weight:bold}
		#home-agenda .agenda-items .item .desc .detail{color:#666; margin-top:10px}

#home-agenda .transparansi-items{margin-bottom:30px}
	#home-agenda .transparansi-items .item{padding:10px 0; border-bottom:dashed 1px #CCC}
	#home-agenda .transparansi-items .item:first-child{border-top:dashed 1px #CCC}
	#home-agenda .transparansi-items .item .title a{font-size:18px; color:#d71a21;}
	#home-agenda .transparansi-items .item .date{font-size:14px; color:#666}

#home-pengaduan .create{text-align:center}
	#home-pengaduan .create .icon{margin:20px 0}
	#home-pengaduan .create .button .btn{background:#d71a21}
	
	#home-pengaduan .show-item .items{padding:35px 25px; background:#c7e7d1; margin-top:30px; min-height:150px; color:#000}
	#home-pengaduan .show-item .items .img{min-height:200px}
	#home-pengaduan .show-item .items h3{margin:0 0 10px 0; color:#000}
	#home-pengaduan .show-item .items p{margin:0; color:#000; font-weight:normal}
	#home-pengaduan .show-item .items .item{padding:0 25px}
	#home-pengaduan .show-item .items .carousel-control{width:auto}
	#home-pengaduan .show-item .items .carousel-control.left{background:none}
	#home-pengaduan .show-item .items .carousel-control.right{background:none}


#inside{min-height:500px; padding:50px 0;}
	#inside .left-side h2{font-size:24px}
	#inside .left-side h3{font-size:20px}
	#inside .left-side h1.page-title{font-weight:bold; margin:0; font-size:30px; margin-bottom:20px}
		#inside .left-side h1.page-title strong{color:#d71a21}
		
	#inside .left-side .content-detail h1.news-title{font-weight:bold; margin:0; font-size:30px; margin-bottom:20px}
	#inside .left-side .content-detail .date-and-detail{font-size:12px; color:#666; margin-bottom:20px}
	#inside .left-side .content-detail .main-image{margin-bottom:30px}
	#inside .left-side .content-detail .socmed-share{margin-bottom:20px}
	#inside .left-side .content-detail .socmed-share .item{width:20% !important; padding:0px 3px}
	
	#inside .left-side .news-list-item{}
		#inside .left-side .news-list-item .news-item{padding:25px 0; border-bottom:solid 1px #DDD}
		#inside .left-side .news-list-item .news-item:first-child{padding-top:0}
		#inside .left-side .news-list-item .news-item .title{font-size:16px; font-weight:bold; margin-bottom:15px}
		#inside .left-side .news-list-item .news-item .date{font-size:12px; color:#656565; font-weight:bold; margin-bottom:10px}
		#inside .left-side .news-list-item .news-item .desc{font-size:14px; line-height:1.4em}
	
	
	#inside .right-side .sidebar{margin-bottom:25px}
	#inside .right-side .header-title{font-size:16px; background:#d71a21; color:#FFF; padding:8px 15px}
	
	#inside .right-side .aparatur-desa .aparatur{border:solid 2px #d71a21;border-top:none; min-height:100px; background:#F3F3F3}
	
	#inside .right-side .map-desa .map{border:solid 2px #d71a21;border-top:none; min-height:50px}
	
	#inside .right-side .agenda .items .item{padding:10px 0;border-bottom:dashed 1px #CCC}
	#inside .right-side .agenda .items .item .date-month{background:#d8d8d8; width:50px; min-height:50px; text-align:center; border:solid 1px #989898; 
		border-radius:8px; padding:10px 5px; line-height:1em; float:left}
		#inside .right-side .agenda .items .item .date-month .date{font-size:18px; font-weight:bold}
		#inside .right-side .agenda .items .item .date-month .month{font-size:12px;}
	#inside .right-side .agenda .items .item .title{padding-left:60px; line-height:1.4em}
		#inside .right-side .agenda .items .item .title a{color:#d71a21}
	
	#inside .right-side .news-list .items .item .title{padding-left:0;}
		#inside .right-side .news-list .items .item .date{font-size:12px; color:#777}
	

footer{background:#31844c; padding:45px 0; border-bottom:solid 7px #b30b11; color:#000}
	footer a{color:#f7df35}
	footer .title{font-size:18px; font-weight:bold; margin-bottom:15px;text-transform:uppercase}
	
	footer .logo{text-align:center}
	footer .logo .img{width:155px; margin:auto}
	footer .logo .name{font-size:20px; font-weight:bold; margin-top:20px; text-transform:uppercase}
	footer .logo .detail{font-size:14px; font-weight:bold}
	
	footer .address{font-weight:bolds; line-height:1.3em}
	footer .address p{margin:15px 0;text-indent: -10px; padding-left:20px}
	footer .address .glyphicon{color:#FFF;}
	
	footer .link-list ul{padding-left:15px; font-size:16px;}
	footer .link-list ul li{margin-bottom:5px}
	
	footer .copyright{text-align:center; margin-top:20px; padding-top:20px; border-top:solid 1px #559268}

@media (max-width: 640px) {
	#header	.web-name .name{margin-left:10px; padding:20px 0;}
		#header	.web-name .name .title{font-size:20px;}
		
	#header	.web-search .search-box{display:none}
	
	#home-circle-menu{background:#d71a21; padding:20px 0;}
		#home-circle-menu .item .menu-image{width:130px; height:130px; border-width:5px}
		#home-circle-menu .item .menu-name{font-size:12px; margin:15px 0;}
		
	section.home-pad{padding:30px 0}
		section.home-pad h1{font-size:20px; margin:0 0 15px 0}
	
	#home-news .news-pad{height:auto}
	#home-news .news-pad .main-news .img img{height:auto; width:100%}
	#home-news .news-pad .news-list{height:auto}
	#home-news .news-pad .main-news .desc{padding:15px}
	#home-news .news-pad .main-news .desc .date{font-size:14px;}
	#home-news .news-pad .main-news .desc .title a{font-size:18px}
	#home-news .news-pad .news-list .item{font-size:14px; padding:10px}
	#home-news .news-pad .news-list .item:first-child{border-top:1px solid #5f5f5f}
	
	#home-agenda .agenda-items .item{padding:15px; margin-bottom:15px}
		#home-agenda .agenda-items .item .desc .title{font-size:16px;}
		#home-agenda .agenda-items .item .desc .detail{font-size:14px;}
	
	#home-agenda .left-col h1{margin-top:40px}
		#home-agenda .transparansi-items .item .title a{font-size:16px;}
	
	#inside{padding:25px 0 0 0;}
		#inside .left-side .content-detail h1.news-title{font-size:22px;}
		
		#inside .right-side{margin-top:25px; padding-top:25px; border-top:solid 5px #EEE; border-bottom:solid 5px #EEE}
	
	footer{padding:30px 0}
	footer .set-pad-xs{margin-bottom:20px; padding-bottom:20px; border-bottom: solid 1px #559268}
	footer .copyright{border-top:none; margin-top:0; padding-top:0}
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	
}

@media (max-width: 767px){
	.navbar-inverse .navbar-nav .open .dropdown-menu>li>a {color: #FFF;}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}