@@ -44,6 +44,7 @@ </script>
 		<script src="/js/jquery-1.3.2.js" type="text/javascript"></script>
 
 		<!-- JQuery Plugins -->
+		<script src="/js/jquery.preload.js" type="text/javascript"></script>
 		<script src="/js/tooltips.js" type="text/javascript"></script>
 		<script src="/js/jquery.scrollTo-min.js" type="text/javascript"></script>
 		<script src="/js/jquery.localscroll-min.js" type="text/javascript"></script>
@@ -70,7 +71,6 @@ </div>
 					<div id="header-right">
 						<ul id="navigation">
 							<li><a href="/#home" class="cross-link">Home</a></li>
-							<li><a href="/#tags" class="cross-link">Tags</a></li>
 							<li><a href="/#projects" class="cross-link">Projects</a></li>
 							<li><a href="/#about" class="cross-link">About</a></li>
 						</ul>
@@ -81,11 +81,13 @@ </div>
 			<!-- HEADER END -->
 			<div id="border-top"></div>
 			<div class="inner-border"></div>
+			<!-- MAIN START -->
+			<div id="main">
 			<!-- CONTAINER START -->
 			<div id="container">
 				<ul id="palette">
-					<li><a href="#" id="up-arrow" class="half-hidden"><img alt="^" src="/images/icons/up.png" /></a></li>
-					<li><a href="#" id="down-arrow" class="half-hidden"><img alt="v" src="/images/icons/down.png" /></a></li>
+					<li><a href="#" id="up-arrow"></a></li>
+					<li><a href="#" id="down-arrow"></a></li>
 				</ul>
 				<!-- CONTENT START -->
 				<div id="content" class="clearfix">
@@ -107,16 +109,17 @@ </div>
 				<!-- CONTENT END -->
 			</div>
 			<!-- CONTAINER END -->
+			</div>
+			<!-- MAIN END -->
 			<div class="inner-border"></div>
 			<div id="border-bottom">
-				<% if @page.permalink == 'home' then %>
-				<%= render 'services' %>
-				<% end %>
 				<% if @page.type == 'article' then %>
 				<script type="text/javascript">
     			var disqus_developer = 1; 
 				</script> 
 				<%= render 'comments' %>
+				<% else %>
+				<%= render 'services' %>
 				<% end %>
 			</div>
 			<div class="clearfooter"></div>

@@ -127,10 +127,6 @@ }
 
 /*** HOME Page ***/
 
-#services
-{
-	height: 450px;
-}
 #services li
 {
 	margin-left: 0;
@@ -145,9 +141,36 @@ .feed-item, .feed-item-ext
 {
 	list-style-type: none;
 	padding: 0.2em;
-	border: 1px solid #000;
 	margin: 3px 2px;
 	color: #BDB7BA;
+}
+
+/*** Arrows ***/
+
+#down-arrow
+{
+	background: url('../images/icons/down.png');
+	display: block;
+	height: 41px;
+	width: 40px;
+}
+
+#down-arrow:hover
+{
+	background: url('../images/icons/down_hover.png');
+}
+
+#up-arrow
+{
+	background: url('../images/icons/up.png');
+	display: block;
+	height: 41px;
+	width: 40px;
+}
+
+#up-arrow:hover
+{
+	background: url('../images/icons/up_hover.png');
 }
 
 /**** TABLES ****/

@@ -51,7 +51,7 @@ {
 	width: 100%;
 	background-color: #000;
 	padding: 5px 0;
-	height: 60px;
+	height: 70px;
 }
 
 #logo
@@ -116,6 +116,11 @@ width: 900px;
 	height: 100%;
 }
 
+#main
+{
+	background: #fff url('../images/bkg.png') top repeat;
+}
+
 #palette
 {
 	position: fixed;
@@ -142,6 +147,7 @@ 
 #content
 {
 	text-align: justify;
+	padding: 0 10px;
 }
 
 /* FOOTER */
@@ -150,8 +156,7 @@ 
 #wrapper {
 	min-height: 100%;
 	margin-bottom: -40px;
-	position: relative;
-	background: #fff url('../images/bkg.png') top repeat;
+	background: #000;
 }  
 
 #border-top
@@ -165,7 +170,7 @@ {
 	background: #000 url('../images/border-bottom.png') top repeat-x;
 	height: auto;
 	padding: 0 30px;
-	padding-top: 40px;
+	padding-top:40px;
 }
 
 .inner-border 
@@ -174,11 +179,6 @@ background: #000 url('../images/redcloth.png') top repeat-x;
 	height: 30px;
 }
 
-
-#logo
-{
-}
-
 #footer {
 	position: relative;
 	height: 40px;
