body{
background-color: #f5f5f5;
}

#abbr-subsystems{
    font-size: 0.9em;
}
.big-font {
    font-size: 2em;
}
.medium-font{
    font-size: 1.3em;
}
.tiny-font{
    font-size: 0.8em;
}

.clickable-row{
    font-size: 1.1em;
}

.clickable-row:hover{
    cursor: pointer;
    color: #5191b3;
}

.clickable-row[aria-expanded="true"]{
    color: #5191b3;
    background: rgba(228, 228, 228, 0.75);
    border-bottom: 3px solid #5191b3;
}


@media (max-width: 400px) {
    .clickable-row{
        font-size: 0.8em;
    }

    th[scope="row"] i.fas{  /* Icons */
        font-size: 1em;
    }

    table.table-unam td:last-child{  /* numbers of the right column on UNAM table*/
        text-align: right;
        font-size: 1em;
    }
}

.table-font{
    font-size: 0.75em;
}

tr.sub-level, tr.collapse, tr.collapsing{
    color: rgba(64, 64, 64, 0.94);
    font-size: 0.9em;
    border-bottom: 2px solid rgba(75, 145, 181, 0.50);
    background: rgba(75, 145, 181, 0.01);
}

tr.sub-sub-level{
    color: gray;
    border-bottom: 2px solid rgba(78, 189, 225, 0.15);
    font-size: 0.8em;
    background: rgba(78, 189, 225, 0.07);
}

th[scope="row"] i.fas{  /* Icons */
    font-size: 1.5em;
}

table.table-unam td:last-child{  /* numbers of the right column on UNAM table*/
    text-align: right;
    font-size: 1.2em;
}

table.table-institution td:nth-last-child(-n+3){
    text-align: right;
    font-size: 0.8em;
}

.headers{
    color: #00375f;
    font-size: 2em;
}

.sub-headers{
    color: #56ACDF;
    font-size: 1.5em;
}

.text-notes{
    font-size: 0.8em;
}

.top-buffer{
    margin-top: 20px;
}

#comparator-btn{
    font-size: 1.7em;
}

.institution-card{
    box-shadow: 0.3em 0.3em 3px #a5a5a5;
}

.institution-img{
    height: 200px;
    width: 200px;
}

.institution-img:hover{
    border: 3px solid #0d94a1;
    border-radius: 8px;
}

.institution-name{
    font-size: 1.4em;
    font-weight: lighter;
}

.institution-name:hover{
    color: #0d94a1;
}

#institution-box{
    border: #171a1d dot-dash;
}

hr {
    border: 0;
    height: 1px;
    width: 80%;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 55, 95, 0.75), rgba(0, 0, 0, 0));
}

.high-rounded{
    border-radius: 1em;
}

.hide-element{
    display: none;
}

.chart-container{
    position: relative;
    height: 100%;
    width: 100%;
}


.info-bar{
    margin-top: 5px;
    height: 5%;
    width: 50%;
}

.footer {
    background-color: #2d2d2d;
    padding: 10px;
}


.copyright {
    color: #a8a8a8;
    text-align: right;
    font-size: 0.8em;
}