@import "base.css";

/*****************************************************
 FOUNDATIONS: 
****************************************************/

html {
 	margin: 0; padding: 0;
}

body {
	margin: 0; padding: 10px 0 0 0;
	text-align: center;
  background: #fff url(../images/bg_main.jpg) top center fixed repeat-x;
}

#wrapper {
	width: 984px; height: 800px;
	padding: 0 0 25px 0; margin: 0 auto;
	text-align: center;
}

/*****************************************************
 HEADER: 
****************************************************/
#header {
  position: relative;
  height: 100px; 
  overflow: hidden;
  background: url(../images/bg_content_top.png) top center no-repeat;
}
#header .logo {
  float: left;
  height: 85px; 
  width: 250px;
  margin: 15px 0 0 22px;
  text-indent: -9999px;
  background: url(../images/logo.gif) 0 0 no-repeat;
}
#header .logo a {
  display: block;
  height: 89px;
  width: 250px;
  background: url(../images/logo.gif) 0 -85px no-repeat;
}
#header .logo a:hover,
#header .logo a:focus {
  outline: 0;
  background: url(../images/logo.gif) 0 0 no-repeat;
}

#header .search {
  position: absolute;
  top: 20px; right: 30px;
  height: 36px; width: 140px;
  background: url(../images/search_bg.gif) no-repeat;
}
#header .search input.text {
  margin: 9px 0 0 7px;
  width: 83px;
  border: 0;
  color: #fff;
  font-size: 1.2em;
  background: none;
}
#header .search input.submit {
  position: absolute;
  top: 2px; right: 4px;
  border: 0;
  cursor: pointer;
  text-indent: -999px;
  font-size: 1px;
  height: 27px; width: 43px;
  background: url(../images/search_go_btn.gif) 0 0 no-repeat;
}
#header .search input.submit:hover {
  background: url(../images/search_go_btn.gif) 0 -27px no-repeat;
}

#header .navigation {
  margin: 68px 0 0 279px; padding: 0;
  height: 32px; width: 570px;
  list-style: none;
}
#header .navigation li {
  float: left;
  height: 32px;
  margin-left: 8px;
  text-indent: -9999px;
  background: green;
}
#header .navigation li a {
  display: block;
  height: 32px;
}
#header .navigation li a { outline: none; }
#header .navigation li.home,
#header .navigation li.home a {
  width: 72px; 
  background: url(../images/navigation.gif) 0 -32px no-repeat;
}
#page-home #header .navigation li.home,
#page-home #header .navigation li.home a {
  background: url(../images/navigation.gif) 0 0 no-repeat;
}
#header .navigation li.home a:hover,
#header .navigation li.home a:focus {
  background: url(../images/navigation.gif) 0 -64px no-repeat;
}
#header .navigation li.about,
#header .navigation li.about a {
  width: 82px;
  background: url(../images/navigation.gif) -80px -32px no-repeat;
}
#header .navigation li.about a:hover,
#header .navigation li.about a:focus {
  background: url(../images/navigation.gif) -80px -64px no-repeat;
}
#page-about #header .navigation li.about,
#page-about #header .navigation li.about a {
  background: url(../images/navigation.gif) -80px 0 no-repeat;
}
#header .navigation li.artists,
#header .navigation li.artists a {
  width: 82px;
  background: url(../images/navigation.gif) -168px -32px no-repeat;
}
#header .navigation li.artists a:hover,
#header .navigation li.artists a:focus {
  background: url(../images/navigation.gif) -168px -64px no-repeat;
}
#page-artists .navigation li.artists,
#page-artists .navigation li.artists a,
#page-artists .navigation li.artists a:hover {
  background: url(../images/navigation.gif) -168px 0 no-repeat;
}
#header .navigation li.consulting,
#header .navigation li.consulting a {
  width: 110px;
  background: url(../images/navigation.gif) -257px -32px no-repeat;
}
#header .navigation li.consulting a:hover,
#header .navigation li.consulting a:focus {
  background: url(../images/navigation.gif) -257px -64px no-repeat;
}
#page-consulting #header .navigation li.consulting,
#page-consulting #header .navigation li.consulting a {
  background: url(../images/navigation.gif) -257px 0 no-repeat;
}
#header .navigation li.news,
#header .navigation li.news a {
  width: 71px;
  background: url(../images/navigation.gif) -375px -32px no-repeat;
}
#header .navigation li.news a:hover,
#header .navigation li.news a:focus {
  background: url(../images/navigation.gif) -375px -64px no-repeat;
}
#page-news #header .navigation li.news,
#page-news #header .navigation li.news a {
  background: url(../images/navigation.gif) -375px 0 no-repeat;
}
#header .navigation li.contact,
#header .navigation li.contact a {
  width: 91px;
  background: url(../images/navigation.gif) -454px -32px no-repeat;
}
#header .navigation li.contact a:hover,
#header .navigation li.contact a:focus {
  background: url(../images/navigation.gif) -454px -64px no-repeat;
}
#page-contact #header .navigation li.contact,
#page-contact #header .navigation li.contact a {
  background: url(../images/navigation.gif) -454px 0 no-repeat;
}

