@charset "utf-8";
/* FluidMarkup 2009 */

/* RESET */

* { margin: 0; padding: 0; }

/* MASTER ELEMENT STYLES */

body {
	background: #1d242a;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #e5e5e5;
}

a { 
	color: #ff9f9f; 
}

a:hover { 
	text-decoration: none;
}

	a img {
		border: none; 
	}

h2 { 
	font-size: 16px; 
	margin-bottom: 10px; 
}

	h2 img { 
		margin: 0px 5px -8px -5px; 
	}

h3 { 
	margin-bottom: 5px; 
	border-bottom: 1px solid #3f454a; 
	font-size: 14px; 
}

p { 
	margin: 5px 0px 10px 0px; 
}

/* CLASSES */

.addspace { 
	margin-top: 15px; 
}

.box label strong {
	color: #FFF;
}

.box .label {
	color: #FFF;
	font-weight: bold;
	display: block;
}

.center { 
	text-align: center; 
}

.dark { 
	color: #666; 
}

.dark2 {
	color: #a5a5a5;
	font-style: italic;
}

.dark3 {
	font-size: 9px;
	color: #a2b3c3;
}

.draggable {
	position: absolute;
	top: 0;
	left: 0;
}

.error { 
	font-weight: bold; 
	color: #FF3333; 
}

.formlabel {
	width: 24px !important;
	background: none;
	border: none;
	color: #FFF;
	font-weight: bold;
	font-size: 10px;
	height: 15px;
	padding: 0px !important;
	margin: -1px 0px 5px 0px !important;
	float: right;
}

.shade {
	font-size: 11px;
	text-transform: uppercase;
	font-weight: bold;
	color: #a2b3c3;
}

.success { 
	font-weight: bold; 
	color: #00CC00;
}

.warning {
	font-weight: bold; 
	color: #FFE87F;
}

.clear { 
	clear: both;
}

.tiny { 
	font-size: 11px; 
}

.box {
	background: #495057;
	border: 1px solid #565d65;
	padding: 10px;
	margin: 20px;
}

.slider {
	width: 100px; 
	float: left;
}

.nofloat {
	/*float: none !important;*/
}

/*------------------------------*/
/* HEADER                       */
/*------------------------------*/

#header { 
	height: 210px;
	text-align: center;
}
	
/*------------------------------*/
/* NOSCRIPT MSG                 */
/*------------------------------*/

#noscript {
	margin: 0px auto 20px auto;
	width: 820px;
	background: #FFE87F;
	border-top: 2px solid #EFC32C;
	color: #000;
	line-height: 32px;
	font-weight: bold;
	font-size: 13px;
}

	#noscript div a { color: #BF9F0B; }
	
	#noscript div a:hover { color: #000; }

	#noscript div {
		padding: 10px 10px 10px 62px;
		min-height: 32px;
		background: url(../img/exclamation.png) 15px center no-repeat;
	}

/*------------------------------*/
/* NAVIGATION                   */
/*------------------------------*/

#navigation {
	margin: 0px auto 0px auto;
	width: 820px;
	background: #343a40;
	border-top: 1px solid #3f454a;
}

	/* NAVIGATION UL */

	#nav {
		display: block;
		text-align: center;
		padding: 20px 0px 20px 0px;
	}

		#nav li {
			display: inline;
			margin-left: 10px;
			margin-right: 10px;
			font-size: 14px;
			font-weight: bold;
		}
	
	/* GENERATE FORM */
	
	#generate-form {
		width: 555px;
		margin: 0px auto 0px auto;
		padding-bottom: 20px;
	}
	
		#generate-form #user {
			padding: 7px 10px 7px 10px;
			font-size: 19px;
			border: 2px solid #1d242a;
			width: 375px;
			float: left;
			color: #999;
		}
		
		#generate-form img {
			margin: 0px 0px 0px 10px;
		}
		
		/* GENERATE FORM RADIO BUTTONS */
		
		#generate-form #radiogroup {
			clear: both;
			margin-top: 5px;
		}
		
			#generate-form #radiogroup label {
				margin-right: 20px; 
			}
			
			#generate-form #radiogroup #custom-link {
				float: right;
				margin-right: 5px;
			}
			
			#tooltip {
				position: absolute;
				z-index: 3000;
				background-color: #50616B;
				border: 2px solid #1d242a;
				padding: 5px;
				color: #FFF;
				width: 200px;
				text-align: center;
				-moz-border-radius: 6px;
				-webkit-border-radius: 6px;
			}
			#tooltip h3 { display: none !important; }
			#tooltip h3, #tooltip div { margin: 0; }
			
