@import url('https://fonts.googleapis.com/css?family=Baloo+Tamma');

html, body { height:100%; }

#background {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%;

    background-color: #f1f5f8;
    /*background-image:url(img/bg.jpg);*/
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-attachment: fixed;
    opacity: 0.15;
    z-index:-1;
}

.page-load {
    position: fixed;
    left: 0;
    top: 0;
    width:100%;
    height:100%;
    overflow: hidden;
    z-index: 999;
    opacity: 0.8;
    background: url(img/preloader.gif) center no-repeat #fff;
}

nav#navbar { background-color:#2f365f!important; }
nav#navbar a.navbar-brand img { height:30px;width:30px; }
nav#navbar a.navbar-brand span { font-family:'Baloo Tamma', cursive; }
nav#navbar img#profile-pic { height:25px;width:25px;border-radius:50%;object-fit:cover; }
nav#navbar span#profile-name { padding-left:5px; }

nav#navbar div.nav-login div.dropdown-menu {
    padding: 5px;
    min-width: 250px;
}

.bd-callout {
    padding:1.25rem;
    margin-top:1.25rem;
    margin-bottom:1.25rem;
    border:1px solid #eee;
    border-left-width:.25rem;
    border-radius:.25rem;
    border-left-color:#343a40;
    background-color: rgba(255,255,255,0.5);
}
.bd-callout-primary {  border-left-color: #007bff; }
.bd-callout-secondary {  border-left-color: #6c757d; }
.bd-callout-success {  border-left-color: #28a745; }
.bd-callout-danger {  border-left-color: #dc3545; }
.bd-callout-warning {  border-left-color: #ffc107; }
.bd-callout-info {  border-left-color: #17a2b8; }
.bd-callout-light {  border-left-color: #f8f9fa; }
.bd-callout-dark {  border-left-color: #343a40; }

.cd-top {
 border-radius: 50%;
  display: inline-block;
  height: 40px;
  width: 40px;
  position: fixed;
  bottom: 15px;
  right: 15px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
          box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  /* image replacement properties */
  overflow: hidden;
  /* text-indent: 100%; */
  white-space: nowrap;
  background: rgba(47, 54, 95, 1);
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s, background-color .3s 0s;
  transition: opacity .3s 0s, visibility 0s .3s, background-color .3s 0s;
}
.cd-top i { margin: -3% 0 0 19%;font-size:30pt; }
.cd-top.cd-top--show, .cd-top.cd-top--fade-out, .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s, background-color .3s 0s;
  transition: opacity .3s 0s, visibility 0s 0s, background-color .3s 0s;
}
.cd-top.cd-top--show {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-top--fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}
.cd-top:hover {
  background-color: rgba(47, 54, 95, 1);
  opacity: 1;
}

@media only screen and (min-width: 768px) {
  .cd-top {
    right: 20px;
    bottom: 20px;
  }
  .cd-top i { margin: -3% 0 0 19%;font-size:30pt; }
}

@media only screen and (min-width: 1024px) {
  .cd-top {
    height: 60px;
    width: 60px;
    right: 30px;
    bottom: 20px;
  }
  .cd-top i { margin: 7% 0 0 25%;font-size:36pt;}
}