body {
width:900px;
margin:0 auto;
margin-top:0px;
background-color: #833503;
background-image: url(../images/body-bg.png);
background-repeat: repeat-x;
background-position: top;
}



/* ----- HEADER ----- */



#header {
width:900px;
height:100px;
background:url(../images/header.jpg);
}



/* FAUX LAYOUT WRAPPER */


/* 
This div is optional: When you delete it the navigation bar and the content block won't have the same size when one of them has a larger height then the other. I recommend you to leave this faux layout wrapper here.

IMPORTANT: In order to make this work you have to download http://csseasy.com/layouts/fixed/background_3.gif (copy past in your address bar) and place it in the same folder as this html file. DON'T HOTLINK to this file.
*/


#wrapper{
width:900px;
background-color: #833503;

overflow:auto; /* USE FIREFOX GUYS! WE ONLY NEED THIS LINE BECAUSE INTERNET EXPLODER ISN'T READING CODE PROPERLY */
margin-top:0px;
}


/* ----- MAIN CONTENT ----- */



#left {
width:430px;
min-height:425px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:425px; /* for IE5.x and IE6 */
float:left;
}




#right { 
margin-left:470px;
width:430px;
min-height:425px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:425px; /* for IE5.x and IE6 */
}

#photography {
width: 400px;
min-height:400px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:400px; /* for IE5.x and IE6 */
display: block;
background-image: url(../images/photography.jpg);
margin-top: 30px;
margin-left: 30px;
}


#photography a:link, a:visited {
width: 400px;
min-height:400px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:400px; /* for IE5.x and IE6 */
display: block;
text-indent: -9000px;
}
#photography-inside {
	padding-top: 50px;
	margin-left:30px;
	margin-right:30px;
	height: 350px;
	
}


#photography a:hover, a:active {
line-height: 25px;
margin-top: 20px;
font-size: 18px;
font-family: sans-serif, Helvetica, Verdana, Arial, sans-serif;
width: 400px;
min-height:400px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:400px; /* for IE5.x and IE6 */
background-image: url(../images/photography-rollover.jpg);
color: white;
text-decoration: none;
display: block;
text-indent: 0px;

}

#design {
width: 400px;
min-height:400px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:400px; /* for IE5.x and IE6 */
display: block;
background-image: url(../images/design.jpg);
margin-top: 30px;

}

#design-inside {
	padding-top: 40px;
	margin-left:20px;
	margin-right:20px;
	height: 360px;
}

#design a:link, a:visited {
width: 400px;
min-height:400px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:400px; /* for IE5.x and IE6 */
display: block;
text-indent: -9000px;
}

#design a:hover, a:active {
width: 400px;
min-height:400px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:400px; /* for IE5.x and IE6 */
display: block;
background-image: url(../images/porkchop-rollover.jpg);
text-indent: 0px;
color: white;
text-decoration: none;
line-height: 25px;
font-size: 18px;
font-family: sans-serif, Helvetica, Verdana, Arial, sans-serif;

}
/* ----- FOOTER ----- */



#footer { 
line-height: 22px; 
font-size: 14px; 
font-family: Helvetica, Verdana, Arial, sans-serif; 
color: white;
text-align: right;
width:900px;
height:100px;
}

#footer-inside {
	padding-right: 30px;

}


#txt-contact-email a:link, a:visited {
text-decoration: none;
line-height: 22px; 
font-size: 14px; 
font-family: Helvetica, Verdana, Arial, sans-serif; 
color: white;

}

#txt-contact-email a:hover, a:active {
text-decoration: none;
line-height: 22px; 
font-size: 14px; 
font-family: Helvetica, Verdana, Arial, sans-serif; 
color: white;

}