
.no-padding {padding:0;}
.no-margin{margin:0;}
.no-height{
    height:0
}
.none-height{
    height:0!important
}
.full-height{
    height:100%
}
.fully-height{
    height:100%!important
}
.no-width{
    width:0
}
.none-width{
    width:0!important
}
.full-width{
    width:100%
}
.fully-width{
    width:100%!important
}
.no-border{
    border:0
}
.none-border{
    border:0!important
}
.no-radius{
    border-radius:0
}
.none-radius{
    border-radius:0!important
}
.no-shadow{
    -webkit-box-shadow:none;
    box-shadow:none
}
.none-shadow{
    -webkit-box-shadow:none!important;
    box-shadow:none!important
}
.no-bg{
    background:none
}
.none-bg{
    background:none!important
}
.transparent-bg{
    background:transparent
}
.transparently-bg{
    background:transparent!important
}
.invisible{
    visibility:hidden
}
.unseeable{
    visibility:hidden!important
}
.ellipsis,.text-ellipsis{
    -o-text-overflow:ellipsis;
    text-overflow:ellipsis;
    word-break:break-word
}
.legible-white-text{
    text-shadow:1px 1px 1px #000
}
.centerable{
    position:relative
}
.centerable .centerable-block{
    position:absolute;
    top:50%;
    left:50%;
    right:50%;
    -webkit-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%)
}
.centered-wrapper{
    position:relative
}
.centered-block{
    position:absolute;
    top:50%;
    left:50%;
    right:50%;
    -webkit-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%)
}
body,html{
    height: 100%


}
body{
  min-width:600px;
    overflow:hidden;
    font-family:sans-serif;
    background:#000;
    background-image: url('image/bg1.jpg');
}

h1{
    color: orange;
    stroke:1px;

}


h2, h3, h4, h5, h6{
    color: #fff;
}

hr{
    color: #fff;
}

p{
    font-size: 15px;
}

menu-img-pro {
    width: 100px;
    background-color: transparent; 
}

body.fonts-loaded{
    font-family:Lato
}
body.ready{
    overflow:auto
}

.debug{
    border:1px solid red!important
}
.thumbnail{
    background-color:#eee
}
.ready #loader-wrapper{
    z-index:0;
    opacity:0;
    height:0;
    -webkit-transition:all 1s ease-out;
    -o-transition:all 1s ease-out;
    transition:all 1s ease-out
}

@media (min-width:768px){
    .wrapper,.wrapper.top{
        padding:3em 5% 0
    }
    .wrapper.bottom,.wrapper.middle{
        padding:0 5%
    }
}

.bg-top{


	background-color:#005488;
	background:url(image/bg1.jpg)bottom;
    background-position:top;
    background-size:100% 100%;
    background-repeat:no-repeat;

}
.bg-middle{
    background:url(image/bg1.jpg) top;
    background-size:cover
}
.navbar.navbar-top{
    margin:0;
    padding:30px 0 10px 0;

    background:none;
    -webkit-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
   /* Css untuk layout wide mobile di tulis pada bagian ini */
  .home .wrapper.top{
	  padding-top:-300px;
	}
}
@media (min-width:768px){
    .navbar-top{
        padding:10px 0
    }
	.panel-agenda {margin-top:10px;}
}
@media (min-width:992px){
    .navbar-top{
        padding:10px 0
    }
}
@media (min-width:1400px){
    .navbar-top{
        padding:10px 0;

    }
	.panel-berita {background:orange}
}
.navbar-top .navbar-header{
    margin:0;

}
@media (min-width:768px){
    .navbar-top .navbar-header{
        margin-left:15px
    }

}
.navbar-top .navbar-brand{
    margin:0;
    float:left
}
.navbar-top .navbar-nav{
    margin:0
}
.navbar-top .navbar-right{
    margin-top:-60px;
    float:right
}

