html {
    height: 100%;
}

body {
    min-height: 100%;
    padding-bottom: 3rem;
    margin: 0;
    position: relative;
    font-family: "Roboto", sans-serif !important;
    font-weight: 300 !important;
}

#footer {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 1rem;
    background: #E8ECEF;
    /* border-top: 1px solid #EAEEF2; */
    /* color: #514B52; */
    box-shadow: rgba(0, 0, 0, 0.075) 0px -1px 4px 0px;
    font-family: "Roboto Condensed", sans-serif; 
    font-size: 0.8em;
}

#footer p {
    margin-bottom: 0;
}

pre {
    border: #dddddd 1px solid;
    padding: 1em;
    background-color: white;
}

.green {
    color: #2C9F1C;
}

.red {
    color: #E3342F;
}

.page-item .page-link {
    color: #cc5500;
    background-color: #fff;
}

.page-item.active .page-link {
    z-index: 1;
    color: #fff !important;
    background-color: #cc5500 !important;
    border-color: #cc5500 !important;
}

.page-item .page-link:hover {
    background-color: #dee2e6;
    border-color: #dee2e6;
    color: #cc5500;
}
body strong {font-weight: 800;}
#dev-server {position: absolute; left: 25px; top: -2px;}

body h1 {font-weight: 800; color: #5b6268}
body .btn-light {border-color: #D7DEE3;}
/* body .btn-light:hover {border-color: #BEC5C9;} */
body .btn-light:not(:disabled):not(.disabled).active {}

.form-control.show-data {height: auto; min-height: 37px;}
a i, button i {opacity: 0.5; transition: opacity 0.15s;}
a:hover i, button:hover i {opacity: 0.7;}

body .btn, body .dropdown-item {font-weight: 300;}
body .bg-primary, body .btn-primary, body .bg-info, body .btn-info, body .btn-primary:not(:disabled):not(.disabled):active, body .btn-info:not(:disabled):not(.disabled):active {background-color: #cc5500;}
body nav.bg-info {background-color: #cc5500 !important;}
body a {color: #cc5500;}
body a:hover {color: #F16602;}
body .btn-link:not[.dropdown-item] {color: #cc5500;}
body .btn-link:hover:not[.dropdown-item] {color: #F16602;}
body .btn-primary, body .btn-info {border-color: #cc5500;}
body .btn-primary:hover, body .btn-info:hover, body .btn-primary:not(:disabled):not(.disabled):focus, body .btn-info:not(:disabled):not(.disabled):focus {background-color: #F16602; border-color: #F16602}

table.table tbody td {font-family: "Roboto Condensed", sans-serif; padding: 6px; font-size: 0.9em;}
table tr.ignore td:not(.action) {text-decoration: line-through; opacity: 0.4;}

.text-condensed {font-family: "roboto Condensed", sans-serif;}
.text-smaller {font-size: 0.8em;}

/* 3 dots bounce loading effect - https://codepen.io/danielmorosan/pen/XmYBVx */
.bouncing.ball.spinner {margin: 0 auto; width: 70px; text-align: center;}
.bouncing.ball.spinner > div {width: 10px; height: 10px; background-color: #bbbbbb; border-radius: 100%; display: inline-block;-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both; animation: sk-bouncedelay 1.4s infinite ease-in-out both;}
.bouncing.ball.spinner .bounce1 {-webkit-animation-delay: -0.48s; animation-delay: -0.48s;}
.bouncing.ball.spinner .bounce2 {-webkit-animation-delay: -0.32s; animation-delay: -0.32s;}
.bouncing.ball.spinner .bounce3 {-webkit-animation-delay: -0.16s; animation-delay: -0.16s;}
@-webkit-keyframes sk-bouncedelay {0%, 80%, 100% { -webkit-transform: scale(0) }  40% { -webkit-transform: scale(1.0) }}
@keyframes sk-bouncedelay {0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); } 40% { -webkit-transform: scale(1.0); transform: scale(1.0); }}

.container.main {position: relative;}
.bouncing.ball.page-header {position: absolute; top: 18px; left: calc(50% - 100px); width: 200px; display: none;}
.bouncing.ball.page-header.spinner > div {margin-left: 14px; width: 12px; height: 12px;}