/**
 @ css/empty.css
 @ css/gl2.css
*/
body {background-color:#000;width:100%;}
div input {display:none}

@font-face {
  font-family: 'Electrolize';
  font-style: normal;
  font-weight: 400;
  src: local('Electrolize'), local('Electrolize-Regular'), url(http://themes.googleusercontent.com/static/fonts/electrolize/v2/DDy9sgU2U7S4xAwH5thnJ4bN6UDyHWBl620a-IRfuBk.woff) format('woff');
}

@font-face {
  font-family: 'Wire One';
  font-style: normal;
  font-weight: 400;
  src: local('Wire One'), local('WireOne'), url(http://themes.googleusercontent.com/static/fonts/wireone/v3/fas9dl2wmMkt5rCu-aBez_esZW2xOQ-xsNqO47m55DA.woff) format('woff');
}

	body {
		height: 100%;
		overflow: hidden;
		width: 100%;
	}
	body.sleeping {
		cursor:none;
	}

	* {
		font-family:"Electrolize";
		-webkit-transition: all .5s ease-in-out;
		-moz-transition: all .5s ease-in-out;
		-o-transition: all .5s ease-in-out;
		-ms-transition: all .5s ease-in-out;
		transition: all .5s ease-in-out;
	}
	h1 {
		font-size:15px;
		color	: rgba(255,255,255,.8);
		margin:0;
		margin-right:3px;
		float:left;
	}
	h2 {
		font-size:20px;
		/*font-weight:bold;*/
		position:absolute;
		top 	: 70%;
		left 	: 40%;
		color	: rgba(255,255,255,.2);
	}
	h3 {
		color: rgba(200, 200, 200, 1);
		font-size: 16px;
		letter-spacing: 3px;
		text-shadow: 0 0 10px rgba(252, 240, 210, 1);
		margin-top: 6px
	}
	.splash {
		width:100%;
		height:100%;
		margin:0;
		padding:0;
		margin-top:10%;
		text-align:center;
		color   : rgba(255,255,255,.2);
	}
	.splash * { font-family: 'Electrolize';}
	.subLegend {
		width:720px;
		margin:auto
	}
	.subLegend p {
		text-align:left;
		margin-top:-12px;
		color:rgba(255,255,255,.6);
	}
	.subLegend p.loader {
		margin-top:100px;
		color:rgba(255,255,255,.4);
	}
	.right {float:right !important;}
	.modal {
		padding:5px;
		margin:5px;
		border-radius : 4px;
		background-color:rgba(15,15,15,.5);
		opacity:.4;
		position:fixed;
		color:rgba(200,200,200,.8);
		box-shadow : 0 0 10px rgba(250, 240, 210, 0.2)
	}
	.modal p , .panelMain p {
		font-size : 12px;
		line-height: 13px;
		margin: 1px;
		padding: 0;
	}
	.modal p:hover{
		background-color:rgba(41,171,226,.2);
	}
	.panel p.selected,.modal p.selected{
		background-color:rgba(41,171,226,.6);
		color:#000
	}
	.modal strong {
		color : rgba(250, 250, 250, .8);
	}
	.playlist.modal p {width:400px;}
	.stats * {opacity:.2}
	.stats:hover * {opacity:1}
	.modal:hover {opacity:.7;}
	#credits {
		width:200px;
		top:2px;
		right:2px;
		font-size:10px;
	}
	#dialog {
		bottom:10px;
		right:45%;
		font-size:12px;
	}
	a {
		color:rgba(200,200,200,.8);
	}
	#item {font-size:14px}
	#item .loaded {
		color:#29abe2;
		float: right;
		margin-left:10px;
		text-shadow: 1px 1px 10px #29abe2;
	}

	#item .loading {
		color:orange;
		float: right;
		margin-left:10px;
		text-shadow: 1px 1px 10px orange;

		-webkit-animation-name:loading;
		-webkit-animation-duration:.5s;
		-webkit-animation-iteration-count:infinite;
		-webkit-animation-direction:linear;

		-moz-animation-name:loading;
		-moz-animation-duration:.5s;
		-moz-animation-iteration-count:infinite;
		-moz-animation-direction:linear;
	 }

	@-webkit-keyframes loading{
		0%{opacity:.2;-webkit-transform: scale(1)}
		50%{opacity:.5;-webkit-transform: scale(.9)}
		100%{opacity:1;-webkit-transform: scale(.8)}
	}

	@-moz-keyframes loading{
		0%{opacity:.2;-moz-transform: scale(1)}
		50%{opacity:.5;-moz-transform: scale(.9)}
		100%{opacity:1;-moz-transform: scale(.8)}
	}


	.credits {
		width : 100%;
		font-size : 12px;
		left:600px;
		height: 180px;
		margin-top: 10px;
	 }

	.irc {
		width: 430px;
		position: absolute;
		bottom: 100px;
		}

	.performance {
		width	   : 430px;
		right	   : 20px;
		height	  : 190px;
	 }

	.fullscreen {
		width	   : 32px;
		right	   : 10px;
		height	  : 31px;
		cursor	  : pointer
	 }
	.fullscreen.contextualTop { bottom : 0px;}

	.lineInToggle {
		width: 26px;
		right: 65px;
		padding-left: 7px;
		height: 31px;
		cursor: pointer;
	 }
	.lineInToggle.contextualTop { bottom : 0px;}

	.nextPreset {
		width: 26px;
		right: 165px;
		padding-left: 7px;
		height: 31px;
		cursor: pointer;
	 }
	.nextPreset.contextualTop { bottom : 0px;}

	.nextMusic {
		width: 26px;
		right: 115px;
		padding-left: 7px;
		height: 31px;
		cursor: pointer;
	 }
	.nextMusic.contextualTop { bottom : 0px;}

	.playlist .dial p {display: inline}
	.playlist .dial input {display:none}/* I'll have to correct that shit ...*/
	.playlist .dial {margin-right:20px}

	.playlist.contextual {
		bottom: 50px;
		width : 240px;
		font-size : 12px;
		left : -190px
	}
	.controls {
		top   : 40px;
		font-size : 12px;
	}
	.presets {
	}
	.presets .col {
	float: right;
	display: block;
	width: 100px;
	}
	.myPresets {
		top   : 310px;
		font-size : 12px;
		text-align: right;
	}
	.controls, .controls * {
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}
	.controls .control p {
		font-size: 10px;
	}
	.controls.contextual {
		right:-484px;
	}
	.contextual {
		opacity : .5;
	}
	.contextual:hover, .showIt {
		opacity : .9;
	}
	.contextualRight {
		right:-150px;
	}
	.contextualRight:hover {
		right:0px;
	}
	.contextualTop {
		bottom:-150px;
	}
	.contextualTop:hover {
		bottom:10px;
	}
	.contextualLeft {
		left:-80px;
	}
	.presets.contextualLeft{left:-200px}
	.contextualLeft:hover {
		left:0px;
	}
	.playlist p:hover,.presets p:hover,.myPresets p:hover {
		cursor:pointer;
		color:rgba(255,255,255,1);
		background-color: rgba(41, 171, 226, 0.25);
	}
	.container {
		height:auto;
		overflow:hidden;
		position:relative;
/*		box-shadow: 0px 0px 100px rgba(41, 171, 226, 0.5) inset;*/
		box-shadow: 0px 0px 100px rgba(41, 171, 226, 0.25) inset,2px -5px 10px rgba(41, 171, 255, 0.25) inset;
		border: 1px solid rgba(41, 171, 226, 0.45);
		border-radius: 4px;
		margin-right: 12px;
	}
	.playlist .container {
		height:400px;
	}
	.presets .container,.myPresets .container {
		height:400px;
		text-align: right;

	}

	.tips {
		text-align: center;
	}

	.tips p  { font-size:16px; line-height:18px}
	.control {
		float:left;
		padding:4px;
		text-align: center;
		width: 50px;
	}
	.control.xy canvas {
		border: 1px dashed rgba(200,200,200,.1)
	}
	.control input {display:inline;opacity:.5}
	.control fieldset input {display:none;}
	.hr {width:100%;float:left;height:1px;background-color:rgba(200,200,200,.2)}
	.dialog {
		top:20%;
		left:30%;
		width:40%;
	}
	.dialog input {
			display: inline-block;
			background-color: rgba(100, 100, 100, .3);
			border: 1px dotted rgba(200, 200, 200, .5);
			font-size: 21px;
			color: rgba(250, 250, 250, 1);
			padding: 4px;
		}
	a.button {
		background-color : rgba(41, 171, 226, .3);
		border-radius : 4px;
		padding:4px;
		margin:4px;
		cursor:pointer;
		float : right;
	}
	a.button:hover{
		background-color : rgba(41, 171, 226, 1);
		color: #fff;
	}
	p.sourcecode,p.notice {
	   line-height: 10px;
	}
	.legend {
		float : left;
	}
	.miniLogo {
	   position: relative;
/*		top: -18px;*/
		width:430px;
		margin-bottom: -75px;
	}

	.followMe {
		display: block;
		margin: 5px;
		text-decoration: none;
	}
	.followMe img { float: left;margin-right: 4px; }
	.followMe p { line-height:12px }
	.followMe p:hover { background-color:transparent; }
	.credits:hover .followMe {opacity:1}
	p.multi {
		float: left;
		line-height: 12px;
		margin: 2px;
		padding: 4px;
		border-radius: 4px;
		cursor: pointer;
		width: auto;
		background-color: rgba(41, 171, 226, 0.1);
		box-shadow: 0px 0px 7px rgba(41, 171, 226, 0.5) inset;
		text-align: center;
	}
	p.multi:hover {
		color:rgba(250,250,250,1);
		background-color : rgba(41, 171, 226, .6);
	}
	p.multi.selected {
		color:rgba(250,250,250,.9);
		background-color : rgba(41, 171, 226, .4);
	}
	p.multi.unfloat {float : none;}
	div.legT {
		background-color: #040404;
		border: 1px solid rgba(200, 200, 200, 0.2);
		border-radius: 4px 4px 4px 4px;
		float: right;
		font-size: 9px;
		padding: 2px;
		position: relative;
		top: -9px;
		box-shadow: 0px 0px 2px rgba(41, 171, 226,.25);
		color:rgba(200,200,200,.5)
	}
	div.legT:hover {
		color:rgba(200,200,200,1);
		box-shadow: 2px 2px 4px rgba(41, 171, 226, 0.6),0px 0px 2px rgb(41, 171, 226);
	}
	.socials
	{
		margin-top: 10px;
		float: right;
		position: absolute;
		bottom: 10px;
		right: 55px;
	}
	img.social {
		height:32px;
		cursor:pointer;
	}
	img.social:hover {
		background-color:rgba(100,100,100,.5);
		border-radius:6px;
	}
	img.social.facebook:hover {
		background-color:#3b5998
	}
	img.social.twitter:hover {
		background-color:#35aedd
	}
	img.social.google:hover {
		background-color:#c93d2e
	}
	img.actIcon { float:left;display:none;padding-left:2px;}
	.selected img.actIcon {display:inline;}

