body{
    overflow-x: hidden;
}
.mb-3{
    text-align: left;
}
.panel-notify{
    display: flex;
}
.notify{
    background-color: #0088cc;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    color: #FFF;
    font-size: 1rem;
    position: relative;
    top: 7px;
    text-align: center;
    padding: 0.8em;
    height: 1px;
    min-width: 2.7em;
    min-height: 2.7em;

}
.notify-info{
    flex: 1 1 100%;
    padding-left: 15px;
}
sup{
    color: #db0347;
    font-family: 'Glyphicons Halflings';
    font-size: 10px;
}
.tengah {
    text-align: center;
}
.errors {
    color: #a94442;
    background-color: #f2dede;
    border: 1px solid #a94442;
    text-align: left;
    padding: 3px 6px;
    margin-bottom: 12px;
}
.invalid-feedback {
    color: #a94442;
    background-color: #f2dede;
    border-color: #a94442;
    text-align: left;
    
}
.diterima{
    padding: 2px;
    background: #07db1f;
    color: #000;
    border-radius: 4px;

}
.has-error{
    padding: 2px;
    background: #ffbf00;
    color: #000;
    border-radius: 4px;

}
.t-error{
    padding: 2px;
    background: #c70340;
    color: #ebba09;
    border-radius: 4px;

}
.dropdown-menu .dropdown .dropdown-menu {
    left: 100%;
    top: 0;
}
.navbar-right .dropdown-menu {
    right: 0;
    left: 0;
}
.navbar-inverse {
    background-color: #2588df;
    border-color: #2588df;
}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover {
    color: #fff;
    background-color: transparent;

}
.navbar-inverse .navbar-nav>li>a:hover {
    color: #f8b608;
    border-bottom: 2px solid #f8b608;
   
}
.navbar-inverse .navbar-nav>li>a {
    color: #fff;
    border-bottom: 2px solid transparent;
}
.nav.navbar-nav{
    padding: 20px 0px;
}
.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover {
    color: #f8b608;
    background-color: transparent;
}
.navbar-header {
    background: transparent;
}
.search{
    margin-top: 6px;
}
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
    border-color: #fff;
}
.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
    background-color: #db0347;
}
.navbar-inverse .navbar-toggle {
    border-color: #fff;
}

.btn-login{
    color: #fff;
    background-color: #2588df;
    border-color: #2588df;
    border-radius: 0px;
}
    
 .btn-login:hover{
    color: #f8b608;
    background-color: #04569f;
    border-color: #04569f;
    border-radius: 0px;
}
.btn-login{
    margin-bottom: -10px;
}
.btn-prev{
    color: #fff;
    background-color: #999;
    border-color: #999;
    border-radius: 0px;
}
    
 .btn-prev:hover{
    color: #f8b608;
    background-color: #5a5959;
    border-color: #5a5959;
    border-radius: 0px;
}
.btn-prev{
    margin-bottom: -10px;
}
.title-login{
    color : #2588df;
    
}

.grup-login:hover{
    position: relative;
    display: table;
    border-collapse: separate;
    border: 1px solid #2588df;
    border-radius: 4px;
}
.grup-login{
    position: relative;
    display: table;
    border-collapse: separate;
    border: 1px solid transparent;
    border-radius: 4px;
}

.form-login:hover{
    border-bottom: 1px solid transparent;
    border-top: 1px solid transparent;
    border-left: 1px solid #2588df;
    border-right: 1px solid transparent ;
    border-radius: 4px;
}
.form-data:hover{
   
    border: 1px solid #2588df;
    border-radius: 4px;
}
.select2-container--default .select2-selection--single {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
}


.form-registrasi:hover{
    border: 1px solid #db0347 ;
}
.dropdown-menu{
    min-width: min-content;
}
.formnotlp{
    width: 102px;
    padding: 12px;
}

@media screen and (min-width: 360px) {
  .logo-image{
    height: 50px;
    }
}
@media screen and (min-width: 1200px) {
  .logo-image{
    height: auto;
    }
}

@media screen and (min-width: 360px) {
  .carousel-holder{
    margin-top: 5px;
    }
}
@media screen and (min-width: 1200px) {
 .carousel-holder{
    margin-top: 25px;
    }
}

@media screen and (min-width: 360px) {
  .thumbnail-image{
    position: absolute;
    margin: -9px;
    
    width: 34px;
    }
}
@media screen and (min-width: 1200px) {
 .thumbnail-image{
    position: absolute;
    margin: -9px;
    right: 13px;
    width: 34px;
    }
}

