body
{
margin: 0;
padding: 0;
font-family: 'Roboto Condensed', sans-serif;
font-size: 12px;
color: #221E1D;
overflow-y: scroll;
}

a:link, a:visited, a:hover, a:active
{
color: #221E1D;
text-decoration: underline;
}

#container
{
width: 95vw;
margin: 1vw auto 0 auto;
position: relative;
}

#bars, #map, #gemeinden, #footer
{
width: 100%;
}

#gemeinden
{
margin-top: 2vw;
}

#footer
{
margin-top: 2vw;
line-height: 1.5em;
}

.gemeinden
{
margin: 0.2em;
padding: 0.2em 0.5em;
cursor: pointer;
color: #ffffff;
border-radius: 2px;
display: inline-block;
font-size: 11px;
}

.units
{
stroke: #cccccc;
fill: none;
}

.hovered
{
fill: none;
stroke: #213631;
stroke-width: 3px;
}

.border
{
stroke: none;
fill-opacity: 0.2;
}

.content
{
stroke: none;
}

.numbers
{
fill: #213631;
stroke: none;
}

.selection
{
fill: #a9a9a9;
}


@media screen and (min-width: 800px)
{
#map
{
min-height: 550px;
}

.numbers, #footer
{
font-size: 11px;
}

#bars
{
width: 30%;
position: absolute;
top: 0;
left: 0;
}

#map
{
width: 70%;
margin-left: 30%;
}
}

@media screen and (min-width: 1200px)
{
.numbers, #footer
{
font-size: 12px;
}
}