div.duration {
	margin-top: -15px;
	font-size: 12px;
	position: absolute;
}

.totalTime {
	right: 8px;
	margin-top: -15px;
}
img.musicControl {
	padding-right: 15px;
	cursor: pointer;
	opacity: .3;
}

img.musicControl:hover {
	   opacity:1;
   }

   .showIt, .slow {
	-webkit-transition: all 2s ease-in-out;
	-moz-transition: all 2s ease-in-out;
	-o-transition: all 2s ease-in-out;
	-ms-transition: all 2s ease-in-out;
	transition: all 2s ease-in-out;
}
	.titleZone{
		position:fixed;
		text-align: center;
		width:100%;
		top: 20px;
		z-index:99;
	}
	h4 {
		font-family:"Wire One";
		font-weight:normal;
		font-size: 55px;
		color: rgba(250, 250, 250, .8);
		text-shadow: 0px 0px 17px rgba(255, 255, 255, .8),0px 0px 1px black;
		opacity:0;
		-webkit-transform: scale(0,0);
		-moz-transform: scale(0,0);
		z-index: 99;
		}
	h4.sub {
		top:5px;
		left:490px;
		font-size: 30px;
		position:fixed;
		color: rgba(250, 250, 250, .6);
		width:100%;
		text-align:left;
	}
	h4.enter {
		-webkit-transform: scale(1,1);
		-moz-transform: scale(1,1);
		opacity:1;
	}
	h4.leave {
		-webkit-transform: scale(1,0);
		-moz-transform: scale(1,0);
		opacity:0;
	}
	.main {position:fixed;top:0px;}
	.autoContainer {
		max-height: 80px;
		overflow: hidden;
		display: inline-block;
		-webkit-transition: none;
		-moz-transition: none;
		-o-transition: none;
		-ms-transition: none;
		transition: none;
		width:100%;
	}
	.autoContainer:hover {
		max-height:none;
	}
	.autoContainer .control input {display:none;}
	.autoContainer:hover .control input {display:inline;opacity:.5}
