/* CSS Document */

#skiplinks {display:none;}

#skiplinks li { 
display: inline; 
} 

#skiplinks a { 
position: absolute;
top: 0;
left: 20px;
width: 0px;
height: 0;
z-index: 1000;
background-color: #fff;
color: #dc2a1a;
font-weight: bold;
font-size: 1em! important;
overflow: hidden;
} 

#skiplinks a:active { 
position: absolute;
margin: 0;
padding:6px;
width: auto;
height: auto;
border-top-width: 0px;
border-left-width: 0;
border-bottom-width: 0;
overflow: visible; 
border-right-width: 0; 
font-size: 0.6em;
} 


body {
padding: 0px;
margin: 0px;
  background: #000000 url(../images/bg.jpg) no-repeat center top;

color: #FFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
}


/* Main Area of site*/
#container {
	width: 974px;
	margin-right: auto;
	margin-left: auto;

}



/* Head*/
#header {
	width: 940px;
	height: 187px;
	float: left;
	background: transparent url(../images/logo.png) no-repeat left top;
}


#header .logo{
width:500px;
	float: left;
	font-size: 1.0em;
position:relative;
top:167px;
}


#header .nav-menu
{

} 

#header .nav-menu ul
{

margin-top:141px;
	float: right;
} 

#header  .nav-menu li
{
font-size: 1.0em;
float: left;
} 


#header .nav-menu li a
{
padding-bottom: 0.5em;
margin: 0 0.6em;
float: left;
color: #FFFFFF;
text-decoration: none;
text-align: center;
} 


#header .nav-menu li a:hover
{
border-bottom: 0.3em solid #6600cc;
} 

#header .nav-menu li a.current
{
border-bottom: 0.3em solid #6600cc;
} 


/* Main Content*/

#mainContent {
	padding-top:43px;
	float: left;
	width: 974px;
	
}

#mainContent h1 {
	margin: 0 0 15px 0;
	font-size: 0.9em;
		clear: left;
}

#mainContent h1.influences {
	margin: 0 0 25px 0;
	padding:10px 0 0 0;
	font-size: 0.9em;
		clear: left;
}


#mainContent h2 {
	margin: 0 0 15px 0;
	font-size: 0.8em;
		clear: left;
}

#mainContent h3 {
	margin: 15px 0 15px 0;
	font-size: 0.7em;
		clear: left;
}

#mainContent p {
	margin: 0px 0px 15px 0px;
	font-size: 0.7em;
	clear: left;
}



#mainContent p a{
color: #6600cc;
text-decoration:underline;
	font-weight:bold;
}

#mainContent p a:hover{
text-decoration:none;
}

#mainContent ul{
	margin: 15px 0 20px 0;
}

#mainContent ul li{
	padding: 5px 0 5px 0;
	font-size: 0.8em;
}

#mainContent ul.cv{
	margin: 15px 0 20px 0;
}

#mainContent ul.cv li{
	font-size: 0.7em;
	list-style-type:disc;
	padding-top: 3px;
	padding-right: 0;
	padding-bottom: 3px;
	padding-left:2px;
	margin-left: 15px;
}

/* Main Area left*/
/* if min-height needs to be set due to lack of content, set as height in i6 stylesheet*/
#mainContent .left {
min-height:450px;
	width: 565px;
	float: left;
}

#mainContent .left p{
	width:480px;
}

#mainContent .left p.intro{
	font-size: 0.9em;
	padding-bottom: 5px;
}

/* inspire*/
#mainContent .left img{
float: left;
border:5px solid #FFF;
margin:0 15px 15px 0;
}


/* portfolio*/
#mainContent .text {
	width: 525px;
	float: left;
}

#mainContent .text p{
	width:460px;
}

/* Main Area right*/

#mainContent .right {
	width: 368px;
	float: left;
	text-align:right;
}

#mainContent .right h1 {
	font-style:italic;
}


