/*
 * CSS styleshet for the "Groove" theme.
 *
 * Author: Thomas Bruce Dyrud (thomasbrucedyrud[at]gmail.com)
 *
 * Moified version of the "Cool and Clean" and "Monochrome Black" themes.
 * (Cool and Clean created by: Dan Eriksen - dan.o.eriksen[at]gmail.com )
 * (Monochrome Black created by: David D - ddavis1[at]gmail.com )
 *
 * Icons used are released under Creative Commons.
 * Heading icons: (http://toffeenut.deviantart.com/art/Black-Neon-Agua-iPhone-Theme-85452072)
 * Main theme icon part of itunes icon pack created by Michael Flarup (http://pixelresort.com)
 */

@import "default.css";

@import "theme/madsonic-dark/jquery-ui-1.10.4.custom.css";

@import url('//fonts.googleapis.com/css?family=Montserrat:100,200,400,700');

@import "playericons/playericonsHTML5.css";

@import "jquery.mCustomScrollbar3.css"; 

@import "videoPlayerLight.css"; 

body, form, label, table, a {
    font-family: 'Montserrat', Arial, serif; 
}

table {
    font-size: 100%;
} 

body {
    font-size: 9pt;
}

h2, h1, h1 a, .logo {
    font-family: 'Montserrat', Arial, serif; 
}

/* The primary background color (light gray). */
.bgcolor1, table.music tr:nth-of-type(even) {
    background-color: rgba(17, 17, 17, 0.5);
}

/* The secondary background color (darker gray). */
.bgcolor2, .ruleTableHeader, .log, table.music tr:nth-of-type(odd) {
    background-color: #1D1D1D;
    color: #FFFFFF;
}

/* Background colour for selected header, log etc. */
.headerSelected {
    color: #FFFFFF;
    background-color: #CF8E25;
    border: 1px solid #B18904;
    border-radius: 3px;
    padding: 5px 10px;
}

label  {
    font-family: 'Montserrat', sans-serif;
}

h2 {
    font-family: 'Montserrat', Arial, serif;
    font-size: 10pt;    
}

td.fit {
    padding-top: 5px;
    padding-bottom: 5px;    
}

td.truncate {
    padding-top: 4px;
    padding-bottom: 5px; 
}

/* The secondary foreground colour used for h1, details etc. */
h1, .detail, .albumComment {
    color: #FFFFFF;
}

h1,.mainframe h1 a{
    font-size: 16pt; 
    font-family: 'Montserrat', Arial, serif; font-weight: 700;
    text-shadow: 0.0em 0.0em 1.0em #828056;    
    margin: 5px 0 0;
}

/* Foreground colour used for h2, bold and tr. */
h2, b, tr {
    color: #FFFFFF;
	margin: 0.5em 0 0.5em 0; 
}


.content_main .bgcolor2 {
    background-color:#FFF2F47;
    opacity:0.75;
    filter:alpha(opacity=75); /* For IE8 and earlier */
}

/* Table sizing */
table {
    margin: 0 0 0 0;
}

/* frame image. 
.topframe {
    background-image:url( "../icons/madsonic_dark/headerbg.png" );
    background-repeat:repeat-x;
    background-attachment:fixed;
}*/

.topframe table{
	font-size:95%;
}

/* Main frame image & colour */
.mainframe.splash  {
    background-image:url('../icons/madsonic_dark/background.png');
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-color: #222;
    background-position: top left;
    background-size: cover;
    z-index:110;
}

/* Main frame image & colour */
.loginsplash  {
    background-image:url('../icons/black/backgroundalpha.png');
    background-repeat:no-repeat;
    background-position: top left;
    background-size: cover;
	
	border: 1px solid #111;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	opacity:0.95;
	filter:alpha(opacity=95); /* For IE8 and earlier */
	-moz-box-shadow:    0px 0px 25px 5px #111;
    -webkit-box-shadow: 0px 0px 25px 5px #111;
    box-shadow:         0px 0px 25px 5px #111;	
}

/* Main frame image & colour */
.mainframe { 
    background-image:url('../icons/madsonic_dark/background.png');
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-color: #222;
    background-position: top left;
}

/*
.rightframe.bgcolor1 {
    background-image:url("../icons/madsonic_dark/chatbg.jpg");
    background-repeat: no-repeat;
    background-position: top left;
}*/

