@font-face {
    font-family: 'KenyanCoffeeRegular';
    src: url('../fonts/kenyan-coffee-webfont.eot');
    src: url('../fonts/kenyan-coffee-webfont-.eot#iefix') format('embedded-opentype'),
         url('../fonts/kenyan-coffee-webfont.woff') format('woff'),
         url('../fonts/kenyan-coffee-webfont.ttf') format('truetype'),
         url('../fonts/kenyan-coffee-webfont.svg#KenyanCoffeeRegular') format('svg');
    font-weight: normal;
	font-style: normal; }

h1, h2, h3, h4, h5, h6 { 
	font-family: "KenyanCoffeeRegular", Impact, Arial Bold, sans-serif;
	font-weight: normal; }

.clear { clear:both; }
	
.overlay { 
	width: 100%;
	height: 100%;
	display: none;
	position: fixed;
	z-index: 5; }

.overlay.dark { 
	background: rgba(0,0,0,.5); }

/* Header */

#header { 
	height: 550px;
	position: relative;
	background-color: #0f324e;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#1c5379), to(#031224));
	background-image: -webkit-linear-gradient(top, #1c5379, #031224);
	background-image: -moz-linear-gradient(top, #1c5379, #031224);
	background-image: -o-linear-gradient(top, #1c5379, #031224);
	background-image: -ms-linear-gradient(top, #1c5379, #031224);
	background-image: linear-gradient(top, #1c5379, #031224);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#1c5379', EndColorStr='#031224'); }

#header > div { 
	height: 550px;
	position: relative; }

#header #links ul { 
	padding: 5px 20px 0 0;
	float: right; }

#header #links ul li { 
	margin-left: 25px;
	float: left;
	position: relative;
	z-index: 2; }

#header #links ul li:after { 
	width: 15px;
	height: 13px;
	content: "";
	display: block;
	position: absolute;
	top: 7px;
	right: -21px;
	background: url("../img/sprite.png") no-repeat -945px -152px; }

#header #links ul li:last-child:after { 
	background: none; }

#header #links ul li a { 
	font-size: 13px;
	font-weight: bold;
	color: #a9c0cf;
	text-decoration: none; }

#header #links ul li a:hover { 
	color: #fff; }

#header #menu { 
	width: 966px;
	height: 111px;
	position: relative;
	top: -12px;
	left: -8px;
	background: url("../img/sprite.png") no-repeat 0px 0px; }

#header #menu div { 
	width: 267px;
	height: 100px;
	float: left;
	position: relative;
	top: 11px;
	left: 0;
	z-index: 7;
	background: url("../img/sprite.png") no-repeat 0px -290px; }

#header #menu div h1 { 
	width: 152px;
	height: 57px;
	overflow: hidden;
	position: absolute;
	top: 19px;
	left: 30px; }

#header #menu div h1 a { 
	width: 152px;
	height: 57px;
	display: block;
	background: url("../img/gambino.png") no-repeat; }

#header #menu div h1 a span { 
	padding: 57px 0 0 0;
	display: block; }

#header #menu div span.open { 
	width: 43px;
	height: 42px;
	display: block;
	cursor: pointer;
	text-indent: -9999px;
	position: absolute;
	top: 26px;
	right: 30px;
	background: url("../img/sprite.png") no-repeat -595px -290px; }

#header #menu div span.open:hover { 
	background-position: -640px -290px; }

