html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset {  
    margin: 0; 
    padding: 0; 
    border: 0; 
}

/* hide from IE mac \*/
html {
    min-height: 100%;
    margin-bottom: 1px;
}
/* end hiding from IE5 mac */

body { /* set everything to zero for a good cross-browser starting point */
	margin: 0; /* zeroes the margins on the body */
	padding: 0; /* zeroes the padding on the body ~ Opera carries a default padding and requires this zeroing */
	border: 0; /* zeroes off any existing border */
	background-color: #006464; /* sets the body background colour */
	color: #000000;  /* set the default text color */
	text-align: center; /* Hack to centre the wrapper in IE5.x pc */
	font-family: Verdana, Arial, Helvetica, sans-serif; /* set the default fonts */
	font-size: 100.01%; /* Sets default font size. This odd value compensates for several browser bugs. First, setting a default font size in percent (instead of em) eliminates an IE/Win problem with growing or shrinking fonts out of proportion if they are later set in ems in other elements. Additionally, some versions of Opera will draw a default font-size of 100% too small compared to other browsers. Safari, on the other hand, has a problem with a font-size of 101%. Current "best" suggestion is to use the 100.01% value for this property */
	min-width: 770px; /* Prevents the body becoming narrower than our wrapper div - keeps the content from disappearing off the left edge with Gecko browsers */
}

#wrapper {
   width: 770px;/*sets the width for IE5.x's broken box model*/
	w\idth: 770px; /* sets the width of the wrapper for compliant browsers*/
	margin: 5px auto;/* centers the wrapper. First value - 5px is applied to the top and bottom margins, auto sets the excess space on the view port evenly to the left and right*/
	position: relative; /* important to position it relatively */
	background-image: url(); /* sets the path to the wrapper's bg image*/
	background-position: bottom; /* uses two % values to place the image 2% from the left and 93% from the wrappers top left hand corner */
	background-repeat: no-repeat; /* prevents the image from tiling in our page, we do not want this image to repeat */
	background-color: #ffffff; /* sets the wrappers background color */
	border: 1px solid #005351; /* sets a border to all 4 sides */
	text-align: left; /* Realigns the text to the left after the IE hack in the body rule */
	padding-bottom:35px;
}

#nav{
	position:relative;
	top:10px;
	left:20px;
	width:725px;
	font-weight:bold;
	font-size:12px;
	margin-bottom: 20px;
}

#home{
	top:0px;
	left:25px;
	width:150px;
}

#directions{
	top:0px;
	width:150px;
	font-weight:inherit;
}

#photos{
	position:relative;
	width:740px;	
}

#container{
   width: 770px;/*sets the width for IE5.x's broken box model*/
	w\idth: 768px; /* sets the width of the wrapper for compliant browsers*/
}

#banner {
	position: relative; /* **PLEASE READ** ~ This property and value is not needed for your page to be rendered corectly in the browser - However, without it Dreamweaver allows the position of the leftcol div to ride up over the banner in design view. If that does not bother you you can safely delete this property and value pair. Alternatively you could implement a design time style sheet to position the div correctly for working in design view */
	width: 620px; 
	margin-left: 100px; 
	margin-top:0;
    padding-top:30px;
	/* IE does not correctly read margin-top - however this only applies to div properties, not image properties inside of DIVs */
}

#intro{
		clear:both;
		width: 580px; 
		margin: 0 0 0 100px;
		padding-top: 10px;
/* IE does not correctly read margin-top  */
}
#rightcol{ /* Begin laying out and styling the content div */
	width: 265px; /* sets the width of our content*/
	margin-left: 450px; /* this left margin clears the leftcol div and allows our content div to become a second column */
	margin-bottom: 0px; /* sets a padding clearance on the bottom of the div*/
	padding-top: 2.3em;
}

#rightcol p {
	font-size: 80%; /* set the font size for p, scaled from the body declaration */
	margin: 10px 6px 10px 6px; /* set the margins for the p element */
	padding: 0; /* zero off the padding */
}

#leftcol { /* Begin laying out the leftcol div */
	float: left; /* Floats the div to the left to make a column */
	width: 300px; /* sets a width for the div - Imperative for IE mac - for the time being this is set in both basic and ie css until otherwise realized*/
	margin-bottom: 0px;
	margin-left: 100px; /*creates a margin on the left to move the div away from the wrapper's edge */
	margin-top: 0px; /* moves the div down from the banner */
	padding-top: 0px; /* sets a padding to the top of the div to allow the bg image to show above the leftcol divs contents */
}

