@CHARSET "UTF-8";

/* RESET STYLES */
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, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } /* remember to define focus styles! */ :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } 


body {
	background: #000 url("img/sitebg.gif") repeat-x left top;
	text-align: center;
	font-family: georgia;
	font-size: 70%;
	line-height: 150%;
}

a {
	color: #900015;
	text-decoration: underline;
}

a:hover {
	text-decoration: underline;
}

p {
	margin-bottom:15px;
}

h2 {
    font-size: 1.5em;
    margin: 10px 0 10px 10px;
}

h3 {
    font-size: 1.2em;
    font-weight: normal;
    margin: 10px 0;
}

h4 {
	font-size: 1.2em;
	font-weight: normal;
	color: #fff;
	padding: 20px 0 15px 0;
	text-transform: uppercase;
}


.box form.smallform ul {
	margin-bottom:15px;
}

.box form.smallform ul li {

}

.box form.smallform ul li label {
	display:inline-block;
	width: 65px;
}

#loginForm {

}

#loginForm input, #forgotPassForm input {
	width: 140px;
}

#forgotPassForm {
	display:block;
}

.hidden {
	display:none;
}

#toolset {
	width: 740px;
	padding-right: 20px;
	margin: auto;
	text-align: right;
	color: #a4a4a4;
}

#toolset a {
	color: #b1b1b1;	
	text-decoration: none;
}

#merchantsite {
	width: 760px;
	margin: auto;
	text-align: left;
	background: #4a2a26 url("img/wood_texture.jpg") repeat left top;
	margin-top: 34px;	
}

#screenshot-next, #screenshot-prev {
	margin-top:100px;
}

#screenshot-prev {
	float:left;
}

#screenshot-next {
	float:right;
}

#overlay {
	display:none;
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background-image:url(/img/facebook/overlay.png);
}

#overlay-content {
	position: absolute;
	top:50%;
	left:50%;
	width: 300px;
	height: 300px;
	margin-top:-150px;
	margin-left:-150px;
	border:10px solid white;
	background-color: white;
}

