/* Full background image */
 .bg {
     background-image: url(../img/background.jpg)!important;
}
/* html {
    font-size:17px!important
}*/
body {
    font-family: 'roboto', sans-serif
}
.sp-2 {
    letter-spacing: 2px
}
.shadow-img {
    filter: drop-shadow(2px 2px 2px #263238)
}
.shadow-img-2 {
    filter: drop-shadow(4px 4px 4px lightgrey)
}
.bg-login {
     background-image: linear-gradient(to top, #e6e9f0 0%, #eef1f5 100%)!important;
}
.bg-drawer {
     background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 1)), url("../img/sidebar/11.png");
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
}
.bg-container {
    background:#eef1f5!important
}
.bg-card {
     background:url('bg2.jpg');
     background-size: cover;
}
/*/
///// Welcome Banner /////
/*/
/* Loaded body */
 body.loaded {
     opacity: 1;
     transition: 1s opacity;
}
/* Default banner */
.banner {
    position: relative;
    width: 100%;
    height: 40rem;
    padding: 0 5%;
    overflow: hidden;
    backface-visibility: hidden;
}
/* Default image container */
.banner .background {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    transform: translate3d(0,0,0) scale(1.25);
    background: black url(https://images.unsplash.com/photo-1531971085967-431db1ec65a2?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=212d5ac2d6b763d2f2168d4f0a85b36c&auto=format&fit=crop&w=2250&q=80) no-repeat center center;
    background-size: cover;
}
/* Loaded image container */
.loaded .banner .background {
    transform: scale(1);
    transition: 6.5s transform;
}
/* Other stuff */
.banner h1 {
    color: #EEE;
    margin: 0;
    line-height: 40rem;
    text-transform: uppercase;
    text-shadow: 0 0 .3rem black;
}

.no-uppercase {
     text-transform: unset !important;
}

.custom-loader {
  animation: loader 1s infinite;
  display: flex;
}
@-moz-keyframes loader {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes loader {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}
@-o-keyframes loader {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes loader {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}