body {
	padding: 0;
	margin: 0;
	font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
	background-image:url(img/bg.png);
	background-repeat:no-repeat;
	background-position:top;
	width: 100%;
	
	}
	
#content {
	width: 700px;
	margin: 205px auto 0;
	background: #fff;
	border: solid 1px #ccc;
	padding: 10px;
	padding-bottom:20px;
	padding-right:70px;
	font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
	font-size: 16px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}	

#header {
	width: 852px;
}	
	
	
/* Logo and Navigation */

#logo {
	position:absolute;
	left:95px;
	top:15px;
	width:428px;
	height:93px;
}

#nav {
	position:inherit;
	top:108px;
	width:776px;
	height:54px;
	left:36px;
	visibility:visible;
	list-style: none;
}

.navigation a {
	display:block;
	width: 120px;
	padding:10px 10px 10px 7px;
	font: bold 13px sans-serif;;
	color:#333;
	text-decoration: none;
	
}
.navigation a:hover { 
	background-position: 0 -35px;
	color: #049;
}

.navigation a:active {
	background-position: 0 -70px;
	color:#fff;
}

/* Navigation */
ul {
	list-style: none;
	padding-top: .5em;
	float: left;
	width: 100%;
	list-style: none;
	float:left;
}
ul li {
	background: url(images/bullet.gif) no-repeat 4px 4px;
	padding: 0 0 1em 18px;
	line-height: 140%;
	float:left;
}
ol {
	color: #7a656f;
}
ol li {
	padding: 0;
}
ol p {
	color: #7a656f;
}



#nav :hover ul li a.aboutme {background:url(img/about.png); 	background-repeat:no-repeat;}
#nav :hover ul li a.resume {background:url(img/about.png); 	background-repeat:no-repeat;}

#nav :hover ul li a.print {background:url(img/print.png); 	background-repeat:no-repeat;}
#nav :hover ul li a.web {background:url(img/web.png); 	background-repeat:no-repeat;}


#nav table {position:absolute; top:0; left:0; border-collapse:collapse; padding:0; width:0; height:0; margin:-1px;}

#nav .sub {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#nav :hover ul.sub
{left:200px; top:140px; width:152px; height:auto; z-index:300;}
#nav :hover ul.sub li
{display:block; height:30px; position:relative; float:left; width:100px; font-weight:normal;}
#nav :hover ul.sub li a
{display:block; height:30px; width:120px; padding:0; cursor:pointer;}
#nav :hover ul.sub li a b {position:absolute; left:-9999px; margin:0;}



h1 {
	font: bold 180%/100% Georgia, Times, serif;
	padding: 0 0 8px;
	letter-spacing: -1px;
	margin-left: -2px;
	color: #2b2b2b;
}

h2 {
	font: bold Georgia, Times, serif;
	font-size:10px;
	padding: 0 0 8px;
	color: #330033;
}

h3 {
	font: bold Verdana, Geneva, sans-serif;
	font-size: 10px;
	padding: 0 0 3px;
	color: #330033;
}

  #About
  {
    display: block;
    width: 115px;
    height: 23px;
    background: url("img/about.png") no-repeat 0 0;

  }

  #About:hover
  { 
    background: url("img/aboutOver.png") no-repeat 0 0;
  }

  #Folio
  {
    display: block;
    width: 215px;
    height: 23px;
    background: url("img/folio.png") no-repeat 0 0;

  }

  #Folio:hover
  { 
    background: url("img/folioOver.png") no-repeat 0 0;
  }

  #Blog
  {
    display: block;
    width: 115px;
    height: 23px;
    background: url("img/blog.png") no-repeat 0 0;

  }

  #Blog:hover
  { 
    background: url("img/blogOver.png") no-repeat 0 0;
  }

  #Contact
  {
    display: block;
    width: 165px;
    height: 23px;
    background: url("img/contact.png") no-repeat 0 0;

  }

  #Contact:hover
  { 
    background: url("img/contactOver.png") no-repeat 0 0;
  }
  
#twitter_div {
	float:right;
	width: 340px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #c0a2b5;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.05em;
	padding-right: 5px;
	padding-left: 5px;
}
 
#twitter_div ul li {
	color: #0C93BA;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #c0a2b5;
}
 
#twitter_div ul li a {
	text-decoration: none;
	color: #330033;
}
 
#twitter_div ul li a:hover {
	text-decoration: none;
	color: #330033;
}
 
#twitter_div p {
	text-align: left;
	padding-right: 6px;
	padding-bottom: 10px;
}

/* Index Bottom */

#index_bottom {
	width: 600px;
	
	}

#skills_div {
	width: 300px;
	float: left;
}

skills_div.ul {
	list-style: none;
	padding-top: .5em;
	width: 100%;
	list-style: none;
}

skills_div.ul li {
	background: url(images/bullet.gif) no-repeat 4px 4px;
	padding: 0 0 1em 18px;
	line-height: 140%;
}



#web_div {
	float:right;
	width: 300px;	
	height: 300px;

	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.05em;
	padding-right: 5px;
	padding-left: 5px;
}


#footer{width:680px;position:center;left:0;clear:both;background:#fff; padding:10px; 
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;}

#footer-inner{padding:10px 0 0 0; float: none;
 max-width:108em;margin:0 auto}
 

#footer .ol li
a{font:.92em Tahoma, Verdana, Arial, Helvetica, sans-serif;color:#8b8b8b;text-decoration:none; float: none; list-style:none;
}

#footer .col ol li
a{font:.92em Tahoma, Verdana, Arial, Helvetica, sans-serif;color:#8b8b8b;text-decoration:none; float: none; list-style:none;
}

#footer .col ol li a:hover{color:#8999c3; float: none; list-style:none;
}





#created,#function{font:0.83em Tahoma, Verdana, Arial, Helvetica, sans-serif;color:#acacac}

#created
a{color:#8999c3}

#function
a{color:#cbcbcb;text-align:right;text-decoration:none;display:inline-block;padding:0
0 0 15px;float:right}


/* End Index Bottom */

a:link  {color:#8e5176;  }
a:visited {color:#b382a3; }
a:hover {color:#b382a3; text-decoration:overline underline; }
a:active {
	font-size: 9px;
} 



/* Contact */

#contact-area {
	width: 600px;
	margin-top: 25px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

#contact-area input, #contact-area textarea {
	padding: 5px;
	width: 471px;
	font-family: Helvetica, sans-serif;
	font-size: 1.4em;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

#contact-area textarea {
	height: 90px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

#contact-area textarea:focus, #contact-area input:focus {
	border: 2px solid #900;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

#contact-area input.submit-button {
	width: 100px;
	float: right;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

label {
	float: left;
	text-align: right;
	margin-right: 15px;
	width: 100px;
	padding-top: 5px;
	font-size: 1.4em;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