.loadingDiv{width:150px;margin:20px;bottom:15%;left:45%;position:absolute;}

.loadingDiv div {
	background-color:rgba(252,239,214,1);
	float:left;
	height:16px;
	margin-left:17px;
	width:16px;
	-webkit-animation-name:load;
	-webkit-animation-duration:.5s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-direction:linear;
	-moz-animation-name:load;
	-moz-animation-duration:.5s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-direction:linear;
	opacity:1;
	border-radius:5px 10px 5px 10px / 10px 5px 10px 5px;
	box-shadow:0px 0px 20px rgba(252,239,214,5),0px 0px 10px rgba(252,239,214,1),0px 0px 2px #000 inset;
}


.l1{
	-webkit-animation-delay:0.3s;
	-moz-animation-delay:0.3s;
}

.l2{
	-webkit-animation-delay:0.7s;
	-moz-animation-delay:0.7s;
}

.l3{
	-webkit-animation-delay:0.9s;
	-moz-animation-delay:0.9s;
}

@-webkit-keyframes load{
	0%{-webkit-transform: scale(.6) rotate(-90deg);}
	50%{-webkit-transform: scale(.3) rotate(0deg);}
	100%{-webkit-transform: scale(.6) rotate(45deg);}
}

@-moz-keyframes load{
	0%{-moz-transform: scale(.6) rotate(-90deg);}
	50%{-moz-transform: scale(.3) rotate(0deg);}
	100%{-moz-transform: scale(.6) rotate(45deg);}
}

