/* -------------------------------------------------------------- 
  
   reset.css
   * Resets default browser CSS.
   
-------------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, img, q, dl, dt, dd, ol, ul, li, legend, caption{
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
}
strong{font-weight:bold;}
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a img { border: none; }
a{outline:none;}

body{
	padding:0;
	margin:0 auto;
	text-align:center;
	font-size:10px;
	font-family:Arial, Helvetica, sans-serif;
	color:#4d4d4d;
	background:url(../images/bodybg.jpg) repeat top left;
	line-height: 1.5;
}

/*-------------------
Main Text Formating
---------------------*/

h1{
	font-size:24px;
	margin:0;
	line-height:25px;
}

h2{
	font-size:18px;
	margin:12px 0 -5px;
}

p{
	font-size:12px;
	line-height:15px;
	color:#4d4d4d;
	margin:8px 0 8px 0;
}

p a{
	color:#4d4d4d;
	text-decoration:underline;
}
	p a:hover{
		text-decoration:underline;
		color:#666666;
	}

ul a{
	color:#4d4d4d;
	text-decoration:underline;
}
	ul a:hover{
		text-decoration:underline;
		color:#666666;
	}
	
ol a{
	color:#4d4d4d;
	text-decoration:underline;
}
	ol a:hover{
		text-decoration:underline;
		color:#666666;
	}

ul{
}

li{
	font-size:12px;
	line-height:15px;
	color:#4d4d4d;
	margin:0;
}

/*-------------------
Quick Classes
---------------------*/

.fleft{float:left;}
.fright{float:right;}
.clear{clear:both;}
.linkIcon{margin-right:5px;}
.imgBorder{border:1px solid #a6a7a3; background:#d7d8d4; padding:3px; display:block;}
.date{font-size:11px;}

/*-------------------
Navigation
---------------------*/

#navigation{
	position:absolute;
	top:45px;
	right:6px;
}

#navigation span{ display:none;}

.btn1bg, a.btn1,
.btn2bg, a.btn2,
.btn3bg, a.btn3,
.btn4bg, a.btn4,
.btn5bg, a.btn5,
.btn6bg, a.btn6,
.btn7bg, a.btn7{
	height:27px;
	display:block;
	float:left;
}

.btn1bg,
.btn2bg,
.btn3bg,
.btn4bg,
.btn5bg,
.btn6bg,
.btn7bg{
	margin:0 5px;
}


.btn1bg, a.btn1{
	width:89px;
	background:url(../images/nav/master_plan.jpg) no-repeat top left;
}
.btn2bg, a.btn2{
	width:52px;
	background:url(../images/nav/aerial.jpg) no-repeat top left;
}
.btn3bg, a.btn3{
	width:67px;
	background:url(../images/nav/location.jpg) no-repeat top left;
}
.btn4bg, a.btn4{
	width:134px;
	background:url(../images/nav/development_team.jpg) no-repeat top left;
}
.btn5bg, a.btn5{
	width:99px;
	background:url(../images/nav/medica_center.jpg) no-repeat top left;
}
.btn6bg, a.btn6{
	width:65px;
	background:url(../images/nav/contact.jpg) no-repeat top left;
}

.btn1:hover,
.btn2:hover,
.btn3:hover,
.btn4:hover,
.btn5:hover,
.btn6:hover,
.btn7:hover{
	background-position:bottom left;
}

body.masterplan #navigation a.btn1,
body.aerial #navigation a.btn2,
body.location #navigation a.btn3,
body.developmentteam #navigation a.btn4,
body.mediacenter #navigation a.btn5,
body.contact #navigation a.btn6{
	background-position:bottom left;
}

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

#topbar{
	width:100%;
	background:url(../images/topbar.jpg) repeat-x left top;
	margin:0 auto;
}

#topbarwrap{
	width:960px;
	height:34px;
	margin:0 auto;
	text-align:left;
}

#topbar p{
	color:#fff;
	font-size:12px;
}

#topbar p a{
	color:#dadad7;
	font-size:12px;
	text-decoration:none;
}

#header{
	width:100%;
	background:url(../images/headerbg.jpg) repeat left top;
	margin:0 auto;
}

#headerwrap{
	width:960px;
	margin:0 auto;
	text-align:left;
	position:relative;
}

#logo{
	float:left;
	margin:5px 0 5px 40px;
}