#header #menu ul.switcher { 
	padding: 20px 0;
	width: 200px;
	display: none;
	position: absolute;
	top: 94px;
	left: 28px;
	z-index: 6;
	border: 3px solid #dfdfdf;
	background-color: #c7c7c7;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#919191), to(#fefefe));
	background-image: -webkit-linear-gradient(top, #919191, #fefefe);
	background-image: -moz-linear-gradient(top, #919191, #fefefe);
	background-image: -o-linear-gradient(top, #919191, #fefefe);
	background-image: -ms-linear-gradient(top, #919191, #fefefe);
	background-image: linear-gradient(top, #919191, #fefefe);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#919191', EndColorStr='#fefefe');
	border-radius: 0px 0px 30px 30px;
	box-shadow: 0px 1px 10px 1px rgba(0,0,0,.8); }

#header #menu ul.switcher li.yobro { 
	margin: 0 0 20px 14px;
	width: 173px;
	height: 57px;
	overflow: hidden; }

#header #menu ul.switcher li.yobro a { 
	width: 173px;
	height: 57px;
	display: block;
	background: url("../img/yobro.png") no-repeat; }

#header #menu ul.switcher li.yobro a:hover { 
	opacity: .9; }

#header #menu ul.switcher li.yobro a span { 
	padding: 57px 0 0 0;
	display: block; }

#header #menu ul.switcher li.fortune { 
	margin-left: 14px;
	width: 171px;
	height: 124px;
	overflow: hidden; }

#header #menu ul.switcher li.fortune a { 
	width: 171px;
	height: 124px;
	display: block;
	background: url("../img/fortune.png") no-repeat; }

#header #menu ul.switcher li.fortune a:hover { 
	opacity: .9; }

#header #menu ul.switcher li.fortune a span { 
	padding: 124px 0 0 0;
	display: block; }

#header #menu ul.nav { 
	padding-right: 40px;
	float: right; }

#header #menu ul.nav li:first-child { 
	background: none; }

#header #menu ul.nav li { 
	margin-left: 15px;
	padding-left: 15px;
	float: left;
	background: url("../img/seperate.png") no-repeat left center; }
	
#header #menu ul.nav li a { 
	line-height: 111px;
	font-family: "KenyanCoffeeRegular", Impact, Arial Bold, sans-serif;
	font-size: 31px;
	text-decoration: none;
	color: #e8e8e8;
	text-shadow: 1px 1px 1px #000; }

#header #menu ul.nav li a:hover { 
	color: #fff; }

#header #menu ul.nav li.facebook, #header #menu ul.nav li.twitter { 
	padding: 0;
	width: 35px;
	height: 35px;
	text-indent: -9999px;
	position: relative;
	top: 38px;
	background: #041a30;
	border-radius: 7px;
	box-shadow: 0px 1px 0px rgba(225,225,225,.2); }

#header #menu ul.nav li.facebook { 
	margin-left: 20px; }

#header #menu ul.nav li.facebook span { 
	width: 10px;
	height: 20px;
	display: block;
	position: absolute;
	top: 7px;
	left: 13px;
	background: url("../img/sprite.png") no-repeat -945px -130px; }

#header #menu ul.nav li.twitter span { 
	width: 21px;
	height: 15px;
	display: block;
	position: absolute;
	top: 10px;
	left: 7px;
	background: url("../img/sprite.png") no-repeat -945px -113px; }

#slider { 
	position: absolute;
	bottom: 0;
	left: 0; }

#slider .controls { 
	display: none; }

#slider .controls li { 
	width: 90px;
	height: 89px;
	cursor: pointer;
	text-indent: -9999px;
	top: 140px;
	position: absolute;
	background: url("../img/sprite.png") no-repeat; }

#slider .controls #back { 
	left: -90px;
	background-position: -853px -113px; }

#slider .controls #back:hover { 
	background-position: -390px -392px; }

#slider .controls #back:active { 
	background-position: -482px -392px; }

#slider .controls #next { 
	right: -90px;
	background-position: -574px -392px; }

#slider .controls #next:hover { 
	background-position: -666px -392px; }

#slider .controls #next:active { 
	background-position: -758px -392px; }

#slider .images { 
	text-align: center; }

#slider .images a { 
	width: 218px;
	height: 57px;
	cursor: pointer;
	text-indent: -9999px;
	display: block;
	position: absolute;
	bottom: 100px;
	right: 190px;
	background: url("../img/sprite.png") no-repeat -672px -224px; }

