body { background: #004568; }

.logo { width: 180px; margin: 30px auto; }

.table { font-size: 0.8rem; }
.table th { font-size: 0.7rem; }
.table td { vertical-align: middle; }
.column { font-weight: bold; font-size: 0.8rem; }
.table tr.selected td { background: #EAEAEA!important; color: #004568!important; }
.table tr:hover td { background: #004568!important; color: #FFF!important; }


.kpi { background: #004568; color: #FFF; border-radius: 5px; padding: 10px; margin: 10px; width: 170px; }
.kpi span { display: block; font-size: 0.7rem; }
.kpi b { font-size: 1.2rem; display:block; }
.kpi em { font-size: 0.7rem; }

.kpi-invert { background: #EAEAEA; color: #004568; }


.nav-pills .nav-item { padding: 0 5px; }
.nav-pills .nav-link { background: #F5F5F5; color: #004568; font-weight: bold; }

.nav-pills .nav-link.active, .nav-pills .show>.nav-link { background: #004568; border-color: #004568;  }

.bg-info { background-color:#ad9444!important; color: #fff!important; }

.footer { font-size: 0.9rem; }


@media only screen and (max-width: 768px)
and (orientation : portrait)  {

    .m-flex-wrap { flex-wrap: wrap; }
    .nav-item,
    .kpi { width: 100%; }
    form { width: 100%; margin: 25px 0; }
    .nav-pills .nav-item { padding: 10px 0; }
}