/* Layout Stylesheet */ 

/* html body makes columns work */

html,body {
height: 100%;
width: 100%;
}

/* General Body  Coding */

body {
	margin-top: 0px;
	margin-left: 0px;
	margin-top:0px;
	margin-bottom: 0px;
	background-color: #FFFFFF;
    font-family: serif;
}

a:link { color: #660033; text-decoration: none; }

a:link.email { color: #FF0099; text-decoration: none; }
 
a:visited { color: #660033; text-decoration: none; }

a:hover { color: green; text-decoration: none; }

a:active { color: purple; text-decoration: none; }

h1 {
	text-align: center;
	font-family: serif;
	font-size: 1.5em;
	color: #660033;
}

/* Top Corner Pic */

#corner-pic {
left: 0%;
top: 0%;
width: 125px;
height: 125px;
position: absolute;
z-index: 1;
}

/* Site Banner */

#banner{
top: 0%;
left: 40px;
padding: 0px;
height: 125px;
width: 1050px;
position: absolute;
z-index: 3;
}

#nav{
top: 8%;
text-align: center;
color: #993399; 
font-size: 1.1em;
left: 40px;
padding: 0px;
width: 1050px;
position: absolute;
z-index: 4;
}

/* index.htm gradiants */

#index-grad{
top: 0%;
left: 125px;
height: 125px;
width: 100%;
background-image: 
url('images/skin/index_grad2.gif');
background-repeat: repeat-x;
background-position: top left; 
position: static;
z-index: 1;
}

/* resume.htm gradiant */

#resume-grad{
top: 0%;
left: 125px;
height: 125px;
width: 100%;
background-image: 
url('images/skin/resume_grad2.gif');
background-repeat: repeat-x;
background-position: top left; 
position: static;
z-index: 1;
}

/* old.htm gradiant */

#old-grad{
top: 0%;
left: 125px;
width: 100%;
height: 125px;
background-image: 
url('images/skin/old_grad2.gif');
background-repeat: repeat-x;
background-position: top left; 
position: static;
z-index: 1;
}

/* photography.htm gradiant */

#photography-grad{
top: 0%;
left: 125px;
width: 100%;
height: 125px;
background-image: 
url('images/skin/photography_grad2.gif');
background-repeat: repeat-x;
background-position: top left; 
position: static;
z-index: 1;
}

/* art.htm gradiant */

#art-grad{
top: 0%;
left: 125px;
width: 100%;
height: 125px;
background-image: 
url('images/skin/art_grad2.gif');
background-repeat: repeat-x;
background-position: top left; 
position: static;
z-index: 1;
}

/* web.htm gradiant */

#web-grad{
top: 0%;
left: 125px;
width: 100%;
height: 125px;
background-image: 
url('images/skin/web_grad2.gif');
background-repeat: repeat-x;
background-position: top left; 
position: static;
z-index: 1;
}

/* graphics.htm gradiant */

#graphics-grad{
top: 0%;
left: 125px;
width: 100%;
height: 125px;
background-image: 
url('images/skin/graphics_grad2.gif');
background-repeat: repeat-x;
background-position: top left; 
position: static;
z-index: 1;
}

/* writing.htm gradiant */

#writing-grad{
top: 0%;
left: 125px;
width: 100%;
height: 125px;
background-image: 
url('images/skin/writing_grad2.gif');
background-repeat: repeat-x;
background-position: top left; 
position: static;
z-index: 1;
}

/* Middle Column */

#mid-col{
 width: 80%;
 top: 12%;
 left: 125px;
 border: 0px solid #999999;
 background-color: white;
 position: absolute;
 right: 10%;
 padding: 20px 10px 10px 10px;
 z-index: 2;
 }
 

/* Lightbox */

#portfolio ul {
		list-style: none; /* Remove the bullet points from the list */
	}
		#portfolio ul li {
			float: left; /* Float the lists to the left, laying them out side by side */
			padding: 10px; margin: 0 23px 23px 0;
			background: url(images/skin/border.png); /* Add the semi-transparent background, used along with padding to give the impression of a see-through border */
			/* Let's get fancy with some CSS3, only visible in Firefox, Safari & Chrome. Other browsers simply revert to square corners */
			border-radius: 10px; 
			-moz-border-radius: 10px;
			-webkit-border-radius: 10px; 
		}
  
  /* Footer */
 
 #footer{
   width: 900px;
   left: 125px;
   border: none;
   background-color: #ffffff;
   color: #cccccc;
   padding: 5px;
   z-index: 1;
 }

 
/* Right-Hand Navigation 
 
 #rh-nav{
  width: 25%;
  float: right;
  border: 1px solid #000000;
  background-color: #ffffff;
  margin: 0px;
  padding: 5px;
  z-index: 2;
  }
  
Left-Hand Content 
 
 #lh-content{
  width: 65%;
  float: left;
  border-style: none;
  background-color: #ffffff;
  padding: 0px;
  z-index: 2;
  } 
*/