

/*
 * Generic css for whole popup box
 */
div.discojuice {
	font-family: Arial;
	
/*	font-size: small;*/
	z-index: 100;
	margin: 0;
	padding: 0;
	width: 500px;
	position: absolute;
	top: 30px;
	right: 10px;
	z-index: 150;

}

/*div.discojuice * {
	color: #000;
	background: none;
}*/

div.discojuice p {
	margin: 2px; padding: 0px;
}






div.discojuice form.discojuice_up {
	padding: 0px; 
	margin: 0px;
	font-family: Helvetica;
}
div.discojuice form.discojuice_up h2 {
	margin: 0px inherit 3px inherit;
}
div.discojuice form.discojuice_up  p{
		padding: 0px; margin: 0px;
}
div.discojuice form.discojuice_up label.discojuice_up {
	display: block;
	margin: 22px 5px 0px 0px;
	font-size: 160%;
	color: #444;

}
div.discojuice form.discojuice_up input.discojuice_up {
	width: 60%;
	font-size: 200%;
	border-radius: 6px;
	border: 1px solid #aaa;
	padding: 6px 20px;
	background: #fff;
	margin: 0px 5px 3px 0px;
}
div.discojuice form.discojuice_up input.submit {
	font-size: 105px ! important;
}


div.discojuice div.discojuice_page {
	
}

div.discojuice p#dj_help {
	cursor: pointer;
}



div.discojuice > div.top {

	background: #fff;
	border-bottom: 1px solid #bbb;
	
	-webkit-border-top-left-radius: 15px;
	-webkit-border-top-right-radius: 15px;
	-moz-border-radius-topleft: 15px;
	-moz-border-radius-topright: 15px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}

div.discojuice > div.discojuice_listContent {
	padding: 8px;
}
div.discojuice > div {

	background: #eee;
	border-bottom: 1px solid #bbb;
	
	padding: 8px 14px;
	margin: 0;
}

div.discojuice > div.bottom {
/*	background: url(../images/box-bottom.png) no-repeat 0% 100%;*/

	background: #f8f8f8;

	padding: 10px 17px;
	margin: 0;
		
	-webkit-border-bottom-right-radius: 15px;
	-webkit-border-bottom-left-radius: 15px;
	-moz-border-radius-bottomright: 15px;
	-moz-border-radius-bottomleft: 15px;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	
}

div.discojuice .discojuice_maintitle {
	font-size: 15px;
	font-family: Tahoma, Helvetica;
	font-weight: normal;
	color: #666;
}

div.discojuice .discojuice_subtitle {
	font-size: 12px;
	font-family: Tahoma, Helvetica;
	font-weight: normal;
	color: #888;
}

div.discojuice .discojuice_close {
	width: 62px;
	height: 29px;
	background: url(../images/close.png) no-repeat;
	text-decoration: none;
	float: right;
}

div.discojuice .discojuice_close:hover {
	background: url(../images/close-hover.png) no-repeat;
}


div.discojuice a {
	outline: none;
	color: #444;
	text-decoration: none;
}

div.discojuice a img {
	border: none;
	outline: none;
}

div.discojuice a.textlink:hover {
	color: #666;
	border-bottom: 1px solid #aaa;
}






/*
 * Section for the scroller
 */
div.discojuice .discojuice_listContent {
	overflow: auto;	
/*	max-height: 40%;	*/
	max-height: 450px;
}
div.discojuice div.scroller {
	padding:  1px 1px 10px 1px;
}
div.discojuice div.scroller img.logo {
	margin: 0px;
	float:  right;
}

div.discojuice div.scroller a {
	padding: 3px 6px;
	font-size: 100% ! important;
}
div.discojuice div.scroller a span {
/*	margin: 3px;*/
/*	display: block;*/
}
div.discojuice div.scroller a span.title {
	margin-right: .4em;
}
div.discojuice div.scroller a span.substring {
	font-size:  95%;
	color: #777;
}
div.discojuice div.scroller a span.distance {
	font-size:  90%;
	color: #aaa;
}

div.discojuice div.scroller a span.location {
	display: block;
}
div.discojuice div.scroller a span.country {
	font-size:  86%;
	color: #555;
	margin-right: 7px;
}
div.discojuice div.scroller a div.debug {
	font-size:  86%;
	color: #aaa;
}


