/* 
Adobe Kuler : Garden Swimming
Dark Grey : 333
Medium Grey : 474747
Bright Green : 96CA2D
Light Green : B5E655
Bright Blue : 4BB5C1
Light Blue : 7FC6BC
Near White : EDF7F2
*/

body {
    background:#333;
    color:#EDF7F2;
    font-family: 'Open Sans', sans-serif;
	font-size:24px;
	line-height:1.5em;
    text-align:center;
}

h1 {
    position:relative;
    font-family: 'Luckiest Guy', cursive;
    font-size:5em;
	line-height:1em;
    text-shadow: 5px 5px 0 #96CA2D;
}

h1 br {
	line-height:0;
	height:0;
}

h2 {
	font-size:1.5em;
    font-weight:300;
	font-style: italic;
    text-transform:uppercase;
    color:#B5E655;
}

p {margin:0 0 1em 0;}
br {margin:0 0 .25em 0;}

.title-screen h2 {
	margin:0 0 1em 0;
}

#textManic {
    -webkit-animation: popIn .25s ease;animation: popIn .25s ease;
}

#textMoney {
    -webkit-animation: popIn .25s ease .15s;animation: popIn .25s ease .15s;
}

a {
    color:#EDF7F2;
}

#options,
#wrongLinks {
	padding:0;text-align:center;
}

#options li,
#wrongLinks li {
	padding:1%;
    overflow:hidden;
    list-style-type:none;
    text-align:center;
}

.bu {
	display:block;
	border-radius:10px;
	text-align:center;
	text-decoration:none;
	color:#fff;
	cursor:pointer;
	-webkit-box-shadow: 5px 5px 10px 0 rgba(0,0,0,.3);
			box-shadow: 5px 5px 10px 0 rgba(0,0,0,.3);
}
/*
.bu:hover {
    opacity:.75;
}
*/
.green {
	background: #b5e655; /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2I1ZTY1NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5NmNhMmQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #b5e655 0%, #96ca2d 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b5e655), color-stop(100%,#96ca2d)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #b5e655 0%,#96ca2d 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #b5e655 0%,#96ca2d 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #b5e655 0%,#96ca2d 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #b5e655 0%,#96ca2d 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5e655', endColorstr='#96ca2d',GradientType=0 ); /* IE6-8 */
    
	text-shadow: 0 -1px 0 #5F7F1C;
    
}

.blue {    
    background: #4BB5C1; /* Old browsers */
	background: -moz-linear-gradient(top,  #7fc6bc 0%, #4bb5c1 47%, #26afbf 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7fc6bc), color-stop(47%,#4bb5c1), color-stop(100%,#26afbf)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #7fc6bc 0%,#4bb5c1 47%,#26afbf 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #7fc6bc 0%,#4bb5c1 47%,#26afbf 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #7fc6bc 0%,#4bb5c1 47%,#26afbf 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #7fc6bc 0%,#4bb5c1 47%,#26afbf 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7fc6bc', endColorstr='#26afbf',GradientType=0 ); /* IE6-9 */
	
	text-shadow: 2px 2px 0 #2198A5;
}

#options a,
#wrongLinks a {
    width:96.5%;
    padding:1.5%;
    
}
/*
#options a:hover,
#wrongLinks a:hover {
    opacity:.5;
}
a:hover{
	opacity:.5;
}
*/


a:focus,
a:active{
	opacity:1;
}

.cta {
    width:100%;
    max-width:280px;
    margin:5px auto;
    padding:.75em 2em;
    text-transform:uppercase;
    font-weight:700;
	line-height:1em;
}



.w {
	width:94%;
	max-width:768px;
	margin:0 auto;
	padding:2% 3% 5% 3%;
}

.title-screen{padding-top:10%;}

#tracking {
	height:125px;
	margin:0 auto 1em auto;
    padding:0;
    overflow:hidden;
    color:#777;
	position:relative;
}

#header {overflow:hidden;padding:1% 0 0 0;}

#header h1 {
	font-size:1.9em;
	color:#fff;
	text-align:center;
	text-shadow: 3px 3px 0 #96CA2D;
}

#header h2 {
	display:none;
}

#timer {
	position:absolute;
	top:0px;
	left:320px;
	font-family: 'Luckiest Guy', cursive;
    font-size:2em;
    height:55px;
    display:block;
    width:90px;
	padding:24px 7px;
	border:8px solid #96CA2D;
    text-align:center;
    font-weight:700;
	line-height:1.5em;
	background:#fff;
	color:#333;
	-webkit-border-radius:60px;
    		border-radius:60px;
	-webkit-box-shadow: 5px 5px 10px 0 rgba(0,0,0,.3);
			box-shadow: 5px 5px 10px 0 rgba(0,0,0,.3);
	z-index:1000;
}
#user-tally {
	position:absolute;
	top:0px;
	left:0;
	width:100%;
	font-size:1.5em;
	color:#fff;
	font-weight:bold;
	z-index:900;
}

