/***************************************************************************************************

	http://meyerweb.com/eric/tools/css/reset/ 
	v2.0 | 20110126
	License: none (public domain)

***************************************************************************************************/

	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption, footer, header, hgroup,  menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
	body {line-height:1;}
	ol, ul {list-style:none;}
	blockquote, q {quotes:none;}
	blockquote:before, blockquote:after, q:before, q:after {content:'';content:none;}
	table {border-collapse:collapse;border-spacing:0;}
	strong {font-weight:normal;}
	pre {white-space:normal;}

/* http://css-tricks.com/perfect-full-page-background-image/ */

img.bg {
	/* Set rules to fill background */
	min-height: 100%;
	min-width: 1024px;
	
	/* Set up proportionate scaling */
	width: 100%;
	height: auto;
	
	/* Set up positioning */
	position: fixed;
	top: 0;
	left: 0;
}

@media screen and (max-width: 1024px) { /* Specific to this particular image */
	img.bg {
		left: 50%;
		margin-left: -512px;   /* 50% */
	}
}

/***************************************************************************************************

	Global

***************************************************************************************************/

	body {
		/*background:url(img/background_2000x1300.jpg) no-repeat 50% 0 #8ac6ef;*/
		background-color:#8ac6ef;
		color:#222;
		font:12px/1 Arial, Helvetica, sans-serif;
		height:100%;
	}

	h1, h2, h3, h4, h5, h6 {font-weight:normal;}
	.cf:after, .clear-fix:after {clear:both;content:".";display:block;height:0;visibility:hidden;}
	.ie6 .cf, .ie6 .clear-fix {height:1%;}
	.ie7 .cf, .ie7 .clear-fix {display:inline-block;}
	.fl {float:left;}
	.fr {float:right;}
	.dev {border:1px solid #f00;}
	pre.dev {white-space:pre;}

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

	a.fb-button {
		color: #fff;
		display: inline-block;
		text-decoration: none;
	}

	.fb-button {
		background: #5F78AB;
		background-image: url('img/fb_logos.png');
		background-repeat: no-repeat;
		background-position: -1px -81px;
		border-top: 1px solid #29447E;
		border-right: 1px solid #29447E;
		border-bottom: 1px solid #1A356E;
		border-left: 1px solid #29447E;
		-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8A9CC2;
		-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8a9cc2;
		box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8A9CC2;
		cursor: pointer;
		font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
		font-size: 13px;
		font-weight: bold;
		height: 23px;
		line-height: 23px;
		padding: 0 5px 0 30px;
		text-align: left;
	}

	#overlay {
		background-color:#333;
		cursor:default;
		display:none;
		height:100%;
		left:0;
		opacity:0.5;
		position:absolute;
		top:0;
		width:100%;
		z-index:1;
	}

	.ie #overlay {
		filter:alpha(opacity = 50);
	}


	/*************************************************

		Forms

	*************************************************/

	form input.text, 
	form button {
		border:1px solid #888;
		font:bold 13px/26px Arial, Helvetica, sans-serif;
		overflow:hidden;
	}

	form input.text {		
		color:#2b4d90;
		font-weight:normal;
		font-size:12px;
		height:26px;
		margin:0;
		padding:0 8px;
		width:200px;
	}

	form input.text:focus {
		/*outline:2px solid #ffd10a;*/
	}

	form button {
		background: #fefefe;
		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlZmVmZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlOWU5ZTkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
		background: -moz-linear-gradient(top, #fefefe 0%, #e9e9e9 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefefe), color-stop(100%,#e9e9e9));
		background: -webkit-linear-gradient(top, #fefefe 0%,#e9e9e9 100%);
		background: -o-linear-gradient(top, #fefefe 0%,#e9e9e9 100%);
		background: -ms-linear-gradient(top, #fefefe 0%,#e9e9e9 100%);
		background: linear-gradient(to bottom, #fefefe 0%,#e9e9e9 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#e9e9e9',GradientType=0 );
		background-color:#e9e9e9;
		cursor:pointer;
		font-size:11px;
		height:28px;
		margin:0;
		padding-left:12px;
		padding-right:10px;
		text-transform:uppercase;
	}

	.ie6 form button, 
	.ie7 form button {
		padding-left:5px;
		padding-right:3px;
	}

	form button span {
		background:url(img/arrow.png) 100% 7px no-repeat;
		display:inline-block;
		padding-right:14px;
	}



/***************************************************************************************************

	Main

***************************************************************************************************/

	#container-wrapper {
		left:50%;
		margin:-271px 0 0 -380px;
		position:absolute;
		top:50%;
	}

	#container {
		background:url(img/to_window.png) no-repeat;
		height:543px;
		position: relative;
		width:760px;
	}

	#container a {
		text-decoration:none;
	}

	h3,
	#container h1,
	#container h2,
	#container p {
		line-height:16px;
	}

	#container strong {
		font-weight:bold;
	}

	ul#nav, a#fb-login, #content, #sign-up, #login-box, #footer {
		position:absolute;
	}


	/*************************************************

		Nav

	*************************************************/

	ul#nav {
		height:50px;
		left:100px;
		top:110px;
	}

	ul#nav li {
		float:left;
	}

	ul#nav li a {
		color:#225a7a;
		display:block;
		font-family:'BDCartoonShout', Arial, Helvetica, sans-serif;
		font-size:16px;
		line-height:50px;
		padding:0 22px;
		text-transform:lowercase;
	}

	ul#nav li a:hover {
		color:#e91515;
	}


	/*************************************************

		Content

	*************************************************/

	#content {
		width:314px;
		top:190px;
		left:80px;
	}


	/*************************************************

		Facebook login

	*************************************************/

	a#fb-login {
		right:60px;
		top:175px;
	}


	/*************************************************

		Sign up form

	*************************************************/

	#sign-up {
		left:80px;
		top:388px;
	}

	#sign-up span.or {
		color:#495f8c;
		font-family:'BDCartoonShout', Arial, Helvetica, sans-serif;
		font-size:10px;
		padding-left:10px;
	}

	#sign-up form {
		display:block;
		padding-top:10px;
	}

	#sign-up form input.text, 
	#sign-up form button {
		display:block;
		float:left;
	}

	#sign-up form input.text {
		font-weight:bold;
		font-size:13px;
	}

	#sign-up form button {
		margin:0 0 0 3px;
	}

	#sign-up div.info {
		color:#777;
		font-size:10px;
		line-height:11px;
		padding-top:4px;
		width:270px;
	}


	/*************************************************

		Footer

	*************************************************/

	#footer {
		bottom:25px;
		right:20px;
		width:360px;
	}

	#footer a {
		color:#222;
	}


	/*************************************************

		Login box

	*************************************************/

	#login-box {
		background-color:#d4e0f2;
		border:3px solid #000;
		visibility:hidden;
		left:50%;
		margin:-141px 0 0 -174px;
		overflow:hidden;
		padding:12px;
		top:50%;
		width:324px;
		z-index:3;
	}

	#login-box div#login-box-close {
		background:url(img/close.gif);
		cursor:pointer;
		display:inline-block;
		height:16px;
		position:absolute;
		right:12px;
		top:20px;
		width:16px;
	}

	#login-box h3 {
		color:#222;
		font-family:'BDCartoonShout', Arial, Helvetica, sans-serif;
		font-size:18px;
		padding:12px 0 18px 0;
		text-align:center;
	}

	#login-box form {
		background-color:#f2f5fb;
		border:1px solid #b7c2d1;
		padding:18px;
		text-align:center;
	}

	#login-box form label {
		color:#48494b;
		display:block;
		font-family:'BDCartoonShout', Arial, Helvetica, sans-serif;
		font-size:12px;
		padding-bottom:6px;
	}

	#login-box form label.standard {
		font-family:Arial, Helvetica, sans-serif;
		display:inline;
	}

	#login-box p {
		margin-bottom:14px;
	}

	#login-box p.retrieve-login {
		margin-bottom:6px;
	}

	#login-box p.remember-email {
		margin-top:-12px;
	}

	#login-box p.retrieve-login a {
		color:#2b4d90
	}