@@ -200,6 +200,8 @@ {
 	float:left;
 	text-align: left;
 	font-size: 90%;
+	display:block;
+	height: 430px;
 }
 
 .footer-left

@@ -5,7 +5,6 @@ {
 	font-family: Georgia, Serif;
 	font-weight: normal;
 	color: #B80000;
-	text-align: center; 
 }
 
 h1
@@ -18,6 +17,7 @@ h2
 {
 	margin: 0;
 	font-size: 45px;
+	text-align: center; 
 }
 
 h3
@@ -66,6 +66,18 @@ #services h3 a
 {
 	padding-top: 35px;
 	vertical-align: middle;
+}
+
+#content ul
+{
+	list-style-type: none;	
+}
+
+#content li
+{
+	vertical-align: middle;
+	background: url("../images/icons/bullet.png") top left no-repeat;
+	padding-left: 20px;
 }
 
 

@@ -1,9 +1,9 @@ 
 
 $(document).ready(function() {
+		$.preloadCssImages();
 		$.slider();
 		$('#up-arrow').click(function(){ $.scrollTo('#header', 1000)});
 		$('#down-arrow').click(function(){ $.scrollTo('#footer', 1000)});
-	
 		// Drop Caps
 		$('h2 + p').each(function(){
 		var first_paragraph = this;//$('#content p')[0];
@@ -14,12 +14,11 @@ node = node.firstChild;
 		}
 		var text = node.nodeValue;
 		var first_letter = text.substr(0,1);
-		if (first_letter.match(/[a-zA-Z]/))
-		{
+		if (first_letter.match(/[a-zA-Z]/)){
 			node.nodeValue = text.slice(1,text.length);
 			$('<span></span>').addClass('dropcap').html(first_letter).prependTo( first_paragraph );
-			});
 			Cufon.replace('.dropcap', {fontFamily: 'Mutlu'});
-		}
+			};
+		});
 });
 