/*{ width: 520px; clear: both; margin: 20px 0 10px; }*/
.viewport { height: 200px; overflow: hidden; position: relative; }
.overview { list-style: none; position: absolute; left: 0; top: 0;width: 100%; }
/*.thumb .end,.thumb { background-color: #003D5D; }*/
.scrollbar { position: relative; float: right; width: 0px; margin:0 8px;}
.track { background-color: rgba(100,100,100,.4); height: 100%; width:1px; position: relative; padding: 0 1px;border-radius: 2px 2px 2px 2px;}
.thumb {
	background-color: rgba(255, 255, 255, 0.8);
	border-radius: 4px 4px 4px 4px;
	cursor: pointer;
	height: 20px;
	overflow: hidden;
	position: absolute;
	top: 0;
	width: 7px;
	margin-left: -3px;
	}
.thumb:hover {box-shadow:0px 0px 4px rgba(255,255,255,1);}
.thumb .end { overflow: hidden; height: 5px; width: 13px; }
.disable { display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }
h5{margin:2px}
.autoSlide {overflow:hidden}
.autoSlide .slide { height : 0px;margin:0;padding:0;overflow:hidden}
.autoSlide:hover .slide { height : 120px;margin:auto;padding:auto}
.slide p {margin:0;padding:0;line-height:12px}
.musicControls {
    text-align:center;
}
.gExp {
	display: block;
	width: 50px;
	border: 2px solid rgba(255, 255, 255, 0.2);
	padding: 4px;
	font-size: 10px;
	border-radius: 4px;
	cursor: pointer;
	background-color: rgba(0, 0, 0, 0.5);
	color: rgba(255, 255, 255, 0.2);
	text-decoration: none;
	float: left;
	margin-right: 4px;
}
.gExp:hover {
	background-color: rgba(0, 0, 0, .8);
	color: rgba(255, 255, 255, .4);
}
/*.fb-like {float: right;margin-top: -145px;opacity:0;}*/
.modal.credits:hover .fb-like {float: right;margin-top: -145px;opacity:1;}

#log {
	margin-bottom: 30px;
	}
#log .line .destination { display:none;}
#log .line .source { color:rgba(41, 171, 226, .4);padding-right:5px;}
#log .line.self { opacity:.5;}
#log .line.system .source{ color:orange;}
#log .line .message { }
.irc input#msg {
	position: absolute;
	right: 4px;
	width: 300px;
	display: inline-block;
	background-color: rgba(100, 100, 100, 0.3);
	border: 1px dotted rgba(200, 200, 200, 0.5);
	font-size: 12px;
	color: rgb(250, 250, 250);
	padding: 1px;
	margin-top: 8px;
	opacity: .3;
}
.irc input#msg:hover {opacity : 1;}
.nick {
	font-size: 13px;
	position: absolute;
	color: rgba(41, 171, 226, 0.4);
	cursor: pointer;
	margin-top: 10px;
}
.control canvas {opacity : .5;}
.control:hover canvas {opacity : 1;}
.perfGraph {
	float:left;
	background-color: rgba(0,0,0,.2);
}
.perfGraph span {
	background-color: rgba(41, 171, 226, .7);
	display:inline-block;
	position:relative;
	bottom: 0px;
}
.particlesNumber.perfGraph {}
.particlesNumber.perfGraph span {
	background-color: rgba(171,226, 41, .3);
}