#user-tally li,
#options,
#wrongLinks {
	background:#474747;
	border:8px solid #5f5f5f;
	-webkit-border-radius:10px;
    		border-radius:10px;
	-webkit-box-shadow:inset 5px 5px 10px 0 rgba(0,0,0,.3);
			box-shadow:inset 5px 5px 10px 0 rgba(0,0,0,.3);
}

#results {
	background:#fff;
	color:#333;
	-webkit-border-radius:10px;
    		border-radius:10px;
}

#results p {
	margin-bottom:.75em;
}

#user-tally li {
	width:40%;
	line-height:56px;
	margin-top: 20px;
	padding: 0 20px;
	list-style:none;
}

#options,
#results,
#wrongLinks {
	padding:3%;
}
#wrongLinks {margin-bottom:50px;}

#results {
	margin-bottom: 20px;
}

#tally-correct {
	float:right;
}

#tally-correct, #tally-wrong {
    min-width:75px;
}

#tally-wrong {
    float:left;
	text-align:left;
}

#tally-correct {
	text-align:right;
}

.tally-label {
    text-transform:uppercase;
    font-size:.55em;
	font-weight:normal;
    vertical-align: 3px;
    color:#777;
}

#question {margin-bottom:1.25em;font-size:1.25em;font-weight:bold;color:#fff;line-height:1.5em;}

#response {
    color:#333;
    position: relative;
	background: #fff;
    padding:5%;
    margin:0 0 30px 0;
    font-size:1.25em;
    font-weight:700;
    -webkit-border-radius: 25px;
            border-radius: 25px;
	-webkit-box-shadow: 5px 5px 10px 0 rgba(0,0,0,.3);
			box-shadow: 5px 5px 10px 0 rgba(0,0,0,.3);
}

#response:after {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #fff;
	border-width: 20px;
	margin-left: -20px;
}

h2#rankTitle {
    font-family: 'Luckiest Guy', cursive;
    font-size:2.75em;
	line-height:1em;
    text-shadow: 5px 5px 0 #333;
}

#fb-root.fb_reset {
	float:left;
	font-family:inherit;
	font-size:inherit;
	cursor:pointer;
	
	padding: 5px 10px;
	margin: 10px auto;
	font: bold .75em Arial, Helvetica, sans-serif;
	text-decoration:none;
	text-transform:uppercase;
	
	display:inline-block;
	overflow:hidden;
	
	color:#fff;
	border:1px solid #3f68ab;
	
	
	/* -- Round Corners -- */
	-webkit-border-radius: 5px;
    border-radius: 5px;
	
	/* -- Text Shadow -- */
	text-shadow: 0px -1px 0px #333;
    filter: dropshadow(color=#333333, offx=0, offy=-1);
	
	/* -- Drop Shadow -- */
	-webkit-box-shadow:0px 1px 3px rgba(0, 0, 0, 0.3), inset 0px 1px 0px rgba(173, 205, 243, 1);
	box-shadow:0px 1px 3px rgba(0, 0, 0, 0.3), inset 0px 1px 0px rgba(173, 205, 243, 1);
	
	/* -- Background Gradient -- */
	background: #4f7bc2; /* Old browsers */
	background: -moz-linear-gradient(top,  #4f7bc2 0%, #3f5da6 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4f7bc2), color-stop(100%,#3f5da6)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #4f7bc2 0%,#3f5da6 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #4f7bc2 0%,#3f5da6 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #4f7bc2 0%,#3f5da6 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #4f7bc2 0%,#3f5da6 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f7bc2', endColorstr='#3f5da6',GradientType=0 ); /* IE6-8 */
	
	/* -- Animation -- */
	-webkit-animation: popIn .25s ease;
	animation: buAppear .25s ease;

}

.buFacebook-icon-f {float:left;width:30px;height:30px;background:url("../images/icon_facebook-f.png") 0 0 no-repeat;background-size:100%;border-right:1px solid #314d92;text-indent:-9999px;}
.buFacebook-text {float:left;height:30px;line-height:30px;padding:0 0 0 10px;border-left:1px solid #5c81c2;}

#fb-root.fb_reset:hover {
	/* -- Drop Shadow -- */
	-webkit-box-shadow:0px 1px 3px rgba(0, 0, 0, 0.3), inset 0px 1px 0px rgba(181, 210, 244, 1);
	box-shadow:0px 1px 3px rgba(0, 0, 0, 0.3), inset 0px 1px 0px rgba(181, 210, 244, 1);
	
	/* -- Background Gradient -- */
	background: #5685c6; /* Old browsers */
	background: -moz-linear-gradient(top,  #5685c6 0%, #4566af 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5685c6), color-stop(100%,#4566af)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #5685c6 0%,#4566af 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #5685c6 0%,#4566af 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #5685c6 0%,#4566af 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #5685c6 0%,#4566af 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5685c6', endColorstr='#4566af',GradientType=0 ); /* IE6-9 */
	
}

.buContainer {
	overflow:hidden;
	padding:2%;
}

#play-again {
	float:left;
	margin:0 0 0 20px;
	
	/* -- Animation -- */
	-webkit-animation: popIn .25s ease;
	animation: popIn .25s ease;
}