#info-panel{
    border-top: 1px solid var(--off-white);
    height: 100%; /* Needed for scrolling */
    flex-direction: column;
    display: flex;
  }


#info-panel-header{
    background: var(--dataset-col-reg);
    border-bottom: 0px solid var(--off-white);
    padding-top: 10px;
    padding-bottom: 10px;
    padding-right: 20px;
    padding-left: 40px;
    display: flex;
    align-items: center;

}

#info-panel-header-text{
    color: var(--off-white);
    font-weight: bold;
    flex: 1;
}

#info-panel-body{
    flex: 1;
    overflow-y: auto;
}

.info-panel-section{
    display: none;
}

.info-panel-section-title{
    text-transform: uppercase;
    font-weight: bold;
    background-color: var(--bluegrey1);
    padding-right: 25px;
    padding-left: 40px;
    padding-bottom: 10px;
    padding-top: 10px;
}

.info-panel-section-table{
    border-spacing: 0px;
    width: 100%;
}

.info-panel-section-table tr td{
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 40px;
}

/* Only applicable for tables with two columns */
.info-panel-section-table tr td:nth-last-child(2):nth-child(1){
    padding-right: 10px;
    width: 50%;
}
.info-panel-section-table tr td:nth-child(2){
    padding-left: 10px;
}

.info-tab-link{
    cursor: pointer;
}
.info-tab-link td{
    border-bottom: 1px solid var( --bluegrey2);
}

.info-tab-link:hover{
    color: var(--off-white);
    background-color: var(--dataset-col-reg);
}

#info-close-icon{
    fill: var(--off-white);
    height: 20px;
    width: 20px;
    cursor: pointer;
    margin-left: 8px;
}
#info-close-icon:hover{
    fill: var(--dataset-col-verylite);
}