html {
    background: #222 url("../img/bg.png") repeat;
}

body {
	_width: 100%;
	color: #000;
	font: 14px/20px Helvetica, Arial, sans-serif;
	margin: 20px auto 0;
	max-width: 800px;
	text-align: left;
	-webkit-font-smoothing: antialiased;
  }

h1 {
  font: 40px/60px "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #000;
  font-weight: 200;
  }
  
  

h2, h3, h4 {
  font: 16px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin-bottom: 40px;
  }
  
.TITLE_H {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 55px;
	font-weight: lighter;
	color: #000;
	font-style: normal;
}

p {
    margin:     10px 0;
}

em {
    font-style: italic;
}


img {
    display:            block;
    margin-bottom:      0px;
}

a {
    color:              #36c;
    text-decoration:    none;
}
a:focus,
a:hover {
    text-decoration:    none;
}
	
	/** BEGIN NAVIGATION **/

#navigation ul {
	position: absolute; 
	top: 28px; 
	right: 30px; 
	list-style: none;
	margin: 0;
	padding: 0;
	border: none;
	display: inline;
	font-family: 'Trebuchet MS', sans-serif;
	font-size: 11pt;
	font-weight: normal;
	
	letter-spacing: 0.03em;
}
#navigation li {
	list-style-type: none;
	display: inline;
	margin: 0 5px 0 5px;
}
#navigation li a {
	color: #ff0000;
	text-decoration: none;
}
#navigation li a.active, #navigation a:hover {
	text-decoration: none;
	color: #FFF;
}


header {
	background: #000;
	width: 100%;
	height: 70px;
	position: fixed;
	top: 0;
	left: 0px;
	/* [disabled]border-bottom: 4px solid #ff0000; */
	z-index: 100;
	/* [disabled]background-image: url(img/bg.png); */
}

header2 {
	
	width: 100%;
	height: 70px;
	position: fixed;
	top: 0;
	right: 0px;
	/* [disabled]border-bottom: 4px solid #ff0000; */
	z-index: 10;
	/* [disabled]background-image: url(img/bg.png); */
}

/** END NAVIGATION **/

		
			.bgWrapper{
				position:fixed;
				background:url(../img/citypark-bg.png) top center repeat; 
				height:100%; 
				width:100%; 
				top:0; 
				left:0;
				
			}
			
			.huppy{
	position:fixed;
	background:url(../img/home-huppy.gif);
	width:800px;
	height:853px;
	left:10%;
	top:10%;
	margin-left:-1000px;
	margin-top:-200px;
				}
				
				.huppy2{
	position:fixed;
	background:url(../img/captaincapitalism.png);
	width:800px;
	height:853px;
	left:10%;
	top:10%;
	margin-left:-1500px;
	margin-top:350px;
				}
				
			.endymion{
				position:fixed;
				background:url(../img/endymion.png);
				width:350px; 
				height:300px; 
				left:50%; 
				margin-left:-700px;
				margin-top:450px;
				
			}
			.dauphine{
				position:fixed;
				background:url(../img/dauphine.png);
				width:350px;
				height:300px;
				left:50%;
				margin-left:400px;
				margin-top:200px;
			}
			
			.trolley{
				position:fixed;
				background:url(../img/trolley.png);
				width:350px;
				height:300px;
				left:50%;
				margin-left:325px;
				margin-top:700px;
			}
			.cemetary{
				position:fixed;
				background:url(../img/cemetary.png);
				width:350px; 
				height:300px; 
				left:50%; 
				margin-left:-675px;
				margin-top:1650px;
				
				
				}
			.mardigras{
				position:fixed;
				background:url(../img/mardigras.png);
				width:350px; 
				height:300px; 
				left:50%; 
				margin-left:-700px;
				margin-top:1950px;
				
				}
			
			.feathers{
				position:fixed;
				background:url(../img/feathers.png);
				width:350px;
				height:300px;
				left:50%;
				margin-left:400px;
				margin-top:2200px;
				
				}
				
				.hubig{
				position:fixed;
				background:url(../img/hubig.png);
				width:350px;
				height:300px;
				left:50%;
				margin-left:-700px;
				margin-top:2500px;
				
				}
			
			
			.mainWrapper{
	width:800px;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	-o-border-radius:10px;
	box-shadow:0px 0px 5px #000;
	-moz-box-shadow:0px 0px 5px #000;
	-webkit-box-shadow:0px 0px 5px #000;
	-o-box-shadow:0px 0px 5px #000;
	text-align:left;
	padding:25px;
	position:absolute;
	margin:15px auto;
	background-image: url(../img/bg.png);
	top: 100px;
			}
		
	/** BEGIN SOCIAL NAVIGATION **/
	
