
/*---------------------------------------------*/
/*                                             */
/* Todobedobedo!                               */
/*                                             */
/* Site Styles CSS v0.2                        */
/*                                             */
/* By Mark Hurrell for Message, 14 April 2008  */
/*                                             */
/* www.message.uk.com                          */
/*                                             */
/*---------------------------------------------*/







/*---------------------------------------------*/
/*                                             */
/* Page Layout                                 */
/*                                             */
/*---------------------------------------------*/




div#container {
		position: relative;
		width: 86em;
		margin: 0 auto;
}

	div#branding {
			position: relative;
			top: 28px;
			height: 13.3em;
			border-top: 0.2em solid #A3A2A2;
			border-bottom: 0.2em solid #979797;
			background: url(images/branding.png) top left no-repeat;
	}
	
		div#branding h1 {
				position: absolute;
				top: 0.148em;
				left: 152px;
		}
		
		div#branding p {
				position: absolute;
				display: block;
				top: 4em;
				left: 152px;
		}
		
			div#branding p em {
					margin-left: 0.3em;
			}
	
	div#get_started {
			position: relative;
			top: 4.2em;
			/* height: 15em; */
			height: 27.4em;
			background: #FDFDFD;
			-webkit-border-radius: 1.6em;
			-moz-border-radius: 1.6em;
	}
	
		div#get_started div#login_container {
				position: relative;
				width: 41.4em;
				height: 11.6em;
				margin: 1.6em 0 1.6em 1.6em;
				float: left;
				background: #f1f1f1;
				border-top: 0.1em solid #B5B4B4;
				border-bottom: 0.1em solid #B5B4B4;
		}
		
			div#get_started div#login_container h2 {
					position: relative;
					top: 0.8em;
					left: 0.8em;
			}

			div#get_started div#login_container form {
					position: absolute;
					display: block;
					top: 2.5em;
					left: 8em;
					width: 31.8em;
					height: 100%;
			}
			
				div#get_started div#login_container form label {
						position: relative;
						float: left;
						clear: both;
						width: 7.7em;
						text-align: right;
				}
		
				div#get_started div#login_container form input {
						position: relative;
						float: right;
						top: -0.4em;
						width: 22.4em;
						margin-bottom: 1em;
						padding: 0.2em 0.2em;
						border: 0.1em solid #B5B4B4;
				}
				
					div#get_started div#login_container form input.error {
							background: #ffffcc;
					}
				
					div#get_started div#login_container form button {
						position: absolute;
						bottom: 4em;
						left: 8.8em;
						padding: 0.4em 0.8em;
						background: #dbdbdb url(images/form_button_bg.png) top left repeat-x;
						border-top: none;
						border-right: 1px solid #aaaaaa;
						border-bottom: 1px solid #aaaaaa;
						border-left: 0.1em solid transparent;
						cursor: pointer;
					}

			p.error {
					position: relative;
					display: block;
					margin-top: 5.5em;
					float: right;
					width: 15.5em;
					text-indent: 0;
					padding: 3px;
					margin-right: 1.5em;
					color: #fff;
					
			}
			
			div#get_started div#login_container a#forgotten_password {
					position: absolute;
					display: block;
					right: 25.7em;
					bottom: 2.2em;
			}		
		
		div#get_started div#register {
				position: relative;
				width: 39.8em;
				margin: 1.6em;
				float: right;
		}
			
			div#get_started div#register h2 {
					position: relative;
					top: 0.8em;
					left: 0.8em;
			}

			div#get_started div#register p {
					position: relative;
					display: block;
					top: 2.7em;
					left: 1.333em;
			}

				div#get_started div#register button {
						position: relative;
						top: 4.083em;
						left: 1.333em;
						padding: 0.4em 0.8em;
						background: #dbdbdb url(images/form_button_bg.png) top left repeat-x;
						border-top: none;
						border-right: 1px solid #aaaaaa;
						border-bottom: 1px solid #aaaaaa;
						border-left: 0.1em solid transparent;
						cursor: pointer;
						
						display: none;
				}
				
			div#get_started div#register form {
					position: relative;
					top: 5.3em;
					left: 1.6em;
					width: 36.4em;
					height: 100%;
			}
					
				div#get_started div#register form label {
						position: relative;
						float: left;
						clear: both;
						width: 7.7em;
						text-align: right;
				}
		
				div#get_started div#register form input {
						position: relative;
						float: right;
						top: -0.4em;
						width: 27em;
						margin-bottom: 1em;
						padding: 0.2em 0.2em;
						border: 0.1em solid #B5B4B4;
				}
				
					div#get_started div#register form input.error {
							background: #ffffcc;
					}
				
					div#get_started div#register form button {
						position: absolute;
						top: 10.8em;
						left: 8.8em;
						padding: 0.4em 0.8em;
						background: #dbdbdb url(images/form_button_bg.png) top left repeat-x;
						border-top: none;
						border-right: 1px solid #aaaaaa;
						border-bottom: 1px solid #aaaaaa;
						border-left: 0.1em solid transparent;
						cursor: pointer;
					}
					
			div#get_started div#register p.error {
					position: relative;
					display: block;
					margin-top: 13.2em;
					margin-right: 2.666em;
					left: 17.4em;
					width: 20em;
			}
			
			div#get_started div#register p#privacy_link {
					position: absolute;
					left: 10.46em;
					margin-top: 19.6em;
					width: 27.6em;
					padding-top: 0.8em;
					border-top: 0.1em solid #B5B4B4;
					text-align: right;
			}
			
		div#get_started div#logged_in {
				position: relative;
				width: 41.4em;
				height: 11.6em;
				margin: 1.6em 0 1.6em 1.6em;
				float: left;
				background: #f1f1f1;
				border-top: 0.1em solid #B5B4B4;
				border-bottom: 0.1em solid #B5B4B4;
		}

			div#get_started div#logged_in h2 {
					position: relative;
					left: 0.8em;
					margin-top: 0.8em;
			}
								
			div#get_started div#logged_in p {
					display: block;
					margin-top: 1.333em;
					margin-left: 1.333em;
			}
				
			div#get_started div#logged_in ul {
					display: block;
					margin-top: 1.6em;
					margin-left: 1.6em;
					width: 25em;
			}

				div#get_started div#logged_in ul li {
						display: block;
						float: left;
						margin-right: 0.666em;
				}
		
					div#get_started div#logged_in a button {
							padding: 0.4em 0.8em;
							background: #dbdbdb url(images/form_button_bg.png) top left repeat-x;
							border-top: none;
							border-right: 1px solid #aaaaaa;
							border-bottom: 1px solid #aaaaaa;
							border-left: 0.1em solid transparent;
							cursor: pointer;
					}
					
	div#content {
			position: relative;
			display: inline-block;
			margin-top: 11.25em;
			padding-bottom: 1.6em;
			background: #333333;
			border-top: 1px solid transparent;
			border-bottom: 1px solid #A3A2A2;
	}
	
		div#content:after {
				display: block;
				clear: both;
				content: ".";
				height: 0;
				visibility: hidden;
		}
	
		div#content h2 {
				display: block;
				padding: 0.888em 0.888em 0.888em 0;
				background: transparent;
				border-bottom: 1px solid #A3A2A2;
				margin-top: -2.8em;
				margin-bottom: 0.888em;
		}
		
		div#content div.column_first {
				position: relative;
				float: none;
				clear: none;
				width: 50%;
				min-height: 144px;
				padding: 1.6em 0;
		}
		
			div#content.no_login div.column_first {
					width: 66%;
					min-height: 96px;
			}
		
			div#content div.column_first img {
					position: relative;
					float: left;
					margin-top: -40px;
					margin-left: 20px;
			}

		div#content div.column_first h3 {
				display: block;
				margin-bottom: 0.05em;
				margin-left: 176px;
				padding-right: 1em;
		}
		
		div#content div.column_first p {
				display: block;
				margin-left: 176px;
				padding-right: 1.333em;
		}
		
			div#content div.column_first form {
					position: relative;
					margin-left: 176px;
			}
			
				div#content div.column_first form label {
						position: absolute;
						top: 0;
						left: 0;
				}

				div#content div.column_first form input {
						position: relative;
						float: left;
						clear: both;
						width: 27em;
						margin-top: 1.833em;
						margin-bottom: 1.333em;
						padding: 0.2em 0.2em;
						background: #d6d6d6;
						border: 1px solid #000000;
				}
						
				div#content div.column_first form button {
						float: left;
						clear: left;
						padding: 0.4em 0.8em;
						background: #dbdbdb url(images/form_button_bg.png) top left repeat-x;
						border-top: none;
						border-right: 1px solid #aaaaaa;
						border-bottom: 1px solid #aaaaaa;
						border-left: 0.1em solid transparent;
						cursor: pointer;
				}
				
				div#content div.column_first form p {
						position: relative;
						display: block;
						clear: both;
						top: -2.7em;
						left: -8em;
				}
		
		div#content div.column_second {
				position: absolute;
				width: 50%;
				margin-left: 50%;
				padding: 1.6em 0 1.6em 16px;
		}

			div#content div.column_second img {
					position: relative;
					margin: 0 auto;
					border-bottom: 1px solid #222222;
			}

		div#content div.column_second p {
				position: relative;
				display: block;
				top: 0.8em;
				padding-right: 1.333em;
		}

		div#content div.column_second#column_second_top {
				top: 2em;
		}
		
		div#content div.column_second#column_second_bottom {
				bottom: 3.4em;
		}
		
	div#footer {
			position: relative;
			margin-top: 1.6em;
			padding: 0 1.6em;
	}
	
		div#footer ul {
				position: absolute;
				top: 0;
				right: 0;
				padding-bottom: 16px;
		}
		
			div#footer ul li {
					float: left;
					margin: 0 1.454em;
			}

		





