/*-----------------------------------------------------------------------------
Base Style Sheet

version:   1.0
author:    Adam Myhre
email:     adam@undergalaxie.com
website:   http://www.stylusaudio.ca/
-----------------------------------------------------------------------------*/

@import "layout.css";
/* =General
-----------------------------------------------------------------------------*/


/* Remove padding and margin */
* {
  margin: 0;
	padding: 0;
}

/* Put it back on certain elements */
h1, h2, h3, h4, h5, h6, p, pre, blockquote, form, fieldset, table, ul {
  margin: 1em 0;
}

/* Class for clearing floats */
.clear {
	clear:both;
}


/* Remove border around linked images */
img {
	display: block;
	border: 0;
	margin-bottom: 20px;
}

body {
	background: #000 url('../images/bg.jpg') no-repeat top;
	}

#line2 {
	background: #000 url('../images/bg-content.gif') no-repeat top;
	}

#line3 {
	background: #000 url('../images/bg-footer.gif') no-repeat top;
	}

.right {
	float: right;
	padding-left: 10px;
	padding-bottom: 10px;
	}
.left {
	float: left;
	padding-right: 10px;
	padding-bottom: 10px;
	}

/* =Typography
-----------------------------------------------------------------------------*/
body {
	font: 67.5% "Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
	color: #fff;
}

.shadow {
	text-shadow: #000 0px 1px 1px;
}

.content p {
	font-size: 1.15em;
	line-height: 1.7em;
	color: #222;
	padding: 10px 30px 0 30px;
}
.content ul {
	font-size: 1.15em;
	color: #222;
	padding: 10px 30px 0 40px;
	list-style: none;
}
.content ol {
	font-size: 1.15em;
	color: #222;
	padding: 5px 30px 10px 50px;
}
.content li {
	padding: 0 0 5px 0;
}
.content img {
	padding: 10px 30px 0 30px;
}
#footer div.content p {
	color: #ddd;
	}
	
a	{
	color: #444;
	text-decoration: none;
	}
a:hover, .red-under {
	color: #000;
	text-decoration: none;
	border-bottom: 2px solid #ee203b;
	}
#footer a	{
	color: #ddd;
	text-decoration: none;
	}
#footer a:hover, #footer a.red-under {
	color: #fff;
	text-decoration: none;
	border-bottom: 2px solid #ee203b;
	}
hr {
	margin: 20px 30px 10px 30px;
	height: 1px;
	color: #ee203b;
}
.bold {
	font-weight: bold;
	}
/* =Headings
-----------------------------------------------------------------------------*/
h1	{
	color: #fff;
	font: 1.5em "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-shadow: none;
	}
h2	{
	color: #222;
	font: 1.3em "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-shadow: none;
	padding: 10px 30px 0 30px;
	}
h3	{
	color: #222;
	font: 1.3em "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: bold;
	text-shadow: none;
	padding: 10px 30px 0 30px;
	}

/* =Links
-----------------------------------------------------------------------------*/

/* =Language Selectors
-----------------------------------------------------------------------------*/
/* =Branding
-----------------------------------------------------------------------------*/
/* =Main Nav
-----------------------------------------------------------------------------*/
#top-nav {
	text-align: right;
    list-style: none;
	padding-top: 20px;
}
#top-nav li a	{
	color: #ddd;
	font-weight: bold;
	text-decoration: none;
	}
#top-nav li a:hover, #top-nav li a.selected {
	color: #fff;
	font-weight: bold;
	border-bottom: 4px solid #ee203b;
	}
#top-nav li {
	display: inline;
	padding-right: 20px;
	font: 1em "Helvetica Neue", Helvetica, Arial, sans-serif;
	}

/* =Sub Nav
-----------------------------------------------------------------------------*/
/* =Search Box and Ads/Logo
-----------------------------------------------------------------------------*/
/* =Main Content */
/*-----------------------------------------------------------------------------*/
/* =Secondary Content
-----------------------------------------------------------------------------*/
/* =Footer
-----------------------------------------------------------------------------*/
/* =Forms
-----------------------------------------------------------------------------*/
/* Removes fieldset borders. even on Opera 7 */
form	{
	padding: 10px;
	}
	
fieldset {
	border: 0px solid #fff;
}

form p {
	text-align: left;
	}
	
label {
	display: block;
	}
	
input {
	font: 1em "Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
	padding: 5px;
	width: 200px;
	}	

select, option {
	font: 1em "Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
	}	

textarea {
	font: 1em "Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
	padding: 5px;
	width: 399px;
	height: 75px;
	}

/* =Tables
-----------------------------------------------------------------------------*/
/* =Misc 1
-----------------------------------------------------------------------------*/
#social-media img {
	float: right;
	padding: 20px 0px 0 10px;
	}
/* =Misc 2
-----------------------------------------------------------------------------*/
/* Tooltips 
-----------------------------------------------------------------------------*/
/* =Image Replacement
-----------------------------------------------------------------------------*/
#title-home {
	width: 600px;
	height: 79px;
	position: relative;
	margin: 0; padding: 0; overflow: hidden;
	}
#title-home span {
	background: url(../images/title-home.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}

#title-about {
	width: 600px;
	height: 79px;
	position: relative;
	margin: 0; padding: 0; overflow: hidden;
	}
#title-about span {
	background: url(../images/title-about.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}

#title-event-planning {
	width: 600px;
	height: 79px;
	position: relative;
	margin: 0; padding: 0; overflow: hidden;
	}
#title-event-planning span {
	background: url(../images/title-event-planning.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}

#title-charts {
	width: 600px;
	height: 79px;
	position: relative;
	margin: 0; padding: 0; overflow: hidden;
	}
#title-charts span {
	background: url(../images/title-charts.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}

#title-contact {
	width: 600px;
	height: 79px;
	position: relative;
	margin: 0; padding: 0; overflow: hidden;
	}
#title-contact span {
	background: url(../images/title-contact.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}

#title-friends {
	width: 600px;
	height: 79px;
	position: relative;
	margin: 0; padding: 0; overflow: hidden;
	}
#title-friends span {
	background: url(../images/title-friends.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}

#title-upcoming {
	width: 320px;
	height: 79px;
	position: relative;
	margin: 0; padding: 0; overflow: hidden;
	}
#title-upcoming span {
	background: url(../images/title-upcoming.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}

#footer-top {
	width: 920px;
	height: 100px;
	position: relative;
	margin: 0; padding: 0; overflow: hidden;
	}
#footer-top span {
	background: url(../images/footer.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: pointer;
	}