/*

+----------------------------------------------------------------------------------------------------+
|                                                                                                    |
|    TYPOGRIDPHY - TYPOGRAPHICAL AND GRID LAYOUT CSS FRAMEWORK FROM HARRY ROBERTS OF CSS WIZARDRY    |
|                                                                                                    |
+-------------------------------------------------+--------------------------------------------------+
|                                                 |                                                  |
|   TYPOGRIDPHY IS © COPYRIGHT OF HARRY ROBERTS   |   v 0.1.1                                        |
|   IT IS FREE TO BE USED AND MODIFIED PROVIDED   |   May 2008                                       |
|   THIS TEXT REMAINS INTACT -- CSSWIZARDRY.COM   |   http://csswizardry.com                         |
|                                                 |                                                  |
+-------------------------------------------------+--------------------------------------------------+



COLOUR REFERENCES
BODY BG: #FFF
TOP STRIP: #000
BODY COLOUR: #666
LINKS: #000
-------------------------------------------------------- */


/* RESET */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {  
	margin:0; 
	padding:0; 
} 
table { 
	border-collapse:collapse; 
	border-spacing:0; 
} 
fieldset,img {  
	border:0; 
} 
address,caption,cite,code,dfn,em,strong,th,var { 
	font-style:normal; 
	font-weight:normal; 
} 
ol,ul { 
	list-style:none; 
} 
caption,th { 
	text-align:left; 
} 
h1,h2,h3,h4,h5,h6 { 
	font-size:100%; 
	font-weight:normal; 
} 
q:before,q:after { 
	content:''; 
} 
abbr,acronym {
	border:0; 
}
/*---------- END RESET ----------*/


/*-------------------------------------------+
|                                            |
|            MAIN STRUCTURE STYLES           |
|                                            |
+-------------------------------------------*/
html{
	font-size:100%;
	min-height:101%;
}
body{
	font-size:62.5%; /* 10 px */
	font-family:Georgia, "Times New Roman", serif;
	color:#fff;
	background:/*url(images/grid.gif) top center repeat-y*/ #fff; /* Uncomment to display the grid */
	background: url(/assets/imgs/bg.png) top center repeat-y #fff; 
	padding:0 1em;
}
#wrapper{
	width:98em;
	margin:0 auto;
	background: #202020;
}
#header{
	width:94em;
	padding-top:1.5em;
	margin-bottom:2em;
}
/*NAVIGATION
-------------------------------------------------------- */
#nav{
	font-size:2em;
}
#nav a{
	font-variant:small-caps;
	color:#fff;
}
#nav a:hover{
	text-decoration:none;
}
#nav span{
	float:right;
	margin-top:-1.2em;
}
/*FOOTER NAVIGATION
-------------------------------------------------------- */
#footer-nav{
	word-spacing:0.2em;
}
#footer-nav a{
	color:#000;
	font-variant:small-caps;
}
/*GRIDS
-------------------------------------------------------- */
/* Set styles common among all grids - all grid divs must be assigned this class */
.generic{
	float:left;
	padding-top:1em;
	margin-bottom:2em;
}
/* Sets styles for any 'start' grids - this class MUST be given to a grid that is the first in a horizontal series */
.clear{
	clear:both;
}
/* Sets styles for any 'end' grids - this class MUST be given to a grid that is the last in a horizontal series */
.end{
	margin-left:0 !important;
	margin-right:0 !important;
}

/* 220px */
.twotwenty{
	width:22em;
	margin-right:2em;
}
/* 280px */
.twoeighty{
	width:28em;
	margin-right:2em;
}
/* 340px */
.threeforty{
	width:34em;
	margin-right:2em;
}
/* 400px */
.fourhun{
	width:40em;
	margin-right:2em;
}
/* 460px */
.foursixty{
	width:46em;
	margin-right:2em;
}
/* 520px */
.fivetwenty{
	width:52em;
	margin-right:2em;
}
/* 580px */
.fiveeighty{
	width:58em;
	margin-right:2em;
}
/* 640px */
.sixforty{
	width:64em;
	margin-right:2em;
}
/* 700px */
.sevenhun{
	width:70em;
	margin-right:2em;
}
/* 760px */
.sevensixty{
	width:76em;
	margin-right:2em;
}
/* 820px */
.eighttwenty{
	width:82em;
	margin-right:2em;
}
/* 880px */
.eighteighty{
	width:88em;
	margin-right:2em;
}
/* 940px */
.nineforty{
	width:94em;
}
/* 980px */
.nineeighty{
	width:98em;
}

