body, .nav-text, #maintable, tspan, .nav-text, .morris-hover-row-label {
    font-family: 'Cairo', sans-serif !important;

}
body {
    padding-top: 50px;
    padding-bottom: 20px;        
}

tspan, .nav-text, .morris-hover-row-label {    
    margin: 5px;
}


@media print {
    body {
        font-size: 14px !important;
    }


    .navbar-brand {
        font-size: 14px !important;
    }

    .nav-text, #maintable {
        font-size: 12px !important;
    }

    tspan, .nav-text, .morris-hover-row-label {
        font-size: 8px !important;
    }
}

@media only screen {
    body {
        /*font-size: calc(14px + (20 - 14) * ((100vw - 300px) / (1600 - 300))) !important;*/
        font-size: 14px !important;
    }

    a.navbar-brand {
        /*font-size: calc(14px + (20 - 14) * ((100vw - 300px) / (1600 - 300))) !important;*/
        font-size: 14px !important;
    }

    .nav-text, #maintable {
        /*font-size: calc(12px + (18 - 12) * ((100vw - 300px) / (1600 - 300))) !important;*/
        font-size: 12px !important;
    }

    tspan, .nav-text, .morris-hover-row-label, #morris-bar-chart svg text tspan {
        font-size: calc(7px + (10 - 7) * ((100vw - 300px) / (1600 - 300))) !important;
        /*font-size: 8px !important;*/
    }

}


    #maintable tr td, #maintable tr th {
        padding: 3px;
    }
/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/