@charset "UTF-8";

/* 
	Noteworthy Music v2
	Author: Matt Oatley
	clean markup, and boy is it valid!
	
*/

* {
	margin: 0;
	padding: 0;
}

body {
	margin: 0px;
	background: #111 url(../images/bg_grain.jpg) top center no-repeat;
}

img, div, h1, h2, input, li, a {
	behavior: url(../images/iepngfix.htc); 
}

a {
	outline: none;
}

a img {
	border: none;
}

.clear {
	clear: both;
}

/* Header */

#all {
	position: relative;
	width: 876px;
	margin: 0px auto;
}

#header {
	width: 876px;
	height: 162px;
}

a#logo {
	position: absolute;
	width: 323px;
	height: 46px;
	background: url(../images/logo.png) no-repeat;
	top: 75px;
	display: block;
}

#nav {
	position: absolute;
	width: 369px;
	height: 28px;
	background: url(../images/nav.png) no-repeat;
	top: 84px;
	left: 414px;
}

#homeBG, #homeBTOn { position: absolute; left: 0px; background: transparent url(../images/nav.png) 0px 0px no-repeat; }
#mediaBG, #mediaBTOn { position: absolute; left: 67px; background: transparent url(../images/nav.png) -67px 0px no-repeat; }
#servicesBG, #servicesBTOn { position: absolute; left: 138px; background: transparent url(../images/nav.png) -138px 0px no-repeat; }
#tipsBG, #tipsBTOn { position: absolute; left: 233px; background: transparent url(../images/nav.png) -233px 0px no-repeat; }
#contactBG, #contactBTOn { position: absolute; left: 292px; background: transparent url(../images/nav.png) -292px 0px no-repeat; }

a#homeBT { display: block; width: 54px; height: 28px; }
a#mediaBT { display: block; width: 58px; height: 28px; }
a#servicesBT { display: block; width: 81px; height: 28px; }
a#tipsBT { display: block; width: 42px; height: 28px; }
a#contactBT { display: block; width: 77px; height: 28px; }

a#homeBT:hover { background: transparent url(../images/nav.png) 0px -28px no-repeat; }
a#mediaBT:hover { background: transparent url(../images/nav.png) -67px -28px no-repeat; }
a#servicesBT:hover { background: transparent url(../images/nav.png) -138px -28px no-repeat; }
a#tipsBT:hover { background: transparent url(../images/nav.png) -233px -28px no-repeat; }
a#contactBT:hover { background: transparent url(../images/nav.png) -292px -28px no-repeat; }


#homeBTOn { background: transparent url(../images/nav.png) 0px -56px no-repeat; }
#mediaBTOn { background: transparent url(../images/nav.png) -67px -56px no-repeat; }
#servicesBTOn { background: transparent url(../images/nav.png) -138px -56px no-repeat; }
#tipsBTOn { background: transparent url(../images/nav.png) -233px -56px no-repeat; }
#contactBTOn { background: transparent url(../images/nav.png) -292px -56px no-repeat; }


#homeBTOn a:hover, #mediaBTOn a:hover, #servicesBTOn a:hover, #tipsBTOn a:hover, #contactBTOn a:hover {
	background: none;
}


/* Home Top */

#homeTop {
	position: relative;
	width: 876px;
	height: 380px;
}

#contactTop {
	position: relative;
	width: 876px;
	height: 380px;
	background: url(../images/contact_page.png) no-repeat;
}

#flashElement {
	position: absolute;
	width: 621px;
	height: 273px;
}

#featuredMedia {
	position: absolute;
	width: 230px;
	height: 320px;
	left: 647px;
}

#fmTitle {
	position: relative;
	width: 230px;
	height: 47px;
	background: url(../images/featuredMedia.png) no-repeat;
}

.fmItem {
	position: relative;
	width: 230px;
	height: 106px;
	margin-bottom: 14px;
}

a#bfunk {
	position: absolute;
	display: block;
	width: 230px;
	height: 106px;
	background: url(../images/bfunk.png) no-repeat;
}

a#bfunk:hover {
	background: url(../images/bfunk.png) 0px -106px no-repeat;
}


a#nwsounds {
	position: absolute;
	display: block;
	width: 230px;
	height: 106px;
	background: url(../images/nwsounds.png) no-repeat;
}

/* Home Content */

#homeContent {
	position: relative;
	width: 876px;
	height: 382px;
}

