/*
 * Screen css for michaelallanson.com
 * @author Michael Allanson
 *
 */

/* =0 Eric Meyer css reset - modify as necessary
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
		html, body, div, span, applet, object, iframe,
		h1, h2, h3, h4, h5, h6, p, blockquote, pre,
		a, abbr, acronym, address, big, cite, code,
		del, dfn, em, font, img, ins, kbd, q, s, samp,
		small, strike, strong, sub, sup, tt, var,
		b, u, i, center,
		dl, dt, dd, ol, ul, li,
		fieldset, form, label, legend,
		table, caption, tbody, tfoot, thead, tr, th, td {
			margin: 0;
			padding: 0;
			border: 0;
			outline: 0;
			font-size: 100%;
			vertical-align: baseline;
			background: transparent;
		}
		
		body {
			line-height: 1;
		}
		
		ol, ul {
			list-style: none;
		}
		
		blockquote, q {
			quotes: none;
		}
		
		blockquote:before, blockquote:after,
		q:before, q:after {
			content: '';
		}

		/* remember to define focus styles! */
		:focus {
			outline: 0;
		}

		/* remember to highlight inserts somehow! */
		ins {
			text-decoration: none;
		}
		
		del {
			text-decoration: line-through;
		}

		/* tables still need 'cellspacing="0"' in the markup */
		table {
			border-collapse: collapse;
			border-spacing: 0;
		}


/* =1 html elements
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

		body {
			background: #e5e5e5;
			color: #fff;
			font: 62.5%/1.25 Monaco, "Lucida Console", monospace; /* reset 1em to 10px */
			text-shadow: #fff 0 0 0;
		}

		/*
		 * headings
		 */
				h1 {
					float: left;
					font-family: Monaco, "Lucida Console", monospace;
					font-size: 24px;
					font-weight: normal;
					text-shadow: #393939 1px 1px 5px; /* just for fun */
				}

				h1 span {
					display: block;
					color: #00aeef;
				}
				
				h2 {
					font-size: 1.2em;
					font-weight: normal;
					margin: .2em 0 2em 0;
				}
				
				h3 {
					font-weight: normal;
					margin-bottom: 0.5em;
				}


		/*
		 * lists
		 */
				li {
					padding-bottom: 0.2em;
				}


		/*
		 * text
		 */
				p {
					font-size: 1.1em;
					margin-bottom: 0.6em;
				}


		/*
		 * links
		 */
		 		a {
					color: #fff;
				}

				a:hover,
				a:active, 
				a:focus {
					color: #7F7F7F;
					background-color: #fff;
					text-decoration: none;
				}
				
				
				#about a:hover,
				#about a:active, 
				#about a:focus,
				#footer a:hover,
				#footer a:active, 
				#footer a:focus {
					color: #393939;
				}

		/*
		 * misc
		 */


/* =1 global classes
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
		/* print styles */
		.printonly { display: none !important; }

		/*
		* clearfix - fixes float clearing issues
		*/
				/* Gecko-based browsers */
				 .clearfix:after {
					content: "."; 
					display: block; 
					height: 0px; 
					clear: both; 
					visibility: hidden;
				}


/* =2 global ids / areas
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
		/*
		 * Jump links - accessibility friendly links at the top of every page
		 */
				/* not added because content starts at top of page - nothing to jump! */

		/*
		 * header
		 */
				#header {
					background-color: #393939;
					height: 70px;
					margin-bottom: 3.5em;
					overflow: auto; /* triggers clearfix */
					padding: 2.5em 0 2em 3.5em;
				}


		/*
		 * content
		 */
				#content {
					margin: 0 1.5em 0 3.5em;
					padding-bottom: 2em;
					position: relative;
				}
				
				.project {
					background-color: #7f7f7f;
					margin: 0 1.5em 1.5em 0;
					padding: 1em 1em 2.5em;
					width: 365px;
				}
				
				.hasJs .project {
					position: absolute;
				}

				.project img {
					margin-bottom: 1em;
					position: relative;
				}


				/*
				 * content : about
				 */
						#about {
							background-color: #393939;
						}
				
						#about h2 {
							margin-bottom: .4em;
							text-transform: uppercase;
						}


		/*
		 * footer
		 */
				#footer {
					background-color: #393939;
					width: 100%;
				}

				#footer p {
					padding: 1em 0 1em 4.5em;
					margin: 0;
				}
	

/* = page specific styles
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/