.mainframe p.dense{
    clear: both;
    padding: 2px;
    border-bottom: 1px dotted #444444;
}
.mainframe p.dense:last-child{
    border: none;
}

.leftpanel p.dense{
    clear: both;
    padding: 2px;
    border-bottom: 1px dotted #444444;
    line-height: 2em;
}
.leftpanel p.dense:last-child{
    border: none;
}

.leftpanel p.dense a:hover{

}

.leftpanel #anchor_list a {
 /*   font-weight: bold; */
    padding: 0.8px;
    margin: 0.8px;
}
.leftpanel #anchor_list a:hover {
    background-color: #111;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    
}

.dropshadow {
    box-shadow: 1px 2px 5px #111111;
}

/* Back image */
.back {
    font-size: 8pt;
    background-image:url( "../icons/madsonic_dark/back.png" );
}

/* Forward image */
.forward, .forwardright {
    font-size: 8pt;
    background-image:url( "../icons/madsonic_dark/forward.png" );
}

#artistBio {
    line-height: 22px;
    font-size: 12px;
}

.artistbanner {
background-image:url("../icons/madsonic_dark/artist_banner.png");
background-position: 0px 0px; 
background-repeat:no-repeat; 
}

#content_artist .detailcolor {
    line-height: 1.24em;
}

.mainframe #anchor_list a:link, 
.mainframe #anchor_list a:active, 
.mainframe #anchor_list a:visited, 
.mainframe #anchor_list a:link *, 
.mainframe #anchor_list a:active *, 
.mainframe #anchor_list a:visited * {
    color: #FFFFFF;
    font-size: 1.4rem;
    font-family: 'Montserrat', Arial, serif; font-weight: 200;
    text-shadow: 0 0 0.6em #828056;    
    margin: 0 0 0;    
}

.mainframe a:hover {
    text-shadow: 0 0 10px #FFFFFF;    
}


/* Link colour   */ 
a:link, a:active, a:visited, a:link *, a:active *, a:visited * {
    color: #FAE157;
}

/* Link hover colour */
a:hover, a:hover * {
    text-decoration: none;
    color: #FFFFFF;
}

/* Colour for warning messages. */
.warning {
	color: rgb(255, 204, 0);
}

/* The primary foreground colour. */
body {
    color: #FFFFFF;
/*    background-color: #dddddd;*/
}

html {
/*    background-color: transparent;*/ 
}

body, form, label, table, a {
    font-family: 'Montserrat', verdana, arial, sans-serif;
}

label, {
    color: #CCC;
}

#carousel1-title {
    color: #FACC2E;
}

.songRow {
    white-space: nowrap;
}

.ruleTableCellDB {
    border: 1px solid black;
    white-space: nowrap;
    font-size: 7pt;
    margin: 1px;
    padding: 1px;
    padding-right: 10px;
}

.detailmini {
    padding-bottom: 4px;
}

.detailcolor {
    color: #FACC2E;
}
.detailcolordark {
    color: #A4A4A4;
}

.logo {
    padding-right:0.5em;
}

@charset "UTF-8";
::-webkit-scrollbar {
    width: 13px;
    height: 13px;
    background: #222222;
}

::-webkit-scrollbar-track-piece {
    background: transparent none;
    border: solid 4px transparent;
    border-right-width: 8px;
    margin: 4px;
    -webkit-box-shadow: inset 1px 1px 0 0 rgb(0,0,0), inset -1px -1px 0 0 rgb(9,9,9);
}

::-webkit-scrollbar-track-piece:horizontal {
    border-right-width: 4px;
    border-bottom-width: 8px;
}
::-webkit-scrollbar-thumb {
    border: solid 0 transparent;
    border-right-width: 4px;
    -webkit-border-radius: 5px;
    -webkit-border-top-right-radius: 9px 5px;
    -webkit-border-bottom-right-radius: 9px 5px;
    -webkit-box-shadow: inset 0 0 0 1px rgb(79,79,79), inset 0 0 0 5px rgb(102,102,102);
    -webkit-box-shadow: inset 0 0 0 1px rgba(63, 45, 21, 0.49), inset 0 0 0 5px #645516; 
}