#banner {
	width:62px;
	
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-o-border-radius:5px;
	box-shadow:0px 0px 5px #000;
	-moz-box-shadow:0px 0px 5px #000;
	-webkit-box-shadow:0px 0px 5px #000;
	-o-box-shadow:0px 0px 5px #000;
	position: fixed;
	top: 175px;
	left: -20px;
	padding: 16px 0 150px 0;	
	background-image: url(../img/bg.png);
	
}


#banner ul {
	width: 30px;
	height: 180px;
	position: fixed; /** Sticks image at the left of the page **/
	top: 185px; /** Determines the height from the top of the page **/
	left: 5px; /** Determines the width from the left of the page **/
	background: url(../img/social_icons.png) no-repeat 0 0;
	list-style: none;
	margin: 0;
	padding: 0;
}
#banner li {
	display: inline;
}
#banner li a:link, #banner li a:visited {
	border: none;
	width: 30px; /** width of the button in active state **/
	height: 30px; /** height of the button in active state **/
	display: block;
	position: absolute;
	top: 120px;
	text-indent: -7000px; /** Removes li text from the screen **/
	outline: none;
	left: 0px;
}
#banner li.twitter a:link, #banner li.twitter a:visited {
	top: 0px;
}
#banner li.facebook a:link, #banner li.facebook a:visited {
	top: 30px  /** how many px left of the first button i.e blue **/
}
#banner li.blog a:link, #banner li.blog a:visited {
	top: 60px  /** how many px left of the first button i.e blue **/
}
#banner li.flickr a:link, #banner li.flickr a:visited {
	top: 90px  /** how many px left of the first button i.e blue **/
}
#bannerli.email a:link, #banner li.email a:visited { 
	top: 120px  /** how many px left of the first button i.e blue **/
}
#bannerli.youtube a:link, #banner li.youbtube a:visited { 
	top: 150px  /** how many px left of the first button i.e blue **/
}

#banner li.twitter a:hover {
	background: url(../img/social_icons.png) no-repeat -30px 0px; /** moves image up 30px showing the rollover states **/ 
}
#banner li.facebook a:hover {
	background: url(../img/social_icons.png) no-repeat -30px -30px; /** moves image up 30px and right 80px showing the rollover states **/
}
#banner li.blog a:hover {
	background: url(../img/social_icons.png) no-repeat -30px -60px;
}
#banner li.flickr a:hover {
	background: url(../img/social_icons.png) no-repeat -30px -90px;
}

#banner li.email a:hover {
	background: url(../img/social_icons.png) no-repeat -30px -120px;
}


#banner li.youtbue a:hover {
	background: url(../img/social_icons.png) no-repeat -30px -150px;
}

#banner bnrwrapper {
	width:560px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-o-border-radius:5px;
	box-shadow:0px 0px 5px #000;
	-moz-box-shadow:0px 0px 5px #000;
	-webkit-box-shadow:0px 0px 5px #000;
	-o-box-shadow:0px 0px 5px #000;
	padding:1px;
	position:fixed;
	background-image: url(../img/bg.png);
	z-index: 2;
}

/** END SOCIAL NAVIGATION **/


/** END SLIDER **/

