/*------------------------------------+
 | Site: Sarah Enid Moule : Portfolio |
 +------------------------------------*/
 
 /* Site Design: 		www.WildwoodCreative.com.au */
 /* Site Designer:	Sarah Enid Moule */
 /* Site Builder:		Sarah Enid Moule */
 /* Created:				30th November 2009 */
 
@import url("reset.css");


/* Typography  
======================================================================*/
h1, h2, h3, h4, h5, p {line-height:18px;}

h1 {text-indent:-9999px; height:0px;}
h2 {font:25px "Courier New", Courier, monospace; color:#fff; padding:0 0 10px 0;}
h3 {font-size:16px; color:#5aadcc; padding:0 0 15px 0; font-weight:normal;}
h4 {font-size:13px; color:#5aadcc; font-weight:bold; padding:0 0 10px 0;}
h5 {font:14px "Courier New", Courier, monospace; color:#FFF;}
p {padding:0 0 10px 0; text-align:justify;}

ul.list {padding:0 0 10px 0;}
ul.list li {background:url(../images/list_dot.gif) no-repeat 0 5px; padding:0 0 7px 20px !important; line-height:16px;}

em {font-size:13px;}



/* Navigation layout 
======================================================================*/
a {text-decoration:none; color:#66FFFF; text-decoration:underline;}
a:hover {text-decoration:underline;}
a:visited {color:#66CCCC; text-decoration:underline;}

ul.nav {list-style:none; width: 600px; height:25px; display: inline-block; clear: both; float:right; padding:0 31px 0 0;}
ul.nav li {float:left; height:25px; overflow:hidden;}
ul.nav li a {display:block; height:25px; text-indent:-9999px;}
ul.nav li a:hover {background-position:0 -25px!important;}

ul.nav li#about a {background:url(../images/nav/about.gif) no-repeat 0 0; width: 108px !important;} 
ul.nav li#skillset a {background:url(../images/nav/skillset.gif) no-repeat 0 0; width: 124px !important;} 
ul.nav li#history a {background:url(../images/nav/workhistory.gif) no-repeat 0 0; width: 164px !important;} 
ul.nav li#contact a {background:url(../images/nav/contact.gif) no-repeat 0 0; width: 202px !important;} 





/* Core layout 
======================================================================*/
body {background:#26201c url(../images/background/background_01.gif) repeat-x top center fixed; font:12px Arial, Helvetica, sans-serif; color:#b6b6b6;}
	#robot {width:auto; height:auto; margin:0 auto; background:url(../images/background/drunk_bot.png) no-repeat top center fixed; padding:0 0 20px 0;}
		#container {width:1010px; height:auto; margin:0 auto;}
		#banner {height:155px; overflow:hidden;}
		
#my_portfolio {width:1010px; height:540px; background:url(../images/background/portfolio_bg.gif) no-repeat 0 0; overflow:hidden;}
	ul.portfolio {padding:0 0 0 30px;}
	ul.portfolio li {width:150px; height:150px; overflow:hidden; padding:7px 0 0 7px; float:left;}
.content {width:947px; height:auto; margin:0 auto;}
	.info {width:887px; height:auto; margin:20px 0 0 0; background:url(../images/background/transparent_content.png) repeat-y 0 0; padding:30px 30px 10px 30px;}
	
ul.three_columns {}
ul.three_columns li.left {width:320px; height:auto; float:left; padding:0 0 0 0;}
ul.three_columns li.mid {width:370px; height:auto; float:left; padding:0 0 0 0;}
ul.three_columns li.right {width:180px; height:auto; float:left; padding:0 0 0 0;}

.achievements {width:200px; padding:15px 15px 5px 15px; margin:0 0 15px 15px; border:1px solid #303434; float:right;}
.testimonials {width:200px; padding:15px 15px 5px 15px; margin:0 15px 15px 0; border:1px solid #303434; float:left;}
.references 	{width:283px; padding:15px 15px 5px 15px; float:left; background:#303434; margin:0 0 0 7px;}

.space_tab {padding:0 170px 0 0;}

ul.social_media {padding:7px 0 0 0; width:250px; float:left;}
ul.social_media li.twitter {background:url(../images/icons/twitter.png) no-repeat 0 0; height:50px; width:auto; padding:11px 0 0 70px;}
ul.social_media li.tumblr {background:url(../images/icons/tumblr.png) no-repeat 0 0; height:50px; width:auto; padding:11px 0 0 70px;}
ul.social_media li.deviantart {background:url(../images/icons/deviantart.png) no-repeat 0 0; height:50px; width:auto; padding:11px 0 0 70px;}

#footer {width:947px; margin:0 auto;}






/* Extra Bits and Pieces  
======================================================================*/
.left 	{float:left;}
.right 	{float:right;}

.logo {padding:0 0 0 31px;}
.twitter {padding:0 32px 0 0;}

.img_border {border:7px solid #fff; margin:0 0 15px 25px;}

hr {border:none; margin:30px 0 30px 0; border-bottom:1px solid #303434; width:887px; clear:both; }

.anchorstyle {width:19px; height:19px; padding:0 0 10px 0; margin:0; float:right; display:block; background:url(../images/button_backtotop.gif) no-repeat 0 0; text-indent:-9999px;}







/* Form Formatting  
======================================================================*/
form#commentForm {padding:30px 0 0 0; width:400px; float:right; margin:0 0 0 40px;}
form#commentForm li { margin-bottom: 7px;}
form#commentForm li.button-list {height:15px; margin:0 !important;}
form#commentForm input, form#commentForm select, form#commentForm textarea {
	width: 230px;
	height:15px;
	padding: 5px;
	border: none;
	background: #555e5e;
	border:1px solid #909a9a;
	font: 12px Arial, Helvetica, sans-serif;
	color: #d4ca58;
}

form#commentForm input:focus, form#commentForm select:focus, form#commentForm textarea:focus {border:1px solid #66FFFF;}

form#commentForm textarea {height: 80px;}
form#commentForm label {float: left; display: block; width: 140px; padding:7px 0 0 0;}
form#commentForm label.error, form#commentForm input.submit {margin:0 60px 0 0; float: right; display: block; width:200px !important; height:20px; font-size:10px; color:#669999;}

form#commentForm input.button { 
	background:url(../images/button_email.gif) no-repeat 0 0;
	text-indent:-9999px; 
	margin:0; 
	padding:0; 
	width:120px; 
	height:33px; 
	display:block!important; 
	overflow:hidden;
	cursor:pointer;
	border:none;
	position:relative;
	left:0;
	top:-40px;
	}