.avgFrames span {
	background-color: rgba(241,100,255, .2);
}

.fps.perfGraph span.alert {
	background-color: rgba(226,41, 41, .7);
}
.statsInfo {font-size:14px;}
.statsInfo span {color:rgba(41, 171, 226, 1);}
.icons {
	opacity: .6;
float: left;
margin-right: 4px;
margin-left: -3px;
margin-top: 8px;
}

.webapps * {
	font-size:10px;
}
.webapps {
	border-radius: 4px;
	margin: 2px;
	padding: 2px;
	text-align: left;
}
.webapps .legend {
	display:inline-block;
	width:90px;
}
.webapp {
	width: 50px;
	float: left;
	margin: 2px;
	opacity: .5;
}
.webapp:hover {
	opacity:1;
}

.webapp a {
	width:32px;
	display:block;
	text-align:center;
}

.itemContainer {
	float:left;
}
.itemContainer>div {
	display: block;
	width: 20px;
	border: 1px solid;
	text-align: center;
	border-radius: 4px;
	height: 14px;
	float: left;
	margin-right: 4px;
	cursor:pointer;
}
.itemContainer>div:hover {
	border: 1px solid rgba(41, 171, 226, 1);
}
.itemContainer>div.selected{
	background-color: rgba(200, 200, 200, .2);
}

/*a.savePresets {margin-top:-45px}*/

.bloc {
	display : inline-block;
	width   : 100%;
}

/**
 *	 Panel system :
 */
.panel {
	padding:5px;
	margin:5px;
	border-radius : 4px;
/*	background-color:rgba(15,15,15,.5);*/
	opacity:.7;
	position:fixed;
	color:rgba(200,200,200,.8);
/*	box-shadow : 0 0 10px rgba(250, 240, 210, 0.2);*/
	height: 97%;
	width: 480px;
}

.panelMain, .panelTab {
	background-color:rgba(15,15,15,.5);
}

.panel.hover {
	opacity: 1;
    z-index: 100
}

.panelLeft .panelMain, .panelRight .panelMain {
	border:1px solid rgba(255,255,255,.1);
}

.panelLeft .panelMain {
	border-right:0;
	border-radius : 4px 0px 0px 4px
}

.panelRight .panelMain {
	border-left: 0;
	border-radius: 0px 4px 4px 0px;
	top: 5px;
	position: absolute;
}

.panelLeft { margin-left: -449px }
.panelLeft.hover { margin-left: -7px }
.panelRight { right:-488px }
.panelRight.hover { right: -50px }

.panelMain {
	width:430px;
	height:100%;
	float: left;
	padding: 4px;
	overflow:hidden
}
.panelTab {
	cursor: pointer;
	width: 29px;
	background-color: rgba(50, 50, 50, 0.8);
	word-wrap: break-word;
	margin-bottom: 4px;
	text-align: center;
	letter-spacing: 17px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	opacity: .4;
	overflow: hidden;
	padding-left: 10px;
	line-height: 13px;
}
.panelTab.active {
	background-color:rgba(15,15,15,.5);
	opacity:1
}
.panelLeft .panelTab {
	border-left:0;
	float:right;
	border-radius: 0 4px 10px 0;
}
.panelRight .panelTab {
	border-right: 0;
	border-radius: 4px 0px 0 10px;
	margin-left: -41px;
}
.panelTab img {
	margin-bottom: 10px;
	margin-left: 0px;
}

	/** debug the panel ? : */
	body.sleeping .modal , body.sleeping .panel { opacity:0 }

.fb_edge_widget_with_comment {
	position: absolute !important;
	right: 53px;
	top: 20px;
}
.aboutBox {
	display: inline-block;
	width: 98%;
	background-color: rgba(41, 171, 226, 0.1);
	border-radius: 4px;
	margin-top: 10px;
	padding: 4px;
}

