/* ----- Structure ------ */

body {
	padding-top: 0px;
	background-position:center;
	background-repeat:repeat;
	background-attachment:fixed; 
	background-color: #fff;
	background-image: url(../imgs/background.gif);
	margin: 0 auto;
}

#container {
	
	clear: both;
	margin: 0 auto;
	padding: 0 0px;
	width: 900px;
	border-top:0px solid black; 
	border-left:0px solid black; 
	border-right:0px solid black;
	margin-top: 10px;
}

#content {
	background: #000;
	clear: both;
	float: left;
	padding: 10px 10px;
	width: 880px;
}

/* ----- Header ------ */

#header {
	clear: both;
	float: left;
	margin: 10px 10px 0px 10px;
	width: 880px;
}

#header h1 {
	color: #fff;
}

.title {
	color: #d00e7c;
}

/* ----- Main Nav ------ */

#main-nav {
	border-top:0px solid black; 
	border-bottom:0px solid black;
	float: left;
	
}

#main-nav ul {
	list-style: none;
	margin: 0px 0px 0px 0px;
}

#main-nav ul li {
	display: inline;
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 95px 0px 0px 0px;
}

#main-nav ul li a {
	background: #000;
	text-decoration: none;
	color: #fff;
	font-weight: bold;
	font-family: "arial";
	font-size: 2em;
	letter-spacing: -0.1em;
	margin: 5px 10px 0px 10px;
	padding: 5px 10px 10px 10px;
}

#main-nav ul li a.nav-About:hover {
	color: #fff;
	background: #11567a;
}

#main-nav ul li a.nav-Web:hover {
	color: #fff;
	background: #980d5c;
}

#main-nav ul li a.nav-Photography:hover {
	color: #fff;
	background: #7015a4;
}

#main-nav ul li a.nav-Contact:hover {
	color: #fff;
	background: #ca1140;
}

#home a.nav-Home {
	float: left;
	text-decoration: none;
	letter-spacing: -0.1em;
	font-size: 4.5em;
	background: #000;
	font-weight: bold;
	margin: 60px 20px -10px 5px;
	padding: 0px 13px 0px 8px;
	color: #fff;
}

/* ----- Content ------ */

/* ----- Home ------ */

.homepage {
	width: 870px;
	margin: 0px 5px 0px 5px;
}

.home-img {
	border: 2px solid white;
	margin: 5px 0px 0px 0px;
}

.home1 {
	font-weight: bold;
	width: 117px;
	letter-spacing: -0.1em;
	font-size: 2em;
	background: #11567a;
	color: #fff;
	float: left;
	margin: 0px 0px 5px 0px;
	padding: 30px 40px 30px 60px;
}

.home2 {
	font-weight: bold;
	width: 117px;
	letter-spacing: -0.1em;
	font-size: 2em;
	background: #980d5c;
	color: #fff;
	float: left;
	margin: 0px 0px 5px 0px;
	padding: 30px 50px 30px 50px;
}

.home3 {
	font-weight: bold;
	width: 118px;
	letter-spacing: -0.1em;
	font-size: 2em;
	background: #7015a4;
	color: #fff;
	float: left;
	margin: 0px 0px 5px 0px;
	padding: 30px 60px 30px 40px;
}

.home4 {
	font-weight: bold;
	width: 118px;
	letter-spacing: -0.1em;
	font-size: 2em;
	background: #ca1140;
	color: #fff;
	float: left;
	margin: 0px 0px 5px 0px;
	padding: 30px 30px 30px 70px;
}

/* ----- About ------ */

.left-about {
	width: 580px;
	float: left;
}

.info {
	color: #fff;
}

.right-about {
	float: left;
	width: 300px;
}

.about-title {
	font-size: 1.5em;
	font-weight: bold;
	color: #11567a;
}

.about-img {
	margin: 5px 5px 5px 5px;
	float: left;
	border: 2px solid white;
}

/* ----- Web ------ */

.web {
	padding: 5px 0px 5px 5px;
}

