body{
    font-family: 'Lato', sans-serif;
    margin:auto;
    text-align: center;
}

h1{
    margin:1em;
    color:#1f77b4;
}

h2 {
    margin:1em;
    color:#1f77b4;
}

hr{
    border-top: 2px solid #1f77b4;
    margin-top: 4em;
    margin-bottom: 4em;
}

p {
    margin-left: 12em;
    margin-right: 12em;
    font-size: 18px;
    text-align: justify;
}

span{
    font-weight: bold;
    color:#ff7f0e;
}

.chart-container {
    width: 800px;
    margin:auto;
}

#horizontal-bar{
    width: 60%;
}

#pie{
    width: 70%;
}

#scatterplot{
    width: 100%;
}

.labels{
    font-size: 12px;
    font-family: 'Lato', sans-serif;
    
}

.x-label{
    font-size: 12px;
    font-family: 'Lato', sans-serif;
}

.y-label{
    font-size: 12px;
    font-family: 'Lato', sans-serif;
    
}

.xaxis text{
    font-size: 13px;
    font-family: 'Lato', sans-serif;
}

.yaxis text{
    font-size: 13px;
    font-family: 'Lato', sans-serif;
    
}

.pie-label{
    font-family: 'Lato', sans-serif;
}