/*
*************************************************

PORTFOLIO
General Screen Styles

Finaly... the shoemaker has some shoes!
http://www.danielmall.com/

*************************************************
*/

/*-------------------------------------------    
    General Selectors
-------------------------------------------*/
* { margin: 0; padding: 0; line-height: 1.5; }
body { font: normal 62.5% 'Trebuchet MS', Arial, sans-serif; background: #151515 url(/i/screen/scratches.jpg) no-repeat 50% 0; }

h1 { /*width: 119px;*/ border-bottom: 1px solid rgba(255, 255, 255, 0.09); height: 43px; height: 60px; background-image: url(/i/screen/logo.png); }
h2 { position: absolute; top: 50px; right: 0; width: 184px; height: 16px; width: 140px; height: 10px; background-image: url(/i/screen/iad.png); }
h3 { color: #fff; font: normal 60px/0.9 'Times New Roman', serif; margin: 0 10px 0.1em; /*font-style: italic;*/ text-transform: uppercase; letter-spacing: -1px; }
p { color: #909090; font-size: 14px; margin: 0 0 1em; }

form ul { margin: 0; list-style: none; }
	form li { margin: 0 0 1em; }

input, textarea { border: none; background: #222; width: 222px; font: 12px Georgia, 'Times New Roman', serif; padding: 4px; font-style: italic; color: #dcdcdc; }
.submit input { width: auto; padding: 0; }	
label { display: block; color: #9b9b9b; font: 12px Georgia, 'Times New Roman', serif; font-style: italic; }

img { display: block; margin: 0 0 15px; }

a { color: #ccc; border-bottom: 1px solid #333; text-decoration: none; }
a:hover, a:focus { color: #eee; border-color: #444; }

del { opacity: 0.7; }


/*-------------------------------------------    
    Global Combinations
-------------------------------------------*/

/* Global style for image replacement (using Phark) */
h1, h2, #footer #website a, #footer #twitter a, #footer #contact legend span, #mt { display: block; text-indent: -9999px; background-repeat: no-repeat; background-position: 0 0; background-color: transparent; }

/* Hide (from screen) */
dl.duties dt { position: absolute; left: -9999px; }

/* Hide (from screen readers too) */
#logo { display: none; }



/*-------------------------------------------    
    Modules
-------------------------------------------*/
dl.duties { color: #666; /*display: inline;*/ font-size: 12px; margin: 0 10px 1em; padding: 0; }
	dl.duties dd { display: inline; }
	dl.duties dd:before { content: ", "; margin-left: -0.3em; }
	dl.duties dd.first:before { content: ""; }

.project { width: 724px; margin: 0 auto 30px; background: rgba(7, 7, 7, 0.78); padding: 1.5em 6px 6px; }
	.project p { margin-left: 10px; margin-right: 10px; font: 14px/1.5 Georgia, 'Times New Roman', serif; font-style: italic; }
	/*.project dl.duties +  p { margin-top: 1em; }*/
	.project img { margin: 1.5em 0 6px 6px; }
	
.stub { background: #161616 url(/i/screen/stub-bg.jpg) repeat-x 0 0; color: #909090; text-decoration: none; padding: 0.3em 0.5em; font-size: 11px; margin: 0 0 1em 6px; border: none; }
	.stub:hover, .stub:focus { background: #111; color: #aaa; }

.message { font: 11px/1.5 Georgia, 'Times New Roman', serif; font-style: italic; color: #666; }

/*-------------------------------------------    
    Layout
-------------------------------------------*/

#header { position: relative; margin: 0 auto 60px; width: 724px; border-bottom: 2px solid rgba(0, 0, 0, 0.5); padding: 30px 0 0; }

#footer-wrap { background: #030303 url(/i/screen/footer-top.jpg) no-repeat 50% 0; margin: 30px 0 0; }

	#footer { margin: 0 auto; width: 575px; padding: 50px 0 40px 158px; background: transparent url(/i/screen/footer-bg.png) no-repeat 0 0; position: relative; top: -20px; }
	
		#footer #about { width: 255px; }
			#footer #about p { font: 12px/1.5 Georgia, 'Times New Roman', serif; font-style: italic; color: #666; border-bottom: 1px solid #171717; padding: 0 0 1em; }
				#footer #about p em { color: #ccc; color: #dfff05; color: #92bb03; }
				#footer #about p a { color: #999; border-bottom: 1px solid #222; text-decoration: none; }				
				#footer #about p a:hover, #footer #about p a:focus { color: #ccc; }
				
					#footer #about ul li { margin-bottom: 10px; }
						#footer #about ul a { background-color: #4e4e4e; }
						#footer #about ul a:hover { background-color: #b2b2b2; }
				
				#footer #website a { width: 80px; height: 9px; background-image: url(/i/screen/footer-website.png); border: none; }
				#footer #twitter a { width: 124px; height: 11px; background-image: url(/i/screen/footer-twitter.png); border: none; }
				
				
		#footer #contact, #footer #confirm-bam { background: rgba(9, 9, 9, 0.97); width: 230px; position: absolute; right: -10px; top: -40px; padding: 20px 20px 0; }
			#footer #contact .message { position: relative; top: -0.5em; }
			#footer #contact fieldset { border: none; }
			#footer #contact legend span { width: 87px; height: 33px; background-image: url(/i/screen/make-history.gif); }
			#contact label { display: block; margin-bottom: 0.5em; }
			
		#footer #copyright { font: bold 10px 'Trebuchet MS', Arial, sans-serif; color: #222; text-transform: uppercase; letter-spacing: 0.1em; margin: 7em 0 1em; padding: 0 45px 0 0; position: relative; width: 210px; }
			#mt { background-image: url(/i/screen/mt-logo.gif); width: 39px; height: 15px; border: none; position: absolute; right: 0; top: -1px; }
			#mt:hover, #mt:focus { background-position: 0 -15px; }