/*---------------------------------------------*/
/*                                             */
/* Typography                                  */
/*                                             */
/*---------------------------------------------*/




div#container {
		font-family: Verdana, sans-serif;
}

	h1 {
			color: #A3A2A2;
			font-size: 5.4em;
			font-weight: 500;
	}
	
		h1 span {
				color: #ffff00;
				font-size: 0.333em;
				vertical-align: super;
		}
	
	div#branding p {
			font-size: 1.6em;
			color: #f1f1f1;
	}
	
		div#branding p em {
				color: #A3A2A2;
				font-style: italic;
		}
	
	div#get_started div#login_container h2 {
			font-size: 2em;
			font-weight: 400;
	}

	div#get_started div#register h2 {
			font-size: 2em;
			font-weight: 400;
	}

	div#get_started div#register p#privacy_link {
			font-size: 1em;
	}
	
	div#get_started div#logged_in h2 {
			font-size: 2em;
			font-weight: 400;
	}
	
	div#get_started div#logged_in p {
			font-size: 1.2em;
			color: #666666;
	}
	
		div#get_started div#logged_in p strong {
				color: #333333;
				font-weight: 800;
		}
	
			div#get_started div#logged_in a {
					text-decoration: none;
					color: #000000;
			}
			
			div#get_started div#logged_in a button {
					font-size: 1em;
			}
			
	div#get_started div#login_container form input, 
	div#get_started div#register form input {
			font-size: 1em;
	}
	
	div#get_started div#login_container form button, 
	div#get_started div#register form button {
			font-size: 1em;
	}
	
	div#get_started div#register p {
			font-size: 1.2em;
			color: #666666;
	}
	
	div#get_started div#login_container p.error {
			line-height: 1.3;
			color: #fff;
			font-size: 1.1em;
	}
	
	div#get_started div#register p.error {
			line-height: 1.3;
			color: #C03;
			font-size: 1em;
	}

	div#get_started div#register p strong {
			font-weight: 800;
			color: #333333;
	}

	div#get_started div#register p em {
	}

	div#get_started div#register button {
			font-size: 1.2em;
	}
	
	div#content h2 {
			color: #f1f1f1;
			font-size: 1.8em;
			font-weight: 400;
	}
	
		div#content h2 em {
				font-style: italic;
		}
		
	div#content div.column_first h3, 
	div#content div.column_second h3 {
			font-size: 1.6em;
			line-height: 1.4;
			color: #f1f1f1;
			font-weight: 400;
	}
		
	div#content div.column_first p {
			font-size: 1.2em;
			line-height: 1.6;
			color: #b1b1b1;
	}
	
	div#content div.column_first form label {
			color: #b1b1b1;
	}
	
	div#content div.column_first form input {
			color: #333333;
	}
	
	div#content div.column_first form button {
			font-size: 1em;
	}
	
	div#content div.column_first form p {
			font-size: 1em;
	}
	
	div#content div.column_second p {
			font-size: 1em;
			line-height: 1.8;
			color: #f1f1f1;
	}
	
	div#content div.column_first strong, 
	div#content div.column_second strong {
			color: #f1f1f1; 
	}
	
	div#content div.column_first em, 
	div#content div.column_second em {
			font-style: italic;
	}
	
	div#content a {
			color: #b1b1b1;
			padding: 0 0.2em 0.1em 0.2em;
			text-decoration: none;
			background-color: #444444;
			border-bottom: 1px solid #777777;
	}
	
		div#content a:hover {
				color: #f1f1f1;
				border-bottom: 1px solid #b1b1b1;
		}
		
	div#footer p {
			font-size: 1.1em;
			color: #f1f1f1;
	}
	
		div#footer p a {
				color: #ffff00;
		}
	
	div#footer ul li a {
			font-size: 1.1em;
			color: #ffff00;
	}
	
	div#footer p a {
		text-decoration: none;
	}
	
	div#footer span.share {
		margin-left: 25%;
		
	}
	