/*****************************************************
 CONTENT: 
****************************************************/
#content {
  position: relative;
  background: url(../images/bg_content_rpt.png) top center repeat-y;
}
#content .wrap {
  clear: both;
  margin: 0 auto;
  padding: 12px;
  width: 916px;
  background: #fff;
}

/*****************************************************
 MAIN: 
****************************************************/
#main {
  float: left;
  width: 685px;
  padding-bottom: 10px;
}

#main #carousel {
  margin: 8px 0 0 -5px;
  width: 699px; height: 204px;
  background: url(../images/carousel_bg.gif);
}

#main .focus-box {
  margin: 0 0 0 5px;
  padding: 0;
  background: #2f526a;
}
#main .focus-box a {
  color: #fff;
}
#main .focus-box h3 {
  color: #fff;
  font-size: 11px;
  margin: 8px 0 3px 0;
  font-family: Verdana, Arial, Sans-Serif;
}
#main .focus-box .item p {
  color: #9fbdcf;
  margin: 0 0 0 0;
  font-size: 1.0em;
}
#main .focus-box .item {
  margin-right: 18px;
  min-height: 40px;
  padding: 0 4px 10px 0;
  background: url(../images/div_horizontal.gif) bottom repeat-x;
}
#main .focus-box .item ul {
  list-style: none;
  margin: 0 0 0 0px; padding: 0;
}
#main .focus-box .item ul li {
  display: inline;
  font-size: 10px;
  margin: 0; padding: 0 3px 0 6px;
  background: url(../images/div_white.gif) left 3px no-repeat;
}
#main .focus-box .item ul li.first {
  background: none;
}
#main .focus-box .item.last {
  background: none;
}
#main .focus-box .content {
  float: left;
  padding: 3px 5px 13px 17px;
  width: 662px; 
  color: #fff;
  min-height: 198px;
  background: #2f526a url(../images/news_box_bg.gif) bottom no-repeat;
}
#main .focus-box .latest-news {
  float: left;
  width: 285px;
  padding: 3px 0 0 0;
  background: url(../images/div_vert.gif) right repeat-y;
}
#main .focus-box .billy-blog {
  float: left;
  width: 344px;
  overflow: hidden;
  margin-left: -2px;
  padding: 3px 0 0 19px;
  background: url(../images/div_vert.gif) left repeat-y;
}
#main .focus-box .billy-blog p {
  white-space: nowrap;
}
#main .focus-box .feat-wrap {
  float: left;
  padding-top: 1px;
  background: url(../images/div_feat_wrap.gif) 241px 0 repeat-y;
}
#main .focus-box .artist-links {
  float: left;
  width: 243px;
  padding: 3px 0 0 0;
}
#main .focus-box .feat-inner-wrap {
  float: left;
  width: 398px;
  overflow: hidden;
  margin-left: -2px;
  padding: 3px 0 0 19px;
}
#main .focus-box .latest-release {
  width: 160px;
  float: left;
  background: url(../images/div_vert.gif) right repeat-y;
}
#main .focus-box .news-and-media {
  width: 221px;
  overflow: hidden;
  float: left;
  margin-left: -2px;
  padding: 0 0 0 19px;
  background: url(../images/div_vert.gif) left repeat-y;
}
#main .focus-box h2 {
  text-indent: -9999px;
  margin-bottom: 8px;
  height: 24px;
}
#main .focus-box .artist-links p {
  font-size: 1.0em;
  color: #9fbdcf;
}
#main .focus-box .artist-links ul {
  font-size: 1.0em;
  float: left;
  margin: 0 18px 0 0; padding: 0px 0 1px 0;
  list-style: none;
}
#main .focus-box .artist-links li {
  float: left;
}
#main .focus-box .artist-links li a {
  float: left;
  height: 29px;
  width: 68px;
  padding: 10px 0 0 44px;
}
#main .focus-box .artist-links li.myspace a {
  background: url(../images/icon_large_myspace.gif) no-repeat;
}
#main .focus-box .artist-links li.facebook a {
  background: url(../images/icon_large_facebook.gif) 4px 0 no-repeat;
}
#main .focus-box .artist-links li.youtube a {
  clear: left;
  background: url(../images/icon_large_youtube.gif) no-repeat;
}
#main .focus-box .artist-links li.itunes a {
  background: url(../images/icon_large_itunes.gif) no-repeat;
}
#main .focus-box .website {
  clear: both;
  padding-top: 8px;
  margin-right: 18px;
  background: url(../images/div_horizontal.gif) top repeat-x;
}
#main .focus-box .website p {
  color: #fff;
  line-height: 1.8em;
}
#main .focus-box .website a {
  display: block;
  color: #9fbdcf;
  font-weight: bold;
}
#main .focus-box .news-and-media p {
  font-size: 1.0em;
  margin: 0;
}
#main .focus-box .news-and-media ul  {
  margin: 3px 0 0 0; 
}
#main .focus-box .news-and-media .item ul li {
  display: inline;
}
#main .focus-box .news-and-media ul li.first {
  padding: 0 3px 0 0;
}
#main .focus-box .news-and-media h3 {
  font-weight: normal;
  font-size: 0.9em;
  color: #639fb3;
  margin: 8px 0 5px 0;
}
#main .focus-box .news-and-media h4 {
  font-size: 1.0em;
  color: #fff;
  margin: 0 0 4px 0;
}
#main .focus-box .news-and-media h4 a {
  font-weight: bold;
}
#main .focus-box .latest-news h2 {
  background: url(../images/heading_latest_news.gif) no-repeat;
}
#main .focus-box .billy-blog h2 {
  background: url(../images/heading_billy_blog.gif) no-repeat;
}
#main .focus-box .artist-links h2 {
  background: url(../images/heading_artist_links.gif) no-repeat;
}
#main .focus-box .latest-release h2 {
  margin-bottom: 13px;
  background: url(../images/heading_latest_release.gif) no-repeat;
}
#main .focus-box .news-and-media h2 {
  background: url(../images/heading_news_and_media.gif) no-repeat;
}