@media (min-width:768px){
    .navbar-top .navbar-right{
        margin:0
    }
}
.navbar-brand {
    height:60px;
    padding:0
}
@media (min-width:1400px){
    .navbar-brand{
        height:80px
    }
}
.navbar-nav{
    padding:20px 0
}
@media (min-width:1400px){
    .navbar-nav{
        padding:30px 0
    }
}
.navbar-nav>li>a{
    padding:0;
    font-size:25px;
    font-weight:700;
    letter-spacing:1px
}
@media (min-width:1400px){
    .navbar-nav>li>a{
        font-size:28px
    }
}
.nav>li>a:focus,.nav>li>a:hover{
    background:none
}
.logo{
    width:300px;
    height:59px
}
@media (min-width:1400px){
    .logo{
        width:400px;
        height:79px
    }
}
.navbar-black .logo .navbar-nav>li>a{
    color:#222
}
.navbar-white .logo .navbar-nav>li>a{
    color:#fff
}

.error .message{
    text-align:center;
    margin-top:10%
}

/*navigation*/
.navigation{
    position:fixed;
    z-index:1200
}
.navigation,.navigation .overlay{
    top:0;
    left:0;
    width:100%;
    height:100%
}
.navigation .overlay{
    position:absolute;
    opacity:.5;
    bottom:0;
    z-index:1201;
    background:rgb(000,000,000,.5);

}
.navigation{
  background:url(../bg-menu/bgb.png);

}
.navigation .menu{
    position:relative;
    height:100%;
    width:90%;
    margin:0 auto;
    z-index:1205
}
.navigation .menu .logo{
    position:relative;
    margin:50px 0;
    text-align:center;
    padding:0;
    background:none;
    width:100%
}
.navigation .menu .logo img{
    text-align:center;
    display:inline-block;
	margin-top:-30px;
	padding-bottom:10px;
}
.navigation .menu .logo button{
    float:right;
    display:inline-block;
    font-size:20px;
    color:#fff;
    font-weight:900
}
.navigation .menu .logo button:hover{
    text-decoration:none
}
.navigation .menu .menu-container{
    position:relative
}
.navigation .menu .menu-container:after{
    content:".";
    display:block;
    height:0;
    visibility:hidden;
    clear:both
}
.navigation .menu .menu-container .menu-placeholder{
    display:block
}
.navigation .menu .menu-container .menu-placeholder-column{
    position:absolute;
    top:0
}
.navigation .menu .menu-container .menu-items-column{
    float:left;
    width:33.333%;
    position:relative;
    z-index:1;
    background:none;
    border-left:1px solid #f5f5f5
}
.navigation .menu .menu-container .menu-items-column:first-child{
    border:0
}
.navigation .menu .menu-container .menu-items-column:last-child .menu-items .title{
    font-size:14px
}
.navigation .menu .menu-items-breadcrumbs{
    display:none
}
.navigation .menu .menu-items-container{
    height:100%;
    margin:0;
    overflow:auto
}
.navigation .menu .menu-items-container .menu-items{
    list-style:none;
    margin:0;
    padding:0
}
.navigation .menu .menu-items-container .menu-items li{
    margin:0;
    padding:0;
    position:relative;
	margin-right:5px;
}
@font-face{font-family: 'fontku'; src:url('Prociono-Regular.otf');}
.navigation .menu .menu-items-container .menu-items li>a{
    display:block;
    padding:9px 0 9px 20px;
    color:#f5f5f5;
	font-weight:bold;
	background:none;
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: .6s;
  font-family: 'fontku';

}
@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.navigation .menu .menu-items-container .menu-items li.active>a[href='javascript:;'],.navigation .menu .menu-items-container .menu-items li.active>a[href='javascript:;']:hover,.navigation .menu .menu-items-container .menu-items li>a[href='javascript:;']:hover{
    color:#000;
	background:url(right.png)right center no-repeat #f5f5f5;
	 text-decoration:none;
    -webkit-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s;
	padding-left:30px;
	border-radius:0 20px 20px 0;
	border-left:5px solid #F8C300
}
.navigation .menu .menu-items-container .menu-items li.active>a,.navigation .menu .menu-items-container .menu-items li.active>a:hover,.navigation .menu .menu-items-container .menu-items li>a:hover{
    color:#000;
    background:url(cursor.png)left center no-repeat #f5f5f5;
	 text-decoration:none;
    -webkit-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s;
	padding-left:30px;
	border-radius:0 20px 20px 0;
	border-left:5px solid #F8C300;


}
.navigation .menu .menu-items-container .menu-items .title{
    display:block;
    font-size:14px;

    letter-spacing:1px;
    font-weight:400
}
.navigation .menu .menu-items-container .menu-items .has-children .title{
    font-size:14px;
    font-weight:700
}
.navigation .menu .menu-items-container .menu-items .description{
    font-size:14px
}
.navigation .menu .menu-items-container .menu-items .active .description,.navigation .menu .menu-items-container .menu-items .active:hover .description{
    color:#fff
}
.navigation .menu .js-focus{
    outline:1px dotted #000
}