@media screen and (min-width: 360px) {
  .thumbnail-image-default {
    position: absolute;
    margin: -9px;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    border: 2px solid white;
    }
}
@media screen and (min-width: 1200px) {
 .thumbnail-image-default {
    position: absolute;
    margin: -9px;
    right: 13px;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    border: 2px solid white;
    }
}

.oke {
    margin-top: 5px;
    margin-bottom: 0px;
    padding-left: 0px;
}
.text {
    position: absolute;
    top: 4px;
}
.oke{
    margin-top: 12px;
    margin-bottom: 6px;
}

@media screen and (min-width: 360px) {
 .daftar{
    padding: 15px 12px;
    font-size: 14px;
}
}
@media screen and (min-width: 1200px) {
    .daftar{
    padding: 15px 12px;
    font-size: 18px;
    }
}
.float-right{
    float: right!important;
}
.main-footer {
    background: #fff;
    border-top: 1px solid #dee2e6;
    color: #869099;
    padding: 1rem;
}
.radius{
    border-radius: 0px;
}
label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 500;
}
.alert-dismissable1, .alert-dismissible1 {
    padding-right: 0;
}
.alert1 {
    padding: 0px;
}
.modal-content1 {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    /* border: 1px solid #999; */
    /* border: 1px solid rgba(0,0,0,.2); */
    border-radius: 6px;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgb(0 0 0 / 50%);
    box-shadow: 0 3px 9px rgb(0 0 0 / 50%);
}

/*FORM WIZARD*/
.bg-mage{
    background-image: url(../images/wizard-v3.jpg);
    background-image: url(../images/wizard-v3.jpg);
    position: relative;
    top: -30px
}
@media screen and (min-width: 360px) {
  .bg-mage{
        padding: 15px;
    }
}
@media screen and (min-width: 1200px) {
  .bg-mage{
        padding: 100px;
  }
}

.top-content { padding: 40px 0 170px 0; }

.top-content .text { color: #fff; }
.top-content .text h1 { color: #fff; }
.top-content .description { margin: 20px 0 10px 0; }
.top-content .description p { opacity: 0.8; }
.top-content .description a { color: #fff; }
.top-content .description a:hover, 
.top-content .description a:focus { border-bottom: 1px dotted #fff; }

/*.form-box { padding-top: 40px; }*/


.f1 {
    padding: 15px; background: #fff;
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
    text-align: center;
}
.f1 h3 { margin-top: 0; margin-bottom: 5px; text-transform: uppercase; }

.f1-steps { overflow: hidden; position: relative; margin-top: 20px; }

.f1-progress { position: absolute; top: 24px; left: 0; width: 100%; height: 1px; background: #ddd; }
.f1-progress-line { position: absolute; top: 0; left: 0; height: 1px; background: #db0347; }


.f1-step { position: relative; float: left; width: 32.333333%; padding: 0 5px; }

.f1-step-icon {
    display: inline-block; width: 40px; height: 40px; margin-top: 4px; background: #ddd;
    font-size: 16px; color: #fff; line-height: 40px;
    -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%;
}
.f1-step.activated .f1-step-icon {
    background: #fff; border: 1px solid #11ce17; color: #11ce17; line-height: 38px;
}
.f1-step.active .f1-step-icon {
    width: 48px; height: 48px; margin-top: 0; background: #db0347; font-size: 22px; line-height: 48px;
}

.f1-step p { color: #ccc; }
.f1-step.activated p { color: #11ce17; }
.f1-step.active p { color: #db0347; }

.f1 fieldset { display: none; text-align: left; }

.f1-buttons { text-align: right; }

.f1 .input-error { border-color: #db0347; }

@media (max-width: 415px) {
    
    h1, h2 { font-size: 32px; }
    
    .f1 { padding-bottom: 20px; }
    .f1-buttons button { margin-bottom: 5px; }

}

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx),

/*AKHIR FORM WIZARD*/
.f1 {
    padding: 15px; background: #fff;
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
    text-align: center;
}
.error{
    color: #db0347;
}
.geterror{
   border-color: #db0347; 
}

/*AWAL PROFILE*/
.image-views {
    text-align: center;
    padding-top: 15px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.img-thumbnail1 {
    width: 16rem;
    display: block;
    margin-right: auto;
    margin-left: auto;
    border-radius: 100px;
    border: 2px solid #e6e0e0;
}
.p {
    border-top: 1px solid #e6e0e0;
    border-bottom: 1px solid #e6e0e0;
    color: #828181;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.profile {
    font-size: 14px;
    color: #4e4c4c;
}
.profile {
    padding: 6px;
    margin: 6px;
}
.ketengah{
    text-align: center;
}