::-webkit-scrollbar-thumb:hover {
    -webkit-box-shadow: inset 0 0 0 1px rgba(63, 45, 21, 0.49), inset 0 0 0 5px #816C1A;
}
::-webkit-scrollbar-thumb:horizontal {
    border-right-width: 0;
    border-bottom-width: 4px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px 9px;
    -webkit-border-bottom-left-radius: 5px 9px;
}

::-webkit-scrollbar-corner {    
    background: #222;
}
::-webkit-scrollbar-button {    
    height: 26px;
    background: url(../icons/madsonic_dark/webkit-arrows-vert.png) 1px 50% no-repeat, #333;
}
::-webkit-scrollbar-button:increment {
    background-position: -19px 50%;
}
::-webkit-scrollbar-button:horizontal {
    width: 26px;
    background: url(../icons/madsonic_dark/webkit-arrows-horiz.png) 50% 1px no-repeat, #222;
}
::-webkit-scrollbar-button:horizontal:increment {
    background-position: 50% -19px;
}

body ::-webkit-scrollbar {
    background: transparent none;
}


.NFButtonLeft {
    background: url() no-repeat scroll 0 0 transparent;
}
.NFButtonRight {
    background: url() no-repeat scroll 0 0 transparent;
}


input {
    background: none repeat scroll 0 0 #333;
    border-radius: 5px;
    font-family: 'Montserrat', Arial, serif; 
    font-weight: 400;
    padding: 5px 8px 5px 8px;
	margin-left: 4px;	
    font-size: 12px;
    color: #fff !important;
    background-color: #333;
    border: 1px solid #444;
}

select, button {
    background: none repeat scroll 0 0 #333;
    border: 1px solid #E1DBDB;
    border-radius: 5px;
    color: #fff !important;
    font-family: 'Montserrat', Arial, serif; 
    font-weight: 400;
    padding: 5px 8px 5px 8px;
	margin-left: 4px;	
    font-size: 12px;
    border: 1px solid #444;
}

input[type=button]{
    background: #7d7e7d; /* Old browsers */
    background: -moz-linear-gradient(top, #7d7e7d 0%, #4c4c4c 50%, #3d3d3d 53%, #2b2b2b 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(50%,#4c4c4c), color-stop(53%,#3d3d3d), color-stop(100%,#2b2b2b)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #7d7e7d 0%,#4c4c4c 50%,#3d3d3d 53%,#2b2b2b 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #7d7e7d 0%,#4c4c4c 50%,#3d3d3d 53%,#2b2b2b 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #7d7e7d 0%,#4c4c4c 50%,#3d3d3d 53%,#2b2b2b 100%); /* IE10+ */
    background: linear-gradient(top, #7d7e7d 0%,#4c4c4c 50%,#3d3d3d 53%,#2b2b2b 100%); /* W3C */
    border: 1px solid #111;
}
input[type=submit]{
    background: #FFC000; /* Old browsers */
    background: -moz-linear-gradient(top, #FFC000 0%, #FF8900 50%, #FFBF00 53%, #F9BB00 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFC000), color-stop(50%,#FF8900), color-stop(53%,#FFBF00), color-stop(100%,#F9BB00)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #FFC000 0%,#FF8900 50%,#FFBF00 53%,#F9BB00 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #FFC000 0%,#FF8900 50%,#FFBF00 53%,#F9BB00 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #FFC000 0%,#FF8900 50%,#FFBF00 53%,#F9BB00 100%); /* IE10+ */
    background: linear-gradient(top, #FFC000 0%,#FF8900 50%,#FFBF00 53%,#F9BB00 100%); /* W3C */
    border: 1px solid #8A6300;
}    

/* Custom */
.innerbox {
    border: 0px solid #222222;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    opacity:0.9;
    filter:alpha(opacity=90); /* For IE8 and earlier */
}

.innerbox:hover {
    opacity:0.70;
    filter:alpha(opacity=70); /* For IE8 and earlier */
    border: 0px solid #AB9100;
}

span.off {
    background: #FFF !important;
    border: solid 1px #ffffff;
}

span.on {
    background: #F5C70F !important;
    border: solid 1px white;
}

span.off:hover {
    background: #F5C70F !important;
    border: solid 1px #999;
}

.divIdCoverBack {
top: -58px; 
left: 0px;
}
/*
.rank {
    white-space: nowrap;
    font-size: 5.9pt;
    line-height: 1.40em;
	background-image: url('../icons/default/rank.png');
	background-position:right;
	background-repeat: no-repeat;
	padding-top: 8px;
	padding-left: 8px;
	padding-right: 3px;
	padding-bottom: 8px;
	margin-left: 5px;
	margin-right: 5px;
	color: #FFEE00;
	opacity: 0.99;
}

.mainframe div#content_2 img {
    border-style: none;
    border: 0;
    margin: 0 0px;
    padding: 0;
    vertical-align: middle;
}
*/

.rank {
    white-space: nowrap;
    font-size: 6pt;
    line-height: 1.40em;
    background: url('../icons/madsonic_black/rank.png') no-repeat right;
    padding: 8px 3px 8px 8px;
    margin-left: -2px;
    color: #FFC200;
    font-family: verdana, arial, sans-serif;
}

#media_control {
	padding-top: 10px;
	padding-bottom: 15px;
    -moz-box-shadow: 0px 0px 3px 3px #181818;
    -webkit-box-shadow: 0px 0px 3px 3px #181818;
    box-shadow: 0px 0px 3px 3px #181818;
}

#bitrate_menu {
    color: #999 !important;
}

#overlay {
    background-color: #2e2e2e !important;
 }
 
 #toogleGenre {
	top: -22px;
} 

