td {font:12px Arial, Helvetica, sans-serif normal; color:#333333;}


body{margin:0;padding:0;border:0;font:12px Arial, Helvetica, sans-serif normal; color:#333333; background:url(library/gradient-bg.jpg) repeat-x top left #e1e1e1; line-height:1.5}

p{margin-bottom:20px}
h1{margin-bottom:10px;font-size:16px;font-weight:bold;}
h2{margin-top:20px}

/*start of the links*/
a:link{text-decoration: underline; color:#333333;}
a:visited{text-decoration: underline; color:#333333;}
a:active{text-decoration: underline; color:#333333;}
a:hover{text-decoration: underline; color:#FF0000;}


#container { padding: 0px; height: auto; width: 940px; margin-top: 30px; margin-right: auto; margin-bottom: 0px; margin-left: auto; background: white}
#header { margin: 0px; padding: 0px; height:225px; width: 940px;text-align:center;}


/* Menu */
#nav {height: auto; margin:2px ; padding:0; font-size:10px;margin: 0px; padding: 0px; list-style: none; margin-top:5px; margin-left: 5px; z-index:500;}
#nav li {float: left; position:relative;border-right: 2px solid white;list-style: none;text-align:center; z-index:501}
#nav a {padding:3px 20px;  display:block; color:#333333; background: #e2e2e2; text-decoration:none; }
#nav a:hover{background:#d6d6d6;text-decoration:none}

	/* Second level drop down */
#nav li ul {position: absolute;width: 150px;left: -999em;margin-left: -35px;_margin-left: 0px;z-index:100}
#nav li ul li{/*margin-left: -40px;*/float:none;text-align:left; }
#nav li ul li a{height:100%; width:100%;border:solid 1px #FFFFFF; }

#nav li:hover ul, #nav li.sfhover ul {left: auto;}


/* layout*/

#content-left { float: left; height: auto; width: 547px; padding:20px; display:inline;z-index:20;}
#content-left .quote { font-weight: bold; text-align:right; display:block;margin-right: 20px;}
#content-right { float: right; height: auto; width: 310px; padding:20px; display:inline; z-index:20;}
#content-right form{margin-top:10px;}
#content-right  input {border:1px solid #ccc;padding:5px;width:200px;}
#content-right input:focus {border:1px solid #ccc;padding:5px;width:200px; background:#F5F5F5}
#content-right select{padding:3px; border:1px sold #ccc; background:#d6d6d6;margin:0 0 5px 0} 
#content-right label {font-size:12px}
#content-right #submit {margin:0 0 0 5px; border:1px solid #b1bfc7; background: #d8dee1; font-size:10px;font-weight:bold; color: #5c6163;padding:5px 10px 6px 10px; width:75px; cursor:pointer}
#footer {clear: both;height: auto;width: 920px;	float:left;	font-size:10px;/*margin:20px 0 0 0*/background-color: #FFFFFF;background-image: url(library/footer_line.jpg);background-repeat: no-repeat;background-position: center top;margin-bottom: 15px;}
#footer p{margin-bottom:5px}
#footer-left {float:left; width: 400px; margin-left: 20px;margin-top: 15px;}
#footer-right {float:right;width: 410px;text-align:right;margin-top: 25px;}
#footer a{color:#285884;text-decoration: none; /*border-bottom: 1px dotted #285884*/}
#footer a:hover{border-bottom: 1px solid #285884}
#footer-right img {margin-left:10px}




/* inside page, left column with links (or one col)*/

#inside_colleft{width: 190px; padding: 20px; float: left;}
#inside_colright{width: 640px; padding: 20px; float:right;margin-right: 20px;}/* available width: 580*/

		/* side links on the left hand side */
		#inside_colleft ul{	list-style-image: none;	list-style-type: none;margin-left: 0;width:190px;padding:0;}
		#inside_colleft ul li{width: 190px; height: 20px; background-color: #EBEBEB;text-align:center; margin-bottom: 3px;margin-left: 0; padding: 5px 0 5px 0; }
			#inside_colleft ul li:hover{background-color: #F4F4F4;}
			
			#inside_colleft ul li a:link,#inside_colleft ul li a:visited,#inside_colleft ul li a:active{color: #666666; text-decoration: none;font-weight:bold;}
			#inside_colleft ul li a:hover{ text-decoration: underline;color:#333333;}


		#inside_colright ul, #inside_onecol ul{	list-style-image: url(library/bullet_li.gif);list-style-type: none;line-height: 200%;}




#inside_onecol{width: 733px; padding: 20px;margin-left: auto;margin-right: auto;}


/*news letter box home page*/
	#newsletter{width: 400px;height: auto;background-color: #FFFFFF;border:solid 1px #999999;position: absolute;left: 50%;top: 340px;margin-left: 70px;display:none;}

/*start of the links*/
a.link_img:link,a.link_img:visited,a.link_img:active,a.link_img:hover{text-decoration: none; color:#FFFFFF;}

							
h1{color:#333333;font-size: 16px;}
h2{color: #333333; font-size: 14px;}

a:link, a:visited,a:active{text-decoration: underline;color:#333333}
a:hover{color:#999999;}

a.warning:link, a.warning:visited,a.warning:active{text-decoration: underline;color:#FF0000;font-weight:bold;}
a.warning:hover{text-decoration: underline;color:#0000FF;font-weight:bold;}




/****************STYLING THE AREAS PRODUCED BY THE cms*************************/

/*by leaving the following empty the tags will be styled from your regular tags*/


/*          ECOMMERCE SITES, PRODUCT LISTING           */

div.cms_prod_listing_cd{width:90%;margin-left:auto; margin-right: auto;border: solid 1px #CCCCCC; /*background-color: #EEEEEE;*/	margin:10px;text-align: left;height: auto;}/* the div containing each product  */


/* mini cart*/
#minicart{width: 190px;background-image: url(Library/min-cart_top.gif);background-repeat: no-repeat;}
#minicart_content{
	width: 190px;
	padding: 8px;
	margin-top: 20px;
	background-image: url(Library/min-cart_bottom.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}



#cms_addedcart{border: solid 1px #990000; width: 80%;margin-left: auto;margin-right:auto;background: #F0F0F0; text-align:center; }/*the DIV displaying the message when something has been added to the cart*/



p.error{font-weight: bold; color:#FF0000;}/*the errors shown when adding to cart*/

/* styling the table which contains the cart on the detail page*/

td.cart_header_normal{border: solid 1px #E4E4E4;border-right:0px;/*text-align:center;*/background: #E4E4E4;height:30px;}/*header  / first row, all fields except last to the right*/
td.cart_header_last_right{border: solid 1px #E4E4E4;/*text-align:center;*/background: #E4E4E4;}/*header  / first row, all fields except last to the right*/

td.cart_td_normal{border-left: solid 1px #E4E4E4;border-bottom: solid 1px #E4E4E4;background: #EEEEEE;}/* all td's except last to the right*/
td.cart_td_last_right{border-left: solid 1px #E4E4E4;border-bottom: solid 1px #E4E4E4;border-right: solid 1px #E4E4E4;background: #EEEEEE;}/* td's  last to the right*/
td.cart_total_left{border:0; height: 30px;line-height: 200%;}/*main cart, total at the bottom*/
td.cart_total_right{border:solid 1px #E4E4E4;border-top:0px; height: 30px;line-height: 200%;background: #EEEEEE;}/*main cart, total at the bottom*/

input{background-color: #EEEEEE;border: solid 1px /*#e4e4e4*/#999999;}

			input:focus{background-color: #f4f4f4;border: solid 1px #990000;}
			tr.tr_checkout{height: 30px;}


div.cms_special_offer{width: 100%;text-align:center;}

p.all_offers{}/*the p tag for the link to all offers*/

/* checkout section only*/

		#checkout_container{width: 100%; padding:10px;}/*container contiing all elements for the checkout*/
					#checkout_step0_left{width: 99%;}/* the div containing the login palette for step 0, login or register*/
					#checkout_step0_right{width: 99%;}/* the div containing the login palette for step 0, login or register*/
					
			h1.checkout{font-size: 16px;}
			p.checkout_steps{}/*The tag showing the links to step by step*/
			p.checkout_general{}/*general p tags during checkout*/
			
			div.products_checkout{width: 90%; margin-left:auto; margin-right: auto; border: solid 1px red;}
			
			
			div.checkout_address{border:solid 1px black;padding:10px;width: 80%;margin-left:auto;margin-right:auto; color: #999999;}
			
			div.checkout_address_selected{border:solid 1px #FFFFFF;padding:10px;background: #eeeeee}/* the address currently selected*/
			
			div.checkout_shipment{width: 90%;border: solid 1px e4e4e4; background: #e4e4e4e;margin-left:auto;margin-right:auto;}
			
			
.main_tr1{background: #EEEEEE}
.main_tr2{background: #E4E4E4;}





/* customer area*/

p.cust_orders{margin-left: 100px;}/*showing the order detail*/

#cust_area{margin:15px;}/*the area where the content is*/











/*    STYLING THE LINKS PAGE(S)      */
h2.cms_links_cat{}/* Displays the links categories*/
p.cms_links{}/* Displays the actual link and description*/
a.cms_links{}/*Displays the actual links*/
p.cms_links_empty{}/*The line letting users know there is no links in the database if applicable*/



/*    STYLING THE HELP/FAQ PAGE(S)      */
p.cms_nofaq{}/*the line showing that there is no faq in the database*/
h3.cms_faq_category{margin-left: 40px;}/*the category of either help or FAQ*/
p.cms_faq_questions{margin-left: 60px;}/*the clickable questions on the faq or help*/
span.cms_faq_title{font-weight: bold;/*display:none;*/}/*this shows weather this is an help or faq, you can hide this using CSS if you do not want to show it*/
a.cms_faq_links{}/*all links within the FAQ section including the back to the top links*/
#cms_faq_spacer{height: 150px;}/*the div allowing you to include space between the last question and the first answer*/
p.cms_faq_answer_title{margin-left: 40px; font-weight:bold;}/*the title of the answer*/
p.cms_faq_answer_detail{margin-left: 50px;}/*the comment on the answer*/
p.cms_backtop{margin-left: 80px;}/*the P tag containing the back to top link*/
hr.cms_faq_hr{width: 50%;margin-left:auto;margin-right:auto;}

/*        STYLING THE GOOGLE API MAP */

#cms_api{}


/*    STYLING THE FORM FIELDS ON THE CONTACT FORM      */

input.cms_form, textarea.cms_form, radio.cms_form, select.cms_form, submit.cms_form{background: #F2F2F2; font-size: 14px;}/*styling the fields, you can also style them individually*/
#cms_upload_window{border: solid 1px black; background: #FFFFE1;padding:15px;}
/*    STYLING THE IMAGE GALLERY      */
h2.cms_image_gallery{}/*displaying the categories of images*/
div.cms_photo_name{margin-bottom:5px;}/*name of the photo*/
div.cms_image_layout{width:160px; border: solid 1px black; margin:15px;text-align:center;padding-top:4px;padding-bottom:5px;float:left;}/*This is the div which contains the actual thumbnail with name etc*/
div.clearfloat{clear:both;}/*If you are floating the above div, then you might need to cancel the float at the end of category, you can do so by using this div*/
#cms_image_window{border: solid 1px black; width:300px; margin-top:5px;margin-left:auto;margin-right:auto; text-align:center;}/*div styling the container on the window for enlarged images*/
h1.cms_image_window{}/* displays the image name*/

/*styling the news*/
p.cms_current_news{background-repeat: no-repeat;padding-left:11px;margin-bottom:0px;background-image: url(Library/bullet_li.gif);}/*displays the listing of news*/
p.cms_current_news_desc{margin-top:0px;margin-left:25px;margin-bottom:0px;}/*small description just under the headline on the listing of news*/
p.other_news{}/*the p tag showing the link "to go to archive click here or to go to live news click here*/

p.cms_news_back{}/*the back link /button on the news detail page*/

p.cms_current_news a:hover,p.cms_current_news_desc a:hover{color: red;}


/****************END OF STYLING THE AREAS PRODUCED BY THE cms*************************/




/***********************  blog*********************************/
h2.blog{font-size:20px; border-bottom:1px dashed #ccc; padding-bottom:5px}
h3.blog_list_headline, h3.blog_detail_headline,h3.blog_user_name{}
h3.blog_list_headline a{ text-decoration:none; font-size:20px;}
.blog_list_cats{background:#eaeaea; }
p.blog_list_more{background:url(Library/read-more-btn.png) no-repeat; width:108px; height:28px;text-align:center;padding-top:3px}
p.blog_list_more a{text-decoration:none; color:#8c8c8c; font-weight:bold; font-size:15px}
p.blog_list_more a:hover{text-decoration:underline}
div.blog_list_posts{background-image: url(library/blog_line.jpg);background-repeat: no-repeat;background-position: center bottom; position: relative}
.comments{position:absolute; top:0;right:0;font-weight:bold; font-size:25px; text-align:center;}
.comment-text{font-size:10px;font-weight:normal;margin-top:-10px;position:absolute;top:40px;right:0; }
div.blog_sep{width: 350px; margin-left: 60px; }
div.blog_list_cats,div.blog_detail_cats, div.blog_detail_cats{margin-bottom: 20px;}

div.blog_detail_date{margin-top: 20px;}
h3.blog{font-size: 16px; margin-left: 20px;}
ul.catsblog{list-style-image: url(library/li_blue.gif);}
									ul.catsblog li{margin-bottom: 10px;margin-left: 10px;}	

div.blog_comment{border: dashed 1px #999999;margin: 15px; padding: 10px;}
select.blog, input.blog,submit.blog,textarea.blog, checkbox.blog{background: #EEF4FA; font-size: 14px;}

#cart_mess{width:80%;border:solid 1px red;height: auto; margin-left: auto;margin-right:auto;display:none;font-weight:bold;padding:20px;text-align:center;}

/*************music sheet****************/
.row_even{background-color: #EEEEEE;height: 30px;}
.row_odd{background-color:#E4E4E4;height: 30px;}

.row_odd td, .row_even td{padding-left: 10px;}

#tr_header td{padding-left: 10px;padding-bottom: 10px;}

.cd_list_small{width: 125px; text-align:center;float:left;margin: 8px; height: 140px;}


/*message on the sheet music*/

#mess_screen{border: solid 1px red;z-index:1000;width:870px;height:auto;position:absolute;top: 50px;left:50%;background-color: #E6E6E6;margin-left: -450px;padding: 15px;display:none;}





/* ul's inside the content*/
.inside_ul{color: red;margin:0;}



/*login panel on the side of pages*/

#login_panel,#reg_panel{width: auto;height:auto;display:none;}

/* blog lists on the home page */
.homelist{margin:0; padding:0;list-style:none; line-height:1.4}/*ul*/
#slideshow .slides ul li ul{width:400px}

/* count down on home page */
.countdown{font-weight: bold;}

#grey_layer{position: absolute; top: 0;left: 0; width: 0; height: 0;z-index:502;background:#000000;}
#full_detail{ position: absolute;width:850px;  top: 250px; left: 50%;margin-left: -450px;border:1px solid #335763; height: auto; z-index:1505; background-color: #fff; display:none; padding: 20px ;line-height:1.6}

.tooltip-content {
	display: none;        /* required */
	position: absolute;   /* required */
	padding: 10px;
	border: 1px solid black;
	background-color: #DBDBDB;
}

p.cat-side{background-image: url(Library/bullet_li.gif);background-repeat: no-repeat;padding-left: 15px;margin-bottom: 0px;}



