@import url(site.css);
@import url(//fonts.googleapis.com/css?family=Rokkitt:400,700);

/*-------------------------------------------------------

      *Filename:        browse.css
      *Description:     browse = product page css
      *Version:         12/12/2011
      *Website:         youtab
      *Author:          Maggie proart
      
---------------------------------------------------------*/


#content { padding: 23px 18px 24px;  position: relative;  }

.browse-container h1 {margin-left:20px; letter-spacing: 0.01em;}
.browse-container h2 {font-size:0.8em; font-size:1.167em; padding-bottom:5px; border-bottom:1px solid #424242;padding-left:10px; margin-bottom:5px; }
#browse-slider-container {padding:20px 0 28px 35px; height:43px;  overflow:hidden;position:fixed;top:52px;}
.slider { xbackground: url(https://youtab-static.s3.amazonaws.com/images/slider-background.png) repeat-x scroll 0 0 transparent; cursor: pointer; height: 16px;  width: 898px;  margin-top:-16px;}
.knob { background: url(https://youtab-static.s3.amazonaws.com/images/knob.png) no-repeat scroll left 3px transparent; cursor: pointer; height: 20px; width: 16px;  visibility:hidden;}
#character-list-wrapper { overflow:hidden; margin-left:1px; height:16px;}
#character-list li a{color:#ffba00; font-size:14px; font-weight:bold; padding-bottom:20px; display:block; }
#character-list li.selected a{color:#fff;}

#filter-container {margin-left:12px; margin-top:25px;}
.list-link .data {width: 173px;}
.feed-list {margin-left:5px; }
#filter_main li{margin-bottom:11px;}


/*browse-artist-song*/

#browse-artist-song .feed-list {  margin: 23px 17px;}

/*browse-artist-song -list*/
#browse-artist-song-list #feed-container {padding:0 0 0 0; margin-top:5px;}
#browse-artist-song-list h2 {display:block}
#browse-artist-song-list .more {float:none;}
#browse-artist-song-list .feed-list { margin-left: 16px;  margin-top: 6px;}

/* browse song*/
#browse-song #feed-container {padding:0 0 0 0; margin-top:25px;}
#browse-song h2 {display:block}
#browse-song .more {float:none;}
#browse-song .feed-list { margin-left: 16px;  margin-top: 6px;}

#feed-container {padding:0;margin-left:12px; margin-top:25px;}
#feed-container h2 {border-bottom: 1px solid #424242; font-size: 1.167em; margin-bottom: 5px; padding-bottom: 5px; padding-left: 10px; display:block;}
#feed-container .more
{
	float:right;
	color:#ffba00;
	line-height:1em;
	font-size:1em;
	margin-right: 7px;
	margin-top: 13px;
}

#information {background:rgb(0,0,0);background:rgba(0,0,0,0.2);-ms-filter:alpha(opacity=50);filter:alpha(opacity=50); width:884px; position:relative; margin:0 auto 20px;  text-align:left; padding:20px; line-height:1.5em;}
#information a {color:#ffba00;}
#information a:hover { color:#2E2D2D;}
.info-ico {color:#ffba00; background:url(https://youtab-static.s3.amazonaws.com/images/info.png) no-repeat; padding-left:22px; line-height:16px; height:16px;display:block;}

#feed-play h2 {display: inline-block; margin: 0 8px 0 10px; font-size: 20px;  font-weight: bold; border-bottom:none;}
#feed-play .feed-list {margin-left:4px;}



/*   NEW */
#searchResultsContainer #searchResult {
	width:415px;
	float:left;
	background:url(https://youtab-static.s3.amazonaws.com/images/searchIcon.png) no-repeat 16px 4px;
}
#searchResultsContainer #searchResult h1 {
	margin:4px 0 0 0;
	padding-left:85px;
	line-height:22px;
}

#searchResultsContainer ul#filter_main {
	float:left;
	margin:37px 0 0;
	padding-left:85px;
}

#searchResultsContainer ul#filter_main h2 {
	border-bottom: none;
	font-size: 16px;
	line-height:22px;
	padding-left:0;
	margin-left:0;
}

#searchResultsContainer #informationBrowse {
	width:380px;
	margin:0 0 20px;
	text-align:left;
	padding:6px 15px 20px 20px;
	line-height:1.5em;
	float:right;
}

#searchResultsContainer #informationBrowse h2 {
	border-bottom: none;
	font-size: 18px;
	margin-bottom: 5px;
	margin-left:0;
	padding-bottom: 5px;
	padding-left: 0px;
	display:block;
}

#searchResultsContainer #informationBrowse a { color:#ffba00; }

#searchResultsContainer #informationBrowse a:hover { color:#2E2D2D; }

#searchResultsContainer #description {
	width:923px;
	height:260px;
	margin: 0 auto;
	background: url(https://youtab-static.s3.amazonaws.com/images/bulletsDescriptionBg.jpg) no-repeat left bottom #383838;
}

#searchResultsContainer #description ul#bullets {
	margin-left:135px;
	padding-top:35px;
	margin-bottom:120px;
}

#searchResultsContainer #description ul#bullets li {
	display:inline;
	float:left;
	margin-right:45px;
	padding-left:45px;
	background:url(https://youtab-static.s3.amazonaws.com/images/tabBullet.png) no-repeat left 10px;
	font-family:'Rokkitt', serif;
	font-size:27px;
	line-height:27px;
}

#searchResultsContainer #description ul#bullets li span {
	font-size:20px;
}

#searchResultsContainer #description p {
	float:right;
	font-family:'Rokkitt', serif;
	font-size:38px;
	line-height:45px;
	color:#ffba00;
	text-align:right;
	padding-right:30px;
	font-weight:700;
}

