@font-face {
  font-family:'Berthold-Baskerville';
  src: url('../fonts/berthold-baskerville-regular.ttf');
}

html,
body {
	width:100%;
	height:100%;
	fill:#fff;
	color:#fff;
	font-size:22px;
	font-family:'Berthold-Baskerville',serif;
	margin:0;
	padding:0;
	}

#target {
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	}

#vis {
	display:block;
	background:#292929;
	background:url('../imgs/ChalkBG_615x1108.jpg') 0 0;
	width:100%;
	margin:0;
	padding:0;
	shape-rendering:geometricPrecision;
	}

.over {
	z-index:99;
	position:absolute;
	background:rgba(17,17,17,0.8);
	}
.over .mid {
	color:#fff;
	font-size:18px;
	line-height:140%;
	margin-top:35%;
	padding:60px 60px 30px;
	}
.over .btn {
	height:100px;
	margin:36px auto;
	padding:15px;
	cursor:pointer;
	}
.over .btn:hover {
	opacity:0.9;
	}
.over .btn:active {
	opacity:0.75;
	}
#start .mid {
	padding:60px 60px 0;
	}
#start .btn.start {
	background:url('../imgs/Start.svg') no-repeat 50% 0;
	}
#end {
	opacity:0;
	visibility:hidden;
	}
#end .btn.tweet {
	background:url('../imgs/Tweet.svg?ver=0') no-repeat 50% 0;
	margin-bottom:0;
	}
#end .btn.fb {
	background:url('../imgs/FB.svg') no-repeat 50% 0;
	margin-top:0;
	}

/*.title {
	fill:#111;
	cursor:default;
	}
.title.header {
	font-size:45px;
	}
.title.sub {
	fill:#111;
	font-size:18px;
	}

.columnLabels {
	font-size:16px;
	font-weight:bold;
	text-anchor:start;
	text-transform:uppercase;
	cursor:default;
	}*/

/*.dividerG line {
	fill:none;
	stroke:#ddd;
	stroke-width:1.5;
	shape-rendering:crispEdges;
	}*/
.dividerG text {
	font-size:28px;
	font-variant:small-caps;
	text-anchor:end;
	}

.reset {
	fill:#111;
	stroke:#111;
	stroke-width:2;
	shape-rendering:crispEdges;
	text-rendering:optimizeLegibility;
	cursor:pointer;
	}
.reset:hover rect {
	/*fill:blue;
	stroke:blue;*/
	}
.reset text {
	font-weight:bold;
	fill:#eee;
	stroke:none;
	letter-spacing:0.025em;
	text-anchor:middle;
	}

.timer {
	text-anchor:start;
	}
.sec {
	font-style:italic;
	text-anchor:start;
	}

.pairs text {
	text-anchor:start;
	cursor:default;
	}
.pairs text.dupe {
	fill:#eb3b33;
	}
.pairs .label {
	font-weight:bold;
	}

.socketHolder {
	pointer-events:none;
	}

.socketHolder .socket {
	/*fill:none;
	stroke:#aaa;
	stroke-width:1;
	stroke-dasharray:6,3;*/
	}
.socketHolder .socket {
	/*stroke:#aaa;*/
	}
.socketHolder .socketGroup.highlight .socket {
	/*fill:LightGoldenRodYellow;
	stroke:purple;*/
	}

.girlGroup {
	cursor:cell;
	}
.girlGroup.win {
	pointer-events:none;
	cursor:default;
	}
.girlGroup.correct.win.selectable .girl,
.girlGroup.correct.win.selectable:hover .girl,
.girlGroup.correct.win.selectable:focus .girl {
	fill:#95a24a;
	}
.girlGroup.nonselectable {
	pointer-events:none;
	cursor:pointer;
	}
.girlGroup.nonselectable.correct .girl {
	}
.girlGroup.nonselectable.correct .label {
	}

.girlGroup .girlCircle {
	fill:#292929;
	}
.girlGroup .girl {
	fill:#fff;
	shape-rendering:geometricPrecision;
	}
.girlGroup.L .girl {
	}
.girlGroup.selectable:hover .girl,
.girlGroup.selectable:focus .girl {
	fill:lightblue;
	}
.girlGroup.nonselectable .girl {
	/*fill:#ccc;*/
	}
.girlGroup.incorrect .girl {
	fill:#eb3b33;
	}
.girlGroup.correct .girl {
	fill:#95a24a;
	}

/*.girlGroup .label {
	fill:#111;
	font-family:sans-serif;
	font-weight:bold;
	text-anchor:middle;
	pointer-events:none;
	cursor:pointer;
	}
.girlGroup.correct.win.selectable .label,
.girlGroup.correct.win.selectable:hover .label,
.girlGroup.correct.win.selectable:focus .label {
	fill:#95a24a;
	}
.girlGroup.correct .label {
	fill:#95a24a;
	}
.girlGroup.L .label {
	fill:#111;
	}
.girlGroup.incorrect .label {
	fill:#eb3b33;
	}
.girlGroup.correct .label {
	fill:#95a24a;
	}

.girlGroup.selectable:hover .label,
.girlGroup.selectable:focus .label,
.girlGroup.selectable.L:hover .label,
.girlGroup.selectable.L:focus .label,
.girlGroup.selectable.L.correct:hover .label,
.girlGroup.selectable.L.correct:focus .label {
	fill:lightblue;
	}*/