body {}
a{text-decoration:none !important;outline:none;}
.flexcenter{display: flex;justify-content: center;align-items: center;}
.flexleft{display: flex;justify-content: left;align-items: center;}
.flexright{display: flex;justify-content:right;align-items: center;}
.app-logo{padding:5px 0;margin:0 0 0 50px;}
.app-logo img{width:auto;height:40px;margin:0 10px 0 0;}
.app-logo h1{font-size:120%;margin:0;padding:0;line-height:1;font-weight:bold;color:#fff;}
.container-fluid{padding:0 10px;}
.backg-grad, .backg-grad2{border-bottom:#00d3f1 3px solid;background: rgb(0,25,59);
background: -moz-linear-gradient(90deg, #1d3379 0%, #2e81b0 100%);
background: -webkit-linear-gradient(90deg, #1d3379 0%, #2e81b0 100%);
background: linear-gradient(90deg, #1d3379 0%, #2e81b0 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1d3379",endColorstr="#2e81b0",GradientType=1);}
.backg-grad2{border-top:#00d3f1 3px solid;border-bottom:none;}
.menu-absolute{position:absolute;left:0;top:0;bottom:0;background:#2e81b0;width:50px;}
.menu-absolute .btn{background:transparent;outline:none;border:none;}
.menu-absolute .btn:focus, .menu-absolute .btn:hover{border:none;outline:none;box-shadow:none;}
.menu-absolute svg{width:auto;height:26px;fill:#dbdbdb;}
.circle-image{width:17vh;height:17vh;position:relative;overflow:hidden;border-radius:17vh;border:#919191 3px solid;}
.circle-image img{display:block;width:100%;height:100%;position: absolute;top: 50%;left: 50%;margin:0 auto;object-fit: cover;-webkit-transform: translate3d(-50%, -50%, 0);-moz-transform: translate3d(-50%, -50%, 0);-ms-transform: translate3d(-50%, -50%, 0);-o-transform: translate3d(-50%, -50%, 0);transform: translate3d(-50%, -50%, 0);border-radius:17vh;}
.space-admin{padding:15px 0 15px;margin:0 0 10px;background: transparent;
background: -moz-linear-gradient(0deg, transparent 20%, #1d3379 100%);
background: -webkit-linear-gradient(0deg, transparent 20%, #1d3379 100%);
background: linear-gradient(0deg, transparent 20%, #1d3379 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="transparent",endColorstr="#1d3379",GradientType=1);}
.space-admin{width:100%;float:left;text-align:center !important;}
.space-admin h2{font-size:110%;margin:5px 0 2px;padding:0;line-height:1.2;font-weight:bold;color:#fff;}
.space-admin p{font-size:90%;margin:0;padding:0;line-height:1.2;font-weight:500;color:#bdbdbd;}
.admin-absolute{position:absolute;right:0;top:0;height:100%;padding:0 10px;}
.admin-box{height:32px;padding:0 4px;border-radius:32px;background:rgba(0,0,0,0.2);cursor:pointer;}
.admin-box img{width:24px;height:24px;border-radius:24px;}
.admin-box p{font-size:90%;margin:0 5px;padding:0;line-height:1.2;font-weight:500;color:#bdbdbd;}
.dropdown-toggle::after {
    display: inline-block;
    width: 0;
    height: 0;
    margin: 3px 5px 0 0;
    vertical-align: 0.255em;
    content: "";
    border-top:#919191 8px solid;
    border-right: 6px solid transparent;
    border-bottom: 0;
    border-left: 6px solid transparent;
}
.footer-fixed{position:fixed;bottom:0;left:0;right:0;z-index:1000 !important;height:35px;}
.footer-links{margin:0 10px 0 auto !important;}
.copyright{margin:0 0 0 10px;}
.footer-fixed p{font-size:90%;margin:0;padding:0;line-height:1.2;font-weight:500;color:#bdbdbd;}
.footer-fixed a{font-weight:500;color:#bdbdbd;}
#main #main-content, #sidebar {-webkit-transition:width .05s cubic-bezier(0,0,.58,1);-moz-transition:width .05 cubic-bezier(0,0,.58,1);-o-transition:width .05 cubic-bezier(0,0,.58,1);-ms-transition:width .05 cubic-bezier(0,0,.58,1);transition:all .55s cubic-bezier(.645,.045,.355,1) 0s;}
#main-content{padding-bottom:80px;}
#sidebar {padding-bottom:80px !important;}
#sidebar.active {width: 0;}
#main #main-content.active{width:100%;}
.input-group{margin-top:5px;}
.welcome{position:relative;overflow:hidden;margin:20px;background:#e0e0e0;padding:20px;border:#bdbdbd 1px solid;border-radius:5px;text-align:center;}
.welcome img{width:40%;height:auto;margin:0 30px;}
.welcome h2{font-size:120%;margin:0 30px 10px;padding:0;line-height:1.2;font-weight:bold;}
.welcome h1{font-size:150%;margin:0 30px;padding:0;line-height:1.2;font-weight:bold;color:#00327e;}
.samewidth {position:relative;display: grid;grid-template-columns: repeat(auto-fit, minmax(calc(25% - 10px), 1fr)) !important;grid-gap: 10px;}
.col h4{font-size:140%;margin:0;padding:0;line-height:1.2;font-weight:bold;}
.dashboard-icon{position:relative;overflow:hidden;margin:0 20px;}
.icon-box{border:#bdbdbd 1px solid;padding:10px;border-radius:5px;}
.icon-box p{position:relative;overflow:hidden;padding:0 0 0 15px;margin:2px 0;line-height:1.2;font-size:100%;font-weight:500;}
.icon-box p:after{content:"";position:absolute;left:0;top:4px;width:8px;height:8px;border-radius:8px;background:#bdbdbd;}
.icon-box a{color:#515151;}
.icon-box p:hover{font-weight:bold;color:#0066b8;}
.icon-box-image{width:50px;margin:0 0 0 10px;float:right;}
.icon-box-image img{width:100%;height:auto;}
.slider{position:fixed;top:0;left:0;right:0;height:100vh;}
.slider-cover{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1;background:rgba(0,0,0,0.2);}
.image-slider{width: 100%;display: block;position: relative;overflow:hidden;background-size:cover;background-repeat:no-repeat;background-position:center;}
.image-slider{height:100vh;}
.image-slider img{display:block;width:100%;height:100%;position: absolute;top: 50%;left: 50%;margin:0 auto;object-fit: cover;-webkit-transform: translate3d(-50%, -50%, 0);-moz-transform: translate3d(-50%, -50%, 0);-ms-transform: translate3d(-50%, -50%, 0);-o-transform: translate3d(-50%, -50%, 0);transform: translate3d(-50%, -50%, 0);}
.bluetrans{background:rgba(0,35,87,0.6);}
.blacktrans{background:rgba(0,0,0,0.6);}
.loginstyle{width:80%;}
.loginstyle .form-control {
  height: 40px;
  padding: 0 12px;
  font-size: 100%;
  line-height: 40px;
  color: #bdbdbd;
  background-color:rgba(0,0,0,0.5);
  background-image: none;
  border-radius:5px 0 0 5px;
  border: 1px solid #717171;
  -webkit-box-shadow:none;
          box-shadow:none;
  -webkit-transition:none;
       -o-transition:none;
          transition:none;
}
.loginstyle .form-control:focus {border-color: #717171;outline: 0;-webkit-box-shadow:none;box-shadow: none;color: #bdbdbd;}
.loginstyle .form-control::-moz-placeholder {color: #bdbdbd;}
.loginstyle .form-control:-ms-input-placeholder {color: #bdbdbd;}
.loginstyle .form-control::-webkit-input-placeholder {color: #bdbdbd;}
.loginstyle .input-group-text{border: 1px solid #717171;border-left:none;background-color:rgba(0,0,0,0.5);border-radius:0 5px 5px 0;padding:0;width:40px;}
.loginstyle .input-group-text i.fa{color:#bdbdbd;}
.pw-style{background-color:#000;margin:0 0 10px;padding:0 10px;border-radius:5px;border: 1px solid #717171;height:40px;}
.pw-remember p{line-height:1;font-size:100%;margin:0 0 0 5px;padding:0;color:#bdbdbd;}
.pw-reset{margin:0 0 0 auto !important;}
.pw-reset p{line-height:1;font-size:100%;margin:0 0 0 5px;padding:0;color:#ffb300;}
.pw-reset a{color:#ffb300;}
.loginstyle .btn{padding-top:0;padding-bottom:0;height:40px;border-radius:5px;}
.biru{background:#0098b4;color:#fff;}
.masuk{margin:0 0 10px;}
.daftar p{line-height:1;font-size:100%;margin:0;padding:0;color:#fff;}
.daftar-disini{margin:0 0 0 auto !important;height:40px;border-radius:5px;background:#007a6d;color:#6be8ff;padding:0 15px;}
.daftar-disini a, .daftar-disini p{color:#6be8ff;}
.apptitle{position:relative;overflow:hidden;width:80%;}
.apptitle img{width:25vh;margin:0 auto 30px;}
.apptitle-text{position:relative;overflow:hidden;text-align:center;margin:0 10%;}
.apptitle h1{font-size:240%;margin:0;padding:0;line-height:1;font-weight:bold;text-transform:uppercase;color:#fff;}

.carouselright {background:transparent;}
.carouselright-cell {width: 100%;counter-increment: gallery-cell;}
.flickity-enabled {position: relative;}
.flickity-enabled:focus { outline: none;}
.flickity-viewport {overflow: hidden;position: relative;height: 100%;}
.flickity-slider {position: absolute;width: 100%;height: 100%;}
.flickity-enabled.is-draggable {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.flickity-enabled.is-draggable .flickity-viewport {cursor: move;cursor: -webkit-grab;cursor: grab;}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {cursor: -webkit-grabbing;cursor: grabbing;}
.flickity-prev-next-button {display:none;}
.carouselright:hover .flickity-prev-next-button{opacity:1;}
.flickity-prev-next-button.previous {left:0;background-position: center;background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");}
.flickity-prev-next-button.next { right: 0;background-position: center;background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");}
.flickity-prev-next-button:disabled {filter: alpha(opacity=0); /* IE8 */opacity: 0;cursor: auto;}
.flickity-prev-next-button svg {display:none;}
.flickity-page-dots {display:none;}
.big-kode{font-size:150% !important;margin:0 0 0 5px !important;font-weight:bold !important;}
.alert {
    position: relative;
    padding: 8px 10px;
	margin:0 !important;
    margin-bottom:10px !important;
border:none;border-radius:5px;text-align:center;}
.alert-danger {
    color: #fff;
    background-color: #ff4400;
border-color: none;}
.body-notif{position:fixed;top:0;left:0;right:0;bottom:0;background:#002b61;}
.body-notif-absolute{display:block;width:50%;height:auto;position: absolute;top: 50%;left: 50%;margin:0 auto;object-fit: cover;-webkit-transform: translate3d(-50%, -50%, 0);-moz-transform: translate3d(-50%, -50%, 0);-ms-transform: translate3d(-50%, -50%, 0);-o-transform: translate3d(-50%, -50%, 0);transform: translate3d(-50%, -50%, 0);}
.body-notif-inner{position:relative;overflow:hidden;padding:20px;border-radius:5px;background:#c9dae2;text-align:center;}
.notif-col{width:100% !important;float:left;text-align:center;}
.pw-reset2{font-size:120%;margin:0 0 25px !important;padding:0;line-height:1;font-weight:bold;text-transform:uppercase;}
.notif-logo{position:relative;overflow:hidden;padding:0 0 10px;border-bottom:#719aad 1px solid;margin:0 0 20px;}
.notif-logo img{width:auto;height:60px;margin:0 10px 0 0;}
.notif-logo h1{font-size:100%;margin:0;padding:0;line-height:1;font-weight:bold;text-transform:uppercase;color:#002b61;}
.head-default{background:#dbdbdb;position:relative;overflow:hidden;padding:15px 15%;}
.head-default img{width:auto;height:12vh;margin:0 10px 0 0;}
.head-default h1{font-size:120%;margin:0;padding:0;line-height:1;font-weight:bold;text-transform:uppercase;color:#002b61;}
.page-default{position:absolute;left:0;top:0;width:100%;}
.margin-body{margin:0 15%;}
.head-default-top{position:relative;overflow:hidden;background:#002b61;margin:15px 0 30px;padding:10px 0;color:#fff;}


@media (max-width: 768px) {	
.head-default{padding:10px 20px;}
.margin-body{margin:0 20px;}
.head-default-top{margin:10px 0 20px;}
.head-default img{height:60px;}
.head-default h1{font-size:100%;}
#sidebar.active {width: 80% !important;}
.samelogin {position:relative!important;display:block !important;}
.pkklogin-inner{width:90%!important;margin:0 5%!important;margin-top:30px!important;}
.samelogin-col{height:auto!important;border-radius:0!important;border:none!important;}
.apptitle img{width:100px;margin:0 auto 20px;}
.apptitle-text{margin:0 5%;}
.apptitle h1{font-size:180%;}
.blacktrans{background:transparent;margin:0 0 30px;}
.bluetrans{background:rgba(0,35,87,0.6);padding:25px 0;}
.loginstyle{width:90%;}
.menu-absolute{width:40px;}
.app-logo img{height:35px;margin:5px 5px 5px 0;}
.app-logo h1{font-size:110%;margin:0 50px 0 0 ;}
.dropdown-toggle::after, .admin-box p {display:none;}
.welcome.flexcenter{display:block !important;}
.welcome{margin:20px;background:#e0e0e0;padding:20px;}
.welcome img{width:80%;margin:10px auto 0;}
.welcome h2{font-size:120%;margin:0 0 10px;}
.welcome h1{font-size:130%;margin:0 0;}
.samewidth {display: grid;grid-template-columns: repeat(auto-fit, minmax(calc(50% - 10px), 1fr)) !important;grid-gap: 10px;}
.icon-box-image{width:100%;margin:0 auto 10px;float:none;text-align:center;}
.icon-box-image img{width:35px;height:auto;margin:0 auto;}
.footer-fixed{height:auto;padding:8px 0;}
#sidebar.active .navbar-nav  li a{text-align: left;margin:0 15px;}
#sidebar.active .navbar-nav  li a .menu-label{display: block;font-size:16px;line-height:1.2;}
.circle-image{width:80px;height:80px;border-radius:80px;}
.footer-links{margin:0 auto !important;text-align:center !important;}
.copyright{margin:0 auto;text-align:center !important;}
.footer-fixed.flexleft, .footer-links.text-right, .copyright.flexleft{display:block !important;text-align:center !important;}
.body-notif-absolute{width:80%;}
.body-notif-inner{padding:20px 0;}
}