@import url(reset.css); 
@import url(defaults.css); 

body {
	background:#000000 url(../images/home_bg.jpg) repeat-x;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size:13px;
	color:#FFFFFF;
}

a, a:visited, a:link {
	color: #FFFFFF;
}

a:hover {
	color: #e70000;
}

p {
	line-height:22px;
}


/****** Generic Colours *******

RED: #e70000

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

#wrapper {
	width: 980px;
	margin: 0 auto;
}

#footer {
	width: 980px;
	float: left;
	clear:both;
	margin-top: 40px;
	height: 76px;
	background-image:url(../images/footer_bg.gif);
	background-repeat:no-repeat;
}
	



#invalid-message {
background-color:#ffd3de;
border:1px dotted #cc0035;
font-weight:bold;
margin-bottom:5px;
padding:5px;
text-align:center;
color: #993300;
}

#success-message {
background-color:#CAFFCB;
border:1px dotted #00CC00;
font-weight:bold;
margin-bottom:5px;
padding:5px;
text-align:center;
color: #006633;
}


/************ Homepage **************/

h1.logo {
	display:block;
	width: 257px;
	height: 95px;
	background-image:url(../images/drumminskool.gif);
	background-repeat:no-repeat;
	text-indent: -9999px;
	float: left;
	margin-top: 23px;
}

h1.logo a {
	display: block;
	width: 257px;
	height: 95px;
	text-indent:-9999px;
}

/***** Menu *****/

#menu ul {
	list-style:none;
	float: right;
	margin: 50px 0 0 100px;
}

#menu ul li {
	float: left;
	margin-right: 4px;
}

#menu ul li.home a {
	display: block;
	background-image:url(../images/menu-inactive.gif);
	background-position: 0 0;
	width: 55px;
	height: 35px;
	text-indent:-9999px;
}

	#menu ul li.home a:hover, #menu ul li.home a.active {
		display:block;
		width: 55px;
		height: 35px;
		background-image:url(../images/menu-active.gif);
		background-position: 0 0;
	}
	
#menu ul li.about a {
	display: block;
	background-image:url(../images/menu-inactive.gif);
	background-position: -59px;
	width: 55px;
	height: 35px;
	text-indent:-9999px;
}

	#menu ul li.about a:hover, #menu ul li.about a.active {
		display:block;
		width: 55px;
		height: 35px;
		background-image:url(../images/menu-active.gif);
		background-position: -59px;
	}
	
#menu ul li.services a {
	display: block;
	background-image:url(../images/menu-inactive.gif);
	background-position: -118px;
	width: 74px;
	height: 35px;
	text-indent:-9999px;
}

	#menu ul li.services a:hover, #menu ul li.services a.active {
		display:block;
		width: 74px;
		height: 35px;
		background-image:url(../images/menu-active.gif);
		background-position: -118px;
	}
	
#menu ul li.gallery a {
	display: block;
	background-image:url(../images/menu-inactive.gif);
	background-position: -196px;
	width: 154px;
	height: 35px;
	text-indent:-9999px;
}

	#menu ul li.gallery a:hover, #menu ul li.gallery a.active {
		display:block;
		width: 154px;
		height: 35px;
		background-image:url(../images/menu-active.gif);
		background-position: -196px;
	}
	
#menu ul li.merchandise a {
	display: block;
	background-image:url(../images/menu-inactive.gif);
	background-position: -354px;
	width: 104px;
	height: 35px;
	text-indent:-9999px;
}

	#menu ul li.merchandise a:hover, #menu ul li.merchandise a.active {
		display:block;
		width: 104px;
		height: 35px;
		background-image:url(../images/menu-active.gif);
		background-position: -354px;
	}
	
#menu ul li.contact a {
	display: block;
	background-image:url(../images/menu-inactive.gif);
	background-position: -462px;
	width: 74px;
	height: 35px;
	text-indent:-9999px;
}

	#menu ul li.contact a:hover, #menu ul li.contact a.active {
		display:block;
		width: 74px;
		height: 35px;
		background-image:url(../images/menu-active.gif);
		background-position: -462px;
	}
	
/********* END MENU *********/

#banner {
	width: 980px;
	float: left;
	height: 272px;
	background-image:url(../images/banner_bg.jpg);
	background-repeat:no-repeat;
	background-position:right top;
	margin-top: 26px;
	position:relative;
}

#drums {
	text-indent:-9999px;
	display:block;
	z-index:100;
	background-image:url(../images/drums.png);
	background-repeat:no-repeat;
	width: 368px;
	height: 225px;
	position:absolute;
	right: 0;
	bottom: -70px;
}

#fun-cool {
	margin-top: 30px;
	margin-left: 10px;
	float: left;
}

#photoframe {
	float: right;
	width: 416px;
	height: 251px;
	background-image:url(../images/photo-frame_bg.png);
	background-repeat:no-repeat;
	margin-top: 10px;
	overflow: hidden;
}

	#photoframe img {
		margin: 28px 0 0 19px;
		width: 376px;
		height: 195px;
	}


#mainBody_home {
	width: 960px;
	margin: 75px 10px 40px 10px;
	float: left;
}

#left-col {
	float: left;
	width: 620px;
}

#right-col {
	width: 311px;
	float: right;
}

#left-col p, #right-col p {
	margin-bottom: 20px;
}

h2#learn {
	display:block;
	background-image:url(../images/learn-to-play-drums.gif);
	background-repeat:no-repeat;
	width: 438px;
	height: 62px;
	text-indent:-9999px;
	float: left;
	margin-bottom: 10px;
}

h3#aboutus {
	display: block;
	width: 164px;
	height: 22px;
	background-image:url(../images/about-us.gif);
	background-repeat:no-repeat;
	text-indent:-9999px;
	margin-top: 40px;
	margin-bottom: 10px;
}

#left-col-split {
	display: block;
	width: 620px;
	height: 6px;
	background-image:url(../images/left-column-hr.gif);
	background-repeat:no-repeat;
	float: left;
	margin-bottom: 25px;
}

hr.left-col-split {
	display: block;
	width: 620px;
	height: 6px;
	background-image:url(../images/left-column-hr.gif);
	background-repeat:no-repeat;
	float: left;
	margin-bottom: 25px;
}

#right-col-split {
	display: block;
	width: 311px;
	height: 6px;
	margin-bottom:25px;
	background-image:url(../images/right-col-hr.gif);
	background-repeat:no-repeat;
	float: left;
}

.bold-ital-red {
	font-weight: bold;
	font-style:italic;
	color: #e70000;
	font-size: 15px;
}

.read-more_home {
	display:block;
	float: left;
	width: 159px;
	height: 40px;
	background-image: url(../images/read_more.png);
	background-repeat:no-repeat;
	text-indent:-9999px;
}

/***** Footer styling ******/

#footer ul {
	margin: 30px 0 0 20px;
	float:left;
}

#footer ul li {
	float: left;
	border-right: 1px solid white;
	padding: 2px 8px;
}

#footer ul li.last {
	border: none;
}

#footer p.copyright {
	width: 400px;
	float: right;
	margin: 30px 20px 0 0;
	text-align:right;
}

#footer ul li a {
	font-weight: bold;
}

.ascensor__image {
	height: 14px;
	width: 82px;
	display: inline-block;
	background: url(../images/ascensor.png) 0px -16px no-repeat;
	text-align: left;
	text-indent: -9999px;
	cursor: pointer;
	line-height: 19px;
}

.ascensor__image:hover {
	background-position: 0 -33px;
}

	