#aboutUs {
	position: absolute;
	width: 315px;
	height: 270px;
}

#aboutUsTitle {
	position: relative;
	width: 315px;
	height: 51px;
	background: url(../images/aboutUsTitle.png) no-repeat;
}

#weAre {
	position: absolute;
	width: 230px;
	height: 270px;
	left: 365px;
}

#weAreTitle {
	position: relative;
	width: 230px;
	height: 44px;
	background: url(../images/weareTitle.png) no-repeat;
}

a#johnfutch {
	position: absolute;
	display: block;
	width: 230px;
	height: 106px;
	background: url(../images/johnfutch.png) no-repeat;
}

a#juliefutch {
	position: absolute;
	display: block;
	width: 230px;
	height: 106px;
	background: url(../images/juliefutch.png) no-repeat;
}


/* Footer */

#footer {
	position: relative;
	width: 876px;
	height: 90px;
	margin-bottom: 60px;
}

#socialLinks {
	position: absolute;
	width: 320px;
	height: 90px;
}

#socialTitle {
	position: relative;
	width: 320px;
	height: 45px;
	background: url(../images/socialTitle.png) no-repeat;
}

a.socialLink, a.socialLinkLast {
	position: relative;
	float: left;
	margin-right: 5px;
	margin-left: 5px;
	width: 42px;
	height: 42px;
	display: block;
}

a.socialLinkLast {
	margin-right: 0px;
}

a#facebookLink {
	background: url(../images/facebook_link.png) no-repeat;
}

a#twitterLink {
	background: url(../images/twitter_link.png) no-repeat;
}

a#linkedinLink {
	background: url(../images/linkedin_link.png) no-repeat;
}

a#diggLink {
	background: url(../images/digg_link.png) no-repeat;
}

a#stumbleLink {
	background: url(../images/stumble_link.png) no-repeat;
}

a#deliciousLink {
	background: url(../images/delicious_link.png) no-repeat;
}

a#emailPhone {
	position: absolute;
	display: block;
	width: 230px;
	height: 42px;
	background: url(../images/contactBT.png) no-repeat;
	top: 45px;
	left: 365px;
}

a#emailPhone:hover {
	background: url(../images/contactBT.png) 0px -42px no-repeat;
}

a#moatleyMade {
	position: absolute;
	width: 88px;
	height: 88px;
	background: url(../images/moatleymade.png) no-repeat;
	left: 787px;
	top: 2px;
	display: block;
}

a#virbLink {
	position: absolute;
	width: 78px;
	height: 21px;
	display: block;
	top: 57px;
	left: 687px;
	background: url(../images/virb_link.png) no-repeat;
}


/* Media Content */

#mediaTop {
	position: relative;
	width: 876px;
}

#flashMedia {
	position: relative;
	width: 876px;
	height: 810px;
}

/* Services Content */

#privateLessons {
	position: absolute;
	width: 426px;
	height: 736px;
	top: 38px;
}

#performancePackages {
	position: absolute;
	width: 426px;
	height: 736px;
	left: 450px;
	top: 38px;
}

#privateTitle {
	position: relative;
	width: 426px;
	height: 59px; 
	background: url(../images/private_lessons.png) no-repeat;
}

#performanceTitle {
	position: relative;
	width: 426px;
	height: 59px; 
	background: url(../images/performance_packages.png) no-repeat;
}

a#singleLesson, a#monthlyLessons, a#semesterLessons, a#groupLessons, a#weddings, a#livemusic, a#webmusic, #lessonPolicy {
	position: relative;
	margin-bottom: 15px;
	width: 426px;
	height: 135px;
	display: block;
	background: url(../images/single_lesson.png) no-repeat;
}

a#monthlyLessons {
	background: url(../images/monthly_lesson.png) no-repeat;
}

a#semesterLessons {
	background: url(../images/semester_lessons.png) no-repeat;
}

a#groupLessons {
	height: 185px;
	background: url(../images/group_lessons.png) no-repeat;
}

a#weddings {
	background: url(../images/wedding_performance.png) no-repeat;
}

a#livemusic {
	background: url(../images/livemusic_performance.png) no-repeat;
}

a#webmusic {
	background: url(../images/webmusic.png) no-repeat;
}

#lessonPolicy {
	background: url(../images/lesson_policy.png) no-repeat;
	height: 185px;
}

