@font-face {
    font-family: GeogrotesqueCondRegular;
    src: url(../fonts/GeogrotesqueCondRegularRegular.otf);
}
@font-face {
    font-family: GeogrotesqueCondSemiBold;
    src: url(../fonts/GeogrotesqueCondSemiBoldRegular.otf);
}

html,
body {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	}

#map {
	display:inline-block;
	width:100%;
	margin:0;
	padding:0;
	}

svg {
	display:block;
	width:100%;
	font-family:'GeogrotesqueCondRegular',sans-serif;
	font-size:16px;
	letter-spacing:0.025em;
	margin:0;
	padding:0;
	/*border:1px dotted #eee;*/
	shape-rendering:geometricPrecision;
	}

#c {
	position:absolute;
	pointer-events:none;
	}

.title {
	fill:#010e17;
	stroke:#010e17;
	stroke-width:0;
	font-size:36px;
	cursor:default;
	}

.outline {
	}
.states {
	fill:#099aff;
	fill-opacity:1;
	stroke:white;
	stroke-width:2;
	stroke-linejoin:round;
	}
.states.inactive {
	fill-opacity:0.75;
	}
.states.IL,
.states.inactive.IL {
	fill:#082336;
	fill-opacity:1;
	}

.labels,
.labelCap {
	fill:white;
	text-anchor:middle;
	cursor:default;
	}
.labels.IL {
	font-family:'GeogrotesqueCondSemiBold',sans-serif;
	font-size:24px;
	}
.labelCap {
	font-size:15px;
	}

.yearLabel {
	fill:#082336;
	font-family:'GeogrotesqueCondSemiBold',sans-serif;
	font-size:75px;
	cursor:default;
	}

.sourceRect {
	fill:#082336;
	}

.source {
	fill:white;
	cursor:default;
	}

.btnG {
	}
.btnRect {
	/*fill:#b9bbbd;*/
	fill:#082336;
    -webkit-transition: fill 0.3s;
    -moz-transition: fill 0.3s;
    -o-transition: fill 0.3s;
    transition: fill 0.3s;
	cursor:pointer;
	}
.btnRect:hover {
	fill:#099aff;
	}
.btnRect.play {
	fill:#099aff;
	}

.btnPath {
	fill:white;
	pointer-events:none;
	}

.chiDot {
	fill:#099aff;
	}