/*****************************************************
 SIDEBAR: 
****************************************************/
#sidebar {
  float: right;
  width: 205px;
  padding-bottom: 10px;
}
#sidebar p,
#sidebar ul {
  font-size: 1.0em;
}

/*****************************************************
 PAGE CONTROLS & BREADCRUMBS: 
****************************************************/
#page-controls {
  height: 36px;
  overflow: hidden;
  position: relative;
  margin-bottom: 14px;
  background: #b5c7cc url(../images/bc_top.gif) top left no-repeat;
}
#page-controls .breadcrumbs {
  padding: 10px 10px 12px 10px;
  background: #b5c7cc url(../images/bc_btm.gif) bottom left no-repeat;
}
#page-controls .breadcrumbs p {
  display: inline;
}
#page-controls .actions {
  top: 7px; right: -8px;
  position: absolute;
}
#page-controls .actions li {
  float: right;
  padding-left: 5px;
  text-indent: -9999px;
  list-style: none;
}
#page-controls .actions li.print a {
  display: block;
  height: 19px; width: 49px;
  text-decoration: none;
  background: url(../images/page_ctrl_print.gif) no-repeat;
}
#page-controls .actions li.share a {
  display: block;
  height: 19px; width: 49px;
  text-decoration: none;
  background: url(../images/page_ctrl_share.gif) no-repeat;
}


/*****************************************************
 INNER SIDEBAR: 
****************************************************/
#inner-sidebar {
  float: left;
  width: 190px; 
}

/*****************************************************
 PAGE THUMB: 
****************************************************/
#inner-sidebar .page-thumb {
  margin-bottom: 19px;
}

