


/* --- Tabs --- */
.mp3j-tabbuttons-wrap {
	position:relative;
	min-height:30px;
	padding:15px 0 0 0; 
	width:auto; 
	overflow:visible;
}
.mp3j-tabbutton { 
	float:left; 
	padding:9px 36px 12px 32px; 
	font-size:15px;
	margin:0;
	background:#e9e9e9;  
	font-weight:500; 
	-webkit-border-top-left-radius: 1px;
	-webkit-border-top-right-radius: 1px;
	-moz-border-radius-topleft: 1px;
	-moz-border-radius-topright: 1px;
	border-top-left-radius: 1px;
	border-top-right-radius: 1px;
	border-bottom:1px solid #fcfcfc;
	cursor:pointer;
	color:#707070;
	font-family: "Open Sans",sans-serif;
	line-height:24px;
}
div.wrap  .mp3j-tabbutton h1 { 
	margin:0; 
	font-size:20px;
	line-height:24px;
}
.mp3j-tabbutton:hover {
	background:#ededed;
	text-decoration:none;
}



.active-tab	{
	border:1px solid #fcfcfc;
	border-bottom:0px;
	padding-left:31px;
	padding-right:35px;
	color:#222;
	font-weight:500;
	background:none;
	margin-top:-1px;
	text-decoration:none;
}
.active-tab:hover {
	background:none;
	text-decoration:none;
}

.mp3j-tabbutton.first {
	padding-top:8px;
	padding-bottom:13px;
	padding-left:22px;
	padding-right:26px;
}

.mp3j-tabbutton.first.active-tab {
	border-left:0;
	border-top:0;
	padding-right:25px;
	padding-top:9px;
	padding-left:22px;
	padding-bottom:13px;
}

.mp3j-tabbutton.last { padding-right:52px; }
.mp3j-tabbutton.last.active-tab {
	border-right:0;
	padding-right:52px;
}






.mp3j-tabs-wrap { 
	position:relative;
	height:auto;
	padding:0px 0 0 0;
}
.mp3j-tab { 
	position:relative;
	height:auto;
	padding:20px 0px 40px 22px;
	background:#f1f1f1;
}
.tab-header { padding:2px 0 6px 0; margin:0; width:100%; }
.tab-header h3 { margin:0 0 0 0 !important; }

.tabH { font-size:19px; font-weight:700; }
.tabD { font-style:italic; padding:0 0 10px 0;  } 

.mp3j-tab label { font-weight:700; }

.mp3j-tab .description { color:#888; }

.mp3j-tab hr { margin-bottom:8px; }
		

.os {
	font-family: 'Open Sans', sans-serif;
}
		
/* --- */
div#library-list,
div.library-list,
div#folder-list {
	position:relative;
	padding:10px 20px 15px 20px;
	margin:0px 0px 0px 0px;
	background:#f9f9f9;
	
	border:1px solid #c3c3c3;
	border-top:none;
}
div#folder-list {
	border:1px solid #c3c3c3;
}

/* --- */	
.unselectable,
.unselectable * {
   -moz-user-select: 	-moz-none;
   -khtml-user-select: 	none;
   -webkit-user-select: none;
   -ms-user-select: 	none;
   user-select: 		none;
}


/* --- */
table.fileList { 
	border-collapse:collapse; 
	margin:0 0 0 0;
	width:	100%;
}
table.fileList td { 
	text-align:left; 
	vertical-align:top; 
	padding:5px 15px 5px 5px; 
}
table.fileList td * { 
	padding:0; 
	margin:0; 
}
table.fileList th { 
	text-align:left; 
	padding:10px 5px;
	border-bottom: 1px solid #999;
}
table.fileList tr.odd {
	background-color: transparent;
}
table.fileList tr.even {
	background-color: #f1f1f1;
}