#slider .images a:hover { 
	opacity: .9; }
	
/* Page */

#page { 
	width: 963px;
	position: relative;
	top: -80px;
	left: -11px;
	background: url("../img/page.png") no-repeat center top; }

#page > .alpha {
	position: relative;
	top: 50px;
	left: 50px;
	background: url("../img/divide.png") no-repeat 78% top; }

#page > .omega { 
	position: relative;
	top: 50px;
	right: 50px; }

#page div div { 
	margin-bottom: 30px; }

#page h2, #page h3 { 
	color: #d70000; }

#page h4 { 
	margin-bottom: 5px;
	color: #12527b; }

#page p { 
	color: #0f476d; }

#page .copy p, #page .copy li { 
	font-size: 14px;
	color: #0f476d; }
	
#page .copy li { 
	margin-bottom: 10px;
	list-style: decimal; }

#page a.join { 
	width: 344px;
	height: 61px;
	display: block;
	text-indent: -9999px;
	background: url("../img/join.png") no-repeat; }

#page a.join:hover { 
	opacity: .9; }

#page #reasons li { 
	margin-bottom: 10px;
	padding: 15px 0;
	border: 2px solid #cacaca;
	background-color: #e7ecee;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#d1dade));
	background-image: -webkit-linear-gradient(top, #fefefe, #d1dade);
	background-image: -moz-linear-gradient(top, #fefefe, #d1dade);
	background-image: -o-linear-gradient(top, #fefefe, #d1dade);
	background-image: -ms-linear-gradient(top, #fefefe, #d1dade);
	background-image: linear-gradient(top, #fefefe, #d1dade);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#fefefe', EndColorStr='#d1dade');
	border-radius: 10px; }

#page #reasons li span { 
	margin: 2px 10px;
	width: 78px;
	height: 78px;
	display: block;
	float: left;
	background: url("../img/sprite.png") no-repeat; }

#page #reasons li.free span { 
	background-position: 0px -525px; }

#page #reasons li.easy span { 
	background: url("../img/easy.png") no-repeat; }

#page #reasons li.fun span { 
	background-position: -850px -392px; }

#page #reasons li h4 { 
	margin: 0 10px 10px 0;
	width: 260px;
	float: right;
	font-size: 28px;
	color: #12527b; }

#page #reasons li p { 
	margin: 0 10px 0 0;
	width: 260px;
	float: right;
	line-height: 18px;
	font-size: 13px;
	text-shadow: 1px 1px 0px #fff; }

#page #overview li span { 
	margin: 2px 10px;
	width: 128px;
	height: 131px;
	display: block;
	float: left;
	background: url("../img/sprite.png") no-repeat; }

#page #overview li.gifts span { 
	background-position: 0px -392px; }

#page #overview li.avatar span { 
	background-position: -130px -392px; }

#page #overview li.acheivements span { 
	background-position: -260px -392px; }

#page #overview li h4 { 
	margin: 0 10px 10px 0;
	padding-top: 20px;
	width: 220px;
	float: right;
	font-size: 28px;
	color: #12527b; }

#page #overview li p { 
	margin: 0 10px 0 0;
	width: 220px;
	float: right;
	line-height: 18px;
	font-size: 13px;
	color: #0053a6;
	text-shadow: 1px 1px 0px #fff; }
	
/* Banner */

#banner div { 
	margin: 0 auto;
	width: 851px;
	height: 109px;
	display: block;
	position: relative;
	background: url("../img/sprite.png") no-repeat 0px -113px; }

#banner div a { 
	width: 148px;
	height: 73px;
	display: block;
	cursor: pointer;
	text-indent: -9999px;
	position: absolute;
	top: 22px;
	right: 15px;
	background: url("../img/sprite.png") no-repeat -445px -290px; }
	
#banner div a:hover { 
	opacity: .9; }

/* Footer */