/* BEGIN ABOUT CSS ACCORDIAN */
ul.accordion {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Hide the radio buttons */
/* These are what allow us to toggle content panes */
ul.accordion label + input[type='radio'] {
    display: none;
}

/* Give each content pane some styles */
ul.accordion li {
	background-image: url(../img/bg.png);
	text-align: left;	
}

/* Make the main tab look more clickable */
ul.accordion label {
	/* [disabled]background-color: #cc0000; */
	color: #FFFFFF;
	display: block;
	padding: 10px;
	background-image: url(../img/transparent.png);
	margin-bottom: 5px;
}

ul.accordion label:hover {
    cursor: pointer;
}

/* Set up the div that will show and hide */
ul.accordion div.content {
    overflow: hidden;
    padding: 0 10px;
    display: none;
}

/* Show the content boxes when the radio buttons are checked */
ul.accordion label + input[type='radio']:checked + div.content {
    display: block;
}

/* END ABOUT CSS ACCORDIAN */

/** BEGIN GALLERY **/

.gallerycontainer {
	margin:20px auto;
	padding:20px;
	position:relative;
	/* [disabled]width:100%; */
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	box-shadow:1px 1px 5px #111;
	-moz-box-shadow:1px 1px 5px #111;
	-webkit-box-shadow:1px 1px 5px #111;
	alignment-adjust:middle;
	background-image: url(../img/bg.png);
}

/* css3 photo gallery styles */
.gallery {
    width:100%;
    margin:0 auto;
}
.gallery a {
    display:inline-block;
    height:150px;
    position:relative;
    width:200px;
}
.gallery a img {
    border:5px solid #fff;
    cursor:pointer;
    display:block;
    height:100%;
    left:0px;
    position:absolute;
    top:0px;
    width:100%;
    z-index:1;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-transition-property:width, height, top, bottom, left, right, z-index, border;
	-webkit-transition-duration:0.5s;
	-moz-transition-property:width, height, top, bottom, left, right, z-index, border;
	-moz-transition-duration:0.5s;
	-o-transition-property:width, height, top, bottom, left, right, z-index, border;
	-o-transition-duration:0.5s;
	transition-property:width, height, top, bottom, left, right, z-index, border;
	transition-duration:0.5s;
}
.gallery a:focus img {
    border:15px solid #fff;
    cursor:default;
    height:450%;
    position:absolute;
    width:450%;
    z-index:25;


    box-shadow:1px 1px 5px #888;
    -moz-box-shadow:1px 1px 5px #888;
    -webkit-box-shadow:1px 1px 5px #888;
    -webkit-transition-property:width, height, top, bottom, left, right, z-index, border;
    -webkit-transition-duration:0.5s;
    -moz-transition-property:width, height, top, bottom, left, right, z-index, border;
    -moz-transition-duration:0.5s;
    -o-transition-property:width, height, top, bottom, left, right, z-index, border;
    -o-transition-duration:0.5s;
    transition-property:width, height, top, bottom, left, right, z-index, border;
    transition-duration:0.5s;
}
/* custom focus rules */
.BLACK_BLD   {
left:-150px;
}
.gallery a:focus:nth-child(3n+2) img {
    left:-350px;
}
.gallery a:focus:nth-child(3n+3) img {
    left:-350px;
}
.gallery a:focus:nth-child(-n+3) img {
    top:-140px;
}
.gallery a:focus:nth-child(n+7) img {
    top:-150px;
}
.gallery a:focus:nth-child(n+10) img {
    top:-295px;
}
/* extra close layer */
.gallery .close {
	background:transparent;
	cursor:pointer;
	display:none;
	height:352px;
	/* [disabled]left:170px; */
	position:absolute;
	top:160px;
	width:500px;
	z-index:30;
}
.gallery a:focus ~ .close {
    display:block;
}

/** END GALLERY **/


/** BEGIN DOWNLOAD **/

.downloadcontainer {
	margin:20px auto;
	padding:20px;
	position:relative;
	/* [disabled]width:100%; */
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	box-shadow:1px 1px 5px #111;
	-moz-box-shadow:1px 1px 5px #111;
	-webkit-box-shadow:1px 1px 5px #111;
	alignment-adjust:middle;
	background-image: url(../img/bg.png);
}

.downloadgallery {
    width:100%;
    margin:0 auto;
	overflow:hidden;
	max-width: 100%;
	height: auto;
	
}


/** END DOWNLOAD **/
.DownloadText {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #000;
}

/** BEGIN RAM **/

.bgWrapperRAM{
				position:fixed;
				background:url(../img/esplanade-bg.png) top center repeat; 
				height:100%; 
				width:100%; 
				top:0; 
				left:0;
				
			}
			
			.RAMcontainer {
	margin:20px auto;
	padding:20px;
	position:relative;
	/* [disabled]width:100%; */
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	box-shadow:1px 1px 5px #111;
	-moz-box-shadow:1px 1px 5px #111;
	-webkit-box-shadow:1px 1px 5px #111;
	alignment-adjust:middle;
	background-image: url(../img/bg.png);
	top: 150px;
}
			
			#container #footer p {
	color: #FFF;
	font-family: Verdana, Geneva, sans-serif;
}
p {
	font-family: Georgia, Times New Roman, Times, serif;
}
.twoColElsLtHdr #container #header p {
	font-family: Georgia, Times New Roman, Times, serif;
}
.twoColElsLtHdr #container #mainContent blockquote p {
	font-family: Verdana, Geneva, sans-serif;
}
.twoColElsLtHdr #container #sidebar1 blockquote p {
	font-family: Verdana, Geneva, sans-serif;
}
.RED {
	color: #F00;
}
.RED_BLD {
	color: #F00;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bolder;
	font-size: 16px;
	font-style: normal;
}
.BLACK_BLD {
	color: #000;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bolder;
	font-size: 14px;
	font-style: normal;
}
.BLACK_BLDCopy {
	color: #000;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bolder;
	font-size: 14px;
	font-style: normal;
	text-align: left;
}
.BLACK_BLDsm {
	color: #000;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bolder;
	font-size: 9px;
	font-style: normal;
}
.NAME {
	font-size: x-large;
}


	