#highlights{
	width:400px;
	background:url(../images/highlightstop.jpg) top left no-repeat;
}

#highlightsbottom{
	width:320px;
	background:url(../images/hlighlightsbottom.jpg) bottom right no-repeat;
	padding:45px 40px;
}

#photoarea{
	width:614px;
	height:276px;
	display:block;
	position:absolute;
	bottom:-50px;
	right:-10px;
	background:url(../images/sliderbg.png) top left no-repeat;
	background:url(../images/sliderbg.gif) top left no-repeat;
}

#highlightsbottom ul{
	list-style:none;
	margin:0;
	padding:0;
}

#highlightsbottom ul li{
	font-size:14px;
	font-weight:bold;
	margin:0;
	padding:4px 0 16px 33px;
	background:url(../images/libg.jpg) bottom left no-repeat;
}


#content{
	width:100%;
	background:url(../images/contentbg.jpg) repeat left top;
	margin:0 auto;
}

#contenttop{
	width:100%;
	background:url(../images/contenttop.jpg) repeat-x left top;
	margin:0 auto;
}

#contentwrap{
	width:960px;
	margin:0 auto;
	padding:50px 0 25px;
	text-align:left;
}

	.leftThird{
		float:left;
		width:600px;
	}
	
	.rightThird{
		float:right;
		width:320px;
		padding:0;
	}
	
	.leftHalf{
		width:450px;
		float:left;
	}
	
	.rightHalf{
		width:450px;
		float:right;
	}
	
	#contentwrap p{
		font-size:13px;
		line-height:18px;
	}
	
	#contentwrap ul{
		margin:8px 0 0 30px;
	}
	
	#contentwrap ul li{
		font-size:13px;
		line-height:18px;
		margin:0 0 8px;
	}
	
	#contentwrap table{
		font-size:13px;
		line-height:18px;
	}
	
	.sideImage{
		margin-top:25px;
	}
	
	#projectUpdate{
		width:320px;
		background:url(../images/projectUpdateBg.jpg) repeat-y top left;
		margin-top:25px;
	}
	
		#projectUpdateTop{
			width:320px;
			background:url(../images/projectUpdateTop.jpg) no-repeat top left;
		}
		
		#projectUpdateBottom{
			width:290px;
			background:url(../images/projectUpdateBottom.jpg) no-repeat bottom left;
			padding:5px 15px;
		}
		
		#projectUpdate p{
			color:#fff;
		}
		
		#projectUpdate #projectUpdateDate{
			font-size:11px;
			text-align:right;
			color:#a5b0c2;
		}
		
	#projectUpdate.downloads h2{
		color:#fff;
		margin-top:5px;
	}
	
	#projectUpdate.downloads p a.pdf{
		background:url(../images/pdf.gif) no-repeat top left;
		color:#fff;
		font-size:12px;
		padding:0px 0 0 20px;
		display:block;
	}
	
	#projectUpdate.downloads p a.img{
		background:url(../images/img.gif) no-repeat top left;
		color:#fff;
		font-size:12px;
		padding:0px 0 0 20px;
		display:block;
	}
		
	#masterplanMap{
		width:450px;
		height:400px;
		display:block;
		margin-top:25px;
	}
	
	#arialMap{
		width:950px;
		height:550px;
		display:block;
		margin-top:25px;
	}
	

#footer{
	width:100%;
	background:url(../images/footerbg.jpg) repeat-x left top;
	margin:0 auto;
}

#footerwrap{
	width:960px;
	min-height:150px;
	margin:0 auto;
	text-align:left;
}

	#footerTop{
		padding:15px 0 15px;
	}
	
	#footerTop p a{
		padding:0 10px;
		text-decoration:underline;
	}
	#footerTop p a:hover{
		padding:0 10px;
		text-decoration:underline;
		color:#666666;
	}
	
	#footerBottom table tr td p{
		font-size:10px;
	}
	
/***
Photo Slideshow
***/

#s3slider { 
   width: 570px; /* important to be same as image width */ 
   height: 225px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
   margin:25px 0 0 23px;
}

#s3sliderContent {
   width: 570px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 12px/15px Arial, Helvetica, sans-serif;
   padding: 10px 20px;
   width: 530px;
   background-color: #000;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   bottom: 0;
   text-align:right;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image 
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

.clear {
   clear: both;
}