@charset "utf-8";

/**** Reset ****/
* { margin:0; padding:0; }


body {
	background:#3a3a3a url(../images/bg-repeat.gif) repeat-x;
	font-family:Verdana, Geneva, sans-serif;
	color:#4a4a4a;
	font-size:10px;
	line-height:14px;
}

	/** Background */
	#background {
	position:absolute;
	top:0;
	left:0;
	z-index:-1; }


@font-face { 
	font-family: "Marke"; 
	src: url(fonts/marke.ttf) format("truetype"); 
}

	/**** Links ****/
	a:link { color: #000; text-decoration: none; }
	a:visited { color: #000; text-decoration: none; }
	a:hover { color: #ff2400; text-decoration: none; }
	a:active { color: #000; text-decoration: none; outline:none; }
	img { border:none; } /* Removes borders on image links */


/**** Headers ****/
h1 { color:#000; font-size:18px; }
h2 { color:#FFF; font-size:18px; }
h3 { font-size:24px; font-weight:bold; }
h4 { font-size:16px; color:#4a4a4a; line-height:24px; }
h5 { font-size:12px; color:#333333; }
h6 { color:#FFF; font-weight:bold; font-size:10px; }


/**** Color Styles ****/
.red { color:#ff0f00; }
.white { color:#FFFFFF; }
.lightGrey { color:#aeaeae; margin:0 6px 0 6px; }
.grey { color:#8e8e8e; margin-left:13px; }
.darkGrey { color:#444444; }
.black {color:#000; } /* Cufon Color Override */


	/**** List Styling ****/
	.links li { display:inline; padding:9px 10px 0 0px; }
	#navigationLinks ul {list-style-type:none; padding:9px 11px 0 12px; }
	#news ul { margin-bottom:24px; }
	
	#news li {
	background:url(../images/li-bg-light.png) no-repeat;
	width:325px;
	height:15px;
	list-style-type:none;
	padding-left:5px;
	color:#444444;
	margin-bottom:-4px; }
	
	.blogList li {
	background:url(../images/small-li.png) no-repeat;
	width:196px;
	height:15px;
	list-style-type:none;
	padding-left:5px;
	color:#444444;
	margin-bottom:3px; }
	
	.current a:link { color: #ff2400; text-decoration: none; }
	.current a:visited { color: #ff2400; text-decoration: none; }
	.current a:hover { color: #000; text-decoration: none; }
	.current a:active { color: #ff2400; text-decoration: none; outline:none; }


/* Main Styles */
#logo {
	margin:35px 0 10px 158px;
	width:146px;
	height:37px;
}

#wrapper {
	position:relative;
	margin:0 auto;
	width:1000px;
}

#contentPlaceholder {
	background:url(../images/placeholder-white.png) no-repeat;
	width:731px;
	height:611px;
	margin:0 auto;
	padding:1px 128px 0 128px;
}



/** Navigation **/
#nav {
	background:url(../images/nav.png) no-repeat;
	font-family:"Marke", Verdana;
	font-size:8px;
	color:#000;
	height:32px;
	width:721px;
	margin:5px 0 0 7px;
	z-index:99999;
}

#navigationLinks {
	float:left;
}


/** Scroller Styles and Buttons **/
#scrollMe { margin:5px 8px 0 0px; float:right; }
#scroll-down { margin-right:4px; }
#scroller { height:420px; overflow:hidden; }


/* CU3R */
#flashPlaceholder {
	background:url(../images/cu3r-bg.png) no-repeat bottom;
	width:690px;
	height:210px; 
	padding-top:14px; 
	margin-left:23px;
	margin-bottom:-10px;
}

#cu3r-container { margin:60px 0 0 0; }
#adobe { margin:85px 0 0 312px; }


/* WHITE SHELF  */
#shelfFooter {
	position:absolute;
	z-index:9998;
	background:url(../images/shelf-white.png) no-repeat;
	width:550px;
	height:221px;
	margin:0 auto;
	margin:-235px 0 0 6px;
	padding-left:463px; 
}

/* BLACK SHELF. See Documentation to install.
#shelfFooter {
	position:absolute;
	z-index:9998;
	background:url(../images/shelf-black.png) no-repeat;
	width:550px;
	height:221px;
	margin:0 auto;
	margin:-235px 0 0 9px;
	padding-left:463px; 
}
*/


/**** Home Page ****/
#leftContent {
	float:left; 
	width:320px;
	height:auto;
	padding:0 0 150px 35px;
	margin-top:-3px;
	overflow:hidden;
}

#rightContent {
	float:right; 
	width:348px;
	margin-top:-3px;
	height:auto;
	overflow:hidden;
}

.news { margin-top:7px; }
.date { color:#FFF; padding-right:9px; }

.features {
	background:url(../images/features-bg.gif) no-repeat;
	height:71px;
	width:323px;
	margin:5px 0 -4px 0;
	padding:5px 0 0 5px; 
}


/**** Tool Tips ****/
.tooltipFeatured {
	background:url(../images/featured-tooltip.png) no-repeat;
	width:175px;
	height:89px;
	font-family:Verdana, Geneva, sans-serif;
	background-color: transparent;
	z-index:9999;
	border:none;
}

.tooltipFacebook {
	background:url(../images/facebook-tooltip.png) no-repeat;
	width:125px;
	height:69px;
	font-family:Verdana, Geneva, sans-serif;
	background-color: transparent;
	z-index:9999;
	position:fixed;
}

.tooltipFlickr {
	background:url(../images/flickr-tooltip.png) no-repeat;
	width:125px;
	height:69px;
	font-family:Verdana, Geneva, sans-serif;
	background-color: transparent;
	z-index:9999;
}

.tooltipTwitter {
	background:url(../images/twitter-tooltip.png) no-repeat;
	width:125px;
	height:69px;
	font-family:Verdana, Geneva, sans-serif;
	background-color: transparent;
	z-index:9999;
	position:fixed;
}

.tooltipRss {
	background:url(../images/rss-tooltip.png) no-repeat;
	width:125px;
	height:69px;
	font-family:Verdana, Geneva, sans-serif;
	background-color: transparent;
	z-index:9999;
	position:fixed;
}


/** More Button ID's **/
#more1 {margin-top:8px;}
#more2 {margin-top:8px;}
#more3 {margin-top:8px;}
#more4 {margin-top:8px;}
#more5 {margin-top:8px;}
#more6 {margin-top:8px;}


/*** Blog Text Links ***/
a:link.blog { color: #ff2400; text-decoration: none; }
a:visited.blog { color: #ff2400; text-decoration: none; }
a:hover.blog { color: #000; text-decoration: none; }
a:active.blog { color: #ff2400; text-decoration: none; }

#blogRight { float:right; width:200px; margin:19px 18px 0 0; }

/* Dividers */
.divider { background:url(../images/divider.png) no-repeat; width:350px; height:1px; margin-top:4px; }
.dividerShort { width:196px; height:1px; background-color:#ff0f00; margin-top:4px; }
.dividerMedium { width:473px; height:1px; background-color:#ff0f00; margin-top:4px; }
.dividerLong { width:667px; height:1px; background-color:#ff0f00; margin-top:4px; }
.dividerLong8 { width:667px; height:1px; background-color:#ff0f00; margin-top:8px; }

/*** MARGIN STYLES ***/
	.left-3 { margin-left:-3px; }
	.left-8 { margin-left:-8px; }
	.left-10 { margin-left:-10px; }
	.right7 { margin-right:7px; }
	.top3 { margin-top:3px; }
	.top7 { margin-top:7px; }
	.top10 { margin-top:10px; }
	.top11 { margin-top:11px; }
	.top12 { margin-top:12px; }
	.top20 { margin-top:20px; }
	.top49 { margin-top:49px; }
	.top52 { margin-top:52px; }
	.top63 { margin-top:63px; }
	.bottom6 { margin-bottom:6px; }


/** About Page **/
#aboutContent {
	padding-top:20px; 
	padding-left:35px;
	width:672px;
	overflow:hidden;
	padding-bottom:100px;
}

#about-img { margin:20px 12px 0 0; }

#aboutList { padding-bottom:150px; }
.about { background-color:#999999; width:204px; height:51px; padding:7px; margin:8px 6px 0 0; float:left; }


/** Blog Page **/
#blogContent {
	padding:20px 0 100px 30px;
	width:473px; 
	overflow:hidden;
	float:left;
}

.blogDetails {
	background-color:#999999;
	color:#FFF;
	padding:4px;
	margin-top:3px;
}


/** Portfolio Page **/
#portfolioContent {
	padding-top:20px; 
	padding-left:35px; 
	width:672px;
	overflow:hidden;
}

#portfolioTable { margin-top:12px; padding:0 0 100px 8px; float:left; }
.portfolio-row2 { margin-top:10px; width:210px; }
.portfolioList { float:left; width:212px; margin-right:9px; }

/** Portfolio Background Images for rollover **/
#envato1 { background:none; width:210px; height:97px; border:none; cursor:pointer; }
#freelance1 { background:none; width:210px; height:97px; border:none; cursor:pointer; }
#workawesome1 { background:none; width:210px; height:97px; border:none; cursor:pointer; }
#envato2 { background:none; width:210px; height:97px;; border:none; cursor:pointer; }
#freelance2 { background:none; width:210px; height:97px; border:none; cursor:pointer; }
#workawesome2 { background:none; width:210px; height:97px; border:none; cursor:pointer; }
/* Above is the background images on mouseover for the portfolio. In the portfolio, once you've added an image, make in black and white (same size), and save it in the images foldder. Replace "none" with the black and white image for the background above. Once they mouseover the portfolio image, the image will fade to your black and white image using javascript. */


/* Contact Page **/
#contactContent {
	padding-top:20px;
	padding-left:35px; 
	width:672px; 
	overflow:hidden;
}

#contact-img { margin:20px 12px 0 0; }

#name { width:139px; height:21px; }
#email { width:139px; height:21px; }
#website { width:139px; height:21px; }
#textarea { position:relative; float:right; }

/**** Form Styling ****/
input {
	font-family:Verdana, Geneva, sans-serif;
	background-color:#494949;
	outline:none;
	border:1px solid #a0a0a0;
	color:#aeaeae;
	margin-bottom:7px;
	font-size:10px; 
	padding:6px 8px 0 8px; 
}

textarea { 
	font-family:Verdana, Geneva, sans-serif; 
	z-index:9999;
	font-size:10px; 
	background-color:#494949;
	overflow:hidden;
	border:1px solid #a0a0a0;
	padding:8px;
	outline:none;
	color:#aeaeae; 
	width:485px;
	height:122px;
	margin:-108px 0 0 4px;
}

#send {
	background-color:transparent;
	outline:none; 
	border:none;
	margin:0px 0 0 160px;
	position:relative; 
	z-index:9999; 
}


/** Mailer Page **/
#mailerContent {
	padding-top:20px; 
	padding-left:35px;
	width:672px; 
	overflow:hidden;
}


/** Blank Page **/
#blankContent {
	padding:20px 0 150px 35px;
	width:672px; 
	overflow:hidden;
}