/*navigation end*/
/*.bg-rb {background:/*url(../image/bg-menu/background.jpg)top center no-repeat;*/background-size:100% 100%;padding:20px 0}*/
#btns:hover {background:#fff;color:white}
#page-content{

    -webkit-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s;

    min-height: 100%;

	background:url(../bg-menu/bgb.png);


}
body a:hover {text-decoration: none;}

/*menu samping*/
.menu-side{
    height:100%;
    width:0;
    position:fixed;
    z-index:10000;
    top:0;
    right:0;

    background-color:#0EA77B;
    overflow-y:auto;
    overflow-x:hidden;
    padding-top:3em;
    -webkit-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s
}
.menu-side a{
    padding:5px 40px;
    text-decoration:none;
    font-size:1.5em;
    color:#fff;
    display:block;
    -webkit-transition:.3s;
    -o-transition:.3s;
    transition:.3s
}
.menu-open-link a {color:#fff;}
.menu-side a:focus,.menu-side a:hover, .menu-open-link a:focus,.menu-open-link a:hover{
    color:#fff;
}

.menu-side .btn-close{
    position:absolute;
    top:25px;
    right:25px;
    font-size:40px;
    height:55px;
    width:64px;
    line-height:0;
    color:#fff
}
.menu-side .btn-close:focus,.menu-side .btn-close:hover{
    text-decoration:none;
    color:red;
    outline:none
}
.menu-side ul{
    width:400px;
    margin:45px 0
}

/*menu samping end*/
/*button menu*/

.menu-buttons{
animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: .6s;
    text-align:center;
    -webkit-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s;

	margin-top:20px;
	padding:0;
	border-radius:10px;
}
@media (min-width:992px){
    .menu-buttons{
        padding-left:0;
        padding-right:0
    }
}
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #f5f5f5;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #f5f5f5;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #f5f5f5;
}
.btn-menu-item:hover {background:rgba(255,255,255,.4);
 -webkit-transition:all .9s;
    -o-transition:all .9s;
    transition:all .9s;
	border-radius:5px;}
.btn-menu-item{

    background:transparent;
    overflow:hidden;
    color:#fff;
	font-weight:bold;
    font-size:12px;
    font-weight:600;
    letter-spacing:1px;
    -o-text-overflow:ellipsis;
    text-overflow:ellipsis;
    white-space:nowrap;
    -webkit-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s
}
.btn-menu-item:focus,.btn-menu-item:hover{

    text-decoration:none;
	color:#F8C300;

}
@media (min-width:768px){

    .btn-menu-item{
        width:48%;



    }
       .menu-buttons{
        padding-bottom: 0px;
    }

}

