@import url(https://fonts.googleapis.com/css?family=Aclonica|Pacifico|Righteous|Didact+Gothic|Rubik|Anton|Great+Vibes);
/* POSISI */
body{font-family: 'Didact Gothic', sans-serif;}
.hide{display: none;}
.btn, .form-control, .input-group-text{border-radius: 0px}
.center{text-align: center!important;}
.center .img-responsive { margin: 0 auto!important; text-align: center!important;}
/* Scrollbar Style */
::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #fff;border-radius: 10px;width: 10px}
::-webkit-scrollbar{width: 6px;height: 6px;background-color: #fff;}
::-webkit-scrollbar-thumb{background-color: #F0F0E6;border-radius: 10px;right: 0px}
::-webkit-scrollbar-thumb:window-inactive {background: #F0F0E6; }
.main{
  padding-top: 40px;
  padding-bottom: 60px;
}
.content{
  min-height: 600px;
  font-size: 20px;
}

/* TEXT */
.blink {animation-duration: .5s;animation-name: blink;animation-iteration-count: infinite;animation-direction: alternate;animation-timing-function: ease-in-out;}
@keyframes blink {from {opacity: 1;}to {opacity: .3;}}

/* Aspek */
h2.aspek{font-size: 25px; font-weight: bold; margin: 0px 0px 15px 0px}
.dl-horizontal dd {margin-left: 50px!important;}
.dl-horizontal dt {width: 40px!important;}
.box-key{margin-left: 50px;}}
.green{color: #5cb85c}

/* MARGIN */
.mrg-top-10{margin-top: 10px!important}
.mrg-top-20{margin-top: 20px!important}
.mrg-top-30{margin-top: 30px!important}
.mrg-top-40{margin-top: 40px!important}
.mrg-top-50{margin-top: 50px!important}
.mrg-bottom-10{margin-bottom: 10px!important}
.mrg-bottom-20{margin-bottom: 20px!important}
.mrg-bottom-30{margin-bottom: 30px!important}
.mrg-bottom-40{margin-bottom: 40px!important}
.mrg-bottom-50{margin-bottom: 50px!important}
.mrg-top-5p{margin-top: 5%!important}

/* slider */
.carousel-indicators li{background-color: #07122b}

/*navbar */
.navbar{padding: 0 1rem}
.animate{-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.navbar-fixed-left {position: fixed;top: 0px;left: 0px;border-radius: 0px;}
.navbar-minimal {width: 60px;min-height: 60px;max-height: 100%;background-color: rgba(51, 51, 51, 0.8);border-width: 0px;z-index: 1000;}
.navbar-minimal > .navbar-toggler {padding:15px 13px;position: relative;min-height: 60px;border-bottom: 1px solid #0F6095;z-index: 100;cursor: pointer;}
.navbar-minimal > .navbar-toggler > span {position: absolute;top: 50%;right: 50%;margin: -8px -8px 0 0;width: 16px;height: 16px;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE2LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHdpZHRoPSIxNnB4IiBoZWlnaHQ9IjMycHgiIHZpZXdCb3g9IjAgMCAxNiAzMiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTYgMzIiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0ZGRkZGRiIgZD0iTTEsN2gxNGMwLjU1MiwwLDEsMC40NDgsMSwxcy0wLjQ0OCwxLTEsMUgxQzAuNDQ4LDksMCw4LjU1MiwwLDgKCVMwLjQ0OCw3LDEsN3oiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiNGRkZGRkYiIGQ9Ik0xLDEyaDE0YzAuNTUyLDAsMSwwLjQ0OCwxLDFzLTAuNDQ4LDEtMSwxSDFjLTAuNTUyLDAtMS0wLjQ0OC0xLTEKCVMwLjQ0OCwxMiwxLDEyeiIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0ZGRkZGRiIgZD0iTTEsMmgxNGMwLjU1MiwwLDEsMC40NDgsMSwxcy0wLjQ0OCwxLTEsMUgxQzAuNDQ4LDQsMCwzLjU1MiwwLDMKCVMwLjQ0OCwyLDEsMnoiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiNGRkZGRkYiIGQ9Ik0xLjMzLDI4Ljk3bDExLjY0LTExLjY0YzAuNDU5LTAuNDU5LDEuMjA0LTAuNDU5LDEuNjYzLDAKCWMwLjQ1OSwwLjQ1OSwwLjQ1OSwxLjIwNCwwLDEuNjYzTDIuOTkzLDMwLjYzM2MtMC40NTksMC40NTktMS4yMDQsMC40NTktMS42NjMsMEMwLjg3MSwzMC4xNzQsMC44NzEsMjkuNDMsMS4zMywyOC45N3oiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiNGRkZGRkYiIGQ9Ik0yLjk5MywxNy4zM2wxMS42NDEsMTEuNjRjMC40NTksMC40NTksMC40NTksMS4yMDQsMCwxLjY2MwoJcy0xLjIwNCwwLjQ1OS0xLjY2MywwTDEuMzMsMTguOTkzYy0wLjQ1OS0wLjQ1OS0wLjQ1OS0xLjIwNCwwLTEuNjYzQzEuNzg5LDE2Ljg3MSwyLjUzNCwxNi44NzEsMi45OTMsMTcuMzN6Ii8+Cjwvc3ZnPgo=);
background-repeat: no-repeat;background-position: 0 0;-webkit-transition: -webkit-transform .3s ease-out 0s;-moz-transition: -moz-transform .3s ease-out 0s;-o-transition: -moz-transform .3s ease-out 0s;-ms-transition: -ms-transform .3s ease-out 0s;transition: transform .3s ease-out 0s;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);}
.navbar-minimal > .navbar-menu {position: absolute;top: -1000px;left: 0px;margin: 0px;padding: 0px;list-style: none;z-index: 50;background-color: rgb(51, 51, 51);background-color: rgba(51, 51, 51, 0.8);}
.navbar-minimal > .navbar-menu > li > a {position: relative;display: inline-block;color: rgb(255, 255, 255);padding: 10px 15px;text-align: center;cursor: pointer;border-bottom: 1px solid #2169a8;width: 100%;text-decoration: none;margin: 0px;}
.navbar-minimal > .navbar-menu > li > a:last-child {border-bottom-width: 0px;}
.navbar-minimal > .navbar-menu > li > a:hover {background:#26abe2;}
.navbar-minimal > .navbar-menu > li > a > .glyphicon {float: right;}
.navbar-minimal.open {width: 300px;}
.navbar-minimal.open > .navbar-toggler > span {background-position: 0 -16px;-webkit-transform: rotate(-180deg);-moz-transform: rotate(-180deg);-o-transform: rotate(-180deg);-ms-transform: rotate(-180deg);transform: rotate(-180deg);}
.navbar-minimal.open > .navbar-menu {top: 60px;width: 100%;min-height: 100%;}
@media (min-width: 768px) {
.navbar-minimal.open {width: 300px;}
.navbar-minimal.open > .navbar-menu {overflow: visible;}
.navbar-minimal > .navbar-menu > li > a > .desc {position: absolute;display: inline-block;top: 50%;left: 130px;margin-top: -20px;margin-left: 20px;text-align: center;white-space: nowrap;padding: 10px 13px;border-width: 0px !important;background-color: rgb(51, 51, 51);background-color: rgba(51, 51, 51, 0.8);opacity: 0;}
}

.circle-tile {margin-bottom: 15px;text-align: center;}
.circle-tile-heading {position: relative;width: 80px;height: 80px;margin: 0 auto -40px;border: 3px solid rgba(255,255,255,0.3);border-radius: 100%;color: #fff;transition: all ease-in-out .3s;}
.dark-blue {background-color: #34495e;}
.green {background-color: #16a085;}
.blue {background-color: #4C5466;}
.orange {background-color: #f39c12;}
.red {background-color: #e74c3c;}
.purple {background-color: #8e44ad;}
.dark-gray {background-color: #7f8c8d;}
.gray {background-color: #95a5a6;}
.light-gray {background-color: #bdc3c7;}
.yellow {background-color: #f1c40f;}
.text-dark-blue {color: #34495e;}
.text-green {color: #16a085;}
.text-blue {color: #2980b9;}
.text-orange {color: #f39c12;}
.text-red {color: #e74c3c;}
.text-purple {color: #8e44ad;}
.text-faded {color: rgba(255,255,255,0.7);}
.circle-tile-heading i {line-height: 80px;}
.circle-tile-content {padding-top: 50px;}
.circle-tile-description {text-transform: uppercase;}
.text-faded {color: rgba(255,255,255,0.7);}
.circle-tile-number {padding: 5px 0 15px;font-size: 24px;font-weight: 700;line-height: 1;}
.circle-tile-footer {display: block;padding: 5px;color: rgba(255,255,255,0.5);background-color: rgba(0,0,0,0.1);transition: all ease-in-out .3s;}
.circle-tile-footer:hover {text-decoration: none;color: rgba(255,255,255,0.5);background-color: rgba(0,0,0,0.2);}

.left-panel.panel-default{border-radius:0px!important;border-bottom:2px #DDD solid;}

hr.line { background-color:#dbdbdb; width:80%; margin:0 auto; }
.foot{
  padding: 40px 15px; 
  font-size: 12px;
  background-image: linear-gradient(to right, #093875 , #1f6cd1);
  color: #fff;
}
.foot a{
  text-decoration: none;
  color: #f7d600;
}
.foot a:hover{
  text-decoration: underline;
}

.errors{
  color: red;
  margin-bottom: 15px;
  font-size: 13px;
}

.alert .errors{
  color: inherit;
}

.form-horizontal .form-group .errors{
  margin-bottom: 0px;
}
.file {
  visibility: hidden;
  position: absolute;
}

/* LOGIN */
.login-container{position: relative;width: 300px;margin: 200px auto;padding: 20px 40px 40px;text-align: center;background: #fff;border: 1px solid #ccc;}
#output{position: absolute;width: 300px;top: -75px;left: 0;color: #fff;}
#output.alert-success{background: rgb(25, 204, 25);}
#output.alert-danger{background: rgb(228, 105, 105);}
.login-container::before,.login-container::after{content: "";position: absolute;width: 100%;height: 100%;top: 3.5px;left: 0;background: #fff;z-index: -1;-webkit-transform: rotateZ(4deg);-moz-transform: rotateZ(4deg);-ms-transform: rotateZ(4deg);border: 1px solid #ccc;}
.login-container::after{top: 5px;z-index: -2;-webkit-transform: rotateZ(-2deg);-moz-transform: rotateZ(-2deg);-ms-transform: rotateZ(-2deg);}
.avatar{width: 100px;height: 100px;margin: 10px auto 30px;border-radius: 100%;border: 2px solid #aaa;background-size: cover; padding: 2px}
.form-box input{width: 100%;padding: 10px;text-align: center;height:40px;border: 1px solid #ccc;;background: #fafafa;transition:0.2s ease-in-out;}
.form-box input:focus{outline: 0;background: #eee;}
.form-box input[type="text"]{border-radius: 5px 5px 0 0;text-transform: lowercase;}
.form-box input[type="password"]{border-radius: 0 0 5px 5px;border-top: 0;}
.form-box button.login{margin-top:15px;padding: 10px 20px;}
.animated {-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
@-webkit-keyframes fadeInUp {
  0% {opacity: 0;-webkit-transform: translateY(20px);transform: translateY(20px);}
  100% {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}
}
@keyframes fadeInUp {
  0% {opacity: 0;-webkit-transform: translateY(20px);-ms-transform: translateY(20px);transform: translateY(20px);}
  100% {opacity: 1;-webkit-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);}
}
.fadeInUp {-webkit-animation-name: fadeInUp;animation-name: fadeInUp;}