@charset "utf-8";
/*
Copyright is held by original owners.
CSS Document: The Panics.
Version: 1.00
*/

/*
ATTRIBUTES
**********
Font Primary: #FFF, Arial, 11px
Page Heading: #b7eeff, Bahamas, 36px
Content Headings: #FFF, Arial, 14px
__________

DIMENSIONS
**********
Main site width: 1024px
Content Main: 620px -> 500px
Gutter width: n/a
__________

CSS INDEX:
**********
+ Global Styles
  - Text
  - Headings  
  - Links
  - Lists
  - Forms
+ Page Layout
  - Content (Containers)
+ Header
+ Footer
+ Navigation
  - Primary
  - Secondary
+ Banners
+ Page Tools
+ Content (Body)
__________

*/

/*
=================================
GLOBAL STYLES
*/

* {
	margin:0em;
	padding:0em;
	border:none;
}

#panics {
	font-family:Arial, Helvetica, sans-serif;
	font-size:70%;
	color:#fff;
}	
	
.accessible {
	display:block;
	position:absolute;
	left:-9999em;
	z-index:0;
	height:0px;
	width:0px;
	line-height:0px;
	font-size:0px;
	float:left;
	clear:none;
	visibility:collapse;
}

.invisible {
	display:none;
}	

.right {
	float:right;
}

.left {
	float:left;
}

.image.right {
	margin:0em 0em 2em 2em;
}

.image.left {
	margin:0em 2em 2em 0em;
}

a {
	text-decoration:underline;
}

a:link {
	color:#ed571c;
}
a:visited {
	color:#ffa27e;
}
a:hover {
	color:#82e7ed;
}
a:active {
	color:#ed571c;
	outline:none;
}

form button {
	font-weight:bold;
	font-size:.9em;
	cursor:pointer;
	background:url(../images/bg_button.gif) left bottom no-repeat;
	height:23px;
	width:auto;
	overflow:visible;	
	text-align:center;
	margin-right:1em;
}


/*
PAGE LAYOUT
*/

body {
	background:#796a55 url(../images/bg-page.jpg) center top no-repeat;
}

#header {
	margin:0em auto;
	width:1024px;
	height:242px;
	position:relative;
	z-index:9;
}

#page {
	width:1024px;
	margin:0em auto;
	position:relative;
}

#enewsletter {
	position:absolute;
	top:0px;
	right:0px;
	width:220px;
	z-index:20;
	height:.1%;
}

#header #banner {
	position:absolute;
	left:420px;
	top:0px;
	height:232px;
}

#content-container {
	position:relative;
	z-index:8;
	margin-bottom:100px;
	width:100%;
	background:url(../images/bg-content.png) center top repeat-y;
	_background-image:url(../images/bg-content.gif);
}

#content-pre {
	float:left;
	width:220px;
	margin-left:20px;
	_margin-left:10px;
	height:.1%;
	display:inline-block;
}

#content {
	float:left;
	background:;
	width:500px;
	padding:0px 0px 0px 20px;
	margin:0px 20px;;
	height:.1%;
}

#content-post {
	float:left;
	width:222px;
	height:.1%;
}



	/* Content Colours */
	/* This ised to bridge the gaps between the flexible content box and other content around it */
	#header #gap-head {
		position:absolute;
		bottom:-20px;
		left:0px;
		width:100%;
		height:146px;
		background:url(../images/bg-content-header.png) center bottom no-repeat;
		_background-image:url(../images/bg-content-header.gif);
	}
	
	#content-container #break {
		position:absolute;
		bottom:-89px;
		left:0px;
		background:red;
		height:109px;
		width:100%;;
		clear:both;
		background:url(../images/bg-content-footer.png) center bottom no-repeat;
		_background-image:url(../images/bg-content-footer.gif);
	}


/*
NAV PRIMARY
*/

#nav-primary {
	position:relative;
	z-index:12;
	width:138px;
	top:8px;
	left:298px;
}

#nav {
	list-style:none;
	padding:0px;
}

#nav li {
	float:left;
}

#nav li span {
	display:none;
}

#nav li a {
	float:left;
	width:138px;
	background-position:left top;
	background-repeat:no-repeat;
}

#nav li a:hover {
	background-position:left bottom;
}

	#nav-pri-1 a {
		background-image:url(../images/nav-pri-1.gif);
		height:23px;
	}
	#nav-pri-2 a {
		background-image:url(../images/nav-pri-2.gif);
		height:21px;
	}
	#nav-pri-3 a {
		background-image:url(../images/nav-pri-3.gif);
		height:24px;
	}
	#nav-pri-4 a {
		background-image:url(../images/nav-pri-4.gif);
		height:20px;
	}
	#nav-pri-5 a {
		background-image:url(../images/nav-pri-5.gif);
		height:22px;
	}
	#nav-pri-6 a {
		background-image:url(../images/nav-pri-6.gif);
		height:22px;
	}	
	#nav-pri-7 a {
		background-image:url(../images/nav-pri-7.gif);
		height:25px;
	}		
	#nav-pri-8 a {
		background-image:url(../images/nav-pri-8.gif);
		height:19px;
	}
	
	
/*
FOOTER
*/

#footer {
	position:absolute;
	top:0px;
	margin:0px auto;
	background-color:red;
	z-index:14;
}

#footer #site-design a {
	position:absolute;
	display:block;
	height:24px;
	width:100px;
	top:695px;
	left:34px;
}

#footer #site-design a span {
	position:absolute;
	left:-999em;
}

/*
PRE CONTENT
*/

#content-pre #tours {
	max-height:185px;
	_height:185px;
	overflow-y:scroll;
	overflow-x:hidden;
}

#content-pre #tours .informer {
	font-size:.95em;
}

#content-pre #tours .item {
	margin-bottom:.8em;
	font-size:1.3em;
}




/*
CONTENT
*/

h1, h2, h3 {
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	margin-bottom:.4em;
}

#content .h1 {
	font-size:3em;
	color:#b7eeff;
}

#content .h2 {
	font-size:1.6em;
	color:#ed571c;
}

#content .h3 {
	font-size:1.3em;
}

#content-pre h2 {
	color:#ffc5b7;
	font-size:3em;
}

#content-container p {
	margin-bottom:0em;
}


	/* info boxes */
	
	#content .info .item {
		margin-bottom:14px;
		padding-bottom:1px;
		background:url(../images/divider-items.gif) center bottom no-repeat;
	}
	
	#content .info .item h3 {
		margin-bottom:.4em;
		color:#b7eeff;
	}
	
	#content .info .icons {
		margin:1em 0em;
	}
	
	
	/* Mailing List */
	#enewsletter form .line {
		clear:left;
	}
	
	#enewsletter form label {
		float:left;
		width:29px;
		padding-left:39px;
		padding-right:4px;
		padding-top:2px;
		height:18px;
		vertical-align:middle;
	}
	
	#enewsletter form input {
		float:left;
		display:block;
		width:130px;
		height:12px;
		line-height:12px;
		font-size:.95em;
		padding:2px;
	}
	
	#enewsletter form button {
		clear:left;
		float:right;
		padding-right:4px;
	}