@charset "utf-8";
/* CSS Document */

/*   
Theme Name: EdJunaidi
Theme URI: http://www.edjunaidi.com
Description: A theme for my own online portfolio
Author: Ed Junaidi
Author URI: www.edjunaidi.com
Version: 1.0
*/

* {margin:0;padding:0;} 

/* must declare 0 margins on everything, also for main layout components use padding, not 
vertical margins (top and bottom) to add spacing, else those margins get added to total height 
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body, #container {height: 100%;}

body {
	font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
	font-size: 11px;
	color: #666666;
	background-attachment: fixed;
	background-image: url(images/edjunaidi-webbg.jpg);
	background-repeat: no-repeat;
	background-position: 80px top;
}

body > #container {height: auto; min-height: 100%;}

#container {
	width: 630px;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 20px;
}

#cbody {overflow:auto;
	padding-bottom: 50px;
	padding-top: 30px;}  /* must be same height as the footer */

#footer {position: relative;
	height: 30px;
	clear:both;
	margin-top: -30px; /* negative value of footer height */
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 20px;
	} 

/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}


/* IMPORTANT

You also need to include this conditional style in the <head> of your HTML file
[if  IE 8]>
	<style type="text/css">
		#wrap {display:table;}
	</style>
<![endif]

*/

a {
	color: #CC0033;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

#header {
	display: block;
	margin: 0px;
	padding: 50px 0px 0px 0px;
	width: 630px;
}

#navmenu {
	margin: 5px;
	padding: 5px;
	height: 24px;
}
#navmenu ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}
#navmenu ul li {
	display: inline-block;
	float: left;
	margin: 0px;
	padding-top: 0px;
	padding-right: 25px;
	padding-bottom: 0px;
	padding-left: 15px;
	background-image: url(images/navmenu_mainseparator.gif);
	background-repeat: no-repeat;
	background-position: right center;
	position: relative;
}
#navmenu ul li a {
	font-family: 'Lucida Grande', Lucida Console, Verdana, Arial, Sans-Serif;
	font-size: 18px;
	font-weight: bold;
	color: #666666;
	text-decoration: none;
}
#navmenu ul li a:hover {
	color: #CC0033;
	text-decoration: none;
}
#navmenu ul li ul {
	list-style-type: none;
	position: absolute;
	top: -8px;
	margin-top: 25px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	left: -20px;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	width: 400px;
	display: none;
}
#navmenu ul li:hover ul {
	display: block;
}
#navmenu ul li ul li {
	display: block;
	float: left;
	margin: 0px;
	padding-top: 0px;
	padding-right: 25px;
	padding-bottom: 0px;
	padding-left: 20px;
}
#navmenu ul li ul li a {
	font-family: 'Lucida Grande', Lucida Console, Verdana, Arial, Sans-Serif;
	font-size: 14px;
	color: #999999;
}
#navmenu ul li ul li a:hover {}

.h-thisis {
	display: block;
	font-size: 18px;
	font-weight: bold;
	color: #CCCCCC;
}
.h-edjunaidi {
	margin-top: 0px;
	margin-bottom: 0px;
	letter-spacing: -1px;
	display: block;
	margin-left: 20px;
}
.h-iamawebdesigner {
	display: block;
	margin-top: 0px;
	margin-left: 80px;
	font-size: 24px;
	font-weight: bold;
	color: #999999;
	letter-spacing: -1px;
	padding: 0px;
	line-height: 20px;
}

/*EASY SLIDER*/
/* image replacement */
        .graphic, #prevBtn, #nextBtn, #slider1prev, #slider1next{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-8000px;
            }
    /* // image replacement */
#slider {
	border: 1px solid #E3E3E3;
}
#slider ul, #slider li,
	#slider2 ul, #slider2 li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{
	/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:600px;
	height:350px;
	overflow:hidden;
	position: relative;
		}	
	#slider li span {
	display: block;
	margin: 0px;
	padding: 10px;
	position: absolute;
	width: 100%;
	background-image: url(images/black-transparentbg.png);
	background-repeat: repeat;
	left: 0px;
	bottom: 0px;
	color: #FFFFFF;
}
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:30px;
		height:77px;
		position:absolute;
		left:-30px;
		top:71px;
		z-index:1000;
		}	
	#nextBtn, #slider1next{ 
		left:696px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:30px;
		height:77px;
		background:url(slide/btn_prev.gif) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(slide/btn_next.gif) no-repeat 0 0;	
		}	
		
	/* numeric controls */	

	ol#controls{
		margin:1em 0;
		padding:0;
		height:28px;	
		}
	ol#controls li{
		margin:0 3px 0 0; 
		padding:0;
		float:left;
		list-style:none;
		height:24px;
		line-height:24px;
		}
	ol#controls li a{
	float:left;
	color:#FFFFFF;
	text-decoration:none;
	background-image: url(images/roundnobg-right.png);
	background-repeat: no-repeat;
	background-position: right top;
		}
	ol#controls li a span {
	height:24px;
	line-height:24px;
	padding:0 0px 0 9px;
	background-image: url(images/roundnobg-left.png);
	background-repeat: no-repeat;
	background-position: left top;
	margin-right: 9px;
	display: block;
	}
	ol#controls li a:hover{
	color:#FFFFFF;
	background-image: url(images/roundnobg-right.png);
	background-repeat: no-repeat;
	background-position: right bottom;
		}
	ol#controls li a:hover span{
	color:#FFFFFF;
	background-image: url(images/roundnobg-left.png);
	background-repeat: no-repeat;
	background-position: left bottom;
		}
	ol#controls li.current a{
	color:#FFFFFF;
	background-image: url(images/roundnobg-right.png);
	background-repeat: no-repeat;
	background-position: right bottom;
		}
	ol#controls li.current a span{
	background-image: url(images/roundnobg-left.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	margin-right: 7px;
	display: block;
	}
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
	
/* // Easy Slider */

