/* 
MashupAwards.com styles

author:	Cory Duncan / coryduncan.com
colors:
	light green - E7F6D5
	green - 8cc740
	dark green - 59B000
-- */

body, h1, h2, h3, h4, h5, p, abbr, cite, blockquote, form, fieldset, ul, dl, dt, dd, ol, li {
	border: none;
	margin: 0;
	padding: 0;
	}
li { list-style: none; }
abbr { text-decoration: none; }
cite { font-style: normal; }
a { background: url(/img/border.gif) repeat-x 0 100%; padding: 0 0 0.1em; text-decoration: none; }
a.img { background: none; padding: 0; }
a:link, a:visited { color: #59B000; }
p a:link, p a:visited { color: #000; }
a:hover { background: none; }
a.feed {
	background: url(/img/icons/feed.gif) no-repeat 0 0;
	padding: 0 0 2px 18px;
	}
a.feed:link, a.feed:visited { color: #e77122; }
a.feed:hover { background: url(/img/icons/feed.gif) no-repeat 0 0; }
a[target=_blank], a[rel=external] { 
	background: url(/img/icons/external.gif) no-repeat 100% 0;
	padding: 0 12px 0 0;
	}
a:hover[target=_blank], a:hover[rel=external] { color: #59B000; }
a img { border: none; }
body {
	background: #676767 url(/img/bg.gif);
	color: #505050;
	font: 12px/1.5 Verdana, sans-serif;
	margin: 0 0 40px;
	}
p { margin: 0 0 1em; }
h1 {
	color: #59B000;
	font: normal 22px/1.2em Helvetica, Arial, Sans-serif;
	margin-bottom: 0.3em;
	}
h2 {
	color: #59B000;
	font: normal 18px/1em Helvetica, Arial, Sans-serif;
	margin: 1em 0 0.5em 0;
	}
h2.alt { 
	background: url(/img/border.gif) repeat-x 0 0;
	padding-top: 1em;
	}
h2 em { font-size: 12px; font-style: normal; }
h3 {
	color: #59B000;
	font: 600 14px/1em Helvetica, Arial, Sans-serif;
	margin: 0.5em 0 0;
	}
h4 {
	color: #999;
	font-size: 10px;
	line-height: 1.2em;
	margin: 0 0 0.5em;
	text-transform: lowercase;
	}
ol { margin-top: 0.75em; margin-bottom: 1.5em; }
ol li { margin-bottom: 0.5em; }


/* -- structure -- */
#outer {
	background: #fff;
	margin: 0 auto;
	position: relative;
	width: 906px;
	}
#wrapper {
	background: #fff url(/img/header.jpg) no-repeat 0 0;
	color: #505050;
	border: 3px double #505050; border-top: none;
	padding: 200px 0 10px;
	width: 900px;
	}
.col {
	background: url(/img/shadow.gif) repeat-y 0 0;
	float: left;
	margin: 0 0 0 15px;
	}
.col-i { background: url(/img/shadow-t.gif) no-repeat 0 0; float: left; }
.col-i2 { background: url(/img/shadow-b.gif) no-repeat 0 100%; float: left; padding: 56px 0 56px 25px; }
.sub {
	background: none;
	margin: 0 0 0 25px;
	width: 150px;
	}
.sub2 li {
	font-size: 10px;
	line-height: 1.2em;
	margin: 0 0 0.6em;
	}
#content {
	margin: 0;
	width: 517px;
	}
#sidebar { 
	float: left;
	margin: 0 0 0 30px;
	overflow: hidden;
	padding: 48px 0 0 0;
	width: 150px; 	
	}


/* -- content -- */	
#logo {
	height: 48px;
	left: 10px;
	position: absolute;
	top: 66px;
	width: 500px;
	}
#logo img { display: block; }
#logo a { background: none; display: block; height: 48px; outline: none; padding: 0; width: 500px; }
#content .col-i2 { padding-bottom: 20px; padding-top: 20px; width: 490px; }
#content p em { font-style: normal; }
.clear { clear: both; }	
.entry {
	overflow: hidden;
	position: relative;
	width: 100%;
	}
.entry .content {
	float: right;
	width: 232px;
	}
.entry img.thumb { margin: 0; }
p.alt { line-height: 1em; margin: 0; } 
img.thumb { 
	border: 2px solid #999;
	float: left;
	margin: 0 12px 4px 0;
	}