#moreActions option {
    color:white !important;
}

#moreActions optgroup {
    color:#ddd !important;
    font-style:normal;
}

.dropdownOpt {
}

a.dropdownOpt:hover {
background-color:#CF8E25 !important;
color: #FFF !important;
}

div.opt-theme-classic a.dropdownOpt:hover, 
div.opt-theme-classic a.dropdownOpt.selectedOpt {
	background-color:orange !important;
}

div.opt-theme-xp a.dropdownOpt:hover, div.opt-theme-zuneNOIR a.dropdownOpt:hover,
div.opt-theme-xp a.dropdownOpt.selectedOpt, div.opt-theme-zuneNOIR a.dropdownOpt.selectedOpt {
	background-color:orange !important;	
}

a.dropdownOpt.selectedOpt {
	background-color:#CF8E25 !important; 
   color:#FFF !important; 
}

.dd-theme-classic, .dd-all {
    border-color:#444 !important; 
    font-size: 9pt !important;
    color: #eee !important; 
    padding: 8px 15px 8px 15px !important;      
}

.ad {
box-shadow: 0px 0px 15px #000;
background-color: #181818;
border-radius: 5px;
}

.nowPlaying {
    padding: 0px 0px 10px 10px;
    background-color: #181818;
}

.accent {
    color: #FFF3B0;
}

.status {
    color: rgb(255, 155, 0);
}

.topframe .logo img {
    width: 155px;
    height: 38px;
    margin-top: -20px;
    padding-right: 0.5em;
}

.viewSelected {
    color: black;
    background-color: #D49400;
    border: 0px solid black !important;
    border-radius: 3px 3px 3px 3px;
    padding: 5px 10px;
}

.detailyear {
    white-space: nowrap;
    color: #F5E59D;
    font-size: 11px;
    font-weight: 400;
    }
    
.easyPieChartBarColor {
	color:#E6BF33;
}
.easyPieChartScaleColor {
	color:#7E7E7A;
}
.easyPieChartTrackColor {
	color:#5C5C41;
}    
 
.border1, .ruleTableHeader, .ruleTableCell, .headerSelected, .log {
    border: 1px solid rgb(88, 88, 88);
}

.playlistframe {
   /* border-top: 1px dotted #FAE157; */
}

.starSong {
    padding-left:5px;
}

.songTitle {
    font-size: 90%; 
}

.ui-slider .ui-slider-handle {
    background: #E65100 !important;
}
.ui-slider-range-min {
    background: #E65100 !important;
}

#startButton, #stopButton {
    cursor:pointer; font-size:30px; color:#E65100 !important;
}

.ui-slider-range-min {
    background: #E65100;
}

#play, #pause, #buffer {
    font-size: 24px;
    color: #E65100;
}

#previousButton, #nextButton ,#fastpreviousButton, #fastnextButton  {
    color:#222 !important; 
}

#bufferButton {
    font-size:30px; color:#E65100 !important;
}

#progress {
}