/* @override 
	http://localhost:8888/RyanDownie/css/screen.css */

/*
	Website: Ryan Downie Personal
	Designer: RyanDownie (Ryan@RyanDownie.com)
	Main Developer: RyanDownie
	Version: 1.0
	-------------------------------------------------------------
	Contents
	-------------------------------------------------------------
/* 1. General Settings 
---------------------------------------------------------------------*/


	/*Reset Based on the YUI framework*/
	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, li {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;}
	article, aside, dialog, figure, footer, header, hgroup, nav, section {display : block; }
	abbr,acronym { border-bottom:1px dotted #000;cursor:help;}
	em{font-style:italic;}
	caption{margin-bottom:.5em;text-align:center;}
	p,ul,dl,ol,fieldset,table{margin-bottom:1em;}
	p{line-height:19px;text-transform:none; font-size: 12px; width: 80%; text-shadow: 1px 1px 0 rgba(0,0,0,.3);
	}
	ol{list-style:lower-roman;}
	a {
		color: #bc1718; text-decoration: none; font-weight: bold;
	}
	
	nav a {
		color: #fff; font-weight: normal;
	}
	
	a.button {
	font-size: 13px; font-weight: bold; text-shadow: 1px 1px 0 rgba(0,0,0, .4); -webkit-border-radius: 4px; -moz-border-radius: 4px;border-radius: 4px; color: #fff;
	background-image: linear-gradient(bottom, rgb(144,21,21) 15%, rgb(191,31,31) 66%);
	background-image: -o-linear-gradient(bottom, rgb(144,21,21) 15%, rgb(191,31,31) 66%);
	background-image: -moz-linear-gradient(bottom, rgb(144,21,21) 15%, rgb(191,31,31) 66%);
	background-image: -webkit-linear-gradient(bottom, rgb(144,21,21) 15%, rgb(191,31,31) 66%);
	background-image: -ms-linear-gradient(bottom, rgb(144,21,21) 15%, rgb(191,31,31) 66%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0.15, rgb(144,21,21)),
		color-stop(0.66, rgb(191,31,31))
	);
	
	padding: 10px 15px; -webkit-box-shadow: 0px 2px 0 rgba(255,255,255,.2) inset, 1px 1px 0 rgba(0,0,0,.2);
	box-shadow: 0px 2px 0 rgba(255,255,255,.2) inset, 1px 1px 0 rgba(0,0,0,.2);
	-moz-box-shadow: 0px 2px 0 rgba(255,255,255,.2) inset, 1px 1px 0 rgba(0,0,0,.2);
	
	margin: -5px 0 0; float: left;
	}
	
	a.button:hover {
	background: #bf1f1f;
	background: -moz-linear-gradient(top,  #bf1f1f 0%, #901515 99%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bf1f1f), color-stop(99%,#901515));
	background: -webkit-linear-gradient(top,  #bf1f1f 0%,#901515 99%);
	background: -o-linear-gradient(top,  #bf1f1f 0%,#901515 99%);
	background: -ms-linear-gradient(top,  #bf1f1f 0%,#901515 99%);
	background: linear-gradient(top,  #bf1f1f 0%,#901515 99%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bf1f1f', endColorstr='#901515',GradientType=0 );
	
	
		text-shadow: -1px -1px 0 rgba(0,0,0, .4);
	}
	
	a.button:active {
		box-shadow: 1px 1px 5px rgba(0,0,0,.3) inset;
		-webkit-box-shadow: 1px 1px 5px rgba(0,0,0,.3) inset;
		-moz-box-shadow: 1px 1px 5px rgba(0,0,0,.3) inset;
		
		
	}
	
/*	-------------------------------------------------------------
	 General Layout
---------------------------------------------------------------------*/
	/* Wrappers */
	html {
		background: url('../site-images/background.jpg') repeat left top; font-family: arial, sans-serif; color: #fff; 
	}
	section#wrapper {
	width: 1010px;
	overflow: hidden;
	margin: 0 auto;
	background: black;
	}
	
	section#masthead {
		float: left; width: 100%;padding: 10px;
	}
	
	nav {
	float: right;
	width: 411px;
	margin: 30px 0 0;
	}
	
	nav li {float: left;}
	
	nav li a {
	font-size: 21px;
	background: url('../site-images/sprite.jpg') no-repeat -15px 0px;
	padding: 15px 22px 0 38px;
	display: block;
	}
	
	nav li:nth-of-type(2n) a {
		background-position: -15px -46px;
	}
	
	nav li:nth-of-type(3n) a {
		background-position: -15px -89px;
	}
	
	
	section#work, section#work li {
		float: left; width: 100%;
	}
	
	section#work li {
	min-height: 738px;
	border-bottom: 1px dashed red;
	margin-bottom: -9px;
	}
	
	section#work li .content {
	float: left;
	width: 236px;
	margin: 49px 0px 0 17px;
	}
	
	div.image {
	float: right;
	background: url('../site-images/web-browser.png') repeat -7px -10px;
	padding: 47px 0 18px 2px;
	width: 735px;
	margin: 42px 14px 0 0;
	}
	
	li.spotify {background: url('../site-images/spotify.jpg') no-repeat top center;}
	li.ui {background: url('../site-images/ui.jpg') no-repeat top center;}
	li.bikey {background: url('../site-images/bikey-bg.jpg') no-repeat top center;}
	li.woothemes {background: url('../site-images/woothemes-bg.jpg') no-repeat top center;}
	li.tnw {background: url('../site-images/tnw-bg.jpg') no-repeat top center;}
	li.getrightmusic {background: url('../site-images/getrightmusic-bg.jpg') no-repeat top center;}
	li.prodcast {background: url('../site-images/prodcast-bg.jpg') no-repeat top center;}
	li.armitage {background: url('../site-images/armitage-bg.jpg') no-repeat top center;}
	
	section#work li.ui .content {width: 554px;} 
	section#work li.ui p {width: 240px;} 
	section#work li.ui a {
		float: left; margin: 0 10px 0 0;
	}
	
	
	

	
	
h1 {
	background: url('../site-images/logo.png') repeat left top; display: block; width: 218px; height: 67px; text-indent: -9999px; float: left; margin: 20px 0;
}	
	
h2, nav {
font-family: 'Oswald', sans-serif;
text-transform: uppercase;
font-weight: 400;
text-shadow: 1px 1px rgba(0, 0, 0, .2);
font-style: normal;
}

h2 {
	font-size: 25px;
}

h4 {
font-family: 'Cutive', serif; font-weight: normal; color: #f7d8a8; margin: 5px 0 5px; font-size: 12px;
}