/*------------------------------*/
/* WRAPPER DIV                  */
/*------------------------------*/

#body {
	margin: 20px auto 0px auto;
}

	/* BODY CLASSES FOR ONE- OR TWO-COLUMN LAYOUTS */

	.two-column { 
		background: url(../img/body_bg.gif) repeat-y; 
		width: 820px;
	}
	
	.one-column { 
		background: #343a40;
		padding: 10px; 
		border-top: 1px solid #3f454a;
		width: 800px;
	}
	
	/* BASIC LIST STYLES */
	
	#body ul li { margin-left: 20px; }
	
	#body ul { margin: 5px 0px 5px 0px; }
	
	/* GENERATE PAGE PREVIEW BOX IMAGE */
	
	#preview-box img { padding: 10px; }
	
	/*------------------------------*/
	/* SIDEBAR                      */
	/*------------------------------*/

	#sidebar {
		float: right;
		width: 280px;
		background: #343a40;
		padding: 10px; 
		border-top: 1px solid #3f454a;
	}
	
		#body #sidebar ul li { margin-left: 0px; }
		
		#body #sidebar ul li { margin: 0px; }
		
		/* NEWS LIST */
	
		#news-ul li { 
			list-style: none; 
			font-size: 11px;
		}
	
			#news-ul li a {
				display: block; 
				text-decoration: none; 
				color: #e5e5e5; 
				margin: 2px 0px 2px 0px; 
				padding: 5px; 
				border-top: 1px solid #343a40; 
				border-bottom: 1px solid #343a40; 
			}
			
			#news-ul li a:hover { 
				border-top: 1px dotted #666; 
				border-bottom: 1px dotted #666; 
				background: #40474e;
			}
			
		/* BUZZ LIST */
			
		#buzz-ul li { 
			list-style: none; 
			font-size: 11px;
		}
		
			#buzz-ul li a img { float: left; margin-right: 10px; width: 48px; height: 48px; }
	
			#buzz-ul li a {
				display: block; 
				text-decoration: none; 
				color: #e5e5e5; 
				margin: 2px 0px 2px 0px; 
				padding: 5px; 
				border-top: 1px solid #343a40; 
				border-bottom: 1px solid #343a40; 
			}
			
			#buzz-ul li a:hover { 
				border-top: 1px dotted #666; 
				border-bottom: 1px dotted #666; 
				background: #40474e;
			}
			
			#buzz-ul li a .status-date {
				margin-left: 58px;
			}
			
			/* CLASSES FOR LISTS */
			
			.status-date { 
				display: block; 
				font-size: 9px; 
				color: #999;
			}
			
			.status-clear { display: block; clear: both; }
			
		/* ACCOUNT TOOLS SIDEBAR */
		
		#account-tools {
			border-top: 1px solid #3f454a;
			margin-bottom: 15px;
		}
		
			#account-tools li {
				list-style: none;
				display: block;
				border-bottom: 1px solid #3f454a;
			}
			
			#account-tools li a {
				padding: 10px;
				display: block;
				color: #e5e5e5;
				text-decoration: none;
			}
			
			#account-tools li a:hover { background: #1d242a; }
			
				#account-tools li a img { margin: 0px 5px -3px 0px; }
				
	/*------------------------------*/
	/* MAIN CONTENT                 */
	/*------------------------------*/
	
	#main {
		margin-right: 320px;
		background: #343a40;
		padding: 10px; 
		border-top: 1px solid #3f454a;
	}
	
		/* ACCOUNT EDIT FORM */
		
		#account-edit label {
			display: block;
			margin-bottom: 15px;
			font-size: 11px;
			line-height: 20px;
		}
		
		#account-edit #submit {
			padding: 5px;
			font-size: 14px;
			font-weight: bold;
			margin-top: 10px;
		}
		
		#account-edit label input {
			padding: 5px;
			width: 400px;
			border: 2px solid #1D242A;
		}
	
		/* CONFIGURATION BOXES */
		
		.ui { 
			width: 700px; 
			margin: 10px auto 10px auto;
		}
		
			/* TABS (LEFT) */
		
			.ui-left {
				float: left;
				width: 150px;
			}
			
				.ui-left ul li {
					display: block;
					list-style: none;
					margin: 0px 0px 5px 0px !important;
					background: #292f35;
				}
				
				.ui-left ul li a {
					padding: 10px;
					display: block;
					color: #999;
					text-decoration: none;
				}
				
				.ui-left ul li a:hover {
					color: #e5e5e5;
					background: #1d242a url(../img/arrow.gif) center right no-repeat;
				}
				
				.ui-current {
					color: #e5e5e5 !important;
					background: #1d242a url(../img/arrow.gif) center right no-repeat !important;
				}
				
			/* BODY (RIGHT) */
				
			.ui-right {
				margin-left: 150px;
				background: #495057;
				min-height: 100px;
				border: 1px solid #565d65;
				padding: 10px;
			}
			
			/* GENERATE PAGE CHOOSER STYLES */
			
			#chooser-tiny { display: none; }
			#chooser-medium { display: none; }
			#chooser-special { display: none; }
			#ui-chooser-right a { display: block; }
	
