@charset "UTF-8";

/*	Use the following colours:
	Primary colour
	00adef	-	Pale blue
	2d8eb3	-	Darker
	00709b	-	Much darker (used for text)
	3ec4f7	-	Lighter
	6fd1f7	-	Lighter still
	
	Complemantary colour
	ff8500	-	pale orange
	bf7a30	-	Darker
	a65600	-	Much darker
	ffa340	-	Lighter
	ffbc73	-	Even lighter (used to underline menu)
	
	Border of screen is black and base background is white
*/

#header,
#footer,
#content,
#container
{
	position: relative;
}

#headerTopRight
{
	float: right;
	padding: 10px;
}

#homeLink
{
	position: absolute;
	top: 0px;
	left: 0px;
	height: 150px;
	width: 358px;
	z-index: 100;
	cursor: pointer;
}

#underConstructionImage
{
	position: absolute;
	left: 430px;
}

#homeContent
{
	position: relative;
	height: 300px;
}

#slideshow
{
	height: 320px;
	width: 450px;
	overflow: hidden;
}

#restOfHomeContent
{
	position: absolute;
	top: 1px;
	left: 460px;
	height: 210px;
	width: 425px;
}


	/*	Sprites menu	*/
	
ul.spritemenu 
{
    width: 920px;
    height: 36px;
	background-image: url(../images/menu/sprites_menu.png);
	background-repeat: no-repeat;
    position: absolute;
    /*top: 151px;*/
	bottom: 0px;
    left: 0px;
	list-style-type:none;
	margin:0;
	padding:0;
}

ul.spritemenu li 
{
	list-style-type:none;
	margin:0;
	padding:0;
	float: left;
}

ul.spritemenu li a 
{
	display: block;
	width: 115px;
	height: 36px;
	float: left;
}


.spritemenu li a:link, .spritemenu li a:visited 
{
    text-indent: -9000px;
    overflow: hidden;
	border-bottom-style: solid;	/*	This bottom border is made black at first so there is something to be overwriten by Java Script (if it exists) when 	*/
	border-bottom-width: 1px;	/*	it highlights the choosen page.  Doesn't really show if JS is not enabled	*/
	border-bottom-color: #000;
}

.spritemenu  a#homeitem:hover, .spritemenu  a.homeitem:focus 
{
	background: url(../images/menu/sprites_menu.png) no-repeat 0px -36px;
}
.spritemenu  a#homeitem:active 
{
	background: url(../images/menu/sprites_menu.png) no-repeat 0px -73px;
}

.spritemenu  a#aboutitem:hover, .spritemenu  a.aboutitem:focus 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -115px -36px;
}
.spritemenu  a#aboutitem:active 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -115px -73px;
}

.spritemenu  a#contactitem:hover, .spritemenu  a.eventsitem:focus 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -230px -36px;
}
.spritemenu  a#contactitem:active 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -230px -73px;
}

.spritemenu  a#newbuilditem:hover, .spritemenu  a.newbuilditem:focus 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -345px -36px;
}
.spritemenu  a#newbuilditem:active 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -345px -73px;
}

.spritemenu  a#residentialitem:hover, .spritemenu  a.residentialitem:focus 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -460px -36px;
}
.spritemenu  a#residentialitem:active 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -460px -73px;
}

.spritemenu  a#personalitem:hover, .spritemenu  a.personalitem:focus 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -575px -36px;
}
.spritemenu  a#personalitem:active 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -575px -73px;
}

.spritemenu  a#testimonialitem:hover, .spritemenu  a.testimonialitem:focus 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -690px -36px;
}
.spritemenu  a#testimonialitem:active 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -690px -73px;
}

.spritemenu  a#tipsitem:hover, .spritemenu  a.tipsitem:focus 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -805px -36px;
}
.spritemenu  a#tipsitem:active 
{
	background: url(../images/menu/sprites_menu.png) no-repeat -805px -73px;
}