/*-------------------------------------------+
|                                            |
|                FONT STYLES                 |
|                                            |
+-------------------------------------------*/
/*PARAGRAPHS
-------------------------------------------------------- */
.generic p{
	font-size:1.2em;
	line-height:1.5em;
	margin-bottom:1.5em;
}
/* Styles an introductory paragraph, similar to newspapers. Assign this class to the first paragraph in an article */
p.intro:first-line{
	font-variant:small-caps;
}
/* Styles a drop cap on each paragraph with this class */
p.drop:first-letter{
	float:left;
	font-size:3em;
	margin-top:-0.05em;
	margin-right:0.1em;
	margin-bottom:-0.5em;
}
/*HEADINGS
-------------------------------------------------------- */
h1{
	color:#fff;
	font-size:3em;
	margin-bottom:0.6em;
	font-style:italic;
	line-height:1.2em;
}
h2{
	color:#fff;
	font-size:2em;
	margin-bottom:0.9em;
	line-height:0.9em;
}
h3{
	color:#fff;
	font-size:1.5em;
	margin-bottom:1.2em;
	line-height:1.2em;
	font-variant:small-caps;
}
h4{
	color:#fff;
	font-size:1.2em;
	margin-bottom:1.5em;
	line-height:1.5em;
	font-variant:small-caps;
}
h5{
	color:#fff;
	font-size:1em;
	margin-bottom:1.8em;
	line-height:1.8em;
	font-variant:small-caps;
}
h6{
	color:#fff;
	font-size:1em;
	margin-bottom:1.8em;
	line-height:1.8em;
}
/*LINKS
-------------------------------------------------------- */
p a{
	color:#fff;
}
p a:hover{
	text-decoration:none;
}
h1 a{
	color:#fff;
}
h1 a:hover{
	text-decoration:none;
}
li a{
	color:#fff;
}
li a:hover{
	text-decoration:none;
}
/*ALL THE TRIMMINGS
-------------------------------------------------------- */
blockquote p{
	font-size:1.2em!important;
	line-height:1.5em!important;
	margin-bottom:1.5em!important;
	font-style:italic;
	font-weight:bold;
}
blockquote p cite{
	font-style:normal;
}
.generic strong{
	font-variant:small-caps;
}
.generic em{
	font-style:italic;
	font-weight:inherit;
}
.amp{ /* Give those ampersands a right sexy look */
	font-family:Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;
	font-style:italic;
	font-weight:normal;
	line-height:inherit;
}
abbr{
	border-bottom:1px dotted #666;
	border-color:inherit;
	cursor:help;
}
.clear{
	clear:both;
}
.right-float{ /* Float any item to the right */
	float:right;
	margin-left:2em;
	margin-right:0;
}
.left-float{ /* Float any item to the left */
	float:left;
	margin-right:2em;
	margin-left:0;
}
.code{ /* Styling for and code type items */
	font-family:Courier, "Courier New", monospace;
	background:#ddd;
	font-size:1em;
}
/*-------------------------------------------+
|                                            |
|               IMAGE STYLES                 |
|                                            |
+-------------------------------------------*/
img{
	font-size:1em;
}
img.left-img{ /* Float any image to the LEFT and give it some margin */
	font-size:1em;
	float:left;
	padding:4px;
	border:1px solid #ccc;
	margin-bottom:1.8em;
	margin-right:2em;
	margin-top:0.3em;
}
img.right-img{ /* Float any image to the RIGHT and give it some margin */
	font-size:1em;
	float:right;
	padding:4px;
	border:1px solid #ccc;
	margin-bottom:1.8em;
	margin-left:2em;
	margin-top:0.3em;
}
/*CONTACT FORM STYLES
-------------------------------------------------------- */
#contact-form{
}
#contact-form label{
	width:10em;
	float:left;
	margin-top:0.6em;
}
#name, #form-email, #durl, #location{
	width:42.7em;
	height:20px;
	padding:3px;
	padding-top:5px;
	border:2px solid #666;
	margin-bottom:18px;
	background:#fff !important;
}
#comments{
	width:43.8em;
	padding:3px;
	overflow:auto;
}
#name:active, #form-email:active, #url:active, #location:active, #comments:active, #submit:active, #name:focus, #form-email:focus, #url:focus, #location:focus, #comments:focus, #submit:focus{
}
#asubmit{
	clear:both;
	padding:5px;
	border:2px solid #666;
	background:#fff !important;
	cursor:pointer;
	margin-left:9em;
}
#reset{
	clear:both;
	padding:3px;
	border:none;
	background:#f00 !important;
	cursor:pointer;
	float:right;
	color:#fff;
	margin-top:-28px;
}
/*-------------------------------------------+
|                                            |
|                LIST STYLES                 |
|                                            |
+-------------------------------------------*/
ul{
	margin-bottom:1.8em;
	list-style:square inside;
}
ul li{
	font-size:1.2em;
	line-height:1.5em;
}
ul li.caption{ /* Apply this class to the first list item in a list to give it a caption */
	font-variant:small-caps;
	list-style:none;
	color:#000;
}
li > ul, li > ol{
	margin-bottom:0;
	margin-left:5em;
}
li > ul li, li > ol li{
	font-size:1em;
}
ol{
	margin-bottom:1.8em;
	list-style:decimal inside;
}
ol li{
	font-size:1.2em;
	line-height:1.5em;
}
/*-------------------------------------------+
|                                            |
|               MISC. STYLES                 |
|                                            |
+-------------------------------------------*/


