@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;400;700&display=swap');

body { padding-bottom: 20px; font-family: 'Roboto', sans-serif;}
body.logged-in {padding-top: 70px;}

h1 {margin: 0 0 20px;}

.logo {padding: 40px; margin-bottom: 20px;}
.navbar-default, .logo {background-color: #ef2a2d;}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover { background-color: #d62427;
    color: #fff;
}

/* TODO: prefarbit hamburger a tlacitko collapse menu */
.table-responsive>.table>tbody>tr>td, .table-responsive>.table>tbody>tr>th, 
.table-responsive>.table>tfoot>tr>td, .table-responsive>.table>tfoot>tr>th, 
.table-responsive>.table>thead>tr>td, .table-responsive>.table>thead>tr>th {
  white-space: nowrap;
}

.navbar-default .navbar-nav > li > a {color: #fff;}

a[href^="#error:"] {background: red; color: white;}

a:hover {text-decoration: none;}

form .required label {font-weight: bold;}

/* dashboard */
.box {display: flex; align-items: center; margin: 10px;}

.box > .box-head {flex: 0 0 80px; text-align: center; padding: 10px; color: #fff; font-weight: bold; font-size: 5rem;}

.consolas {font-family: Consolas, "Lucida Console", "Courier New", monospace;}

.box-head:hover {text-decoration: none;}

.box > .box-body {flex: 0 1 auto; padding: 10px; font-weight: bold;}

.box-body > span {display: block; font-weight: normal;}

.row-flex {display: flex; flex-wrap: wrap; align-items: center; margin: 10px;}

.col-flex {flex: 0 0 100%;}

textarea.form-control {height: 10rem;}

@media screen and (min-width: 768px) {
    .col-flex {flex: 0 0 50%;}
}

@media screen and (min-width: 992px) {
    .col-flex {flex: 0 0 25%;}
}

.bg-blue {background-color: #0d6efd;}

.bg-red {background-color: #dc3545;}

.bg-green {background-color: #28a745;}

.bg-orange {background-color: #ffc107;}

.bg-gray {background-color: #6c757d;}

.bg-purple {background-color: #68217a;}

.bg-turquoise {background-color: #17a2b8;}

.bg-blue-l {background-color: #cfe2ff}

.bg-red-l {background-color: #f8d7da;}

.bg-green-l {background-color: #d4edda;}

.bg-orange-l {background-color: #fff3cd;}

.bg-gray-l {background-color: #e2e3e5;}

.bg-purple-l {background-color: #e8baf8;}

.bg-turquoise-l {background-color: #d1ecf1;}

.tx-blue {color: #073984;}

.tx-red {color: #721c24;}

.tx-green {color: #155724;}

.tx-orange {color: #856404;}

.tx-gray {color: #383d41;}

.tx-purple {color: #68217a;}

.tx-turquoise {color: #0c5460;}

.tx-white {color: #fff;}

.bo-blue {border: 1px solid #0d6efd;}

.bo-red {border: 1px solid #dc3545;}

.bo-green {border: 1px solid #28a745;}

.bo-orange {border: 1px solid #ffc107;}

.bo-gray {border: 1px solid #6c757d;}

.bo-purple {border: 1px solid #68217a;}

.bo-turquoise {border: 1px solid #17a2b8;}

.copyright {font-size: 10pt; position: fixed; z-index: 3; width: 100%; bottom: 0; padding: 5px; margin-bottom: 0; text-align: center; border-top: 1px solid #e7e7e7; background-color: #f8f8f8;}

.p-1 {padding: .5rem;}

.mh-1 {margin-left: .3rem; margin-right: .3rem;}