#footer > .alpha {
	position: relative;
	top: 50px;
	left: 50px; }

#footer > .omega { 
	position: relative;
	top: 50px;
	right: 50px; }

#footer #twitter span.icon { 
	width: 57px;
	height: 57px;
	display: block;
	float: left;
	background: url("../img/sprite.png") no-repeat -892px -224px; }

#footer #twitter .tweet { 
	width: 310px;
	float: right; }

#footer #twitter .tweet_time { 
	display: none; }
	
#footer #twitter .tweet_text { 
	line-height: 22px;
	font-family: "KenyanCoffeeRegular", Impact, Arial Bold, sans-serif;
	font-size: 17px;
	color: #3b5a72; }
	
#footer #twitter .tweet_text a { 
	color: #ff0000;
	text-decoration: none; }

#footer #links { 
	padding-bottom: 35px;
	position: relative; }

#footer #links span.chips { 
	width: 174px;
	height: 84px;
	position: absolute;
	bottom: 0;
	right: -30px;
	background: url("../img/sprite.png") no-repeat -269px -290px; }

#footer #links ul li { 
	width: 43%;
	float: left;
	line-height: 20px;
	position: relative; }

#footer #links ul li:before { 
	width: 15px;
	height: 13px;
	content: "";
	display: block;
	position: absolute;
	top: 5px;
	left: -21px;
	background: url("../img/sprite.png") no-repeat -945px -152px; }

#footer #links ul li a { 
	font-size: 13px;
	color: #3b5a72;
	text-decoration: none; }

#footer #links ul li a:hover { 
	text-decoration: underline; }
	
/* Contact */

#contact { 
	margin-left: -250px;
	width: 500px;
	height: 710px;
	display: none;
	position: absolute;
	top: 100px;
	left: 50%;
	z-index: 99;
	border: 3px solid #6096ac;
	background: url("../img/contact.png") no-repeat;
	border-radius: 30px; }

#contact span.close { 
	width: 77px;
	height: 76px;
	display: block;
	cursor: pointer;
	text-indent: -9999px;
	position: absolute;
	top: -35px;
	right: -35px;
	background: url("../img/close.png") no-repeat; }

#contact form { 
	margin: 0 auto;
	padding-top: 130px;
	width: 400px; }

#contact label { 
	margin-bottom: 10px;
	display: block;
	font-family: "KenyanCoffeeRegular", Impact, Arial Bold, sans-serif;
	font-size: 28px;
	color: #fff; }

#contact input[type=text] { 
	margin-bottom: 20px;
	padding: 14px 10px;
	width: 380px;
	font-size: 14px;
	color: #fefefe;
	border: 1px solid #77b5ce;
	background: #151d2c;
	border-radius: 10px; }

#contact textarea { 
	margin-bottom: 20px;
	padding: 10px;
	width: 380px;
	height: 100px;
	font-size: 14px;
	color: #fefefe;
	border: 1px solid #77b5ce;
	background: #151d2c;
	border-radius: 10px; }

#contact label span {font-size:60%;}

#contact-form #captcha {
	width:130px;
	float:left;
}

#contact-form #captcha-input {
	float: right;
    padding: 14px 10px;
    width: 235px;
}

#contact input[type=submit] { 
	margin: -10px 0 0 -6px;
	width: 204px;
	height: 76px;
	display: block;
	cursor: pointer;
	text-indent: -9999px;
	border: 0;
	background: url("../img/submit.png") no-repeat; }

#contact input[type=submit]:hover { 
	background-position: bottom center; }

#contact div {
    margin: 0 auto;
    padding-top: 130px;
    text-align: center;
    width: 400px;
}
#contact div h6 {
    color: #FFFFFF;
    font-size: 32px;
    text-shadow: 1px 1px 2px #000000;
}
#contact div p {
    color: #FEFEFE;
    font-size: 14px;
}	
#contact input.error[type="text"], #contact textarea.error {
    border: 1px solid red;
}