@charset "UTF-8";
/* CSS Document */

html {overflow-y: scroll;}

img, div, a { behavior: url(/css/iepngfix.htc) }

body {
	text-align: center;	
	font-family:Arial, Helvetica, sans-serif;
}

.clearFloat {
    clear: both;
    height:0px;
    font-size: 1px;
    line-height: 0px;
}

/* top nav */
ul#topnav {
	margin:13px 0px 0px 0px;
	padding: 0;
	padding-left:100px;
	list-style: none;
	float: left;
	width: 481px;
}
ul#topnav li {
	float: left;
	margin: 0; padding: 0;
}

/*--CSS Sprites - Default State--*/
ul#topnav a {
	float: left;
	display: block;
	//height: 48px; /*--Specify height of navigation--*/
//	text-indent: -99999px; /*--Shoot the text off the page--*/
	
	height: 0; overflow: hidden; padding-top: 39px;
	background-position: left top;
}

/*--Assign an image and width to each link--*/
ul#topnav li.cleartune a {
	background-image: url(../img/top-sprite-2.png);
	width: 124px;
	background-position: 0px 0px;
}
ul#topnav li.cleartune a:hover { background-position: 0px -39px; }
#cleartune li.cleartune a { background-position: 0px -39px !important; }

ul#topnav li.clockwork a {
	background-image: url(../img/top-sprite-2.png);
	width: 128px;
	background-position: -124px 0px;
}
ul#topnav li.clockwork a:hover { background-position: -124px -39px; }
#clockwork li.clockwork a { background-position: -124px -39px !important; }

ul#topnav li.stagepass a {
            background-image: url(../img/top-sprite-2.png);
                    width: 128px;
                            background-position: -252px 0px;
}
ul#topnav li.stagepass a:hover { background-position: -252px -39px; }
#stagepass li.stagepass a { background-position: -252px -39px !important; }


ul#topnav li.support a {
	background-image: url(../img/top-sprite-2.png);
	width: 101px;
	background-position: -380px 0px;
}
ul#topnav li.support a:hover { background-position: -380px -39px; }
#support li.support a { background-position: -380px -39px !important; }


/* end top nav */



/* clockwork nav */
ul#subnav {
	margin:0px auto 0px auto;
	padding: 0;
	list-style: none;
	width: 586px;
	height:17px;
}
ul#subnav li {
	float: left;
	margin: 0; padding: 0;
}

/*--CSS Sprites - Default State--*/
ul#subnav a {
	float: left;
	display: block;
	//height: 17px; /*--Specify height of navigation--*/
	//text-indent: -99999px; /*--Shoot the text off the page--*/
	height: 0; overflow: hidden; padding-top: 17px;
	background-position: left top;
}

/*--Assign an image and width to each link--*/
ul#subnav li.overview a {
	background-image: url(../img/feature-menu-sprite.png);
	width: 125px;
	background-position: 0px 0px;
}
ul#subnav li.overview a:hover { background-position: 0px -17px; }
#overview li.overview a { background-position: 0px -17px !important; }

ul#subnav li.features a {
	background-image: url(../img/feature-menu-sprite.png);
	width: 126px;
	background-position: -125px 0px;
}
ul#subnav li.features a:hover { background-position: -125px -17px; }
#features li.features a { background-position: -125px -17px !important; }

ul#subnav li.tips a {
	background-image: url(../img/feature-menu-sprite.png);
	width: 73px;
	background-position: -251px 0px;
}
ul#subnav li.tips a:hover { background-position: -251px -17px; }
#tips li.tips a { background-position: -251px -17px !important; }

ul#subnav li.ipod a {
	background-image: url(../img/feature-menu-sprite.png);
	width: 133px;
	background-position: -324px 0px;
}
ul#subnav li.ipod a:hover { background-position: -324px -17px; }
#ipod li.ipod a { background-position: -324px -17px !important; }

ul#subnav li.testimonials a {
	background-image: url(../img/feature-menu-sprite.png);
	width: 129px;
	background-position: -457px 0px;
}
ul#subnav li.testimonials a:hover { background-position: -457px -17px; }
#testimonials li.testimonials a { background-position: -457px -17px !important; }


/* end clockwork nav */

div.testimonial {
	float:left;
	width:280px;
	margin:10px;
	font-size:11px;
}

div.testimonialAuthor {
	color:#888888;
	font-style: italic;
	font-size:11px;
}

.tips_box {
	width:700px;
	margin: 0px auto;
}

.overview_text {
	margin:0px auto;
	padding-top:20px;
	padding-bottom:20px;
	text-align:justify;
	width:727px;
}

