/* Player.css */

html
{
	font-size : 16px;
}

body
{
	/*font-size : 12px;*/
	font-family : "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body, p, ul, ol, img
{
	padding : 0;
	margin : 0;
	-webkit-text-size-adjust:none;
}

img
{
	border : none;
}

/****************/
/***** Misc *****/
/****************/
@font-face {
    font-family: 'shareIcons';
    src: url('/v2/front/fonts/shareicons-webfont.eot');
    src: url('/v2/front/fonts/shareicons-webfont.eot?#iefix') format('embedded-opentype'),
         url('/v2/front/fonts/shareicons-webfont.woff') format('woff'),
         url('/v2/front/fonts/shareicons-webfont.ttf') format('truetype'),
         url('/v2/front/fonts/shareicons-webfont.svg#breezi_icon_setregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'playerIcons';
    src: url('/v2/front/fonts/playericons-webfont.eot');
    src: url('/v2/front/fonts/playericons-webfont.eot?#iefix') format('embedded-opentype'),
         url('/v2/front/fonts/playericons-webfont.woff') format('woff'),
         url('/v2/front/fonts/playericons-webfont.ttf') format('truetype'),
         url('/v2/front/fonts/playericons-webfont.svg#guifx_v2_transportsregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

.playerIcons
{
	font-family : "PlayerIcons";
}

.shareIcons
{
	font-family : "ShareIcons";
}

.invisible
{
	display: none;
}

.pointer
{
	cursor : pointer;
}

.loading
{
	background-color: rgb(191,191,191);
	width:450px;
	height:533px;
	margin: 0 auto;
}

.unavailable
{
	/*width : 600px;
	height : 710px;*/
	/*width      : 450px;
	height     : 450px;
	background : url('/v2/front/img/loading.jpg') no-repeat scroll center 0 / 100% 100%;
	margin     : 0 auto;*/
	
	background-color: rgb(191,191,191);
	width:450px;
	height:533px;
	position : relative;
	margin: 0 auto;
	overflow: hidden;
}

.unavailable .believeLogo
{
	position : absolute;
	bottom : 5px;
	right : 15px;
	width : 20%;
	height : auto;
}

.unavailable .unavailabilityText
{
	text-align  : center;
	margin-top  : 45%;
	font-size   : 3rem;
	color       : rgb(152,156,164);
}



/*****************/
/* Global Layout */
/*****************/
#mainContainer
{
	margin : 0 auto;
	
	/*width : 600px;
	height : 710px;*/
	width : 450px;
	height : 533px;
}

#audioContainer
{
	position   : absolute;
	width      : 1px;
	height     : 1px;
	visibility : hidden;
}

#playerContainer
{
	position         : relative;
	height           : 100%;
	border-width     : 2px;
	border-style     : solid;
	
	overflow         : hidden;
}

.playerItem
{
	position : absolute;
}
/*
#playerBackground
{
	height     : 110%;
	position   : absolute;
	width      : 100%;
	z-index    : -1;
}*/

/*****************/
/* Player header */
/*****************/
#playerHeader
{
	position         : relative;
	z-index          : 5;
	
	height           : 8.05%;
}

#playerTitle
{
	/* Commented 201-09-04 */
	/*padding-top : 0.8%;*/
	position: absolute;
	width : 90%;
	
	margin-left : 1.3%;
}

#playerTitle #player-albumName
{
	font-weight : 500;
	width : 88%;
	white-space : nowrap;
	overflow    : hidden;
	
	font-size   : 1.1rem;
	
}

#playerTitle #player-artistName
{
	padding-top: 1px;
	font-size: 0.9rem;
	/*margin-top : 3px;*/
}

#externalLinks
{
	text-transform : uppercase;
	display        : inline-block;
	
	font-size      : 0.8rem;
	padding        : 3px;
	margin-left    : 5px;
}

#externalLinks a
{
	text-decoration : none;
}



#showShare, #hideShare
{
	position    : absolute;
	
	right       : 1.5%;
	/*line-height : 49px;*/
}

#showShare
{
	font-size : 3rem;
	
	/*Commented 2014-09-04 */
	/*top       : 0;*/
}

/* Chrome spec */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
    #showShare
    {
    	/*Commented 2014-09-04 */
    	/*margin-top  : 1%;*/
    }
    
    #hideShare
    {
    	/*Commented 2014-09-04 */
    	/*margin-top  : 1%;*/
    }
    
}

#hideShare
{
	display   :none;
	
	font-size : 2.2rem;
	top       : 9%;
}

/***************/
/* Player home */
/***************/
#playerContent
{
	height   : 83.9%;
	position : relative;
	width    : 100%;
	z-index    : 4;
}

#playerHome
{
	position : absolute;
	width    : 100%;
}

#playerHome .buttonPlay
{
	overflow: hidden;
	margin                : 0 auto;
	
	width                 : 200px;
	height                : 200px;
	font-size             : 5em;
}

/* Chrome spec */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
    #playerHome .buttonPlay span
    {
    	margin-top  : 27%
    }
}

#playerContent-background
{
	position   : absolute;
	height     : 102%;
	width      : 102%;
}

#playerContent-background.login
{
	position   : relative;
	height     : 84.75%;
	width : 101.3%;
}

#playerContent-backgroundMask
{
	height  : 100%;
	width   : 100%;
	display : none;
}

/*****************/
/* Player footer */
/*****************/
#playerFooter
{
	position         : relative;
	z-index          : 10;
	height           : 8.05%;
}

#playerFooter a
{
	text-decoration : none;
	font-weight     : bold;
}

#playerFooter-container
{
	height:100%;
	/*text-align: center;*/
}

.leadDms {
	display        : inline-block;
	position       : relative;
	text-align     : center;
	vertical-align : middle;
	overflow       : hidden;
	
	margin-top     : 1.7%;
	width          : 21%;
}

.leadDms:first-child
{
	margin-left : 1%;
}

.leadDms img, .secondDms img
{
	width : 100%;
}

.showMoreDms
{
	position    : absolute;
	right       : 0%;
	overflow    : hidden;
	text-indent : -9999px;
	width       : 40px;
	height      : 40px;
	
	/*Commented 2014-09-04*/
	/*top         : 15%;*/
}

@media screen and (-webkit-min-device-pixel-ratio:0)
{
    .showMoreDms
	{
		/*Commented 2014-09-04*/
		/*font-size : 2.2rem;*/
	}
}

.dms-margin
{
	margin-right : 2%;
}

#playerDms
{
	padding-bottom: 5px;
}

.secondDms
{
	display        : inline-block;
	text-align     : center;
	vertical-align : middle;
	overflow       : hidden;
	
	margin         : 1% 1%;
	width          : 22%;
}

/*************/
/* Tracklist */
/*************/
#playerTracklist-container
{
	position    : relative;
	height      : 100%;
}

#playerTracklist
{
	width       : 100%;
	height      : 100%;
	margin-left : 101%;
}

#playerTracklist-top
{
	overflow: hidden;
}

#playerTracklist-top, #playerShare-top
{
	
	height : 40%;
}

#playerTracks ol li.noStream a
{
	cursor: not-allowed;
}

#playerCover
{
	float       : left;
	
	width       : 36%;
	margin-left : 2%;
	margin-top  : 1.8%;
}

#headDmsContainer
{
	display     : inline-block;
	text-align  : center;
	font-weight : 100;
	
	width       : 55%;
	padding-top : 9%;
	margin-left : 3%;
	font-size   : 1.95rem;
}

#headDmsContainer a
{
	color           : inherit;
	text-decoration : inherit;
}

#headDmsContainer .preorder
{
	font-size : 1.6rem;
}

#headDmsContainer img
{
	width : 90%;
}

#headDmsContainer img.itunes
{
	width : 75%;
	margin-top: 3%;
}

/* Controls */
#playerNav
{
	position : relative;
	height   : 20%;
}

#playerControls
{
	height     : 100%;
	width      : 27%;
	text-align : center;
	display    : inline-block;
}

#playerControls table
{
	width  : 80% !important;
	height : 100%;
	margin : 0 auto;
}

#playerControls .navButton
{
	/*float : left;*/
	
	/*margin-top: 16.5%;*/
	font-size : 1.4rem;
}





#playerControls .navButton.buttonPlayPause
{
	
	/*-webkit-margin-top: 11%;*/
	/*margin-top: 9%;*/
	font-size : 2.5rem;
	/*width : 30px;*/
}





/* Chrome spec */
/*@media screen and (-webkit-min-device-pixel-ratio:0)
{
    #playerControls .navButton.buttonPlayPause
	{
		margin-top: 11%;
	}
}*/

/*.navMargin
{
	margin-left: 7%
}

.navMarginFirst
{
	margin-left: 20.5%
}*/


#playerControls-details
{
	display        : inline-block;
	vertical-align : top;
	overflow       : hidden;
	white-space    : nowrap;
	
	width          : 50%;
	margin-left    : 5%;
	margin-top     : 2%;
}

#currentPlayingTrack
{
	font-weight : 200;
}

#currentPlayingTrack .trackNumber
{
	font-weight    : bold;
}

/* Progress bar */
#progressBar
{
	position : relative;
	width            : 85%;
	display          : inline-block;
	
	height           : 3px;
	margin-top       : 4%;
}

#progress
{
	height : 100%;
	width : 0;
}

#playTime
{
	display     : inline-block;
	font-weight : 200;
	
	margin-left : 3%;
}

/* Volume manager */
#volumeManager
{
	position : absolute;
	
	height   : 20%;
	right    : 2.5%;
	top      : 40%;
	width    : 14%;
}

#volumeBar
{
	overflow              : hidden;
	border-radius         : 7px;
	-moz-border-radius    : 7px;
	-webkit-border-radius : 7px;
	
	height                : 100%;
}

#volumeIndicator
{
	overflow : hidden;
	border-radius         : 7px;
	-moz-border-radius    : 7px;
	-webkit-border-radius : 7px;
	
	width : 50%;
	height : 100%;
}

#volumeItem
{
	/*width                 : 11px;*/
	height                : 100%;
	border-radius         : 7px;
	-moz-border-radius    : 7px;
	-webkit-border-radius : 7px;
	float                 :right;
}


/* Tracklist */
#playerTracklist-bot
{
	height : 60%;
}

#playerTracks {
	position   : relative;
	height     : 80%;
	overflow-x : hidden;
	overflow-y : auto;
}

#playerTracklist-bot ol
{
	list-style-type : none;
	overflow-y      : auto;
	overflow-x      : hidden;
}

#playerTracklist-bot ol li
{
	white-space: nowrap;
	padding : 0.8% 0;
}

#playerTracklist-bot ol li.noStream a, #playerTracklist-bot ol li.noStream:before
{
	opacity : 0.35;
}

#playerTracklist-bot ol li:before
{
	content      : "1";
	font-family  : PlayerIcons;
	
	margin-left  : 2%;
	margin-right : 1%;
}

#playerTracklist-bot ol li a
{
	text-decoration : none;
}

#playerCover img
{
	width : 100%;
}


/*********/
/* Share */
/*********/
#playerShare
{
	position   : absolute;
	height     : 100%;
	width      : 100%;
	margin-top : -115%;
	/*text-align : center;*/
}

#playerShare-top
{
	position : relative;
}

#playerShare-items
{
	display     : inline-block;
	
	width : 52%;
	margin-top  : 12%;
	margin-left : 4%;
}

#playerShare-items p
{
	font-weight : 1200;
	
	font-size   : 3rem;
}

#playerShare-itemContainer
{
	display : inline-block;
	margin-top: 1%;
	width:100%;
}

.playerShare-item
{
	display      : inline-block;
	margin-right : 1%;
	
	width : 12.5%;
}

.playerShare-item img
{
	height : 100%;
	width  : 100%;
}

#playerShare-bot
{
	margin-top    : 1.5%;
	margin-bottom : 0.5%;
	margin-left   : 3%;
}

#playerShare-bot p
{
	font-weight : 100;
	
	
	font-size   : 2.5rem;
}


#playerShare-embedDestination
{
	color : white;
	margin-bottom: 2%;
	margin-top: 1%;
}

#playerShare-embedWidth
{
	font-size : 1.1rem;
	vertical-align: middle;
}

#playerShare-embedWidth input[name=embedWidth]
{
	border         : none;
	/*padding        : 1.85%;*/
	vertical-align : middle;
	text-align : center;
	
	/*height : 100%;*/
	vertical-align: top;
}

#copyClipboard
{
	display        : block;
	text-align     : center;
	vertical-align : middle;
	
	line-height: 200%;
	
	width          : 96%;
	
	/* Commented 2014-09-04 */
	/*padding        : 1%; */
}

/*@media screen and (-webkit-min-device-pixel-ratio:0)
{
    #copyClipboard
    {
    	margin-bottom: 2px !important;
    }
}*/


#playerShare-textarea
{
	width : 95%;
	height : 100px;
	margin-top : 2%;
}

#playerShare-textarea textarea
{
	border      : none;
	font-family : inherit;
	width       : 100%;
	height      : 100%;
	resize      : none;
	font-size   : 1rem;
	
	padding     : 1%;
}

/*************/
/*** Login ***/
/*************/
#loginContainer
{
	margin-left : 1.3%;
	padding-top: 1%;
}

#passwordLabel
{
	/*vertical-align : bottom;*/
	
	font-size      : 1rem;
}

input[name="playerPassword"]
{
	border      : medium none;
	display     : inline-block;
	
	margin-left : 3%;
	padding     : 1%;
	width       : 30%;
}

input#submitPassword
{
	border         : medium none;
	display        : inline-block;
	font-size      : inherit;
	vertical-align : bottom;
	
	padding        : 0.4% 1.5% 0.34%;
	margin-left   : 1%;
}

/*** ERROR ***/
.playerDisabled
{
	margin-top : 40%;
	text-align: center;
	font-weight: 500;
	font-size: 2rem;
}

/*@media (max-width : 599px)
{
	html
	{
		font-size : 14px;
	}
	
	html
	{
		background: none !important;
	}
	
	#playerHome .buttonPlay
	{
		width : 180px;
		height : 180px;
	}
	
	.showMoreDms
	{
		width : 35px;
		height : 35px;
	}
	
	#showShare
	{
		top : 2%;
	}
	
	#hideShare
	{
		top : 10% !important;
	}
	
	#externalLinks
	{
		padding : 2px;
	}
	
	
	#playerControls .navButton.buttonPlayPause
	{
	    margin-top: 12%;
	}
	
	#playerControls-details
	{
		overflow: inherit;
	}
	
	#volumeManager
	{
		display : none;
	}
	
	#headDmsContainer
	{
		font-size: 1.75rem;
	}
	
	#headDmsContainer .preorder
	{
		font-size : 1.55rem;
	}
	
	#copyClipboard
	{
		display: none;
	}
	
	input#submitPassword
	{
		padding: 0.5% 1.5% 0.54%;
	}
}*/


