@font-face {
	font-family: 'bsn-regular';
	src: url('fonts/bsn-regular.eot');
	src: local('☺'), 
		url('fonts/bsn-regular.woff') format('woff'), 
		url('fonts/bsn-regular.ttf') format('truetype'), 
		url('fonts/bsn-regular.svg') format('svg');
}
@font-face {
	font-family: 'bsn-bold';
	src: url('fonts/bsn-bold.eot');
	src: local('☺'), 
		url('fonts/bsn-bold.woff') format('woff'), 
		url('fonts/bsn-bold.ttf') format('truetype'), 
		url('fonts/bsn-bold.svg') format('svg');
}
@font-face {
	font-family: 'bsn-condensed';
	src: url('fonts/bsn-condensed.eot');
	src: local('☺'), 
		url('fonts/bsn-condensed.woff') format('woff'), 
		url('fonts/bsn-condensed.ttf') format('truetype'), 
		url('fonts/bsn-condensed.svg') format('svg');
}
.subtletext
{
font-size: 10px;
line-height: 17px;
font-family: bsn-regular, arial, hevetica, sans-serif;
text-transform: none;
text-decoration: none;
color: #333333;
letter-spacing: 00em;
background-color: rgba(255,255,255,1);
padding: 5px 10px 4px 6px;
}
circle {
	mix-blend-mode: screen;
	}
hr 
{
color: #333333;
background-color: #333333;
height: 1px;
border: 0;
}
body {
	background-color:white;
	height:100%;
	width:100%;
	margin: 0; 
	padding: 0;
	overflow: hidden;
}
.bigtitle
{
font-family: bsn-regular, arial, hevetica, sans-serif;
text-transform: none;
text-decoration: none;
text-anchor:middle;
fill: white;
letter-spacing: 00em;
font-size:80px;
cursor:default;
    -moz-font-feature-settings: 'onum';
    -ms-font-feature-settings: 'onum';
    -webkit-font-feature-settings: 'onum';
    font-feature-settings: 'onum';
}
.legendtitle
{
font-family: bsn-regular, arial, hevetica, sans-serif;
font-weight:bold;
text-decoration: none;
text-anchor:start;
fill: white;
letter-spacing: 00em;
font-size:15px;
cursor:default;
    -moz-font-feature-settings: 'onum';
    -ms-font-feature-settings: 'onum';
    -webkit-font-feature-settings: 'onum';
    font-feature-settings: 'onum';
}
.legend
{
font-family: bsn-regular, arial, hevetica, sans-serif;
text-transform: none;
text-decoration: none;
text-anchor:start;
fill: white;
letter-spacing: 00em;
font-size:13.3px;
cursor:default;
    -moz-font-feature-settings: 'onum';
    -ms-font-feature-settings: 'onum';
    -webkit-font-feature-settings: 'onum';
    font-feature-settings: 'onum';
}
.note
{
font-family: bsn-regular, arial, hevetica, sans-serif;
text-transform: none;
text-decoration: none;
text-anchor:end;
fill: white;
letter-spacing: 00em;
font-size:17px;
cursor:default;
    -moz-font-feature-settings: 'onum';
    -ms-font-feature-settings: 'onum';
    -webkit-font-feature-settings: 'onum';
    font-feature-settings: 'onum';
}
.yellownote
{
font-family: bsn-condensed, arial, hevetica, sans-serif;
text-transform: none;
text-decoration: none;
text-anchor:middle;
fill: hsl(60,100%,50%);
letter-spacing: 00em;
font-size:16px;
cursor:default;
}
.stateabbv
{
font-family: bsn-bold, arial, hevetica, sans-serif;
text-transform: none;
text-decoration: none;
text-anchor:start;
fill: hsl(315,90%,40%);
letter-spacing: 00em;
font-size:12px;
cursor:default;
}
.statenum
{
font-family: bsn-regular, arial, hevetica, sans-serif;
text-transform: none;
text-decoration: none;
text-anchor:start;
fill: hsl(315,90%,40%);
letter-spacing: 00em;
font-size:16px;
cursor:default;
    -moz-font-feature-settings: 'onum';
    -ms-font-feature-settings: 'onum';
    -webkit-font-feature-settings: 'onum';
    font-feature-settings: 'onum';
}
.svg-container {
    background-image: url("slavery_north_bg.jpg");
	background-size:contain;
	background-repeat:no-repeat;
	background-attachment:scroll;
	background-color:white;
    display: inline-block;
    position: relative;
    vertical-align: top;
    overflow: hidden;
}
.svg-content-responsive {
    display: inline-block;
    position: absolute;
    top: 0px;
    left: 0;
}