/****************************
Copyright Criccieth Holiday Club
Design CSS
Coded by Jon Bradley with initial workings by David Turner

NOTE: This code is copyrighted.  No unauthorized use
is allowed.  Don't steal code.  However, please feel free
to look at how we did something then write it yourself.

*****************************/

html { height: 100%; margin-bottom: 1px; }

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 14px;
	color: #003366;
}

/* THIS is to hide any text you need hiding */
.hidetext {display:none; overflow: hidden; position: absolute;} 
/* END of text you need hiding */

#page_bg{
	margin: auto;
	padding: 0px;
	width: 800px;
}

#page_outline{
	margin: auto;
	padding: 0px 20px 0px 0px;
	float: left;
	height: auto;
	width: 800px;
	/*border-left: 1px solid #003366;
	border-right: 1px solid #003366;
	border-bottom: 1px solid #003366;*/
}

#header_container{
	margin: 0px;
	border: 0px;
	width: 800px;
	height: 156px;
	background-image: url(../images/header.jpg);
}

#footer_text_container{
	z-index: 1;
	width: 800px;
	height: auto;
	float: left;
	margin: auto;
	margin-top: 20px;
	position: relative;
	font-color: #003366;
	font-size: 10px;
	text-align: center;
	border-top:1px solid #003366;
}

#content_container{
	position:relative;
	left:1px;
	height: auto;
	width: 800px;
}

#side_photos{
	float:left;
	width:250px;
	height:350px;
}

#copy{
	float:left;
	width:480px;
	height: auto;
	margin-left: 20px;
	padding-top: 10px;
}

.inline_image_left{
	float:left;
	margin-right:15px;
	margin-bottom:5px;
}

.inline_image_right{
	float:right;
	margin-left:10px;
}

/****************************
MENU LAYOUT STARTS HERE
******************************/
#menu_container{
	position:relative;
	top:0px;
	left:0px;
	z-index: 8;
	width: 800px;
	height: 52px;
	margin: 0px;
	background-color: #FFFFFF;
}
#menu_container ul{
	padding: 0px;
	top:0px;
	left:0px;
	z-index: 50;
	margin: 0px;
}
#menu_container li, #menu_header_1, #menu_header_2, #menu_header_3, #menu_header_4, #menu_header_5, #menu_header_6, #menu_header_7, #menu_header_8{
	position: relative;
	top:0px;
	left:0px;
	z-index: 50;
	float: left;
	padding: 0px;
	margin: 0px 0px 0px 0px;
	list-style: none;
	height: 52px;
}

#menu_header_1, #menu_header_2, #menu_header_3, #menu_header_4, #menu_header_5, #menu_header_6, #menu_header_7, #menu_header_8{
	margin: 0px 0px 0px 0px;
}

#menu_header_1 { width: 106px; background: url(../images/menu1.jpg) -0px -0px no-repeat ;}
#menu_header_2 { width: 104px; background: url(../images/menu1.jpg) -106px -0px no-repeat ;}
#menu_header_3 { width: 108px; background: url(../images/menu1.jpg) -210px -0px no-repeat ;}
#menu_header_4 { width: 80px; background: url(../images/menu1.jpg) -318px -0px no-repeat ;}
#menu_header_5 { width: 111px; background: url(../images/menu1.jpg) -398px -0px no-repeat ;}
#menu_header_6 { width: 73px; background: url(../images/menu1.jpg) -509px -0px no-repeat ;}
#menu_header_7 { width: 101px; background: url(../images/menu1.jpg) -582px -0px no-repeat ;}
#menu_header_8 { width: 117px; background: url(../images/menu1.jpg) -683px -0px no-repeat ;}

#menu_header_1 a{ width: 106px; background: none;}
#menu_header_2 a{ width: 104px; }
#menu_header_3 a{ width: 108px; }
#menu_header_4 a{ width: 80px; }
#menu_header_5 a{ width: 111px; }
#menu_header_6 a{ width: 73px; }
#menu_header_7 a{ width: 101px; }
#menu_header_8 a{ width: 117px; }

#menu_header_1 a, #menu_header_2 a, #menu_header_3 a, #menu_header_4 a, #menu_header_5 a, #menu_header_6 a, #menu_header_7 a, #menu_header_8 a{
	display: block;
	margin: 0px 0px 0px 0px;
	height: 52px;
}

#menu_header_1 a:hover{ width: 106px; background: url(../images/menu2.jpg) -1px -0px no-repeat ;}
#menu_header_2 a:hover{ width: 104px; background: url(../images/menu2.jpg) -106px -0px no-repeat ;}
#menu_header_3 a:hover{ width: 108px; background: url(../images/menu2.jpg) -210px -0px no-repeat ;}
#menu_header_4 a:hover{ width: 80px; background: url(../images/menu2.jpg) -318px -0px no-repeat ;}
#menu_header_5 a:hover{ width: 111px; background: url(../images/menu2.jpg) -398px -0px no-repeat ;}
#menu_header_6 a:hover{ width: 73px; background: url(../images/menu2.jpg) -509px -0px no-repeat ;}
#menu_header_7 a:hover{ width: 101px; background: url(../images/menu2.jpg) -582px -0px no-repeat ;}
#menu_header_8 a:hover{ width: 117px; background: url(../images/menu2.jpg) -683px -0px no-repeat ;}
	
#menu_container a{
	padding: 0px;
	margin: 0px;
	display: block;
}

/****************************
FONT STUFF STARTS HERE
******************************/

.large_text{ 
	font-size: 14px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #003366;
	font-weight: normal;
	margin: 0px 0px 0px 0px;
	padding: 0px;
}

.headline_text{ 
	font-size: 11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #003366;
	margin: 0px 0px 0px 0px;
	padding: 0px;
}

.red_text{ 
	color: #990000;
}

a:link {  color: #990000; cursor: hand; font-weight: normal; text-decoration: none}
a:active {  color: #990000; cursor: hand; font-weight: normal; text-decoration: none}
a:visited {  color: #990000; font-weight: normal; text-decoration: none; cursor: hand}
a:hover {  color: #990000; cursor: hand; font-weight: normal; text-decoration: underline}