/*------------------------------*/
/* FOOTER                       */
/*------------------------------*/

#footer {
	margin: 20px auto 0px auto;
	width: 820px;
}

	#footer div div { 
		opacity: .5; 
	}
	
	#footer div div:hover { 
		opacity: 1; 
	}

	#footer-copyright { 
		width: 237px;
		float: left;
		margin-left: 10px;
	}
	
	#footer-site { 
		width: 247px;
		float: left;
		border-left: 1px solid #343a40;
		border-right: 1px solid #343a40;
		padding: 0px 20px 0px 20px;
		margin: 0px 20px 0px 20px;
	}
	
	#footer-site ul li {
		list-style: none;
		margin-bottom: 10px;
	}
	
	#footer-props { 
		width: 237px;
		float: left;
	}

/*------------------------------*/
/* LOGIN/REGISTER PAGES         */
/*------------------------------*/

#login-copyright {
	padding: 10px;
	font-style: italic;
	color: #666;
	font-size: 11px;
	text-align: center;
}

#login {
	width: 330px;
	margin: 0px auto 0px auto;
	border: 10px solid #343a40;
	padding: 10px;
	background: #292f35;
}

	#login-form, #tag-form {
		margin-top: 15px; 
	}
	
	#login-form #login-extra {
		display: block;
		padding-top: 10px;
		line-height: 32px;
	}
	
	#login-form #submit {
		padding: 5px;
		font-size: 14px;
		font-weight: bold;
		float: right;
		margin-top: 10px;
	}

	#login-form label, #tag-form label {
		display: block;
		margin-bottom: 15px;
		font-size: 11px;
		line-height: 20px;
	}
	
	#login-form label input, #tag-form label input {
		padding: 5px;
		width: 315px;
		border: 2px solid #1D242A;
	}
	
	#tag-form label input { width: 400px; }
	
/*------------------------------*/
/* CUSTOM CREATE FORM           */
/*------------------------------*/

#createform {
	display: block;
	line-height: 32px;
}

#createform #submit, #createform #loading {
	padding: 5px;
	font-size: 14px;
	font-weight: bold;
	float: right;
	margin-top: 5px;
}

#createform #submit {
	padding: 0px;
	margin: 0px;
}

#createform label {
	display: block;
	margin-bottom: 15px;
	font-size: 11px;
	line-height: 20px;
}

#createform strong.tos {
	display: block;
	width: 200px;
	float: left;
	line-height: normal;
	color: #FFF;
	font-size: 12px;
	padding-top: 5px;
}

#createform label input {
	padding: 5px;
	width: 315px;
	border: 2px solid #1D242A;
}

/*------------------------------*/
/* CONFIGURATOR/EDIT LAYOUT     */
/*------------------------------*/

#image-list li {
	list-style: none;
	margin: 5px 0px 35px 0px;
}

#configurator h4 {
	text-transform: uppercase;
	color: #a2b3c3;
	margin-bottom: 5px;
}

#configurator #done-btn {
	display: block;
	width: 145px;
	float: right;
	padding-top: 25px;
}

#configurator input {
	width: 124px;
	padding: 2px;
	margin-bottom: 10px;
}

#configurator select {
	width: 130px;
	margin-bottom: 10px;
	padding: 2px 0px 2px 0px;
}

#configurator label strong {
	font-size: 11px;
	padding-bottom: 5px;
	display: block;
}

#configurator #draggable {
	margin: 10px 0px 10px 0px;
	position: relative;
}

#configurator #tweet-properties {
	float: left;
	width: 130px;
}

#configurator #user-properties {
	float: left;
	width: 130px;
	margin-left: 12px;
}

#configurator #date-properties {
	float: left;
	width: 130px;
	margin-left: 12px;
}

#configurator #wrap-properties {
	float: left;
	width: 130px;
}

#configurator #loading {
	display: block;
	float: right;
	padding-top: 20px;
}

#tweet-font-color, #user-font-color, #date-font-color {
	background: center right url(../img/colorpicker_icon.gif) no-repeat #FFF;
	border: 1px solid #FFF;
	cursor: default;
}