/*

	"I could eat a knob at night"
		-	Karl Pilkington

*/

html {
	background: #333333;
}

body{
	background: #333333;
}

p {
	font-size: 12px;
}

#header {
	margin-top: 2em;
	padding: 2em;
	background: #101010;

	border-bottom: 2px solid #404040;
}

#header h1 {
	float: left;
}

	#header h1 a {
		outline: none;
		text-indent: -5000px;
		display: block;
		width: 193px;
		height: 34px;
		background: url("/assets/imgs/logo.png");
	}

	#header div.about {
	}

	#header div.about .what {
		padding: 0.5em 0em;
		float: left;
		line-height: 2em;
		border: 1px solid #040404;
		display: block;
		text-align: center;
		background: #fff;
		color: #000;
	}

		#header div.about .what ul {
			list-style: none;
		}

			#header div.about .what ul li {
				float: left;
				display: block;
				width: 12em;
			}

			#header div.about .what ul li.left {
				text-align: left;
			}

		#header div.about .what h2 {
			padding-top: 0.5em;
			width: 14em;
			color: #000;
		}

		#header div.about .what h2.inBlog {
			padding-bottom: 0.5em;
		}

	#header div.about p {
		font-size: 1.5em;
		margin-left: 20em;
		line-height: 1.5em;
	}

		#header div.about em {
			color: #fffb2e;
		}

#content {
	padding-left: 2em;
}

#mainMenu {
	margin-top: 0.5em;
	float: right;
}
	#mainMenu ul {
		list-style: none;
	}
		#mainMenu ul li {
			display: inline;
		}

			#mainMenu ul li a {
				padding: 10px;
				background: #000;
				color: white;			
				text-decoration: none;
			}

			#mainMenu ul li a:hover {
				background: #444;
			}
#word {
	font-family: arial;
}

	#word h2 {
		padding-bottom: 0.75em;
		border-bottom: 1px dotted #404040;
		font-family: georgia;
	}
		#word h2 span {
			font-family: arial;
			padding: 3px 5px;
			background: #fff;
			color: #000;
			margin-right: 10px;
			font-family: arial;
		}

	#word h3, #word h2.viewWord {
		font-weight: bold;
		font-size: 2em;
		font-family: arial;
		text-transform: uppercase;
	}

	#word p.extended {
		display:none;
	}

#bottom {
	border-top: 1px solid #ccc;
	padding: 2em 0 0 0;	
}

#pastVotes h2 {
	padding-bottom: 0.75em;
	border-bottom: 1px dotted #404040;
	
}

div.pastVote h2 {
	padding-top: 0.75em;
	border-top: 1px solid #404040;
}

ul.pastVotes {
	list-style: none;
}

	ul.pastVotes li {
		clear: both;
	}
		ul.pastVotes li.header {
			border-bottom: 1px dotted #404040;
			padding-bottom: 1em;
			margin-bottom: 1em;
		}

		ul.pastVotes li .pastVote {
		}

		ul.pastVotes li .pastVote .word {
			float: left;
			display: block;
			overflow: hidden;
			width: 130px;
			margin-right: 20px;
		}

		ul.pastVotes li .pastVote .yourvote {
			float: left;
			display: block;
			overflow: hidden;
			width: 130px;
			margin-right: 20px;
		}
			

