/* by rullywahyubintoro@gmail.com */

h1, h2, h3, h4, h5 {
  font-family: 'Arimo';
}

.login-page {
  background: #fff;
  /*overflow: hidden;*/
}
.login-box-msg, .register-box-msg {
  padding-left: 0px;
  padding-right: 0px;
}
.copyright {
  text-align: center;
  font-size: 12px;
}
.copyright a {
  font-weight: 600;
}

.btn {
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 0.5;
}
.form-control:focus {
  background-color: lightyellow;
}
.invalid+.form-control-feedback {
  width: 46px;
  height: 46px;
  line-height: 46px;
}
.invalid {
  display: block;
  padding: 5px 0 5px 0;
  font-size: 12px;
  font-weight: 600;
  color: red;
}

.sidebar-menu>li>a {
  font-size: 12px;
  font-weight: 550;
  text-transform: uppercase;
}
.treeview-menu>li>a {
  font-size: 12px;
  font-weight: 250;
  text-transform: uppercase;
  padding: 12px 5px 12px 15px;
}
.treeview-menu>li.active>a {
  font-weight: 450;
}
.sidebar-menu>li>a>.fa, .sidebar-menu>li>a>.glyphicon, .sidebar-menu>li>a>.ion {
  font-size: 18px;
  margin-right: 7px;
  text-align: center;
}

@media (max-width:767px){ 
	.box-header>.box-tools.tools-search-box {
    position: relative;
    float: right;
    right: 0;
    top:0;
  }
}

@media (min-width: 992px){
  .modal-xl {
      width: 1100px;
  }
}

@media (max-width:560px){
	.box-area-tools {
    display: grid;
    grid-gap: 5px;
  }
	.box-area-tools .btn-group {
    display: grid;
  }
	.box-area-tools .tools-search-box .input-group{
    width: 100%!important;
  }
	.box-area-tools .tools-search-box .form-group{
    width: 100%!important;
  }
	.box-area-tools .tools-search-box .form-group.col-md-6{
    margin-bottom: 5px;
    padding: 0px;
  }
}

.fit-image {
  width: 400px;
  object-fit: cover;
  height: 400px;
  margin: auto;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header > img {
  z-index: 5;
  height: 90px;
  width: 90px;
  border: 0px;
  border-color: transparent;
  border-color: rgba(255, 255, 255, 0.2);
}

.navbar-brand {
  padding-right: 55px;
  border-right: 1px solid orangered;
}
.navbar-brand:hover > .icon-brand {
  transition: 0.25s;
  color: brown;
  background: gold;
  border: 2px solid orangered;
  transform: rotate(10deg);
}
.navbar-brand:hover > .text-brand {
  transition: 0.25s;
  color: gold;
}
.icon-brand {
  color: crimson;
  background: white;
  border: 2px solid lightcoral;
  font-size: xx-large;
  position: absolute;
  top: 8px;
  z-index: 0;
  border-radius: 10%;
  width: 35px;
  height: 35px;
  text-align: center;
}
.text-brand {
  z-index: 9999;
  position: relative;
  left: 40px;
  color: white;
}