.project-para {
	width: 290px;
	color: #fff;
	background: #000;
	margin: 5px 10px 5px 10px;
	float:left;
	clear: both;
}

.para-title {
	float: right;
	color: #fff;
	font-weight: bold;
	font-size: 2em;
	letter-spacing: -0.1em;
	border-top: 2px solid #525252;
	border-bottom: 2px solid #828282;
	border-style:solid none dotted none;
}

.project-para a.link {
	float: right;
	text-decoration: none;
	font-weight: bold;
	font-size: 2em;
	letter-spacing: -0.1em;
	color: #980d5c;
}

.project-img {
	float: right;
	border: 2px solid white;
	margin: 5px 0px 5px 0px;
}

/* ----- Photography ------ */

#gallery {
	background-color: #000;
	margin: 5px 5px 5px 5px;
	padding: 0px;
	width: 880px;
}
#gallery ul { 
	list-style: none; 
	margin: 0px 30px 0px 30px;
	
}
#gallery ul li { display: inline; }
#gallery ul img {
	border: 5px solid #525252;
	border-width: 5px 5px 20px;
	margin: 2px 2px 2px 2px;
}
#gallery ul a:hover img {
	border: 5px solid #7015a4;
	border-width: 5px 5px 20px;
	color: #fff;
}
#gallery ul a:hover { color: #fff; }

/* ----- Contact ------ */

.info {
	margin: -5px 0px 0px 0px;
}

.contact {
	margin: 5px 0px 0px 0px;
}

.contact a {
	text-decoration: underline;
	color: #000;
}

.contact a:hover {
	text-decoration: none;
	color: #ca1140;
}

.fb:hover{
	text-decoration: none;
	color: #fff;
}

.contact-para {
	font-size: 2em;
	width: 150px;
	font-weight: bold;
	margin: 5px 5px 5px 5px;
	padding: 100px 10px 0px 10px;
	color: #000;
	background: #fff;
	float: right;
}

.contact-para2 {
	font-size: 1.5em;
	width: 150px;
	font-weight: bold;
	margin: 5px 5px 5px 5px;
	padding: 108px 10px 0px 10px;
	color: #fff;
	background: #ca1140;
	float: right;
}

.contact-para3 {
	font-size: 1em;
	width: 150px;
	font-weight: bold;
	margin: 5px 5px 5px 5px;
	padding: 112px 10px 5px 10px;
	color: #000;
	background: #fff;
	float: right;
}

.contact-para4 {
	font-size: 3em;
	width: 100px;
	font-weight: bold;
	margin: 5px 5px 5px 5px;
	padding: 52px 10px 30px 60px;
	color: #000;
	background: #fff;
	float: right;
}

.contact-para5 {
	font-size: 2em;
	width: 150px;
	font-weight: bold;
	margin: 5px 5px 5px 5px;
	padding: 100px 10px 0px 10px;
	color: #fff;
	background: #ca1140;
	float: right;
}

.contact-img {
	float:left;
	margin: 5px 0px 0px 5px;
	border: 2px solid white;
}


/* ----- Footer ------ */

#footer {
	background: #000;
	margin: 0px 10px 10px 15px;
	width: 483px;
	clear: both; 
	float: left;
}

#main-foot {
	background: #000;
	float: left;
	margin: 0px 0px 0px 10px;
	border-top:5px solid black; 
	border-bottom:5px solid black;
}

#main-foot ul {
	margin: 0;
	padding: 0em;
	color: #fff;
	font-weight: bold;
	list-style-type: none;
	margin: 0px 0px -5px -5px;
}

#main-foot ul li { 
	display: inline; 
}

#main-foot ul li a { 
	text-decoration: none;
	padding: .2em .5em;
	color: #fff;
	font-weight: bold;
	background-color: #000;
	font-size: 1em;
}

#main-foot ul li a:hover {
	color: #525252;
}

#main-foot li:before { content: "| "; }
#main-foot li:first-child:before { content: ""; }