#searchResultsContainer #descriptionButton{
	height:45px;
	padding:0 20px;
	margin-right:100px;
	font-family:Verdana, Geneva, sans-serif;
	font-size:18px;
	line-height:45px;
	text-align:center;
	font-weight:normal;
	color:#000;
	float:right;
	text-decoration:none;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background-color:#ffad0d;
	background-image: url(https://youtab-static.s3.amazonaws.com/images/descriptionButton-fallback.png);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffad0d), to(#ff7b01));
	background-image: -webkit-linear-gradient(top, #ffad0d, #ff7b01);
	background-image:    -moz-linear-gradient(top, #ffad0d, #ff7b01);
	background-image:     -ms-linear-gradient(top, #ffad0d, #ff7b01);
	background-image:      -o-linear-gradient(top, #ffad0d, #ff7b01);
	moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, .5);
	-webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, .5);
	box-shadow: 0px 1px 2px rgba(0, 0, 0, .5);
}

#searchResultsContainer #descriptionButton:hover {
	background-color:#ff9708;
	background-image: none;
}

#searchResultsContainer #feed-create {
	margin-top:5px;
}

.browse #searchResultsContainer { padding:0 14px;}

.browse #searchResultsContainer #searchResult {
	width:455px;
	float:left;
	background:none;
}

.browse #searchResultsContainer #searchResult h1 { height:46px; font-size:16px; line-height:23px; background:url(https://youtab-static.s3.amazonaws.com/images/browseIcons.png) no-repeat left top; margin:0 0 25px 0 ; }

.browse #searchResultsContainer ul#filter_main h2 { font-size: 14px; }
.browse #searchResultsContainer ul#filter_main h2 a { color: #ffcc00; }
.browse #searchResultsContainer ul#filter_main h2 a:hover { color: #2E2D2D; }

.browse #searchResultsContainer ul#filter_main {
	width:370px;
	margin:0 0 20px 0;
	padding:0 0 0 85px;
	background:url(https://youtab-static.s3.amazonaws.com/images/browseIcons.png) no-repeat left -80px;
}

.browse #searchResultsContainer ul#filter_main li {
	width:370px;
	margin:0;
	padding:25px 0 0;
	border-top:1px solid #404040;
}

.browse #searchResultsContainer ul#filter_main li span { font-size:14px; line-height:22px; }

.browse #searchResultsContainer #informationBrowse { width:420px; font-family:Georgia, serif; font-style:italic; }

.browse #showMore  { display:block; float:right; margin-right: 15px; margin-top: 13px; color:#ffba00; line-height:1em; font-size:1em; cursor:pointer; }

.browse #showMore:hover { color:#818181;}

.browse #feed-play .feed-title { width:940px; }

.browse .filter li a { padding-bottom:5px; }

.browse #feed-play .feed { padding:6px 5px; display:block; overflow:hidden; }

.browse .feed-list { position:relative; height:200px; display:block; overflow:hidden; }

.browse .list-item { width:307px; height:100px; float:left;}

.browse #description {
	width:912px;
	height:245px;
	margin: 50px 14px 25px;
	background: #292929 url(https://youtab-static.s3.amazonaws.com/images/descriptionBg.png) no-repeat 315px top;
}

.browse #description .left-side {
	width:450px;
	float:left;
}

.browse #description .right-side {
	width:360px;
	float:right;
}

.browse #description .left-side, .browse #description .right-side{ height:205px; padding:20px;}

.browse #description h3 { color:#ff9204; font-size:35px; font-weight:bold; }

.browse .textShadow { -webkit-text-shadow:1px 1px 1px #101010; -moz-text-shadow:1px 1px 1px #101010; text-shadow:1px 1px 1px #101010; }

/* ***** */

.browse #description ul#bullets {
	margin:40px 0 0;
	padding:0px;
}

.browse #description ul#bullets li {
	float:left;
	width:100%;
	font-size:15px;
	line-height:30px;
}

.browse #description p {
	font-size:20px;
	line-height:50px;
	font-weight:bold;
	text-align:center;
}

.browse #description p a {
	display:block;
	font-size:23px;
	text-align:left;
	line-height:45px;
	color:#b6d3fc;
	padding:2px 0 0 45px;
	background:url(../images/s/facebook.png) no-repeat left 7px;
}

.browse #description p a:hover {
	color:#818181;
}

.browse #description span {
	font-size:16px;
	font-weight:bold;
	padding-left:45px;
}

.browse #description span a {
	color:#FC0;
}

.browse #description span a:hover {
	color:#818181;
}

.browse #descriptionButton{
	width:255px;
	height:45px;
	padding:0 5px;
	margin:48px auto 10px;
	font-size:14px;
	font-weight:bold;
	line-height:45px;
	text-align:center;
	color:#292929;
	text-decoration:none;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background-color:#ffad0d;
	background-image: url(https://youtab-static.s3.amazonaws.com/images/descriptionButton-fallback.png);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffad0d), to(#ff7b01));
	background-image: -webkit-linear-gradient(top, #ffad0d, #ff7b01);
	background-image:    -moz-linear-gradient(top, #ffad0d, #ff7b01);
	background-image:     -ms-linear-gradient(top, #ffad0d, #ff7b01);
	background-image:      -o-linear-gradient(top, #ffad0d, #ff7b01);
	moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, .5);
	-webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, .5);
	box-shadow: 0px 1px 2px rgba(0, 0, 0, .5);
	cursor:pointer;
}

.browse #descriptionButton:hover {
	background-color:#ff9708;
	background-image: none;
}

.browse #descriptionButton a { color:#292929; display:block; }

.browse #descriptionButton a:hover { color:#000; }