.overview-stave {
	margin:0px auto;
	width:862px;
	height:505px;
	background-image:url(../img/overview-music-stave.png);
	background-repeat:no-repeat;
}

.footer_box a {
	color:#666;
	text-decoration:none;
}

.footer_box {
	float:left;
	text-align:left;
	width:100px;
	padding-left:40px;
	padding-right:40px;
	height:110px;
	margin:5px;
	color:#666;
	font-size:12px;
}

.footer_box ul {
	margin:0px auto 0px auto;
	padding: 0;
	width: 200px;
	list-style:none;
}
.footer_box ul li {
	margin: 0; padding: 0;
}


.footer_box_title {
	font-size:16px;
	font-weight:bold;
}


div#main_container {
	margin: 0 auto;
	width: 938px;
}

div#body_container {
}

div#body_content {
	width:938;
	background-image:url(../img/main-container-left.png);
	background-position:left top;
	background-repeat:repeat-y;
}

div#body_content > div{
	background-image:url(../img/main-container-right.png);
	background-position:right top;
	background-repeat:repeat-y;
}

div#body_content > div > div {
	width:930px;
	margin-left:3px;
	margin-right:5px;
	background-image:url(../img/main-container-gradient.png);
	background-repeat:repeat-x;
		//height:700px;
	
}

div#feature_top {
	height:16px;
	background-image:url(../img/feature-box-top.png);
	background-position:center;
	background-repeat:no-repeat;

}

div#feature_bottom {
	height:16px;
	background-image:url(../img/feature-box-bottom.png);
	background-position:center;
	background-repeat:no-repeat;

}

div#feature_content {
	width:878px;
	margin-left:auto;
	margin-right:auto;
background-image:url(../img/feature-box-left.png);
	background-position:left top;
	background-repeat:repeat-y;
}

div#feature_content > div{
	background-image:url(../img/feature-box-right.png);
	background-position:right top;
	background-repeat:repeat-y;
}

div#feature_content > div > div {
	width:868px;
	margin-left:4px;
	margin-right:6px;
	background-image:url(../img/feature-box-gradient.png);
	background-repeat:repeat-x;
	background-color:#f5f5f5;
	//height:200px;
	
}

div#footer_top {
	height:16px;
	background-image:url(../img/footer-box-top.png);
	background-position:center;
	background-repeat:no-repeat;

}

div#footer_bottom {
	height:16px;
	background-image:url(../img/footer-box-bottom.png);
	background-position:center;
	background-repeat:no-repeat;

}

div#footer_content {
	width:876px;
	margin-left:auto;
	margin-right:auto;
	background-image:url(../img/footer-box-left.png);
	background-position:left top;
	background-repeat:repeat-y;
}

div#footer_content > div{
	background-image:url(../img/footer-box-right.png);
	background-position:right top;
	background-repeat:repeat-y;
}

div#footer_content > div > div {
	width:868px;
	margin-left:3px;
	margin-right:4px;
	background-image:url(../img/footer-box-gradient.png);
	background-repeat:repeat-x;
	height:110px;
	
}


/* body container parts */
div#body_top {
	height:16px;
	background-image:url(../img/main-container-top.png);
	background-position:center;
	background-repeat:no-repeat;
}

div#body_bottom {
	height:16px;
	background-image:url(../img/main-container-bottom.png);
	background-position:center;
	background-repeat:no-repeat;
}

div.feature_box img {
	float:left;
	margin: 10px 20px 10px 20px;
}

div.feature_box {
	width:780px;
	height:120px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	font-size:12px;
}

div.feature_header {
	font-size:14px;
	font-weight:bold;
	color:#000;
	padding-bottom:10px;
}

div.feature_text {
	color:#666;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	padding: 20px 10px 20px 10px;
	font-size:12px;
}

div#header {
	height:52px;
}

div#clockwork_iphone_series {
	height:200px;
	width:492px;
	margin-left:auto;
	margin-right:auto;
	padding-bottom:40px;
	background-image:url(../img/clockwork-iphone-series.png);
	background-position:center;
	background-repeat:no-repeat;
}

div#cleartune_iphone_series {
	height:200px;
	width:370px;
	margin-left:auto;
	margin-right:auto;
	padding-bottom:40px;
	background-image:url(../img/cleartune-iphone-series.png);
	background-position:center;
	background-repeat:no-repeat;
}

div#logo {
	float:left;
	height:52px;
	width:280px;
	background-image:url(../img/logo-smaller.png);
	background-position:center bottom;
	background-repeat:no-repeat;
}