/*****************************************************
 IN THIS SECTION
****************************************************/
#in-this-section h3 {
  text-indent: -9999px;
  width: 190px; height: 38px;
  background: url(../images/heading_in_this_section.gif) no-repeat;
}
#in-this-section h4 {
  list-style: none;
  font-size: 1.2em;
  padding: 0 6px;
  margin-bottom: 5px;
  line-height: 1.8em;
}
#in-this-section ul {
  list-style: none;
  padding: 0 6px; margin: 0;
}
#in-this-section ul li {
  line-height: 1.8em;
  font-size: 1.2em;
}
#in-this-section h4 a,
#in-this-section ul li a {
  font-weight: bold;
}

/*****************************************************
 MAIN CONTENT: 
****************************************************/
#main-content {
  float: right;
  width: 482px; 
}

/*****************************************************
 WHO IS BILLY: 
****************************************************/
#who-is-billy {
  width: 236px;
  margin-left: -21px;
  margin-bottom: 20px;
  background: url(../images/who_is_billy_bg.gif) no-repeat;
}
#who-is-billy .content {
  margin: 0 30px 0 38px; 
}
#who-is-billy .content h2 {
  text-indent: -9999px;
  margin-bottom: 18px;
}

/*****************************************************
 SOCIAL LINKS: 
****************************************************/
#social-links {
  color: #0c0e35;
  margin-bottom: 5px;
  background: url(../images/social_bg_rpt.gif) top repeat-y;
}
#social-links .content {
  padding: 80px 33px 12px 33px;
  background: url(../images/social_bg_top.gif) top no-repeat;
}
#social-links ul {
  list-style: none;
  padding: 0; margin: 0;
}

/*****************************************************
 FEATURED CLIP: 
****************************************************/
#featured-clip-container {
  position: relative;
  margin: 0;
  padding-top: 15px;
}
html[xmlns] #featured-clip-container h3 {
  position: absolute;
  text-indent: -9999px;
  top: 8px; left: -8px;
  height: 55px; width: 59px;
  background: url(../images/overlay_video_clip.png) no-repeat;
}

/*****************************************************
 EMAIL FEED:
****************************************************/
#email-feed {
  margin-bottom: 17px;
  padding: 10px 20px 10px 20px;
  background: #adccd9 url(../images/bg_feed_top.gif) top no-repeat;
}
#email-feed h3 {
  height: 23px;
  text-indent: -9999px;
  background: url(../images/heading_signup_feed.gif) no-repeat;
}
#email-feed form {
  position: relative;
}
#email-feed form input.text {
  border: 0;
  padding: 4px 4px 0 4px;
  height: 20px; width: 110px;
  background: url(../images/signup_input.gif) no-repeat;
}
#email-feed input.submit {
  right: 0;
  position: absolute;
  top: -3px;
  border: 0;
  cursor: pointer;
  margin-left: 5px;
  text-indent: -999px;
  font-size: 1px;
  height: 27px; width: 43px;
  background: url(../images/signup_go_btn.gif) 0 0 no-repeat;
}
#email-feed input.submit:hover {
  background: url(../images/signup_go_btn.gif) 0 -27px no-repeat;
}

/*****************************************************
 ARTISTS PAGE: 
****************************************************/
#page-artists #artist-header {
  position: relative;
  height: 340px;
  width: 910px; 
  background: url('../images/artists_header.jpg') no-repeat;
}
#page-artists #artist-header h1 {
  text-indent: -9999px;
}
#page-artists #artist-header p {
  position: absolute;
  width: 177px;
  height: 40px;
  top: 155px;
  right: 40px;
}
#page-artists #artist-header p a {
  display: block;
  width: 177px;
  height: 40px;
  text-indent: -9999px;
}

#page-artists .artist .pic,
#page-artists .artist .pic img {
  float: left;
  width: 465px;
}
#page-artists .artist .bio {
  float: right;
  width: 400px; 
  height: 246px;
  margin-right: -10px;
  padding: 10px 30px 10px 18px;
  background: url(../images/bg_artist_bio.gif) top right no-repeat;
}
#page-artists .artist .bio h1 {
  color: #0c0e35;
  font-size: 1.9em;
  margin-bottom: 5px;
}
#page-artists .artist .bio .content {
  overflow: auto;
  width: 395px; 
  padding-right: 15px;
  height: 210px;
}
#page-artists .artist .bio p {
  font-size: 1.0em;
}
#page-artists .artist-listing .artist {
  float: left;
  width: 100%;
  margin-bottom: 30px;
}
#page-artists .intro {
  font-size: 1.3em;
  margin-bottom: 10px;
}
#page-artists .artist .bio h2 {
  color: #0c0e35;
  font-size: 1.9em;
  margin-bottom: 10px;
}
html[xmlns] #page-artists .artist .bio .view-profile a {
  display: block;
  text-indent: -9999px;
  width: 118px;
  height: 29px;
  background: url('../images/view_artists-profile_button.png') no-repeat;
}

