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

	Stylesheet for Boogie Nites Disco
	
	version: 	1.0
	author: 	Andrew McEwan
	email:		andrew@web-workshop.net
	website:	www.web-workshop.net
	
************************************************************/

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size:62.5%;
	background-color:#686868;
	text-align:center;
	background-image:url(images/backgrounds/background-gradient.jpg);
	background-repeat:repeat-y;
	background-position:center top;
	padding-top:25px;
	margin: 0px;
	padding-right: 0px;
	padding-bottom: 25px;
	padding-left: 0px;
	color:white;
}

* {
	margin:0;
	padding:0;
	}
	
* html body {		
	font-size:62.5%;  /* Set IE font size */
	}
	
h1 {
	font-size:2.0em;
	font-weight:bold;
	padding-bottom:15px;
	}
	
h2 {
	font-size:1.6em;
	font-weight:bold;
	padding-bottom:10px;
	line-height:1.25em;
	}

h3 {
	font-size:1.4em;
	font-weight:bold;
	padding-bottom:10px;
	}
	
p	{
	font-size:1.2em;
	font-weight:normal;
	padding-bottom:5px;
	line-height:1.5em;
	}
	
a {
	color:white;
	text-decoration:underline;
	}
	
a:hover {
	text-decoration:none;
	}
	
/***************************************************************

	Main site holder
	
****************************************************************/

#mainHolder {
	width: 760px;
	margin: 0 auto;
	border: 1px solid #dfdfdf;
	text-align:left;
	background-color:#666666;
	background-image:url(images/backgrounds/dancers.jpg);
	background-repeat:no-repeat;
	background-position:center top;
	position:relative;
	/*z-index:0;*/
	/*padding-top:250px;*/
	}
	
#mainHolder img#logo {
	position:absolute;
	top:-10px;
	left:-10px;
	width:283px;
	height:159px;
	/*z-index:1;*/
	}
	
#mainHolder img#telno {
	position:absolute;
	top:18px;
	right:17px;
	width:293px;
	height: 25px;
	/*z-index:1;*/
	}

#mainHolder img#stamp {
	position:absolute;
	top:71px;
	right:40px;
	width:188px;
	height:188px;
	/*z-index:1;*/
	}

#mainHolder #topGap {
	padding-bottom:300px;
	float:left;
	}

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

	Top Navigation
	
*********************************************************/

#mainHolder ul#mainNavigation {
	height:27px;
	width:720px;
	z-index:1;
	list-style:none;
	float:left;
	padding-left:30px;
	padding-right:0px;
	padding-top:250px;
	padding-bottom:50px;
	}
	
#mainHolder ul#mainNavigation li {
	float:left;
	}
	
#mainHolder ul#mainNavigation li a {
	padding-left:5px;
	padding-right:5px;
	display:inline;
	}
	
#mainHolder ul#mainNavigation li a:hover {
	padding-left:5px;
	padding-right:5px;
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;
	}


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

	Content
	
********************************************************/

#mainHolder #content {
	width:740px;
	padding-left:10px;
	padding-right:10px;
	padding-top:50px;
	background-image:url(images/backgrounds/lone-dancer-right.gif);
	background-repeat:no-repeat;
	background-position:bottom right;
	}

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

	Info Boxes
	
***********************************************************/

/*
 *
 *	Large
 *
 ***********************************/


#mainHolder #content #largeBoxContainer {
	width:691px;
	float:left;
	padding-left:25px;
	padding-bottom:25px;
	}
	


#mainHolder #content #largeBoxContainer #largeBoxTop {
	background-image:url(images/boxes/large-2/large-box-top.jpg);
	background-repeat:no-repeat;
	height:25px;
	width:691px;
	float:left;
	}
	
#mainHolder #content #largeBoxContainer #largeBoxBottom {
	background-image:url(images/boxes/large-2/large-box-bottom.jpg);
	background-repeat:no-repeat;
	background-position:bottom;
	width:691px;
	clear:left;
	float:left;
	}

#mainHolder #content #largeBoxContainer #largeBoxBottom img#icon {
	padding-left:15px;
	height:57px;
	width:57px;
	float:left;
	}
	
#mainHolder #content #largeBoxContainer #largeBoxBottom h1 {
	float:right;
	font-size:2.0em;
	font-weight:bold;
	letter-spacing:0.1em;
	padding-bottom:10px;
	padding-right:25px;
	width:550px;
	}
	