a:hover img.thumb { border-color: #59B000; }
.vvqbox { margin: 0 0 1.5em; }
.date {
	font-size: 10px;
	text-transform: uppercase;
	}

/* content box */
.box {
	background: #555;
	color: #fff;
	margin: 0.5em 0;
	overflow: hidden;
	padding: 6px;
	}
.box a:link, .box a:visited { color: #8cc740; }
.box a:hover { color: #8cc740; }
.box h2 { font-size: 16px; margin: 0 0 0.25em; }
.box p { margin: 0; }
.box img.thumb { margin: 0 6px 0 0; }
.box a:hover img.thumb { border-color: #ccc; }
.box a:hover { color: #ccc; }
.box .date {
	color: #ccc;
	float: right;
	}

/* pagination */
.pagination { margin: 1em 0; overflow: hidden; }
.top { margin-top: 0; }
.pagination a {
	display: block;
	font-size: 10px; font-weight: bold;
	padding: 6px 10px;
	}
.pagination a:link, .pagination a:visited { 
	background: #333;
	color: #8cc740;
	}
.pagination a:hover { background: #000; }
.pagination .prev { float: left; width: 30%; } 
.pagination .prev a { float: left; }
.pagination .next { float: right; text-align: right; width: 30%; }
.pagination .next a { float: right; }
.pagination .all { 
	margin: 0 auto; 
	padding-top: 5px;
	text-align: center;
	width: 14%
	}
.pagination .all a { padding: 0 0 0.1em; }
.pagination .all a:link, .pagination .all a:visited {
	background: url(/img/border.gif) repeat-x 0 100%;
	color: #333;
	}
.pagination .all a:hover { background: none; }
	
/* alert */
.alert { font-size: 13px; }
.alert p span {
	background: #505050;
	color: #fff;
	}
	
/* mashup metadata */
ul.meta { margin: 3px 0 1em; }
ul.meta li {
	color: #333;
	font-size: 10px; font-weight: bold;
	line-height: 1.2em;
	}
ul.meta li span { font-weight: normal; }
ul.meta li.first {
	background: url(/img/border.gif) repeat-x 0 100%;
	margin: 0 0 0.5em;
	padding: 0 0 0.6em;
	}
	
/* tags */
.tags {
	float: left;
	font-size: 10px;
	line-height: 1em;
	text-transform: lowercase; 
	}
.tags ul { float: left; }
.tags li {
	float: left;
	margin: 0 5px 5px 0;
	}
.tags span { float: left; }
.tags a {
	background: #333; 
	display: block;
	padding: 3px 5px;
	}
.tags a:link, .tags a:visited { color: #fff; }
.tags a:hover { background-color: #000; }
.tags em {
	font-style: normal;
	margin: 0 8px 0 0;
	}
	
/* social bookmarking */
#social { overflow: hidden; width: 125px; }
#social a {
	background: none;
	float: left;
	margin: 0 4px 4px 0;
	padding: 0;
	}
#social img { display: block; }

/* promos */
.co { margin: 1em 0; }
.co h3 { margin-bottom: 1em; margin-top: 2em; text-align: center; }
.sub2 .co { margin-top: 0; }


/* -- footer -- */
#footer {
	clear: both;
	color: #999;
	font-size: 10px;
	padding: 10px 0 0;
	text-align: center;
	width: 100%;
	}
#footer a { margin: 0 0.25em; }
#footer a:link, #footer a:visited { color: #666; }
#footer a:hover { color: #333; }
#footer p { margin: 0; }
#footer .copyright { 
	font-size: 9px;
	margin-top: 3px;
	}


/* -- nav -- */
#nav { overflow: hidden; width: 136px; }
#nav li { float: left; }
#nav a {
	background: url(/img/nav.png) no-repeat 0 0;
	display: block;
	height: 24px;
	outline: none;
	overflow: hidden;
	text-indent: -9999px; 
	width: 136px;
	}
#nav a:hover { background: url(/img/nav.png) no-repeat -136px 0; }
#nav-winners a { background-position: 0 -24px; } #nav-winners a:hover { background-position: -136px -24px; } 
#nav-create a { background-position: 0 -48px; } #nav-create a:hover { background-position: -136px -48px; }
#nav-criteria a { background-position: 0 -72px;  } #nav-criteria a:hover { background-position: -136px -72px; }
#nav-nominate a { background-position: 0 -96px; } #nav-nominate a:hover { background-position: -136px -96px; }

/* you are here */
.home #nav-about a { background-position: -272px 0; }
.winners #nav-winners a { background-position: -272px -24px; }
.create #nav-create a { background-position: -272px -48px; }
.criteria #nav-criteria a { background-position: -272px -72px; }
.nominate #nav-nominate a { background-position: -272px -96px; }  

/* filter by */
#filter {
	background: url(/img/border.gif) repeat-x 0 100%;
	float: left;
	margin: -2px 0 0.5em;
	padding: 0 0 0.5em;
	text-transform: lowercase;
	width: 100%;
	}
#filter a { 
	background: none;
	display: block;
	padding: 0.5em 6px;
	}
#filter a:link, #filter a:visited { color: #333; }
#filter a:hover { background: #efefef; }
#filter ul {
	float: left;
	line-height: 1em;
	margin: 0 0 0.5em;
	position: relative;
	width: 115px;
	z-index: 11;
	}
#filter li { 
	background: #999;
	color: #e6e6e6;
	cursor: pointer;
	float: left;
	padding: 0.4em 6px;
	width: 103px;
	}
