body {
  scroll-behavior: smooth;
}
/*@media screen and (max-width: 991px){*/
/*	.font{*/
/*		color: #fff;*/
/*	}*/
/*}*/

.head {
  height: 250px;
  margin-top: 40px;
  background-image: url('../image/judul.jpg');
  background-size: cover;
  margin-bottom: -20px;
}

.warna {
  /*background-image: url('../image/abs.jpg');*/
  
  background-color: #eee;
  background-repeat: no-repeat;
  background-size: cover;
}

.foto {
  margin-top: -20px;
  margin-left: -5px;
}

.font {
  margin-top: -12px;
  color: white;
}

.konten {
  margin-top: -60px;
  filter: blur(50px);
  margin-bottom: 10px;
  border-radius: 0px;
  padding-right: 20px;
  padding-left: 20px;
  border-top: 2px solid rgb(151, 17, 111);
  background-color: #fafaf7;
  box-shadow: 10px 25px 30px rgba(0, 0, 0, 0.3);
}

.konten2 {
  margin-bottom: 10px;
  border-radius: 0px;
  padding-right: 20px;
  padding-left: 20px;
  border-top: 2px solid rgb(128, 13, 128);
  background-color: #fff;
  box-shadow: 10px 25px 30px rgba(0, 0, 0, 0.3);
}

.progress {
  height: 10px;
  border-radius: 6px;
}

.thumbnail {
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 16px;
  background-color: #fff;
  box-shadow: 10px 25px 30px rgba(0, 0, 0, 0.3);

}

.garis {
  background-color: #e0ddd7;
  height: 2px;
  margin-top: -4px;
}

.bingkai-data {
  border-left: 1px solid #e0ddd7;
  border-radius: 2px;
}

.bingkai-data2 {
  border-left: 1px solid #e0ddd7;
  border-radius: 2px;
}

.tepian {
  border: none;
}

.info {
  padding: 17px;
  padding-top: 10px;
}

.entri {
  border: none;
  color: red;
}

.entri2 {
  border: none;
  border-left: 2px solid rgb(225 225 225 / 50%);
}

.login {
  margin-top: 5%;
  padding: 30px;
  padding-bottom: 30px;
  background-color: #e9e9e9;
}

.judul {
  text-align: center;
  font-size: 12px;
}

.foto-admin {
  margin-top: 20%;
}

.btn {
  border-radius: 15px;
}

.horizontal {
  overflow-y: auto;
  overflow-x: scroll;
}

input[type=text],
input[type=password],
input[type=select],
input[type=file] {
  border: none;
  border-bottom: 1px solid #a9a9a9;
}

.formlogin {
  border-radius: 10px;

}

.ttt {
  color: #000;
}

.src {
  color: #fff;
}

.src:hover {
  text-decoration: none;
  color: rgb(217 83 79);
  font-weight: bold;
}

.exit {
  color: white;
}

.gambar {
  padding-top: 7px;
}

.huruf-judul {
  color: white;
  padding-top: 1px;
  font-weight: bold;
}

.sub-judul {
  color: white;
}

.menu_atas {
  background-color: purple;
  border: none;
  height: 40px;
}

.menu_atas_dua {
  background-color: #5a8d78;
  border: none;
  height: 40px;
}

.menu_data {
  padding: 15px;
  background-color: #9e42aa;
}

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background-color: white;
}

.preloader .loading {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font: 14px arial;
}

.input {
  position: relative;
}

.input input {
  border: none;
  background: none;
  width: 100%;
  height: 45px;
  border-bottom: 1px solid rgb(107 107 107 / 35%);
  padding-left: 15px;
  padding-right: 20px;
  box-sizing: border-box;
  margin-bottom: 15px;
}

.input input:focus {
  outline: none;
  border-bottom: 1px solid #f90;
}

.input .text {
  font: 12px/16px 'Helvetica Neue', Arial, sans-serif;
  position: absolute;
  top: 50%;
  left: 15px;
  margin-top: -15px;
  color: gray;
  background-color: inherit;
  transition: all .1s linear;
  pointer-events: none;
}

.input input:focus+.text,
.input input:not(:invalid)+.text {
  color: #f90;
  top: 0%;
  margin-top: -4px;
}

.tom-login {
  border-radius: 20px;
  border: none;
  border-bottom: 2px solid #eee;
}

.loginbay {
  margin-top: 5%;
  padding: 30px;
  padding-bottom: 30px;
  border-radius: 10px;
  background-color: #fff;
  box-shadow: 10px 25px 30px rgba(0, 0, 0, 0.3);
}
.keluar{
  font-style: normal;
}
.peta{
    margin-top: -10px;
}
.kolom{
    border-radius: 0px;
    margin-top: -12px;
    margin-bottom: -16px;
    height: 90px;
}
.kotak{
            width: 300px;
            border: 1px dashed black;
            margin: 10px auto;
            padding: 20px;
            text-align: center;
        }
 
        .hasil{
            text-align: center;
        }

.act-btn{
      background:green;
      display: block;
      width: 50px;
      height: 50px;
      line-height: 50px;
      text-align: center;
      color: white;
      font-size: 30px;
      font-weight: bold;
      border-radius: 50%;
      -webkit-border-radius: 50%;
      text-decoration: none;
      transition: ease all 0.3s;
      position: fixed;
      right: 30px;
      bottom:100px;
      
      top: 0;
      position: fixed;
      z-index: 1;
      margin-top: 5px;
    }
.act-btn:hover{
    background: black;
    text-decoration: none;
    color: white;
}
        
.bck-btn{
      background:purple;
      display: block;
      width: 50px;
      height: 50px;
      line-height: 50px;
      text-align: center;
      color: white;
      font-size: 30px;
      font-weight: bold;
      border-radius: 50%;
      -webkit-border-radius: 50%;
      text-decoration: none;
      transition: ease all 0.3s;
      position: fixed;
      right: 30px;
      bottom:100px;
      
      top: 0;
      position: fixed;
      z-index: 1;
      margin-top: 65px;
    }
.bck-btn:hover{
    background: black;
    text-decoration: none;
    color: white;
}