@media (min-width:320px){
	.menu-buttons{
		padding-bottom: 50px;

	}
	 .menu-img {width:70px;height:70px;}
	 .btn-menu-item{
        width:33%;


    }
}
@media (min-width:992px){
    .btn-menu-item{
        width:31%;


    }
       .menu-buttons{

    }
}
@media (min-width:1200px){
    .btn-menu-item{
        width:10%;

    }

}
@media (min-width:1330px){
	 .menu-img {width:90px;height:90px;}
	 .logohome {height:250px;}
    .btn-menu-item{
		font-size:9px;
		width:15%;

margin:0 -2px;
    }
}
@media (min-width:1980px){
    .btn-menu-item{
        font-size:40px;

    }

@media (min-width:1430px){
    .btn-menu-item{
        font-size:1em;

    }
}
@media (min-width:1530px){
    .btn-menu-item{
        font-size:1.1em;

    }
}
@media (min-width:1630px){
    .btn-menu-item{
        font-size:1.2em
    }
}
@media (min-width:1730px){
    .btn-menu-item{
        font-size:1.3em
    }
}
a.btn-menu-item{
    padding:1.8em 15px
}

@media (min-width:1600px){
    .home .row.info{
        padding-top:60px
    }
}
.home .wrapper.top{
	padding-bottom:20%;
padding-top:0px;}




.banner.side .public-information .panel-information{
    padding:0;
    margin:0 0 50px;
    height:94%;
    border:0;
    border-radius:0;
    -webkit-box-shadow:none;
    box-shadow:none;
    background:none
}
.banner.side .public-information .panel-information .panel-heading{
    padding:0 15px;
    margin:0;
    color:#000;
    font-size:28px;
    font-weight:700;
    text-align:left
}
@media (min-width:992px){
    .banner.side .public-information .panel-information .panel-heading{
        padding:0 30px
    }
}
.banner.side .public-information .panel-information .panel-heading h3{
    margin-top:0
}
.banner.side .public-information .panel-information .panel-body{
    padding:10px 15px;
    height:96%
}
@media (min-width:992px){
    .banner.side .public-information .panel-information .panel-body{
        padding:30px
    }
}
.banner.side .public-information .panel-information .panel-body .carousel{
    height:92%
}
.banner.side .public-information .panel-information .panel-body .carousel .item img{
    margin:0 auto;
    width:200%
}
.banner.side .public-information .panel-information .panel-body .carousel-indicators{
    bottom:-50px
}
.banner.side .public-information .panel-information .panel-body .carousel-indicators .active{
    background:#888
}
.banner.side .public-information .panel-information .panel-body .carousel-caption{
    width:100%;
    right:0;
    left:0;
    bottom:0;
    background:#000;
    opacity:.7
}
#public-information .modal-body{
    padding:0
}
#public-information .modal-footer{
    text-align:left;
    font-size:15px
}

/*#gov-head {
	margin-top:-111px;
	padding:0px;

}
*/
#gov-head .midle-gov {
	margin-top:-111px;
	background:#fff;
	padding:0px;

}

#gov-head .midle-gov .gover
{

	background:#003256;
	color: #fff;

}
#gov-head .midle-gov .gover small
{

	padding-bottom:4px;

}
#gov-head .midle-gov .gover h3
{
	color:#fff;


}

#gov-head .midle-gov .gover img {
padding:0;
margin:0;
padding-bottom:7px;

}
#gov-head .midle-gov h5
{
	margin-top:100px;
	font-weight:bold;
	font-size: 14px;
	padding:5px 0 0 0;
	text-transform:uppercase;

}
#gov-head .midle-gov .gover img.img1 {


}
#gov-head .midle-gov  .visibility{
	text-align:left;
}
#gov-head .midle-gov .title-gov
{
	background:#00973E;
	margin:0;
	padding:0;
	text-align:center;
}
#gov-head .midle-gov .title-gov h3
{
	margin:0;
	padding:15px 0;
	color:#fff;
}
.slide-news{

	margin:0;
	padding:10px;
}

.mrg
{


}

.mrg .item-list {
	padding:0px;
	margin:0px;
}

.mrg .item-list  .item-berita {
	background:#fff;
	border:1px solid #ccc;
	padding:5px;
	margin:2px;
}
.mrg .item-list  .item-berita img{
	margin-right:4px;
}
.mrg .item-list  .item-berita h3{
	padding:0;
	margin:0;
}
.footer {
	padding:10px;
	margin:0;
	color:#fff;

}
.footer h3 {margin:0;padding:10px;}
.footer ul {margin:0;padding:0}
.footer ul li {list-style:none; padding:8px 2px; }
.list-right-top,.selayang-pandang {
	padding:0;
	margin:0;
	list-style:none;
}

.list-right-top li{

	margin:0;

	border-top:1px solid #f8f8f8;
	list-style:none;
	padding:8px 8px
}

.selayang-pandang li
{

	margin:0;
	border-bottom:1px solid #ccc;
	border-top:1px solid #bbb;
	list-style:none;

}