.recentWordVotes {
	border-top: 1px dotted #404040;
	padding-top: 1em;
}

ul.recentVotes {
	list-style: none;
}
	ul.recentVotes li {
		display: inline;
	}

	ul.recentVotes li a {
		float: left;
		display: block;
		width: 50px;
		height: 20px;
	}
			

ol.pastVoteChart {
	height: 20px;
	width: 640px;
	display: block;
	overflow: hidden;
	list-style: none;
}

	ol.pastVoteChart li {
		display: inline;
	}

	ol.pastVoteChart li a {
		float: left;
		display: block;
		height: 20px;
		border: 0;
	}


#voteform {
}

	#voteform h2 {
		padding-bottom: 0.75em;
		border-bottom: 1px dotted #404040;
	}

	#voteform h2 span {
		font-family: arial;
		padding: 3px 5px;
		background: #fff;
		color: #000;
		margin-right: 10px;
	}

	#voteform form fieldset legend {
		font-size: 2em;
		line-height: 3em;
	}

	#voteform form fieldset ol {
		overflow: hidden;
		list-style: none;
		margin-left: -5px;
	}

		#voteform form fieldset ol li {
			overflow: hidden;
			display: inline;
		}

			#voteform form fieldset ol li label {
				overflow: hidden;
				display: none;
			}

			#voteform form fieldset ol li input {
				overflow: hidden;
				float: left;
				padding: 10px;
				border: none;
				display: block;
				width: 124px;
				height: 93px;
				margin-bottom: 5px;
				margin-left: 5px;
				border: 5px solid inherit;
			}

				#voteform form fieldset ol li input:hover {
					cursor: pointer;
					border: 5px solid #ddd;
				}

			#voteform form fieldset ol li a.skip {
				text-align: center;
				float: left;
				padding: 10px;
				display: block;
				width: 102px;
				height: 71px;
				border: 1px solid #383838;
				margin-bottom: 5px;
				margin-left: 5px;
				line-height: 71px;
				text-decoration: none;
			}


#footer {
	border-top: 1px solid #404040;
	padding: 2em;
	margin: 2em 0;
	background: #101010;
	font-family: arial;
	font-size: 11px;
}

	#footer a {
		text-decoration: none;
	}

	#footer .info {
		float: left;
		width:41em;
	}

	#footer .ads {
		float: right;
		width:42em;
	}

	#footer .info img {
		padding-left: 1em;
	}

	#footer p.copyright {
		float: left;
		padding: 1em 0;
	}

	
	#footer p.credits {
		float: right;
		padding: 1em 0;
	}

		#footer p.credits a {
			text-decoration: none;
		}

		#footer p.credits a:hover {
			text-decoration: underline;
		}

	#footer .suffolk { }
		#footer .suffolk p.suffolk-logo {
			width: 8em;
			float: left;
			margin-right: 1em;
		}

		#footer .suffolk p.suffolk-project {
			color: #999;
			font-family: georgia;
			width: 20em;
			float: left;
			font-size: 1.25em;
			margin-top: 2em;
		}

		#footer .suffolk p.suffolk-project em {
			color: #fffb2e;
		}

	
.required {
	color: #c00;
}
		
ul.flash {	
	list-style: none;
	border: 1px solid #009900;
	background: #def3de;
}

	ul.flash li {	
		padding: 1em;
		color: #009900;
	}

ul.error {	
	list-style: none;
	border: 1px solid #990000;
	background: #f6c0c0;
}

	ul.error li {	
		padding: 1em;
		color: #990000;
	}

#wordSearch {}
	#wordSearch form {}
		#wordSearch form fieldset {}
			#wordSearch form fieldset ol {
				list-style: none;
			}
	
				#wordSearch form fieldset ol li {
				}