#bottom{
	clear:left;
	width: 580px; 
	margin: 0 0 0 100px;
	padding-top: 15px;
}


#bottomnav{
	
}

#footer{
	width: 772px;/*sets the width for IE5.x's broken box model*/
	w\idth: 770px; /* sets the width of the wrapper for compliant browsers*/
	margin: 0px auto;/* centers the wrapper. First value - 0px is applied to the top and bottom margins, auto sets the excess space on the view port evenly to the left and right*/
	position: relative; /* important to position it relatively */
	padding-top:5px;
	padding-bottom:20x;
	color:#ffffff;
	font-size:78%;
	font-weight:bold;
	margin-bottom: 10px;
	text-align:center;
	height:2em;	
}



.highlight{
	color:#666666;
	font-weight:bold;
}



/********************  Interior Page Styles **************/
#bannerInterior{
	position: relative; /* **PLEASE READ** ~ This property and value is not needed for your page to be rendered corectly in the browser - However, without it Dreamweaver allows the position of the leftcol div to ride up over the banner in design view. If that does not bother you you can safely delete this property and value pair. Alternatively you could implement a design time style sheet to position the div correctly for working in design view */
	width: 300px; 
	margin-left: 100px;  
	margin-top:0;
   padding-top:10px;
	/* IE does not correctly read margin-top - however this only applies to div properties, not image properties inside of DIVs */
}

/************** Photo Styles *************/
#TopPhoto{
	float:right;
	margin-left:20px;
	margin-bottom:20px;
}

#LivingRoom{
	padding-left: 40px;
}

#Loft{
	padding-top: 5em;
	padding-left: 0px;
}
#MasterBed{
	margin: 0px 0 0px 10px;
	padding-top: 2em;
	padding-bottom: .5em;	
}

#ThirdFloor1{
	padding-top: 9.5em;
	padding-left: 30px;	
}



/*****************  Text Styles ***************************/
H1{ /* home page header */
	font-size: 2em;
	margin: 0px 0 .5em;
	font-family: "Times New Roman", Times, serif;	
	color: #003366;
	padding-top:0px; /* padding-top selector more effective than margin-top selector
	IE does not read margin-top. However this selector did not work with img id */	
}


H2{ /* home page sub header1 */
	font-size: 1em;
	margin: 1em 0 .5em;
	font-family: Arial, Helvetica, sans-serif;
	color: #CF4212;
}

H3{ /* home page sub header 2 */
	font-size: 0.8em;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	font-weight: bold;
}


H4{ /* home page sub header 3 */
	font-size: 0.8em;
	margin-top: 0.4em;
	font-family: Arial, Helvetica, sans-serif;
	color: #003333;
	font-weight: bold;
}

H5{ /* home page sub header 3 */
	font-size: 0.8em;
	margin-top: 2em;
	font-family: Arial, Helvetica, sans-serif;
	color: #003333;
	font-weight: bold;
}

H6{ /* seasonal header header 3 */
	font-size: 0.4em;
	margin-top: 1em;
	font-family: Arial, Helvetica, sans-serif;
	color: #CF4212;
	font-weight: bold;
}

p {
	font-size: 80%;
	margin: 10px 6px 10px 0;
	padding: 0; 
}


/**********  Global Link Styles *************/
a, a:visited {
	color:#330099;
	font-size:1em;
}

a:hover{
	color:#E37200;	
}





#photocontainer{ 
   position:relative;
	text-align:center;
    margin: 0 20px;
	width:750px;
	padding: 35px 0 20px 0;
}

#photocontainer img{
	border:solid 1px #DDB000;
}

#photocontainer a{
	margin:10px;
}

div.photo{
	width:350px;
	text-align:center;
	margin-right:0px;
	padding:3px;
	margin-bottom:20px;	
}

div.photo p{
	text-align:center;
	font-style:italic;
	border:thin silver solid;	
	font-size:14px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	text-indent:0;
	border:none;
	margin:2px;
}

td{
	width:360px;
	text-align:center;
}

.floatleft{
	float:left;
}

.floatright{
	float:right;
}