/*
*
* DEFT STREAM CSS
*
*/

:root {
    --text: #f5f5f5;
    --color-1 : #201e2e;
    --color-2 : #2a2757;
    --color-3 : #494961;
    --color-footer : #1A1824;
    --link-hover : #5773ef;
}

/* Scroll Bar*/
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background-color: var(--color-footer) !important; }
::-webkit-scrollbar-thumb { background-color: var(--link-hover) !important; }



body { background-color: var(--color-1); color: var(--text); }
.loginForm { width: 300px; text-align: center; margin: auto;}
.jumbotron { font-weight: bold; font-size: 1.1em; background-color: var(--color-2); text-align: center; padding: 1.5rem 1rem; }
.jumbotron:hover { background-color: var(--color-3); }
.jumbotron img { max-height: 40px; }
.nav-link, a { color: var(--text); text-decoration: none; }
.nav-link:hover, a:hover { color: var(--link-hover); }
footer { background-color: var(--color-footer); padding: 30px; text-align: center; margin-top: 30px; font-size: 0.7em; }
#myTab { margin-bottom: 30px; }

.logout-link {
  float: right;
  font-size: initial;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link, .btn-outline-primary { color: var(--text); background-color: var(--link-hover); border: none; }
.nav-link.logout { color: var(--link-hover); background-color: var(--text); border: none; }
.btn-primary { background-color: var(--link-hover); border: none; color: var(--text); }

.alert-dark { color: var(--text); background-color: var(--color-3); border: none; }

.row{ margin-bottom: 5vh; margin-top: 5vh;}

.form-select {max-width: 130px;}

@media only screen and (max-width: 1000px) {
  body { font-size: 1em; }
  .col-3 { flex: 0 0 auto; width: 50%; }
  .jumbotron { font-weight: bold; font-size: 1em; background-color: var(--color-2); text-align: center; padding: 1.5rem 1rem; }
  .form-select {max-width: 105px;}

}