/*=======================================================
 CSS Document for Just4Fun Aqua Park
=======================================================*/

@import url("global.css");

.hidden { display: none; }
.show { display: inline-block; visibility: visible; }


/*=============================================================
	Main layout
=============================================================*/

#container { width: 980px; height: auto; display: block; margin: 0 auto; clear: both; }
#popup-container { width: 660px; height: auto; margin: 0 auto; display: block; }
#popup-wrap { width: 620px; height: auto; display: block; background-color: #fff; clear: both; margin: 0 19px 0 21px; }

/*=============================================================
	Header - header + logo
=============================================================*/

#logo { position: absolute; z-index: 100; width: 300px; height: 175px; display: block; top: 25px; left: auto; background: url('../images/logo.png') no-repeat 0 0; cursor: pointer; text-indent: -999em; }
#splash { background: url('../images/splash.png') no-repeat 0 0; width: 130px; height: 145px; position: absolute; z-index: 100; top: 70px; left: auto; margin-left: 850px; }
#address { width: 300px; height: 50px; position: absolute; z-index: 100; top: 55px; left: auto; margin-left: 300px; }
#header { width: 645px; height: 70px; padding: 70px 0 0 335px; background: url('../images/bg-header.gif') no-repeat 0 0; clear: both; }
#header p, #address p { margin: 0; line-height: 16px; }

/*=============================================================
	Main body - left + right
=============================================================*/

#mainpage { width: 890px; padding: 0 60px 0 30px; background: url('../images/bg-body.gif') repeat-y 50% 0; height: auto; clear: both; }

dl { width: 500px; display: block; clear: both; margin-bottom: 20px; font-size: 1.1em; }
dt { width: 300px; float: left; display: inline }
dd { width: 200px; float: left; font-weight: bold; display: inline; }

/*left ctas*/
#cta-panel { width: 190px; height: auto; padding: 190px 40px 0 40px; display: block; float: left; background: url('../images/bg-left.gif') no-repeat 0 0; }
#cta-panel img { display: block; padding-bottom: 20px; clear: both; }

/*right contents - nav + banner + contents*/
#right-panel { width: 600px; height: auto; float: right; display: block; }
.contents { width: 580px; height: auto; padding: 25px 10px 0 10px; float: left; display: block; clear: both; }
.shift { padding: 10px 20px; display: block; width: 575px; }
#scrollarea { width: 555px; height: 250px; overflow: auto; position: relative; padding: 10px 25px 10px 0; }
#extended-scrollarea { width: 565px; height: 350px; overflow: auto; position: relative; padding: 10px 15px 10px 0; }

/*navigation*/
ul#nav { width: 600px; height: 35px; overflow: hidden; display: inline-block; background: url('../images/bg-nav.gif') no-repeat 0 0; clear: both;  }
ul#nav li { float: left; display: block; }
ul#nav a { height: 35px; text-indent: -999em; overflow: hidden; float: left; display: block; }
ul#nav a:hover { background-position: 0 -35px!important; }
a#navhome { width: 74px; background: url('../images/nav-home.gif') no-repeat 0 0; }
a#navattractions { width: 116px; background: url('../images/nav-attractions.gif') no-repeat 0 0; }
a#navbookings { width: 118px; background: url('../images/nav-bookings.gif') no-repeat 0 0; }
a#navcontact { width: 109px; background: url('../images/nav-contact.gif') no-repeat 0 0; }
#homepage a#navhome, #attractions a#navattractions, #group-bookings a#navbookings, #contact-us a#navcontact { background-position: 0 -35px; }

/*flash + banner*/
.banner { width: 600px; height: auto; float: left; clear: both; margin-top: 25px; display: inline-block; }
#attractions .banner { background: url('../images/banner-attractions.jpg') no-repeat 0 0; height: 200px; }
#group-bookings .banner { background: url('../images/banner-bookings.jpg') no-repeat 0 0; height: 200px; }
#contact-us .banner { background: url('../images/banner-contact.jpg') no-repeat 0 0; height: 200px; }
#flash { width: 240px; height: 300px; float: left; display: none; }
#flash-video { width: 350px; height: 300px; display: none;  float: right; }
#homepage #flash, #homepage #flash-video { display: block; }

hr { border: 0; width: 100%; color: #e6e6e6; background-color: #e6e6e6; height: 1px; }

/* File Download Icons */
a.file {background: url('../images/icon-file.gif') 0 0 no-repeat; padding-left: 20px; display: block;}
a.pdf {background: url('../images/icon-pdf.gif') 0 0 no-repeat; padding-left: 20px; display: block;}
a.doc {background: url('../images/icon-doc.gif') 0 0 no-repeat; padding-left: 20px; display: block;}



/*=============================================================
	Footer
=============================================================*/

#footer { width: 850px; height: 50px; padding: 30px 65px 0 65px; display: block; margin: 0 auto; background: url('../images/bg-footer.gif') no-repeat 50% 0; clear: both; }
#footer img { float: right; }
#footer p { float: left; padding-top: 15px; margin: 0; display: inline-block; }
#footer a { color: #383838; text-decoration: none;}
#footer a:hover { color: #db3c05; text-decoration: underline;}

/*=======================================================
 End of CSS Document for Just4Fun Aqua Park
=======================================================*/