/*
 * HEADER / NAVIGATION :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
 */
	
	/* RESET STYLES */
	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, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } /* remember to define focus styles! */ :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } 
	
	
	body {
		background: #000 url("img/sitebg.gif") repeat-x left top;
		text-align: center;
		font-family: georgia;
		font-size: 70%;
		line-height: 150%;
	}
	
	a {
		color: #900015;
		text-decoration: underline;
	}
	
	a:hover {
		text-decoration: underline;
	}
	
	p {
		margin-bottom:15px;
	}
	
	h2 {
	    font-size: 1.5em;
	    margin: 10px 0 10px 10px;
	}
	
	h3 {
	    font-size: 1.2em;
	    font-weight: normal;
	    margin: 10px 0;
	}
	
	h4 {
		font-size: 1.2em;
		font-weight: normal;
		color: #fff;
		padding: 20px 0 15px 0;
		text-transform: uppercase;
	}
	
	
	.box form.smallform ul {
		margin-bottom:15px;
	}
	
	.box form.smallform ul li {
	
	}
	
	.box form.smallform ul li label {
		display:inline-block;
		width: 65px;
	}
	
	#loginForm {
	
	}
	
	#loginForm input, #forgotPassForm input {
		width: 140px;
	}
	
	#loginForm button, #forgotPassForm button {
		margin:10px 10px 0 0;
		float:right;
		overflow:hidden;
	}
	
	#forgotPassForm {
		display:block;
	}
	
	.hidden {
		display:none;
	}
	
	#toolset {
		width: 740px;
		padding-right: 20px;
		margin: auto;
		text-align: right;
		color: #a4a4a4;
	}
	
	#toolset a {
		color: #b1b1b1;	
		text-decoration: none;
	}
	
	#merchantsite {
		width: 760px;
		margin: auto;
		text-align: left;
		background: #4a2a26 url("img/wood_texture.jpg") repeat left top;
		margin-top: 34px;	
	}
	
	#screenshot-next, #screenshot-prev {
		margin-top:100px;
	}
	
	#screenshot-prev {
		float:left;
	}
	
	#screenshot-next {
		float:right;
	}
	
	#overlay {
		display:none;
		position: absolute;
		top:0;
		left:0;
		width: 100%;
		height: 100%;
		background-image:url(/img/facebook/overlay.png);
	}
	
	#overlay-content {
		position: absolute;
		top:50%;
		left:50%;
		width: 300px;
		height: 300px;
		margin-top:-150px;
		margin-left:-150px;
		border:10px solid white;
		background-color: white;
	}
	
	/*
	 * HEADER / NAVIGATION :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
	 */
		
		#header {
			height: 78px;
			overflow: hidden;
		}
		
		 	#header a.logo {
		 		float: left;
		 		width: 257px;
		 		height:78px;
		 	}
		 	
		 	#header a.logo img {
		 		width: 257px;
		 		height:78px;
		 		border: 0;
		 		display: block;
		 	}
		 	
		 	#header ul {
		 		width: 488px; /* ow: 503 */
		 		padding-left: 15px;
		 		height: 49px;
		 		background: transparent url("img/navbg.jpg") no-repeat left top;
		 		float: left;
		 	}
		 	
		 	#header ul li {
		 		margin: 7px 0 0 0;
		 		float: left;
		 		height: 41px;
		 		background: transparent url("img/tabs.png") no-repeat left top;
		 	}
		 	
		 	#header ul li a {
		 		padding: 12px 0 0 0;
		 		height: 29px;
		 		color: #b7b3a6;
		 		font-size: 1.4em;
		 		text-decoration: none;
		 		text-align: center;
		 		display: block;
		 	}
		 	
		 	#header ul li:hover , #header ul li.active a {
		 		background-position: inherit -40px;
		 	}
		 	
		 	#header #nav-home		{ width: 64px;	background-position: -221px 0px;}
			#header #nav-me			{ width: 51px;	background-position: -351px 0px; }
	        #header #nav-about		{ width: 68px;	background-position: -150px 0px; }
	        #header #nav-download	{ width: 87px;	background-position: -64px 0px; }
		 	#header #nav-messages	{ width: 84px;	background-position: -67px 0px; }
		 	#header #nav-friends 	{ width: 80px;	background-position: -67px 0px; }
		 	#header #nav-empire		{ width: 67px;	background-position: -221px 0px; }
		 	#header #nav-ranks		{ width: 61px;	background-position: -290px 0px;}
		 	#header #nav-map		{ width: 48px;	background-position: -352px 0px;}
		 	#header #nav-pedia		{ width: 63px;	background-position: -403px 0px;}
			#header #nav-settings	{ width: 80px;	background-position: -67px 0px;}
	
			 	#header #nav-home.active, #header #nav-home:hover			{ background-position: -221px -79px;}
				#header #nav-me.active, #header #nav-me:hover				{ background-position: -351px -79px; }
	            #header #nav-about.active, #header #nav-about:hover			{ background-position: -150px -79px; }
	            #header #nav-download.active, #header #nav-download:hover	{ background-position: -64px -79px; }
			 	#header #nav-messages.active, #header #nav-messages:hover	{ background-position: -67px -79px; }
			 	#header #nav-friends.active, #header #nav-friends:hover  	{ background-position: -67px -79px; }
			 	#header #nav-empire.active, #header #nav-empire:hover		{ background-position: -221px -79px; }
			 	#header #nav-ranks.active, #header #nav-ranks:hover			{ background-position: -290px -79px;}
			 	#header #nav-map.active, #header #nav-map:hover				{ background-position: -352px -79px;}
			 	#header #nav-pedia.active, #header #nav-pedia:hover			{ background-position: -403px -79px;}
		 		#header #nav-settings.active, #header #nav-settings:hover	{ background-position: -67px -79px;}
	
	/*
	 * CONTENT :::::::::::::::::::::::::::::	::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
	 */
		
		p.opener {
			text-transform: uppercase;
			font-weight: normal;
			color: #25120f;
		}
		
		#content {
			width: 738px;
			padding: 0 11px 11px 11px;
			background: transparent url("img/sitecloser.png") no-repeat left bottom;
			overflow: hidden;
		}
		
		div.content-area {
			width: 492px;
			float: left;
		}
		
		div.side-bar {
			width: 246px;
			float: left;
		}
		
		div.box {
			margin: 0px 1px 2px 1px;
			width:244px;
			float: left;
			color: #382926;
			font-size: 1.1em;
		}
	
		.box-content {
			xborder: 1px solid red;
			padding:10px;
		}
	
		div.box h3, div.box2 h3, h3.special {
			text-transform: uppercase;
			font-size: 1.0em;
			letter-spacing: 1px;
			margin-bottom:18px;
			font-weight: normal;
			color: white;
		}
	
		div.box h3 img, div.box2 h3 img, h3.special img {
			vertical-align:middle;
			margin-right: 2px;
		}
	
		.box ul, .box2 ul {
			padding:0;
			margin:0;
		}
	
		.box li, .box2 li {
			padding:0;
			margin:0;
			list-style-type:none;
		}
	
		.box li .header {
			clear: both;
			margin-bottom: 5px;
			font-weight: bold;
		}
	
		.box li .item, div.messagecontent {
			padding: 10px;
			border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			-o-border-radius: 5px;
			margin-bottom: 10px;
			clear: both;
		}
	
		.box li .item {
			padding-left: 50px;
		}
	
		.box li .item img.icon {
			vertical-align: top;
			display:inline-block;
			margin-left: -40px;
			position:absolute;
		}
	
		.box li .item p {
			margin:0;
		}
	
		.box li .item .content {
			display:none;
		}
	
		div.box-beige2 {	color: #382926;	background: #A4A593 url("img/boxes/box_beige2_bg.jpg") no-repeat left top; }
		div.box-beige {		color: #382926;	background: #949477 url("img/boxes/box_beige_bg.jpg") no-repeat left top; }
		div.box-brown {		color: #d7ccc2;	background: #4e443b url("img/boxes/box_brown_bg.jpg") no-repeat left top; }
		div.box-green {		color: #fff; 	background: #495b1c url("img/boxes/box_green_bg.jpg") no-repeat left top; color: #A5BF67; }
		
		div.box-brown-wide {color: #d7ccc2;	width: 490px; background: #50463d url("img/boxes/box_brown_wide_bg.jpg") no-repeat left top; overflow: hidden;}
		
		div.box-brown a {
			color: #7cc5dd;
		}
		
		
		ul.sumup li {
			background: #443a31 url("img/bullet2.png") no-repeat 4px 5px;
			padding: 3px 3px 4px 26px;
			margin-bottom: 2px;
		}
		
		li a { 
			color: #d7ccc2;
		}
		
		div.box-beige li a {
			color: #334a1e;
		}
		
		
		
		/* HALFBOX STUFF :-):-):-):-):-):-):-):-):-):-):-):-) */
		
		div.halfbox { 
			width: 367px;
			float: left;
			margin: 0 2px 0 0;
			background: #50463d url("img/boxes/halfbox_brown.jpg") no-repeat left top;
		}
		div.halfbox-beige { background-image: url("img/boxes/halfbox_beige.jpg"); background-color: #98987a;}
		
		div.halfbox-last { margin-right: 0;}
		
		div.halfbox h3 { padding: 0 0 0 10px;}
			
		
		
	/*
	 * SPECIFIC CONTENT :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
	 */
		#hero {
			margin: 0 1px 2px 1px;
			width:489px;
			height:378px;
		}
	
		#screenShots, #achievements {
			min-height: 306px;
		}
	
		#screensContainer {
			text-align:center;
			margin-top: 35px;
		}
	
		#screensContainer img {
		}
	
		#features {
			xmin-height: 306px;
		}
	
		#features li {
			margin-bottom: 10px;
			background: transparent url("img/feature_icon.png") no-repeat left top;
		}
	
		#features li .item {
			color: #d7ccc2;
			background-color: #433930;
			background-image: url(/img/facebook/svg/rounded-corners.php?c=433930&b=4B4139&r=6);
			margin:0;
			padding-left: 0;
			overflow: hidden;
		}
		
		#features li .item span{
			background: transparent url("img/feature_icon.png") no-repeat left top;
			float: left;
			width: 35px;
			height: 34px;
			margin: 0 10px 0 10px;
			overflow: hidden;
		}
	
		#login {
			
		}
	
		#profile {
			min-height: 168px;
			color: #3E452A;
		}
	
		#profile .profilePicture {
			background-image:url(/img/facebook/profilepicture_bg.png);
			background-repeat:no-repeat;
			margin-right: 15px;
			width:50px;
			min-height:50px;
			padding:5px;
		}
	
		#profile .profileName {
			font-size:1.1em;
			color: black;
		}
	
		#profile .profileUserTitle {
			font-style: italic;
		}
	
		#profile #titlesContainer {
			margin-bottom: 10px;
		}
	
		#profile .label {
			display: inline-block;
			width: 120px;
			font-weight: bold;
		}
	
		#profile .info {
			margin-top: 10px;
		}
	
		#about {
			min-height: 399px;
		}
	
		#news {
			xmin-height: 496px;
		}
		
		#recent-activities {
			min-height: 306px;
		}
		
		#recent-messages {
			min-height: 306px;
		}
	
		#recent-messages li .item {
			color: #A5BF67;
			background-color: #3B4B17;
			background-image: url(/img/facebook/svg/rounded-corners.php?c=3B4B17&b=48591C&r=6);
		}
	
		#recent-messages li .header {
			padding: 0 5px 0 5px;
		}
	
		#recent-messages li .header a {
			color: #A5BF67;
			text-decoration: none;
		}
	
		#recent-messages li .header a:hover {
			text-decoration: underline;
		}
	
		#recent-messages li .header .date {
			color: #2E3911;
			float: right;
		}
	
		#recent-messages a {
			color: #A5BF67;
		}
	
		#recent-activities li{
			color: #D7CBC1;
			padding: 10px;
			margin-bottom: 10px;
			background-color: #433930;
			background-image: url(/img/facebook/svg/rounded-corners.php?c=433930&b=4B4139&r=6);
			overflow: hidden;
		}
	
		
		#recent-activities li img.icon {
			width: 25px;
			height: 25px;
			margin: 0 10px 10px 0;
			float: left;
		}
		#recent-activities li div.content {
			width: 165px;
			float: left;
		}
		#recent-activities li div.content p { padding-top: 4px;}
		
		#recent-activities li h5 { font-size: 10px; text-transform: uppercase;}
		
		#recent-activities li h5 a {
			color: #7cc5dd;
			text-decoration: none;
		}
	
		#recent-activities li h5 a:hover {
			text-decoration: underline;
		}
	
		#recent-activities li h5 .date {
			color: #d5cbc3;
			float: right;
			text-transform: lowercase;
		}
	
	#hover {
		width: 250px;
		position: absolute;
		display:none;
	}
	
	#hoverContent {
		background-image: url(/img/facebook/hover_c.png);
		background-repeat: repeat-y;
		padding: 10px 35px 10px 35px;
		color: #333333;
	}
	
	#hoverTop {
		width: 250px;
		height: 34px;
		background-image: url(/img/facebook/hover_t.png);
		background-repeat: no-repeat;
	}
	
	#hoverBottom {
		width: 250px;
		height: 32px;
		background-image: url(/img/facebook/hover_b.png);
		background-repeat: no-repeat;
	}
	
	#hoverContent .icon img, #hoverContent img.icon {
		vertical-align:middle;
		margin-right: 5px;
		margin-bottom: 5px;
		float: left;
	}
	
	#ajaxMessageLoading {
		position: fixed;
		bottom: 50px;
		left: 50%;
		color: #ffffff;
		clear: both;
		width: 150px;
		display: none;
	
		background-color: #000000;
	
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-o-border-radius: 5px;
	
		margin-left: -75px;
		padding:10px;
		text-align:center;
		background-image: url(/img/facebook/svg/rounded-corners.php?c=000000&b=98977A&r=6);
	}
	
	.tabbar {
		text-align: center;
		clear:both;
		margin: 10px 10%;
	}
	
	.tabbar li {
		display: inline-block;
		width: 100px;
		height: 12px;
		padding: 5px;
		text-align: center;
		background: transparent url(/img/facebook/tab.png) no-repeat right top;
		border-left: 1px solid #33201C;
		margin-right: -20px;
		position: relative;
		z-index: 100;
	}
	
	.tabbar li.selected {
		background: transparent url(/img/facebook/tab-selected.png) no-repeat right top;
		border-left: 1px solid #383B0E;
		z-index: 1000;
	}
	
	.tabbar li a {
		margin-right: 10px;
		color: white;
	}
	
	.tabbar li.selected a {
		font-style: italic;
	}
	
	.tabbar li a:hover {
		text-decoration: none;
	}
	
	.optionslist {
		
	}
	
	.optionslist li {
		background-repeat: no-repeat;
		background-image: url(img/bullet3.gif);
		background-position: 0 4px;
		padding-left: 10px;
		margin-bottom: 5px;
	}
	
	.optionslist li.selected {
		font-style: italic;
		font-weight:bold;
	}
	
	.optionslist li a {
		text-decoration:none;
	}
	
	.mapLocationName {
		position:absolute;
		color: #333333;
		margin-left: -60px;
	}
	
	.mapLocationName span {
		display: inline-block;
		background: transparent url(/img/facebook/banner-c.png) repeat-x right top;
		padding: 7px;
		height: 34px;
		vertical-align: top;
		min-width: 100px;
	}
	
	.clickable, .toggleVisibility {
	    cursor: pointer;
	}
	
	#news .newsItem {
		background-image: url(/img/facebook/hr.png);
		background-position: center bottom;
		background-repeat: no-repeat;
		padding: 5px;
		margin-bottom: 5px;
	}
	
	#news .newsItem .date {
		font-size: 0.9em;
	}
	
	
	#aboutcontent {
	
	}
	#aboutcontent .box {
		height: 780px;
	}
	
	
	
	ul.optionlist li {
		margin-bottom: 3px;
		padding: 5px 5px 5px 20px;
		width: 300px;
		background: #443a31 url("img/bullet3.gif") no-repeat 8px 10px;
	}
	
	ul.optionlist li a{
		color: #7cc5dd;
	}
	
	
	ul.formlist li {
		overflow: hidden;
		margin-bottom: 10px;	
	}
	
	ul.formlist li label {
		width: 200px;
		float: left;	
	}
	ul.formlist li input {
		float: left;
	}
	
	.breath {
		min-height: 200px;	
	}
	
	img.inlineimage {
		display: block;
		float: right;
		margin: 0 0 10px 10px;	
	}
	
	ul#messages li {
		background: transparent url("img/boxes/message_bg.png") no-repeat left top;
		width: 450px;  /* 478 - 28 */
		height: 52px;  /* 80 - 28 */
		margin: 0 6px 0 6px;
		padding: 14px;
		overflow: hidden;
		clear: both;
	}
	
	ul#messages li img.icon {
		width: 25px;
		height: 25px;
		margin: 0 10px 10px 0;
		float: left;
	}
	
	ul#messages li div.content {
		width: 410px;
		float: left;
		margin: 0; padding: 0;
	}
	
	ul#messages li div.content p{
		color: #a7a795;
		font-family: arial;
		padding-top: 3px;
	}
	
	ul#messages li h5 {
		font-size: 11px;
		color: #fff;
		text-transform: uppercase;
	}
	ul#messages li h5 span.date {
		float: right;
		color: #d5cbc3;
		text-transform: lowercase;
	}
	ul#messages li h5 a {
		color: #7cc5dd;
	}
	
	
	ul#messages li.last {
		border-bottom: 0;
	}
	

	
	.alert, .warning, .attention {
		font-style:italic;
	}
	
	.help-content {
		display:none;
	}
	
	noscript {
		width: 750px;
		padding: 5px 10px;
		border:1px solid #a8a999;
		color: #a8a999;
		border-top-width: 0;
		display:block;
		margin:auto;
		background-image: url(/img/facebook/warning-bg.png);
		background-repeat: repeat-x;
	}
	
	li.error, p.error {
		margin-bottom: 5px;
		background-image:url(/img/facebook/attention.png);
		background-repeat: no-repeat;
		padding-left: 22px;
		font-style:italic;
	}

	a.blue {
		color: #7cc5dd;
	}