div.discojuice div.scroller hr {
	margin: 0px;
	padding: 0px;
}


div.discojuice div.scroller.filtered a {
	display: none !important;
}

div.discojuice div.scroller.filtered a.present {
	display: inline-block !important;
}


div.discojuice div.loadingData {
	color: #aaa;
}



/*
 * Section for the filters
 */








/*
 * Section for the search box
 */
div.discojuice input.discojuice_search {
	width: 100%;
}













/*
 * ------ SECTION FOR THE IDP Buttons -----
 */


div.discojuice div.scroller a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

/* Generals */
div.discojuice div.scroller a {
	margin: -1px 2px 0px 0px;
	display:  block;

	border: 1px solid #cacaca;
/*	border-radius: 4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
*/	
	background-color: #f3f3f3;
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0.3, rgb(240,240,240)),
		color-stop(0.9, rgb(250,250,250))
	);
	background-image: -moz-linear-gradient(
		center bottom,
		rgb(220,220,220) 30%,
		rgb(240,240,240) 90%
	);
	background-image: -o-linear-gradient(
		bottom,
		rgb(220,220,220) 30%,
		rgb(240,240,240) 90%
	);

	/* Text */
	color: #333;
	text-shadow: 0 1px #fff;
	font-size:  135%;
	font-family:  "Arial Narrow", "Arial", sans-serif;
	text-decoration: none;
}

/* Shaddow effect for normal entries... */
div.discojuice div.scroller a  {
/*	box-shadow: inset 0 1px 3px #fff, inset 0 -15px #cbe6f2, 0 0 3px #8ec1da;*/
} 


/* Item that is hovered. */
div.discojuice div.scroller a:hover, div.discojuice div.scroller a.hothit:hover {
	background-color: #eee;
	border: 1px solid #aaa! important;
}
div.discojuice div.scroller a:hover {
	background-color: #fafafa;
	border: 1px solid #666;

/*
	-o-box-shadow: none;
	-webkit-box-shadow:none;
	-moz-box-shadow: none;
	color: #333;
	text-shadow: 0 1px #fff;
*/
}


/* Highlight the entry that is listed on top reccomended.
 * usually because the user has selected that item before.
 */
div.discojuice div.scroller a.hothit {
/*	border: 3px solid #ccc;*/
	border: 1px solid #aaa;
/*	background-color: #daebf3;*/
	color: #333;
	margin-bottom: 14px;
	
	border-radius: 4px;
	box-shadow: 0 0 5px  #ccc;
	-o-box-shadow: 0 0 5px  #ccc;
	-webkit-box-shadow: 0 0 5px  #ccc;
	-moz-box-shadow: 0 0 5px  #ccc;
	color: #333;
	text-shadow: 0 1px #fff;
}

div.discojuice div.scroller a.disabled span.title {
	color: #999 !important;
}
div.discojuice div.scroller a.disabled span.location {
	color: #999 !important;
}




/*
 * ------ END OF ---- SECTION FOR THE IDP Buttons -----
 */
















div.discojuice a#moreoptions, a.discojuice_what {
	padding-left: 12px;
	background: url(../images/arrow.png) no-repeat 0px 3px;
}

div.discojuice .discojuice_whatisthis.show a.discojuice_what {
	background: url(../images/arrow-r.png) no-repeat 0px 5px;
}

div.discojuice p.moretext {
	margin-top: 0;
	color: #777;
}

div.discojuice div.discojuice_whatisthis {
	margin-bottom: 10px;
}

div.discojuice .discojuice_whattext {
	display: none;
	margin-top: 1px;
	margin-left: 12px;
	margin-bottom: 0;
	padding: 0;
	font-size: 11px;
	color: #555;
}

div.discojuice .discojuice_whatisthis.show .discojuice_whattext {
	display: block;
}




/*
 * Overlay grey out background
 */

div#discojuice_overlay {
    background-color: black;
    filter:alpha(opacity=50); /* IE */
    opacity: 0.5; /* Safari, Opera */
    -moz-opacity:0.50; /* FireFox */
    z-index: 20;
    height: 100%;
    width: 100%;
    background-repeat:no-repeat;
    background-position:center;
    position:absolute;
    top: 0px;
    left: 0px;
}