@@ -0,0 +1,153 @@ 
+
+/**
+ * jQuery-Plugin "preloadCssImages"
+ * by Scott Jehl, scott@filamentgroup.com
+ * http://www.filamentgroup.com
+ * reference article: http://www.filamentgroup.com/lab/update_automatically_preload_images_from_css_with_jquery/
+ * demo page: http://www.filamentgroup.com/examples/preloadImages/index_v2.php
+ * 
+ * Copyright (c) 2008 Filament Group, Inc
+ * Dual licensed under the MIT (filamentgroup.com/examples/mit-license.txt) and GPL (filamentgroup.com/examples/gpl-license.txt) licenses.
+ *
+ * Version: 5.0, 10.31.2008
+ * Changelog:
+ * 	02.20.2008 initial Version 1.0
+ *    06.04.2008 Version 2.0 : removed need for any passed arguments. Images load from any and all directories.
+ *    06.21.2008 Version 3.0 : Added options for loading status. Fixed IE abs image path bug (thanks Sam Pohlenz).
+ *    07.24.2008 Version 4.0 : Added support for @imported CSS (credit: http://marcarea.com/). Fixed support in Opera as well. 
+ *    10.31.2008 Version: 5.0 : Many feature and performance enhancements from trixta
+ * --------------------------------------------------------------------
+ */
+
+;jQuery.preloadCssImages = function(settings){
+	settings = jQuery.extend({
+		statusTextEl: null,
+		statusBarEl: null,
+		errorDelay: 999, // handles 404-Errors in IE
+		simultaneousCacheLoading: 2
+	}, settings);
+	var allImgs = [],
+		loaded = 0,
+		imgUrls = [],
+		thisSheetRules,	
+		errorTimer;
+	
+	function onImgComplete(){
+		clearTimeout(errorTimer);
+		if (imgUrls && imgUrls.length && imgUrls[loaded]) {
+			loaded++;
+			if (settings.statusTextEl) {
+				var nowloading = (imgUrls[loaded]) ? 
+					'Now Loading: <span>' + imgUrls[loaded].split('/')[imgUrls[loaded].split('/').length - 1] : 
+					'Loading complete'; // wrong status-text bug fixed
+				jQuery(settings.statusTextEl).html('<span class="numLoaded">' + loaded + '</span> of <span class="numTotal">' + imgUrls.length + '</span> loaded (<span class="percentLoaded">' + (loaded / imgUrls.length * 100).toFixed(0) + '%</span>) <span class="currentImg">' + nowloading + '</span></span>');
+			}
+			if (settings.statusBarEl) {
+				var barWidth = jQuery(settings.statusBarEl).width();
+				jQuery(settings.statusBarEl).css('background-position', -(barWidth - (barWidth * loaded / imgUrls.length).toFixed(0)) + 'px 50%');
+			}
+			loadImgs();
+		}
+	}
+	
+	function loadImgs(){
+		//only load 1 image at the same time / most browsers can only handle 2 http requests, 1 should remain for user-interaction (Ajax, other images, normal page requests...)
+		// otherwise set simultaneousCacheLoading to a higher number for simultaneous downloads
+		if(imgUrls && imgUrls.length && imgUrls[loaded]){
+			var img = new Image(); //new img obj
+			img.src = imgUrls[loaded];	//set src either absolute or rel to css dir
+			if(!img.complete){
+				jQuery(img).bind('error load onreadystatechange', onImgComplete);
+			} else {
+				onImgComplete();
+			}
+			errorTimer = setTimeout(onImgComplete, settings.errorDelay); // handles 404-Errors in IE
+		}
+	}
+	
+	function parseCSS(sheets, urls) {
+		var w3cImport = false,
+			imported = [],
+			importedSrc = [],
+			baseURL;
+		var sheetIndex = sheets.length;
+		while(sheetIndex--){//loop through each stylesheet
+			
+			var cssPile = '';//create large string of all css rules in sheet
+			
+			if(urls && urls[sheetIndex]){
+				baseURL = urls[sheetIndex];
+			} else {
+				var csshref = (sheets[sheetIndex].href) ? sheets[sheetIndex].href : 'window.location.href';
+				var baseURLarr = csshref.split('/');//split href at / to make array
+				baseURLarr.pop();//remove file path from baseURL array
+				baseURL = baseURLarr.join('/');//create base url for the images in this sheet (css file's dir)
+				if (baseURL) {
+					baseURL += '/'; //tack on a / if needed
+				}
+			}
+			if(sheets[sheetIndex].cssRules || sheets[sheetIndex].rules){
+				thisSheetRules = (sheets[sheetIndex].cssRules) ? //->>> http://www.quirksmode.org/dom/w3c_css.html
+					sheets[sheetIndex].cssRules : //w3
+					sheets[sheetIndex].rules; //ie 
+				var ruleIndex = thisSheetRules.length;
+				while(ruleIndex--){
+					if(thisSheetRules[ruleIndex].style && thisSheetRules[ruleIndex].style.cssText){
+						var text = thisSheetRules[ruleIndex].style.cssText;
+						if(text.toLowerCase().indexOf('url') != -1){ // only add rules to the string if you can assume, to find an image, speed improvement
+							cssPile += text; // thisSheetRules[ruleIndex].style.cssText instead of thisSheetRules[ruleIndex].cssText is a huge speed improvement
+						}
+					} else if(thisSheetRules[ruleIndex].styleSheet) {
+						imported.push(thisSheetRules[ruleIndex].styleSheet);
+						w3cImport = true;
+					}
+					
+				}
+			}
+			//parse cssPile for image urls
+			var tmpImage = cssPile.match(/[^\("]+\.(gif|jpg|jpeg|png)/g);//reg ex to get a string of between a "(" and a ".filename" / '"' for opera-bugfix
+			if(tmpImage){
+				var i = tmpImage.length;
+				while(i--){ // handle baseUrl here for multiple stylesheets in different folders bug
+					var imgSrc = (tmpImage[i].charAt(0) == '/' || tmpImage[i].match('://')) ? // protocol-bug fixed
+						tmpImage[i] : 
+						baseURL + tmpImage[i];
+					
+					if(jQuery.inArray(imgSrc, imgUrls) == -1){
+						imgUrls.push(imgSrc);
+					}
+				}
+			}
+			
+			if(!w3cImport && sheets[sheetIndex].imports && sheets[sheetIndex].imports.length) {
+				for(var iImport = 0, importLen = sheets[sheetIndex].imports.length; iImport < importLen; iImport++){
+					var iHref = sheets[sheetIndex].imports[iImport].href;
+					iHref = iHref.split('/');
+					iHref.pop();
+					iHref = iHref.join('/');
+					if (iHref) {
+						iHref += '/'; //tack on a / if needed
+					}
+					var iSrc = (iHref.charAt(0) == '/' || iHref.match('://')) ? // protocol-bug fixed
+						iHref : 
+						baseURL + iHref;
+					
+					importedSrc.push(iSrc);
+					imported.push(sheets[sheetIndex].imports[iImport]);
+				}
+				
+				
+			}
+		}//loop
+		if(imported.length){
+			parseCSS(imported, importedSrc);
+			return false;
+		}
+		var downloads = settings.simultaneousCacheLoading;
+		while( downloads--){
+			setTimeout(loadImgs, downloads);
+		}
+	}
+	parseCSS(document.styleSheets);
+	return imgUrls;
+};