/*****************************************************
 FAUX FOOTER: 
****************************************************/
#faux-footer {
  clear: both;
  font-family: Arial, Verdana, Sans-Serif;
  background: #b9dce6 url(../images/bg_faux_footer.gif) top repeat-x;
}
#faux-footer a { border: 0; }
#faux-footer .navigation {
  padding: 12px 17px 11px 17px;
  background: url(../images/bg_faux_footer_billy.gif) top right no-repeat;
}
#faux-footer ul {
  margin: 0; padding: 0;
  list-style: none;
  clear: both;
}
#faux-footer ul li {
  position: relative;

}
#faux-footer ul li h4 {
  width: 80px;
  font-size: 12px;
  font-weight: bold;
  display: inline;
}
#faux-footer ul li h4 a {
  color: #363f44;
  font-weight: bold;
}
#faux-footer ul li ul {
  display: inline;
  width: 650px;
}
#faux-footer ul li ul li {
  display: inline;
  font-size: 11px;
  font-weight: normal;
  padding: 0 7px 0 5px;
  margin: 0;
  background: url(../images/divider_footer_links.gif) right no-repeat;
}
#faux-footer ul li ul li.last {
  background: none;
}
#faux-footer ul li ul li a {
  color: #135b85;
}
  
/*****************************************************
 FOOTER: 
****************************************************/
#footer { 
  position: relative;
  margin: 0 auto;
  height: 56px;
  padding: 0 22px 0 23px;
  font-family: Arial, Verdana, Sans-Serif;
  background: url(../images/bg_content_btm.png) bottom center no-repeat;
}
#footer p {
  margin-top: 13px;
  font-size: 9px;
  color: #fff;
  height: 25px;
}
#footer p a {
  color: #fff;
  text-decoration: none;
  border: 0;
  height: 25px;
}
#footer p a:hover,
#footer p a:focus {
  outline: none;
  text-decoration: underline;
}
#footer .copyright {
  float: left;
}
#footer .elastique {
  float: right; 
  width: 203px;
  margin: 10px 3px 0 3px;
}
#footer .elastique a {
  display: block;
  width: 203px;
  height: 25px;
  text-indent: -9999px;
  background: url(../images/elastique_logo.gif) top right no-repeat;
}
#footer .elastique a:hover ,
#footer .elastique a:focus {
  outline: none;
  background: url(../images/elastique_logo.gif) bottom right no-repeat;
}

/*****************************************************
 Blog & News Styles: 
****************************************************/
#page-news .post,
#page-blog .post {
  margin: 15px 0;
  padding-bottom: 15px;
  border-bottom: 1px dotted grey;
}
#page-news .post h2,
#page-blog .post h2 {
  font-size: 15px;
  margin-bottom: 8px;
}
#page-news .post .date,
#page-blog .post .date {
  color: #555;
  font-style: italic;
}
#page-news .post .content,
#page-blog .post .content {
  margin: 10px 0;
}

/*****************************************************
  FORMS
*****************************************************/
select,
textarea,
input[type="text"]    { border: 1px solid #dedede; background: #fff; font-size: 11px; padding: 2px 4px; }
input[type=submit]    { cursor: pointer; }

/*****************************************************
 Contact Form: 
****************************************************/

#contact_form  {
  width: 620px;
  border-bottom: 0;
}
#contact_form label {
  display: block;
  margin: 20px 0 5px 0;
  font-size: 1.2em;
  font-weight: bold;
}
#contact_form  input.text {
  width: 300px;
  padding: 4px;
}

#contact_form  select {
  width: 310px;
  padding: 4px;
}
#contact_form  textarea {
  display: block;
  width: 100%;
  height: 140px;
  margin-bottom: 10px;
}

.meta {
  padding: 5px 3px;
  background: #eee;
}

#label-and-stuff {
  background:transparent url('../images/bg_shadow_sidebar.jpg') top no-repeat;
  margin-bottom: 5px;
  margin-left:-21px;
  width:236px;
}
#label-and-stuff p {
  padding-top: 5px;
  text-align: center;
}
#label-and-stuff img {
  display: block;
  margin: 3px auto 0 auto;
}