/*
Designed & built by Mat Johnson
© 2010
*/

/*--------------------- FONTS ---------------------*/

@font-face 					{ font-family: 'ChunkFiveRegular';
					  		src: url('Chunkfive.eot');
					  		src: local('ChunkFive Regular'), local('ChunkFive'), 
					  		url('Chunkfive.woff') format('woff'), 
					  		url('Chunkfive.ttf') format('truetype'), 
					  		url('Chunkfive.svg#ChunkFive') format('svg'); }
							
@font-face 					{ font-family: 'FontinSansRegular';
							src: url('Fontin_Sans_R_45b.eot');
							src: local('Fontin Sans Regular'), local('FontinSans-Regular'), 
							url('Fontin_Sans_R_45b.woff') format('woff'), 
							url('Fontin_Sans_R_45b.otf') format('opentype'), 
							url('Fontin_Sans_R_45b.svg#FontinSans-Regular') format('svg'); }
	


/*--------------------- CSS RESET & BASICS ---------------------*/


body						{ padding:0; margin:0; font:13px Arial,Helvetica,sans-serif; background:url(../images/bg.gif); }
h1,h2,h3,h4,h5,h6,ul,li,em,strong,pre,code		{ padding:0; margin:0; line-height:1em; font-size:100%; font-weight:normal; font-style: normal; }
table						{ font-size:inherit; font:100%; }
ul							{ list-style:none; }
img							{ border:0; }
html 						{ overflow: -moz-scrollbars-vertical; }
.clear						{ clear:both; }
a							{ color:#ffffff; text-decoration:none; }



/*--------------------- COPY ---------------------*/

h1 							{ font-size: 150px; color:#ffffff; font-weight: normal; font-family: 'ChunkFiveRegular', sans-serif; letter-spacing:-16px; text-shadow: 0px 5px 5px #000; }
h1 strong					{ color:#b2d836; font-weight:normal; }
h2							{ color:#b2d836; font-size:34px; text-shadow: 0px 2px 8px #1e1e1e; letter-spacing:-1px; font-family: 'ChunkFiveRegular', sans-serif; }
h3							{ color:#b2d836; font-size:20px; text-shadow: 0px 2px 8px #1e1e1e; letter-spacing:-1px; font-family: 'ChunkFiveRegular', sans-serif; }
p							{ color:#ffffff; font-size:14px; line-height:20px; font-family: 'FontinSansRegular', sans-serif; margin:8px 0 24px 0; }
p.copyright					{ font-size:11px; color:#909090; text-align:center; padding:0 0 20px 0; margin:0; }



/*--------------------- MAIN DIVS ---------------------*/

#beta						{ position:absolute; top:10px; left:10px; width:108px; height:108px; background:url(http://www.madebymat.com/images/beta-green.png); }
#backtotop					{ position:fixed; bottom:2px; right:15px; }
#header						{ text-align:center; background:url(../images/header-bg.gif) repeat-x; padding:0 0 36px 0; }
#container 					{ width:920px; margin:0 auto;}
#switcher					{ margin:0 auto; text-align:right; height:80px; width:724px; }
#me							{ height:192px; border-top:2px solid #b2d836; padding-top:30px; margin-top:30px; }
#footer-links				{ background: rgba(255, 255, 255, 0.05); padding:30px 0 0 0; }



/*--------------------- CONTENT ---------------------*/

.project					{ background: rgba(255, 255, 255, 0.05); filter:alpha(opacity=05); padding:20px; margin:0 0 20px 0; }
.project img				{ float:left; padding:0 20px 0 0; }
.new						{ background-color: rgba(255, 255, 255, 0.05); background-image:url(../images/new-green.png); background-position:top right; background-repeat:no-repeat; padding:20px; margin:0 0 20px 0; }
#me							{ padding-bottom:50px; }
#me	img						{ float:left; background: rgba(255, 255, 255, 0.05); padding:20px; margin:0 0 20px 0; }
#about						{ float:left; width:420px; padding:16px 27px 0 27px; }
#stuff						{ float:right; width:250px; padding:26px 0 0 0; }
#stuff ul					{ padding:16px 0 0 0; }
#stuff ul li				{ font-family: 'FontinSansRegular', sans-serif; display:block; width:250px; border-top:1px solid #b2d836; line-height:30px; }
.last						{ border-bottom:1px solid #b2d836; }



/*--------------------- LINKS ---------------------*/

.project a:link, .project a:visited					{ color:#242424; background:#ffffff; padding:5px 5px 2px 5px; font-size:20px; letter-spacing:-1px; font-family:'ChunkFiveRegular', sans-serif; text-decoration:none; }
.project a:hover, .project a:active					{ background:#b2d836; }

a:link.green, a:visited.green						{ display:inline-block; width:30px; height:55px; background:url(../images/green-long.png); }
a:hover.green, a:active.green 						{ background:url(../images/green-long.png); }

a:link.orange, a:visited.orange						{ display:inline-block; width:30px; height:55px; background:url(../images/orange-short.png); }
a:hover.orange, a:active.orange 					{ background:url(../images/orange-long.png); }

a:link.blue, a:visited.blue							{ display:inline-block; width:30px; height:55px; background:url(../images/blue-short.png); }
a:hover.blue, a:active.blue 						{ background:url(../images/blue-long.png); }

a:link.pink, a:visited.pink							{ display:inline-block; width:30px; height:55px; background:url(../images/pink-short.png); }
a:hover.pink, a:active.pink 						{ background:url(../images/pink-long.png); }

#me a:link, #me a:visited							{ color:#ffffff; padding:0 0 0 6px; display:block; }
#me a:hover, #me a:active							{ color:#b2d836; padding:0 0 0 8px; }

.project a.thumb 									{ padding:0; margin:0; }



/*--------------------- NAVIGATION - ONE ---------------------*/

#navigation-one				{ margin:40px 0 38px 0; border-bottom:2px solid #b2d836; }
.group:after 				{ visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; }
*:first-child+html .group 	{ zoom:1; } /* IE7 */
#example-one 				{ margin:0 auto; list-style:none; position:relative; width:850px; padding-left:71px;}
#example-one li 			{ display:inline;  }
#example-one li a 			{ color:#b2d836; font-size:34px; text-shadow: 0px 5px 5px #000000; letter-spacing:-1px; font-family: 'ChunkFiveRegular', sans-serif; display:block; float:left; padding:6px 31px 20px 30px; text-decoration:none; }
#example-one li a:hover 	{ color: white; }
#magic-line 				{ position:absolute; bottom:-12px; left:0; width:100px; height:12px; background:#b2d836; }
.current_page_item a 		{ color:white !important; }



/*--------------------- NAVIGATION - TWO ---------------------*/

#navigation-two					{ width:920px; margin:10px auto 0 auto; border-top:2px solid #b2d836; padding:0 0 30px 0; }
.group-two:after 				{ visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; }
*:first-child+html .group-two 	{ zoom:1; } /* IE7 */
#example-two 					{ margin:0 auto; list-style:none; position:relative; width:850px; padding-left:120px; }
#example-two li 				{ display: inline; }
#example-two li a 				{ color:#b2d836; font-size:16px; text-shadow: 0px 2px 8px #1e1e1e; letter-spacing:-1px; font-family: 'ChunkFiveRegular', sans-serif; display:block; float:left; padding:22px 31px 0px 30px; text-decoration:none; }
#example-two li a:hover 		{ color: white; }
#magic-line-two 				{ position:absolute; top:-46px; left:0; width:100px; height:12px; background:transparent; border-bottom:10px solid #b2d836; }
.current_page_item_two a { color: white !important; }