/*
 * 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 "madsonic-dark/jquery-ui-1.10.4.custom.css";

@import url(//fonts.googleapis.com/css?family=Bowlby+One+SC);
@import "playericonsOrange.css";

@import "jquery.mCustomScrollbar.White.css"; 

/* The primary background colour. */
.bgcolor1 {
    background-color: #222;
}

/* The secondary background colour, light blue, primary theme colour. */
.bgcolor2, .ruleTableHeader, .log {
    background-color: #222;
    color: #FFFFFF;
}

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


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

h1,.mainframe h1 a{
    font-size: 1.1rem;
    font-family: 'Bowlby One SC', Arial, serif; font-weight: 400;
    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: 1em 0 1em 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:90%;
}

/* 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;
}

/* 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 dashed #444444;
}
.mainframe p.dense:last-child{
    border: none;
}

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

.leftframe p.dense a:hover{

}

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

/* 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" );
}

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

.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: 'Bowlby One SC', Arial, serif; font-weight: 200;
    text-shadow: 0.0em 0.0em 0.8em #828056;    
    margin: 0 0 0;    
}

.mainframe a:hover {
    text-shadow: 0.0em 0.0em 0.9em #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;*/ 
}

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 {
}

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

.logo {
    padding-right:0.5em;
}

.topframe .logo a img{
    width:165px;
}

@charset "UTF-8";
::-webkit-scrollbar {
    width: 14px;
    height: 14px;
    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 6px rgb(102,102,102);
    -webkit-box-shadow: inset 0 0 0 1px rgba(63, 45, 21, 0.49), inset 0 0 0 6px #645516;
}

::-webkit-scrollbar-thumb:hover {
    -webkit-box-shadow: inset 0 0 0 1px rgba(63, 45, 21, 0.49), inset 0 0 0 6px #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, #222;
}
::-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 #FAFAFA;
    border: 1px solid #ffffff;
    border-radius: 5px;
    color: #333333;
    font-size: 9pt;    
    padding: 3px;
	padding-left: 6px;
}

select {
    background: none repeat scroll 0 0 #FAFAFA;
    border: 2px solid #ffffff;
    border-radius: 5px;
    color: #333333 !important;
    font-size: 9pt;    
    padding: 0px 10px 1px 5px;
}

input[type=button],input[type=submit]{
    color: #dfdfdf ;
    text-shadow: 1px 1px 1px #111;
    padding: 4px 11px;
    font-size:1.1em;
}

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: 4px;
	padding-right: 3px;
	padding-bottom: 8px;
	margin-left: 5px;
	margin-right: 5px;
	color: black;
	opacity: 0.99;
}
/*
.mainframe div#content_2 img {
    border-style: none;
    border: 0;
    margin: 0 0px;
    padding: 0;
    vertical-align: middle;
}
*/
.logo {
	padding-right:2em;
}

#media_control {
	padding-top: 10px;
	padding-bottom: 15px;
}

#bitrate_menu {
    color: #999 !important;
}

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