td.files-edit { padding-right:5px; }
td.files-number { padding-right:5px; color:#aaa; font-size:11px; }
td.files-title {}
td.files-artist { font-size: 12px;  }
td.files-album { font-size: 12px;  }
td.files-caption { font-size: 12px;  }
td.files-date { font-size: 12px;}
td.files-url { font-size: 12px;  }





/* --- */
table.vTop td { vertical-align:top; padding:0 10px 10px 0; }
.vTop { vertical-align:top; padding:0 10px 10px 0; }



.absTL { position:absolute; top:-1px; left:-1px; width:100%; }



	
.quietInput {
	background:#fcfcfc !important;
	border-color:#f0f0f0 !important;
	-webkit-box-shadow:none !important;
	-moz-box-shadow:none !important;
	box-shadow:none !important;
	color:#d6d6d6 !important;
}
.quietText { color:#d6d6d6 !important; }

	
	
.tick { padding-right:25px; font-size:11px; background:url('images/tick2.png') no-repeat left 2px; }


.icon-showsupport {
	background:url('images/icons-admin-S.png') no-repeat -29px -4px;
	width:34px; height:34px; margin:0 auto;
	border:1px solid #d0d0d0;
	overflow:hidden;
}

.icon-showsupport:hover {
	width:280px; height:120px;
}

.icon-extensions {
	background:url('images/icons-admin-S.png') no-repeat 2px -5px;
	padding:0 20px 0 0;
}
	
	
.l { text-align:left; }
.c { text-align:center; }
.r { text-align:right; }



#feedCounterpartInfo {
	border:1px solid #d0d0d0;
	padding:4px 10px;
	background:#f7f7f7;
	border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px;
}




.helpBox {
	border:2px solid #fff;
	border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;
	background:#fafafa;
	padding:15px;
	margin:10px 0 20px 0px;
}

.helpBox p.description {
	color: #333;
	line-height:160%;
	font-size:14px;
	font-style:normal;
	margin-bottom:20px;
}

div.wrap .helpBox h4 {
	margin-bottom:10px;
}

/* ====================================================================================== */





a.fox_buttonlink { 
	background:#eaf2fa; 
	border:1px solid #afcfdb; 
	padding:1px 12px 2px 10px; 
	text-decoration:none; 
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
	a.fox_buttonlink:hover { background:#dbeafa; border:1px solid #99bac7; color:#222; }

	a.bl2 { padding:0px 31px 1px 31px; }



	

.clearB { clear:both; }



div.sp-container {
	background: #fafafa;
	padding:10px 5px 0 10px;
	-webkit-box-shadow:0px 1px 4px rgba(0, 0, 0, 0.35); -moz-box-shadow:0px 1px 4px rgba(0, 0, 0, 0.35); box-shadow:0px 1px 4px rgba(0, 0, 0, 0.35);
}

table.player-settings td {
	padding-bottom: 6px;
}

table.playlist-settings td {
	padding-bottom: 10px;
}




/* ############################################################## */




.light { color:#999; }
.smaller { font-size:80%; }
.alignR { text-align:right; }

.clearB { clear:both; }
.absTL { position:absolute; top:0px; left:0px; }

.vTop { vertical-align:top; }
.vMid { vertical-align:middle; }

code { background:#fff; border:1px solid #e0e0e0; }


.arrowUp { 
	background: url('images/arrowUp.png') no-repeat 0px 8px; 
	padding:0 0 0 20px;
	cursor:pointer;
}

.arrowDown { 
	background: url('images/arrowDown.png') no-repeat 0px 10px; 
	padding:0 0 0 20px; 
	cursor:pointer;
}


div.wrap { 
	border: 0px solid #FF3300;
	margin:0px 20px 0 0px;
	max-width:1600px;
}
	div.wrap p { margin:0 0 4px 0; }
	div.wrap h1 { font-weight:500; font-size: 22px; line-height:22px; margin:20px 0 5px 0; padding:0; }
	div.wrap h2 { font-size: 10px; line-height:10px; margin:0; padding:0; }
	div.wrap h3 { font-size: 18px; margin:0 0 8px 0px; } 
	div.wrap h4 { font-size:14px; margin:0; }



table.plain {
	border-collapse:collapse;
	margin:0;
	padding:0;
}
table.plain tr, 
table.plain td,
table.plain th {
	margin:0;
	padding:0;
}



table.overview-summary {
	border-collapse:collapse;
	margin:0 0 12px 0;
}
table.overview-summary td {
	vertical-align:top; 
	padding:0 0px 5px 0;
}





.panel-stats {
	position:relative;
	border:1px solid #fff;
	background-color:#f8f8f8;
	padding:20px;
	width:auto;
	min-width:240px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	margin:0 0 20px 0;
}


.panel-stats hr { border-bottom:1px solid #fff; margin:10px 0 2px 0; }



.overview-stats {
	width:400px;
	float:left;
	margin:right:20px;
}
.overview-stats-wide {
	width:400px;
	float:left;
	margin:right:20px;
}




.fL { float:left; }
.fLm { float:left; margin-right:20px; }
.fR { float:right; }


.smallDesc {
	font-weight:500;
	font-size:80%;
	font-style:italic;
}


a.noDec, a.noDec:hover, a.noDec:active, a.noDec:visited, a.noDec:link, a.noDec:focus { text-decoration:none; outline:none !important; border:none !important; border-left-color:#f00; }
a.underline, a.underline:hover, a.underline:active, a.underline:visited, a.underline:link, a.underline:focus { text-decoration:underline; outline:none !important; border:none !important; }



.summary1 { float:left; margin-right:20px; min-height:240px; width:280px; }
.summary2 { float:left; margin-right:20px; min-height:240px; width:280px; }
.summary3 { float:left;  margin-right:0px; min-height:240px; width:280px; }

.subsectHeading {
	font-size:14px;
}

.niceParag {
	max-width:550px;
}

.labelCol {
	padding:4px 10px 4px 10px !important;
	font-size:15px;
	font-weight:700;
}

.smallspacer { height:6px; }


.paramsTable { border-collapse: collapse; }
.paramsTable td { padding:10px; border:1px solid #e0e0e0; }
.paramsTable th { padding:10px; }








/* table nav controls
-------------------------- */
.navWrap {
	padding: 		5px;
	border:			1px solid #ccc;
	background:		#fff;
}
.navWrap .button-secondary {
	box-shadow: none;
	-webkit-box-shadow: none;
	font-weight:700;
}

.navWrapHeader{
	margin:			0 0 0px 0;
}
.navWrapFooter {
	margin:			0px 0 0 0;
}

.unPad {
	padding: 0 5px 1px !important;
}

.vTop {
	vertical-align: top !important;
}

.buttonDisabled {
	color: #ececec !important;
	border: 1px solid #f1f1f1 !important;
	background: #fbfbfb !important;
	cursor:	default !important;
}

.tNavSelect,
.vNavSelect {
	margin-top: 0px;
}

.mjp-spinner {
	display: 	inline-block;
	width:		25px;
	height:		25px;
}

#vNavControl_rows,
#tNavControl_rows {
	width:		50px;
}

.vNavMessage,
.tNavMessage {
	text-align:	right;
	float: 		right;
	padding-right:20px;
}
.vNavMessage span,
.tNavMessage span {
	color: 		#333;
	font-weight: 600;
}

.tpos {

}
.ctext {
	padding:5px 20px 0 5px;
}


.loader {
	background-image:url('images/loader.gif');
	background-repeat:no-repeat;
	background-position:center center;
}


#tNavControl_rows {
	padding: 3px 5px;
}




#libraryViewerWrap {
	margin:10px 0 20px 0;
}

#libraryFilesTable {
	margin:0;
}


.infoBox {
	background:#f6f6f6;
	padding:10px 10px 5px 15px;
	border:1px solid #fcfcfc;
	width: 220px;
	float: left;
	margin:	10px 0px 0 0;
}

.settingsBox {
	float: left;
	padding:15px 10px 0px 0px;
	width:475px;
	margin:	0 50px 0 0;
}


.infoBox ul {
	margin: 0 0 20px 0;
}



div.wrap .infoBox h4 { font-size:14px; margin:0 0 10px 0; }

.mainTick {
	font-size: 14px;
}

.mainTick .label {
}


div.wrap p.infoLinks {
	margin: 0 0 0px 0;
	font-weight: 600;
	font-size:	13px;
}


div.underline {
	border-bottom:1px solid #ccc;
	margin-bottom: 20px;
}



.moreinfo {
	margin-bottom:20px;
}


.halfBox {
	float:left;
	width:430px;
}



.dSettingsTable {}
.dSettingsTable td {
	padding: 0px 10px 6px 0px;

}

.mainSettingsTable {}
.mainSettingsTable td {
	padding: 5px 10px 10px 10px;

}


.popoutSettingsTable {}
.popoutSettingsTable td {
	padding: 5px 10px 10px 0px;

}

.advancedSettingsTable {}
.advancedSettingsTable td {
	padding: 0px 15px 10px 0px;
}

.playerSettingsTable {}
.playerSettingsTable td {
	padding: 0px 15px 7px 0px;
}


div.wrap p.advancedP {
	font-size:15px;
	font-weight:500;
	margin-bottom:20px;
}

.padB {
	padding-bottom:15px;
}



.form-table td .notice p, 
.notice p, 
div.error p, 
div.updated p {
    margin: .5em 0;
    padding: 2px;
}



.psHeight {
	height: 30px;
}

.ps2Height {
	height: 50px;
}

.slimButton {
	background:#f7f7f7;
	padding:1px 12px 2px 10px;
	border: 1px solid #ccc;
	border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	-webkit-box-shadow: inset 0 1px 0 #fff,0 1px 0 rgba(0,0,0,.08);
    box-shadow: inset 0 1px 0 #fff,0 1px 0 rgba(0,0,0,.08);
	font-style: italic;
	font-size:13px;
	font-weight:600;
}



/* ----- */
@media screen and (max-width: 1250px) {
	.summary1 { float:none; position:relative; margin-right:0px; min-height:10px; }
	.summary2 { min-height:10px; }
	.summary3 { min-height:10px; }
}

@media screen and (max-width: 720px) {
	table.statsV { width: 400px; }
	table.statsV td { padding:10px 0 10px 0; }
	.columnUrl, .columnSpacer { display:none; }
	table.statsV th { padding:20px 0 20px 0; }
	.summary1 { width: auto; float:none; position:relative; }
	.summary2 { width: auto; float:none; position:relative; margin-right:0px; }
	.summary3 { width: auto; float:none; position:relative; }
}

@media screen and (max-width: 500px) {
	table.statsV { width: 300px; }
	.SVtitle { width:140px; }
	.SVcountp { width:80px; }
	.SVcountd { width:80px; }	
}

@media screen and (max-width: 400px) {
	table.statsV { width: 250px; }
	.SVtitle { width:130px; }
	.SVcountp { width:60px; }
	.SVcountd { width:60px; }
}



