
body{
  height: 100%;
  background: url(../../assets/images/bg2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.kotak {
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  -ms-border-radius: 0px;
  -webkit-border-radius: 0px;
}

.top-header {
  background-color: rgb(70, 169, 38, 0.9);
  color: #fff;
}

.top-header a{
  /*color: #ffcc66;*/
}

.header{
  /*background-color: rgba(255,255,255,0.6);*/
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 3%;
}

.header h1{ 
  color: #006600;
  font-size: 1.8em;
  margin:0px;
  font-weight: bold;
}

.header h3{ 
  color: #006600;
  font-size: 1.4em;
  margin:0px;
}
 
.box-dashboard{
  background-color: rgba(255,255,255,0.4);
  text-align: center;
  border: 1px solid rgba(255,255,255,0.3);
  min-height: 120px;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px;

  -moz-border-radius: 6px;
  -o-border-radius: 6px;
  -ms-border-radius: 6px;
  -webkit-border-radius: 6px;

  position: relative;
  font-size: 0.9em;
}

.box-dashboard:hover{
  background-color: rgba(153, 255, 153,0.8);
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  -webkit-transition: all 1s ease;
  transition: all 1s ease;

  animation: bounce; /* referring directly to the animation's @keyframe declaration */
  animation-duration: 1s; /* don't forget to set a duration! */

}

h4 .text-fix-bawah{
  position: absolute;
  bottom: 0%;
  left: 10%;
  right: 10%;
}


.box-dashboard h4 {
  color: #3d5c5c;
  font-weight: bold;
  font-size: 1.1em;
}

.box-dashboard img {
  width:40%;
  margin: auto;
}

.box-dashboard :hover{
  text-decoration: none !important;
}

#particles-js canvas{
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.swal2-popup {
  font-size: 1.4rem !important;
}


.glyphicon-refresh-animate {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
}

@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}

@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}