#filter li em { font-style: normal; }
#filter li:hover em { color: #fff; }
#filter li li { 
	background: #e0e0e0;
	border-left: 1px solid #ccc; border-bottom: 1px solid #ccc;
	color: #000;
	float: left;
	font-size: 11px;
	line-height: 1em;
	margin: 0;
	padding: 0;
	width: 114px;
	}
#filter li ul {
	display: none;
	left: 0;
	margin: 0;
	position: absolute;
	top: 1.8em;
	width: 100%;
	}
#filter .open ul,
#filter .open li { position: relative; }
#filter .open li ul { position: absolute; }
#filter li:hover ul, #filter li.hover ul { display: block; }
#filter ul.tag { float: right; width: 369px; z-index: 9; }
#filter ul.tag li { width: 357px; }
#filter ul.tag li ul { width: 369px; }
#filter ul.tag li li { width: 122px; }
#filter dl {
	background: #E7F6D5;
	color: #59B000;
	margin: 0 0 0.5em;
	overflow: hidden;
	padding: 0.5em 0;
	width: 100%;
	}
#filter dt {
	float: left;
	font-weight: bold;
	font-size: 10px;
	line-height: 10px;
	padding: 0 0 0 6px;
	text-transform: uppercase;
	}
#filter dd { 
	float: right;
	line-height: 10px;
	padding: 0 0 0 6px;
	width: 364px;
	}

/* -- forms -- */
form {
	margin: 1em 0 0;
	overflow: hidden;
	width: 460px;
	}
fieldset {
	border-top: 2px solid #e0e0e0;
	margin: 1em 0 0;
	padding: 10px 0 0; 
	}
label, .label {
	float: left;
	padding: 0.5em 8px 0 0;
	text-align: right;
	width: 100px;
	}
label em { display: block; font-size: 10px; }
label.radio {
	float: none;
	padding: 0;
	text-align: left;
	width: auto;
	}
label.radio input { margin: 0 4px 30px 0; }
legend { 
	color: #737373;
	font-size: 10px;
	letter-spacing: 0.2em;
	margin: 0;
	text-transform: uppercase;
	}
.field {
	margin: 0.5em 0;
	overflow: hidden;
	padding: 0 20px;
	}
textarea { overflow: auto; }
input.text, textarea { 
	background: #e0e0e0;
	border: 1px solid #999;
	color: #333;
	float: right;
	font: 12px Verdana, Sans-serif;
	padding: 0.4em 2px;
	width: 300px;
	}
input.text:focus, textarea:focus, input.text:hover, textarea:hover { background: #efefef; color: #000; }
.input {
	float: right;
	width: 310px;
	}
.submit { 
	clear: both;
	padding: 0 20px;
	} 
input.submit { 
	background: #505050 url(/img/buttons/bg.gif) repeat-x 0 0;
	border: none;	
	color: #e0e0e0;
	cursor: pointer;
	font: bold 10px Verdana, Sans-serif;
	margin: 0 0 0 114px;
	padding: 0.5em 1.5em;
	}	
.submit input:hover, input.submit:hover { color: #fff; }

/* validation */
input.error, textarea.error { 
	background: #fff;
	border: 1px solid #c00;
	color: #000;
	font: 12px Verdana, Sans-serif;
	padding: 0.4em 2px;
	}
input.error { float: right; width: 300px; }
.errortext, .failure { color: #c00; font-weight: bold; }
.success {
	font-weight: bold;
	padding-bottom: 90px;
	}

/* generate code form */
#generatecode { margin: 0; }
#generatecode label { margin: 1em 0; }
#generatecode .field { clear: none; float: left; margin-top: 0; padding: 0 30px 0 0; width: auto;}
#generatecode .textarea { float: none; }
#generatecode div.submit { float: none; margin: 0 0 2em; padding: 0; width: auto; }
#generatecode .submit input { float: none; margin: 0; }
#generatecode textarea {
	float: none;
	font-family:  Courier, monospace; font-size: 13px;
	line-height: 1.25em;
	height: 100px;
	margin: 5px 0 0;
	width: 400px;
	}
	
/* search form */
.searchform { 
	margin: 0;
	overflow: visible;
	position: absolute;
	right: 20px;
	top: 78px;
	width: 360px;
	}
.searchform label { display: none; }
.searchform .text {
	float: right;
	height: 18px;
	margin: 0 6.2em 0 0;
	padding: 4px 2px 0;
	width: 170px;
	}
.searchform input.submit { 
	clear: none;
	float: none;
	height: 24px;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 7em;
	}
#content .searchform {
	padding-bottom: 100px;
	position: relative;
	right: auto;
	top: auto;
	}
#content .searchform label {
	display: block;
	height: auto;
	margin: 0 0 0.25em;
	overflow: visible;
	text-align: left;
	text-indent: 0;
	width: 100%;
	}
#content .searchform .text {
	float: left;
	margin-right: 0.3em;
	}
#content .searchform input.submit {
	float: left;
	margin: 0;
	position: relative;
	right: auto;
	top: auto;
	}