.searchbox {
	display: inline-block;
	background-color: rgba(100, 100, 100, 0.3);
	border: 1px dotted rgba(200, 200, 200, 0.5);
	font-size: 12px;
	color: rgb(250, 250, 250);
	padding: 4px;
	width:95%;
}
.artwork {
	width:64px;
	padding-right:2px;
	float:left;
	border-radius: 6px;
}
.waveform {
	width:344px;
	height:32px;
	/*border:1px solid rgba(41, 171, 226, 0.7);*/
	background-color:rgba(214, 84, 29, 0.7);
	opacity:.5;
	-webkit-filter: invert(1);
	-moz-filter: invert(1);
	filter: invert(1);
	border-radius: 6px;
}

.timelineBox .waveform {
	width:415px;
	height:64px;
}
p.soundCloudTrack:hover .waveform {opacity:.95;}
p.soundCloudTrack {
	clear: both;
	padding-bottom:3px;
}

/*.main canvas {display:none;}*/

.playingPanel .control {
	padding:4px;
	width: 70px;
}
.albumArt {
	max-height:100px;
	max-width:100px;
	float:left;
	border-radius: 6px;
	margin-right: 2px;
}
.albumInfo {
}

/*.albumInfo .waveform { width:320px; height:64px; }*/

.timeline {
	left: 100px;
	bottom: 32px;
	width: 415px;
	height: 64px;
	overflow: hidden;
	cursor: pointer;
	border-radius: 10px;
	margin-left: 2px;
	box-shadow: 0px 0px 7px rgba(41, 171, 226, 0.3),-4px 2px 5px rgba(0, 0, 0, 0.7) inset;
}

.timeline.reduced .waveform {display:none;}
.timeline.reduced ,.timeline.reduced * {height:16px;}

.myMusic .timeline {
	height:24px;
	background-color: rgba(41, 171, 226, 0.1);
	margin-left: 2px;
}
.soundCloud .timeline {
	bottom: 0px;
}

.soundCloud * {
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	-ms-transition: none;
	transition: none;
}

.timeblock {
	position: absolute;
	left: 10px;
	top: 18px;
	height: 64px;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	-ms-transition: none;
	transition: none;
	cursor:pointer;
    border-radius: 10px;
}
.timeblock.buffured { background-color: rgba(41, 171, 226, 0.1) }
.timeblock.played { background-color: rgba(41, 171, 226, 0.2) }

.trackTitle {
	position: absolute;
	top: -35px;
	width: 340px;
	left: 0px;
	overflow: hidden;
	font-size: 24px;
	height: 24px;
	font-family: wire one;
}
.userArt {
	width:32px;
	border-radius: 4px;
	cursor:pointer;
}
.scTags div {
	display: inline-block;
	max-width: 50px;
	font-size: 9px;
	height: 9px;
	color: rgb(0, 0, 0);
	background-color: rgba(41, 171, 226, 0.3);
	border-radius: 4px;
	overflow: hidden;
	margin-left: 2px;
	padding: 2px;
	text-align: center;
}
.scTags:hover div {
	background-color:rgba(41, 171, 226, .5);
}
.scTags div:hover {
	background-color:rgba(41, 171, 226, 1);
}

.playing {
	display:none;
}
.playing .mainPicture
{
	max-width:250px;
	border-radius: 6px;
}

.playing .pictures {
	float: right;
	width: 165px;
	top: 0px;
}

.playing .pictures img {
	max-width: 32px;
	max-height: 32px;
	float: right;
	margin: 2px;
}

.playing .title {
	font-size: 32px;
	font-family: wire one;
	background-color: rgba(2, 2, 2, 0.5);
	border-radius: 4px;
	padding: 6px;
	text-align: center;
}

.playing .artist {
	text-align: right;
	padding-bottom: 4px;
	font-family: wire one;
	font-size: 18px;
}

.playing .album {
	font-family: wire one;
	font-size: 22px;
	text-align: center
}

.playing .description {
	font-size: 10px;
	background-color: rgba(10, 10, 10, 0.3);
	color: rgba(255, 255, 255, 0.4);
	margin: 3px;
	border-radius: 2px;
	max-height: 200px;
	overflow: hidden;
}

.viewArt {
	left: 500px;
	top: 20px;
	position: absolute;
	opacity:0;
	border-radius : 6px;
	box-shadow: 0px 0px 150px rgba(41, 171, 226, 0.8);
}

.viewArt.show {
	opacity:1;
}

.splashVideo {
	position: fixed;
	width: 780px;
	display: inline;
	top: 40px;
	left: 30%;
}
/*for performances :*/
.scrollbar *,.scrollbar, .viewport, .contained, .contained * { transition : none; }