body {
	background-color: #333333;
	}
	
#wrapper {
	width: 900px;
	margin-left: auto;
	margin-right: auto;
	}

#header {
	height: 100px;
	width: 900px;
	background-image: url(../images/header.2.jpg);
	}

#content {
	padding-top: 20px;
	background-color: #FFFFFF;
	padding-bottom: 20px;
	}


#navigation {
	position: relative;
	top: 60px;
	left: 610px;
	width:300px;
	}

#navigation div {
	width: 80px;
	height: 20px;
	background-color: #FFFFFF;
	float: left;
	margin-left: 10px;
	text-align: center;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 14px;
	color: #333333;
	padding-top: 10px;
	}

#navigation div a {color: #333333; text-decoration: none;}

#navigation_pink {border-top: 10px solid #ff3256;}
#navigation_blue {border-top: 10px solid #7ee6ff;}
#navigation_green {border-top: 10px solid #d9f0d3;}
#navigation_purple {border-top: 10px solid #e47eff;}

#sidebar {
	float: right;
	margin-right: 20px;
	width: 260px;
	}

#sidebar a {font-weight: bold;text-decoration: none;}
#sidebar a:hover {text-decoration: underline;}

.link_pink{color: #333333;}
.link_purple{color: #333333;}
.link_pink:hover {color: #ff3256;}
.link_purple:hover {color:#e47eff;}
	
h1 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 20px;
	color: #333333;
	font-weight: normal;
	}

h3 {
	/*for asymmetry, use 0.714285714em*/
	line-height:1.42857143em;
	margin-top: 1.42857143em;
	margin-bottom: 1.42857143em;
	font-weight: bold;
	font-size: 14px;
	}

.text {
	font-family: Arial, sans-serif;
	font-size: 12px;
	color: #333333;
	line-height: 1.667em;
	}

.article_preview {
	width: 500px;
	margin-left: 20px;
	}

.article_preview img {
	margin-bottom: 20px;
	}

.article_preview h1 {
	line-height: 1;
	margin-top: 1em;
	margin-bottom: 1em;
	}

.article_preview li{
	margin-left: 20px;
	list-style: upper-roman;
	margin-bottom:20px;
	}

.article_preview_bottom {
	background-image: url(../images/hash.jpg);
	height: 20px;
	margin-bottom: 40px;
	}

.article_preview_bottom span {
	height: 20px;
	background-color: #FFFFFF;
	font-size: 10px;
	margin-left: 20px;
	padding: 5px;
	}

.readmore {
	margin-top: 20px;
	margin-bottom: 20px;
	font-weight: bold;
	}

.readmore a {
	color: #ff3256;
	text-decoration: none;
	}

.takequiz {
	margin-top: 20px;
	margin-bottom: 20px;
	font-weight: bold;
	}

.takequiz a {
	color: #7ee6ff;
	text-decoration: none;
	}

#footer {
	height: 195px;
	width: 880px;
	background-image: url(../images/footer_grad.jpg);
	background-repeat: repeat-x;
	padding-left: 20px;
	padding-top: 25px;
	border-top: 1px solid #c1c1c1;
	}

#footer div {
	margin-right: 40px;
	width: 220px;
	float: left;
	}

#advertisment {
	border: 5px solid #f1f1f1;
	width: 250px;
	height: 250px;
	}

.bottom20 { margin-bottom: 20px; }
.top20 { margin-top: 20px; }


.metrics {
	width: 500px;
	margin-left: 20px;
	}

.metrics h1 {
	line-height: 1;
	margin-top: 1em;
	margin-bottom: 1em;
	}

.count{ color: #c1c1c1; }
        
#sidebar a:hover {text-decoration: none;}

#sidebar { margin-top: 5px; }

.input {
	background-image: url('../images/input_bg.jpg');
	height:17px;
	width:240px;
	border: 3px solid #f1f1f1;
	padding: 2px 0 0 5px;
	}

.input:focus {
	border: 3px solid #c1c1c1;
	}

.login_register {
	width: 250px;
	}

.login_register div {
	margin-top: 20px;
	font-weight: bold;
	}


.button {
	width: 90px;
	height: 30px;
	float: right;
	border: 0px;
	cursor: pointer;
	}

.submit { background: transparent url(../images/buttons.jpg) no-repeat scroll 0 -33px; margin: 20px 0;float:none; }
.submit:hover { background-position: 0 -153px;  }

.login { background: transparent url(../images/buttons.jpg) no-repeat scroll 0 -3px; }
.login:hover { background-position: 0 -123px;  }

.register { background: transparent url(../images/buttons.jpg) no-repeat scroll 0 -93px; }
.register:hover { background-position: 0 -213px; }

.facebook { background: transparent url(../images/buttons.jpg) no-repeat scroll 0 -63px;float:none; }
.facebook:hover { background-position: 0 -183px; }

.error {
	width: 97%;
	padding: 5px;
	margin-bottom: 20px;
	background-color: #FFCCCC;
	border: 1px solid #FF0000;
	font-size: 12px;
	line-height: 1.667em;
	}

.confirm {
	width: 97%;
	padding: 5px;
	margin-bottom: 20px;
	background-color: #FFFFCC;
	border: 1px solid #FFFF00;
	font-size: 12px;
	line-height: 1.667em;
	}

#register_button {
	width:140px;
	height:10px;
	float:left;
	margin:10px 0;
	color: #999999;
	font-style: italic;
	font-weight: normal;
	cursor: pointer;
	}


#register_button:hover { color: #333333; text-decoration: underline; }

.navigation_inactive { color: #999999; }

tr { height: 30px; }

tbody tr:hover { background-color:#f1f1f1;cursor:pointer; }

th { text-align:left; font-weight: bold;}

td, th{
	border-color: #cccccc;
	border-width: 0 0 1px 0;
	border-style: solid;
	vertical-align:middle;
}

.progress_bar { background-image: url(../images/bar_bg.png); background-repeat: no-repeat; }

.micro_container {
	padding-bottom: 20px;
	border-bottom: 1px solid #cccccc;
	margin-bottom: 20px;
	}