#mainContent .right h1.influences{
		padding:10px 0 0 0;
	width:290px;
	float:right;
}

#mainContent .right p{
	width:368px;
}


#mainContent .right p.influences{
	width:290px;
	float:right;
}


#mainContent .right img{
float: right;
margin-bottom:18px;

}




#mainContent .right img.contact {

		margin-top:-5px;
		border:2px solid #6600cc;
		position:relative;
		left:-3px;
}

/* portfolio*/
.project{
	padding-bottom: 40px;
	float: left;
}

#mainContent .projectpanel {
	width: 439px;
	float: left;

}

#s1, #s2, #s3, #s4, #s5, #s6, #s7, #s8, #s9, #s11, #s12 {
	width: 387px;
    height: 327px;
		float:left;
}

/*HTML emails - hence taller*/
#s10 {
	width: 387px;
	float: left;
	    height: 486px;
}


#s1 img, #s2 img, #s3 img, #s4 img, #s5 img, #s6 img, #s7 img, #s8 img, #s9 img, #s10 img, #s11 img, #s12 img {
	padding-right: 6px;
	padding-left: 6px;
	

}


#prev1, #prev2, #prev3, #prev4, #prev5, #prev6, #prev7, #prev8, #prev9, #prev10, #prev11, #prev12 {
	cursor: pointer;
	float:left;
	display:block;
	width: 26px;
	height: 28px;
	background-image: url(../images/portfolio/previous.jpg);
	background-repeat: no-repeat;
  }

#prev1:hover, #prev2:hover, #prev3:hover, #prev4:hover, #prev5:hover, #prev6:hover, #prev7:hover, #prev8:hover, #prev9:hover, #prev10:hover, #prev11:hover, #prev12:hover {
	background-image: url(../images/portfolio/previous_hover.jpg);
}

#next1, #next2, #next3, #next4, #next5, #next6, #next7, #next8, #next9, #next10, #next11, #next12 {
	cursor: pointer;
float:left;
display:block;
    width: 26px;
    height: 28px;
	background-image: url(../images/portfolio/next.jpg);
		background-repeat: no-repeat;
  }

#next1:hover, #next2:hover, #next3:hover, #next4:hover, #next5:hover, #next6:hover, #next7:hover, #next8:hover, #next9:hover, #next10:hover, #next11:hover, #next12:hover {
	background-image: url(../images/portfolio/next_hover.jpg););
}

#footer {
float: left;
	cursor: pointer;
	width: 971px;
	height: 26px;
	background-image: url(../images/portfolio/nav_top.jpg);
	background-repeat:no-repeat;
	background-position: center;
  }
  
  #footer:hover {
	background-image: url(../images/portfolio/nav_top_hover.jpg);
  }

/* Forms*/

label {
display:block;
font-size: 0.7em;
margin-bottom: 2px;
}

input, textarea {
background-color:#000000;
border: 1px solid #6600cc;
color:#FFFFFF;
font-family: arial;
clear: left;
width: 300px;
overflow:hidden;
font-size: 0.7em;
}

.required{
font-size: 0.7em;
clear:left;
}

.userbuttons input:hover{
color:#6600cc;

}


/* Footer*/
#base {
padding-top: 20px;
padding-bottom: 25px;
float: left;
	}

#base ul
{

}

#base ul li { float:left; font-size: 0.7em;}

#base ul li a
{
padding-bottom: 0.5em;
margin: 0 0.5em;
float: left;
color: #FFFFFF;
text-decoration: none;
text-align: center;
}

#base ul li.first a
{
	padding-bottom: 0.5em;
	float: left;
	color: #FFFFFF;
	text-decoration: none;
	text-align: center;
	margin-top: 0px;
	margin-right: 0.5em;
	margin-bottom: 0px;
	margin-left: 0px;
}


#base ul li a:hover
{
border-bottom: 0.3em solid #6600cc;
}

#base ul li a.current
{
border-bottom: 0.3em solid #6600cc;
}