/* TIPS CONTENT */

a#tip1, a#tip2, #moretipssoon {
	position: relative;
	margin-bottom: 15px;
	width: 426px;
	height: 135px;
	display: block;
	background: url(../images/tip1.png) no-repeat;
}

a#tip2 {
	background: url(../images/tip2.png) no-repeat;
}

#moretipssoon {
	background: url(../images/moretipssoon.png) no-repeat;
}

#tipsTitle {
	position: relative;
	width: 426px;
	height: 59px; 
	background: url(../images/tips.png) no-repeat;
}

/* CONTACT PAGE */

#linksTitle {
	position: relative;
	width: 315px;
	height: 45px;
	background: url(../images/linksTitle.png) no-repeat;
}

#daLink {
	position: relative;
	width: 300px;
	height: 32px;
	background: url(../images/daLink.png) no-repeat;
	margin-bottom: 10px;
	display: block;
	font-size: 12px;
	color: #ccc;
	padding: 0px 5px 0px 15px;
	line-height: 32px;
}

input.name, input.email, textarea.message {
	position: absolute;
	width: 300px;
	height: 20px;
	display: block;
	background: none;
	padding: 10px;
	border: none;
	font-family: Helvetica, Arial, Verdana;
	font-size: 12px;
	font-weight: 100;
	color: #ddd;
}

input.name {
	top: 30px;
}

input.email {
	top: 110px;
}

textarea.message {
	top: 190px;
	height: 98px;
	line-height: 16px;
	overflow: hidden;
}

input#countdown {
	position: absolute;
	width: 40px;
	height: 20px;
	background: none;
	border: none;
	color: #ddd;
	top: 285px;
	left: 285px;
}

input#submit {
	position: absolute;
	width: 101px;
	height: 35px;
	background: none;
	border: none;
	outline: none;
	top: 272px;
	left: 363px;
	background: url(../images/submit.png) no-repeat;
	cursor: pointer;
	display: block;
}

a#contactEmail {
	position: absolute;
	width: 230px;
	height: 56px;
	background: url(../images/contactEmail.png) no-repeat;
	display: block;
	top: 251px;
}

a#contactEmail:hover {
	background-position: 0px -56px;
}

/* CHECK BOX SWAP */

#checkboxes {
	position: absolute;
	width: 200px;
	height: 280px;
	left: 363px;
	top: 35px;
}

.fakecheck {
	font: 12px Helvetica, Arial, Verdana, sans-serif;
	text-decoration: none;
	outline: none;
	background: url(../images/checkbox.png) no-repeat;
	height: 16px;
	width: 200px;
	display: block;
	float: left;
	padding: 3px 0px 0px 25px;
	color: #888;
	margin-bottom: 10px;
}

/* fake checkbox : hover state */

.fakecheck:hover {
	color:#666;
}
/* fake checkbox : checked state */
.fakechecked {
	background-position: left -50px;
}

#checkboxes input {
	margin-left: -9999px;
}



/* Typography */

p, a, h1, h2, h3, span, ul, li {
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-weight: 100;
	font-size: 12px;
	color: #9f9f9f;
	line-height: 18px;
	text-decoration: none;
}

#aboutUs p {
	padding-left: 5px;
	line-height: 20px;
}


/* Twitter */
#twitterize {
	position: absolute;
	width: 230px;
	left: 647px;
}

#twitterTitle {
	position: relative;
	width: 230px;
	height: 44px;
	background: url(../images/twitterTitle.png) no-repeat;
}

ul#twitter_update_list li {
	position: relative;
	width: 200px;
	height: 106px;
	background: url(../images/twitterbg.png) no-repeat;
	display: block;
	text-decoration: none;
	list-style: none;
	font-size: 10px;
	padding: 25px 10px 10px 20px;
	line-height: 16px;
	margin-bottom: -10px;
}

ul#twitter_update_list ul {
	padding: 0px;
	margin: 0px;
}

ul#twitter_update_list li a {
	position: absolute;
	left: 10px;
	top: 6px;
	font-size: 10px;
	color: #e4774b;
	text-transform: uppercase;
}

ul#twitter_update_list li span a {
	position: inherit;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-weight: 100;
	font-size: 10px;
	color: #d1b874;
	line-height: 18px;
	text-decoration: none;
	text-transform: lowercase;
}

ul#twitter_update_list li span {
	font-size: 10px;
}