.selayang-pandang li a:hover, .list-right-top li  a:hover
{
	background:#ccc;
}
/*
.title-gov {
	background:#fff;
	padding:0;ff
	margin;0;

}
.title-gov h3
{

}
*/
section {margin:0;padding:0}

.pemerinta {
	margin:10px 0 10px 0;padding:6px;
border: 0;
border-radius: 0;
-webkit-box-shadow: 0 0 50px -8px #005488;
box-shadow: 0 0 50px -8px #005488;
background: none;
text-align: left;
}
.wrapper {padding:0;background:#fcfcfc}
.content-main {padding-top:20px;}
.panel-berita,.panel-agenda {background:#fff;padding:0;margin:0;}
.panel-agenda {min-height:360px;}
.panel-heading {margin:0;padding:0 20px;}
.list-right-top li .tgl{color:orange;text-align: center;width:60px;display:inline-block;background:#333;margin:0 5px 0 0;padding:2px;border-radius:2px;}
.list-right-top li .title-agenda{display:inline-block;margin:0;position:absolute}
.list-right-top li .tgl h4{margin:0;padding:0;font-size:18px}
.list-right-top li .tgl small{margin:0;padding:0;}
.list-right-top li .title-agenda a{background:none;text-decoration: none}
.panel-berita {margin-bottom:10px}


.title-heading {text-transform:uppercase;margin:100px 0 0 0;padding:10px;font-size:20px;background:#333;color:#fff;width:50%}
.news-col{background:#fff;height:300px; border-radius:4px; border:1px solid #ccc;}
.news-col ul {padding:0;margin:0;list-style:none;}
.news-col ul li {margin:0}
.news-col ul li a {text-decoration:none;color:orange;display:block;background:red;padding:10px;margin:0;}

#visimisi {background-image:url(../image/kantorbupati2.jpg); padding:20px 0;color:white;}
.par {
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
}



body {
  overflow-x: hidden;
  overflow-y: hidden;
  height: 100%; /* prevent scrollbar */
}






.left:before {
  content: '';
  position: absolute;
  height: 100%;
  width: 100vw;
  top: 0;
  right: 0;

  background: #07c

}

.right:before {
  content: '';
  position: absolute;
  height: 100%;
  width: 100vw;
  top: 0;
  left: 0;

  background: #333;
}
.left-nav:before {
  content: '';
  position: absolute;
  height: 100%;
  width: 100vw;
  top: 0;
  right: 0;
  background: #07c;

}

.right-nav:before {
  content: '';
  position: absolute;
  height: 100%;
  width: 100vw;
  top: 0;
  left: 0;
   padding:10px;
  background:#333;
}

.btn-search {
      background: #00973E;
      border-radius: 0;
      color: #fff;
      border-width: 1px;
      border-style: solid;
      border-color: #1c1c1c;
    }
    .btn-search:link, .btn-search:visited {
      color: #fff;
    }
    .btn-search:active, .btn-search:hover {
      background: #315C31;
      color: #fff;
    }

    h3.head-home {padding:15px;color:#0EA77B;font-weight: bold;margin:0; }
 .no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url(loading.gif) center no-repeat #fff;
}

.menu-img {border:4px solid #fff;border-bottom-color:green;border-top-color:yellow;border-radius: 50%;transition: all 800ms ease-in-out;}
              .menu-img:hover {
                 -ms-transform: rotate(360deg); /* IE 9 */
                -webkit-transform: rotate(360deg); /* Chrome, Safari, Opera */
                transform: rotate(360deg);}

                .menu-img-pro {border:10px solid #fff;border-bottom-color:red;border-top-color:red;border-radius: 50%;transition: all 1000ms ease-in-out;}
                .menu-img-pro:hover {
                 -ms-transform: rotate(0deg); /* IE 9 */
                -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
                transform: rotate(0deg);}

              .blinking{
                    animation:blinking 0.8s infinite;
                }
                @keyframes blinking{
                    0%{     color: #F5F501;    }
                    49%{    color: #F5F501; }
                    60%{    color: transparent; }
                    99%{    color:transparent;  }
                    100%{   color: #F5F501;    }
                }