#suggestWord {}

	#suggestWord form {}

		#suggestWord form fieldset {}

			#suggestWord form fieldset ol {
				list-style: none;
			}

				#suggestWord form fieldset ol li {
					clear: both;
					padding-top: 1em;
				}

					#suggestWord form fieldset ol li label { 
						display: block; 
						width: 150px; 
						float: left;
					}

					#suggestWord form fieldset ol li input { 
						display: block; 
						width: 400px; 
						float: left;
					}

						#suggestWord form fieldset.submit ol li input { 
							margin-left: 150px;
							width: 80px; 
						}
	
					#suggestWord form fieldset ol li textarea { 
						display: block; 
						width: 400px; 
						height: 200px; 
						float: left;
					}



.post {
	margin-bottom: 1em;
	padding-bottom: 1em;
}


	.post a {
		color: #fffb2e;
		text-decoration: none;
	}

	.postmetadata {
		border: 1px dotted #404040;
		border-width: 1px 0;
		padding: 1em 0;
		
		font-family: arial;
	}

	.post h2 {
		color: #fffb2e;;
		text-decoration: none;
		padding: 0.5em 0;
		display: block;
		border-bottom: 1px dotted #404040;
		margin: 0 0 0.5em 0;
		border-top: 2px solid #404040;
	}


	.post h2 a {
		color: #fffb2e;
		text-decoration: none;
		margin: 0;
	}

	.post h2 a:hover {
		border-bottom: 1px dotted #fffb2e;
		text-decoration: none;
	}

	.post .postmeta {
		border-bottom: 1px dotted #393939;
		margin:  1em 0;
		padding-bottom: 0.5em;
	}

	.post h3.categories {
		font-variant:normal;
		float: left;
		margin: 0;
		font-size: 1.15em;
	}
	
	.post h3.date  {
		float: right;
		font-variant:normal;
		color: #999;
		margin: 0;
		font-size: 1.15em;
	}



#comments {
	padding: 0;
	width: 64em;
	overflow:hidden;
}

	#comments ol {
		border-top: 1px dotted #404040;
		list-style: none;
		padding-top: 2em;
	}

		#comments ol li {
			border-bottom: 1px dotted #404040;
		}

			#comments ol li .avatar {
				margin: 0;
				paddng: 0;
				float: left;
			}

			#comments ol li .commentinfo {
				padding-left: 1em;
				width: 45.6em;
				float: left;
				background: #101010;
				height: 6.65em;
			}

				#comments ol li h3 {
					margin: 0;
					padding: 0;
					font-variant: normal;
					margin: 1em 0 0.5em 0;
				}

					#comments ol li h3 a {
						text-decoration: none;
					}

				#comments ol li h4 {
					margin: 0;
					padding: 0;
					font-variant: normal;
					font-size: 0.9em;
				}

					#comments ol li h4 a {
						text-decoration: none;
					}

			#comments ol li .commentBody {
				background: #1a1a1a;
				padding: 2em;
			}
			

#commentform {
}

	#commentform input {
		width: 300px;
	}

	#commentform textarea {
		width: 500px;
	}

	#commentform #submit {
		width: auto;
	}

#searchform {
	margin: 0 0 2em 0;
}

#sidebar {
	margin: 0;
	padding: 0;
}

	#sidebar h2 {
		padding: 0.5em 0;
		display: block;
		border-bottom: 1px dotted #404040;
		margin: 0 0 0.5em 0;
		border-top: 2px solid #404040;
		font-size: 1.5em;
	}

	#sidebar ul {
		list-style: none;
		margin: 1em;
		padding-bottom: 2em;
	}
	
	
	#sidebar ul li {
	}

#stats {}
		
	
div.adsense {
	border: 1px solid #404040;
	padding: 1em 0;
	text-align: center;
	margin-bottom: 1em;
}



#wordList {
	margin: 0 0 2em 0;
	padding: 0;
}

	#wordList ol {
		list-style: none;
	}
	
		#wordList ol li.header {		
			margin-top: 2em;
			width: 100%;
			clear: both;
		}

		#wordList ol li.header:hover {		
			background: inherit;
		}

		#wordList ol li {		
			width: 33%;
			float: left;
		}

		#wordList ol li:hover {		
			background: #555;
		}

		#wordList ol li h2 {
			text-transform: uppercase;
			display: block;
			text-align: center;
			border-bottom: 1px dotted #444;
			border-top: 2px solid #444;
			padding: 1em 0;
		}


		#wordList ol li h3 {
			font-variant:normal;
			margin: 0;
			padding: 0.5em 1em;
			font-size: 1.25em;
		}

			#wordList ol li h3 a {
				text-decoration: none;
				display: block;
			}