#mainHolder #content #largeBoxContainer #largeBoxBottom p {
	clear:right;
	float:right;
	font-size:1.2em;
	font-weight:bold;
	padding-bottom:25px;
	padding-right:25px;
	width:550px;
	}

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

	Two column Content
	
**********************************************************/

#mainHolder #content ul#columnOne {
	float:left;
	width:330px;
	padding-left:25px;
	list-style:none;
	padding-bottom:25px;
	}
	
#mainHolder #content ul#columnTwo {
	float:right;
	width:330px;
	padding-right:25px;
	list-style:none;
	padding-bottom:25px;
	}

#mainHolder #content ul#columnOne li,
#mainHolder #content ul#columnTwo li {
	clear:both;
	padding-top:15px;
	}

#mainHolder #content ul#columnOne li img,
#mainHolder #content ul#columnTwo li img {
	float:left;
	width:38px;
	height:38px;
	border:none;
	}
	
#mainHolder #content ul#columnOne li h1,
#mainHolder #content ul#columnTwo li h1 {
	float:right;
	width:280px;
	font-size:1.6em;
	font-weight:bold;
	}
	
#mainHolder #content ul#columnOne li p,
#mainHolder #content ul#columnTwo li p {
	clear:right;
	float:right;
	width:280px;
	}

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

	Footer
	
*********************************************************/


#mainHolder #footer {
	clear:both;
	float:left;
	width:740px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:10px;
	padding-top:20px;
	}

#mainHolder #footer ul {
	list-style:none;
	float:left;
	padding-bottom:10px;
	}
	
#mainHolder #footer ul li {
	float:left;
	}
	
#mainHolder #footer ul li a {
	padding-left:5px;
	padding-right:5px;
	display:inline;
	color:#FBFBFB;
	font-size:1.1em;
	font-weight:bold;
	text-decoration:none;
	}
	
#mainHolder #footer ul li a:hover {
	text-decoration:underline;
	}
	
#mainHolder #footer p {
	clear:left;
	font-size:0.9em;
	color:#F6F6F6;
	padding-left:5px;
	}

#mainHolder #footer p a {	
	text-decoration:none;
	color:#F6F6F6;
	}
	
#mainHolder #footer p a:hover {
	text-decoration:underline;
	}

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

	Form Elements
	
******************************************************/

form {
  font-size: 1.4em;
  width: 450px;
  padding-bottom:25px;
}


/* fieldset styling */
fieldset {
  margin: 1em 0; /*  space out the fieldsets a little*/
  padding: 1em;
  border : 1px solid #ccc;
  background-color:#666666;
  background-image:url(images/backgrounds/form.jpg);
  background-repeat:repeat-x;
  background-position:bottom;
}

/* legend styling */
legend {
  font-weight: bold;
}


/* style for  labels */
label {
  display: block;
}

/* style for required labels */
label .required {
  font-size: 0.75em;
  color:white;
}

input {
  width: 200px;
  border:1px solid #494949;
  background-color:#919191;
}


input.radio, input.submit {
  width: auto;
}

/* style form elements on focus */
input:focus, textarea:focus {
  background: #ffc;
}

input.radio {
  float: left;
  margin-right: 1em;
}

textarea {
  width: 300px;
  height: 100px;
  border:1px solid #494949;
  background-color:#919191;
}

/* Hack to make sure the floated radio buttons
   sit next to the labels correctly in IE/Mac*/

/* This is the style I want IE/Mac to see */
input.radio + label {
  text-indent: 2em;
}

/* Using the commented backslash filter, I'm resetting
   the above rule for everything other than IE5/Mac \*/
input.radio + label {
  text-indent: 0;
}

/* End the hack */

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

	Misc.
	
******************************************************/

h1#temp {
	padding-top:300px;
	padding-bottom:200px;
	text-align:center;
	font:Arial, Helvetica, sans-serif;
	font-size:2.0em;
	font-weight:bold;
	color:#FCFCFC;
	letter-spacing:0.1em;
	}
	
.floatImage {
	float:right;
	padding-left:15px;
	padding-bottom:10px;
	}
	
.floatImageOther {
	float:left;
	padding-right:15px;
	padding-bottom:10px;
	}
	
.clear {
	clear:left;
	}
	
.createGap {
	padding-bottom:400px;
	}