.tile-text{
	background-color: black;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.tile-text>p{
	color: #878787;
	font-size: 2rem;
}

.adc-hide{
	display: none;
}

.adc-hide-tmp{
	
}

.adc-hide-leaf{
	display: none !important;
}

#easter-text-content{
	color: white;
	display: table-cell;
	vertical-align: middle;
	padding: 2em 2em;
}

#easter-text-container{
	display: flex;
	align-items: center;
}

#easter-text-container-out{
	display: flex;
	align-items: center;
}

#easter-video-preview img{
	width: 100%;
	height: 100%;
}

.tile-folder-leaf{ opacity: 0.7; }
.tile-folder-leaf:hover{ opacity: 1; }

.easter-video-container{ }
.easter-video-info{ display: table; color: white;}
.easter-video-info>div{ display: table-cell; vertical-align: middle; padding: 0px 1.5em; }
.easter-video-info p.easter-video-title{ text-transform: uppercase; }
.easter-video-info p.easter-video-duration{ color: #cecece; }
.easter-video-info .easter-video-play{ position: absolute; right: 0; top: 0; bottom: 0; margin: auto; }
.easter-video-info .easter-video-play>img {width: 32px; position: absolute; top: 0; bottom: 0; margin: auto; right: 1.5em;}

.easter-track-container{ }
.easter-track-preview img{ width: 100%; height: auto; }
.easter-track-info{ display: table; color: white;}
.easter-track-info>div{ display: table-cell; vertical-align: middle; padding: 0px 1.5em; }
.easter-track-info p.easter-track-title{ text-transform: uppercase; }
.easter-track-info p.easter-track-duration{ color: #cecece; }
.easter-track-info .easter-track-play{ position: absolute; right: 0; top: 0; bottom: 0; margin: auto; }
.easter-track-info .easter-track-play>img {width: 32px; position: absolute; top: 0; bottom: 0; margin: auto; right: 1.5em;}

/*========================
Arrow classes
========================*/
#arrow-wrapper{ width:15%; height:15%; position: absolute; bottom:0%; right: 2%;  z-index:10; cursor: pointer; opacity: 0; /*border-radius: 50%; border:2px solid #5f5f5f;*/}
	.arrow-wrap{  position: absolute; top:0; bottom: 0; left:0; right: 0;  }
	#arrow-bg{ width:100%; height: 100%; position: absolute; z-index: 1; }
	#arrow-bg img{ width:100%; height:auto; display: none; }

	.arrow{
		position: absolute;
		width: 50%;
		height: 50%;
			/*border:1px solid white;*/
			-webkit-animation-fill-mode:both;
						-moz-animation-fill-mode:both;
						-o-animation-fill-mode:both;
	}

	.arrow img{ display:block; width: 100%; height: auto; }

	#l-arrow{    
		left: 25%;
		top:0%;
		transform-origin: 50% 100%;
		transform: rotateZ(-90deg) translateZ(0) scale(1.0, 1.0);  
		backface-visibility: hidden;
		-webkit-backface-visibility: hidden;
	}

	#l-arrow.mid{
		animation: rotateLMid 1.2s linear;
		-webkit-animation: rotateLMid 1.2s linear;
		-webkit-animation-fill-mode:both;
		-moz-animation-fill-mode:both;
		-o-animation-fill-mode:both;
	}



	#r-arrow{
		left: 25%;
		top:0%;
		transform-origin: 50% 100%;
		transform: rotateZ(90deg) ;
		backface-visibility: hidden;
		-webkit-backface-visibility: hidden;       
	}

	#l-arrow-b, #r-arrow-b{
		display: none;
	}

	
	#l-arrow-b{
		top:50%;
		transform: translateZ(0) scale(1.0, 1.0);
		backface-visibility: hidden;
		-webkit-backface-visibility: hidden;
	}

	#r-arrow-b{
		left:50%;
		transform-origin: 50% 50%;
		transform: translateZ(0) scale(1.0, 1.0);
		backface-visibility: hidden;
		-webkit-backface-visibility: hidden;
	}

	#r-arrow.mid{
		animation: rotateRMid 1.2s linear;
		-webkit-animation: rotateRMid 1.2s linear;
		-webkit-animation-fill-mode:both;
		-moz-animation-fill-mode:both;
		-o-animation-fill-mode:both;

		transform: translateZ(0) scale(1.0, 1.0);
	}

	#l-arrow-b.maxi{

		animation: rotateLMaxi 1s linear;
		-webkit-animation: rotateLMaxi 1s  linear;

		-webkit-animation-fill-mode:both;
		-moz-animation-fill-mode:both;
		-o-animation-fill-mode:both;

		transform: translateZ(0) scale(1.0, 1.0);

	}

	#r-arrow-b.maxi{

		animation: rotateRMaxi 1s linear;
		-webkit-animation: rotateRMaxi 1s  linear;

		-webkit-animation-fill-mode:both;
		-moz-animation-fill-mode:both;
		-o-animation-fill-mode:both;
		transform: translateZ(0) scale(1.0, 1.0);

	}

	#r-arrow-b.mini{
		animation: rotateRMini 0.5s linear;
		-webkit-animation: rotateRMini 0.5s  linear;

		-webkit-animation-fill-mode:both;
		-moz-animation-fill-mode:both;
		-o-animation-fill-mode:both;

		transform: translateZ(0) scale(1.0, 1.0);

	}

	#l-arrow-b.mini{

		animation: rotateLMini 0.5s linear;
		-webkit-animation: rotateLMini 0.5s  linear;

		-webkit-animation-fill-mode:both;
		-moz-animation-fill-mode:both;
		-o-animation-fill-mode:both;

		transform: translateZ(0) scale(1.0, 1.0);
	}





	@keyframes rotateRMid {
			0% { transform: rotateZ(90deg);    }
			100% { transform: rotateZ(45deg) ;   }
	}

	@-webkit-keyframes rotateRMid {
			0% { transform: rotateZ(90deg);    }
			100% { transform: rotateZ(45deg) ;  }
	}

	@keyframes rotateLMid {
			0% { transform: rotateZ(-90deg);    }
			100% { transform: rotateZ(-135deg) ;   }
	}

	@-webkit-keyframes rotateLMid {
			0% { transform: rotateZ(-90deg);    }
			100% { transform: rotateZ(-135deg) ;  }
	}

	@keyframes rotateLMaxi {
			0% {  transform: rotateZ(0deg);    }
			100% {  transform:  translateX(50%) translateY(-50%)  rotateZ(180deg) ; }
	}

	@-webkit-keyframes rotateLMaxi {
			0% {  transform: rotateZ(0deg);    }
			100% {  transform: translateX(50%) translateY(-50%)  rotateZ(180deg) ; }
	}

	@keyframes rotateRMaxi {
			0% {  transform: rotateZ(0deg);    }
			100% {  transform: translateX(-50%) translateY(50%) rotateZ(180deg) ; }
	}

	@-webkit-keyframes rotateRMaxi {
			0% {  transform: rotateZ(0deg);    }
			100% {  transform: translateX(-50%) translateY(50%) rotateZ(180deg) ; }
	}

	@keyframes rotateRMini {
			0% {  transform: translateX(-50%) translateY(50%)  rotateZ(180deg);    }
			100% {  transform: translateX(-105%) translateY(50%)  rotateZ(225deg) ; }
	}

	@-webkit-keyframes rotateRMini {
			0% {  transform: translateX(-50%) translateY(50%) rotateZ(180deg);    }
			100% {  transform: translateX(-105%)translateY(50%)  rotateZ(225deg) ; }
	}

	@keyframes rotateLMini {
			0% {  transform: translateX(50%) translateY(-50%)  rotateZ(180deg);    }
			100% {  transform: translateX(105%) translateY(-50%) rotateZ(225deg) ; }
	}

	@-webkit-keyframes rotateLMini {
			0% {  transform: translateX(50%) translateY(-50%)  rotateZ(180deg);    }
			100% {  transform: translateX(105%) translateY(-50%) rotateZ(225deg) ; }
	}


/*======================
Grids - Values
======================*/

.grid-bg-default{
 background-image: url("../images/bg-tile.png");
 background-repeat: repeat;
 background-size: 17px 17px;
}

#grid-north{
	/*
	width: 1484px;
	height: 100px;
	background: green;
	*/
	
}

#grid-south{
	padding-bottom: 30px;
	/*
	width: 1484px;
	height: 100px;
	background: yellow;
	*/
	
}

#grid-west-east{

	position: relative;
	/*
	height: 642px;
	*/
}

#grid-east{
	z-index: -1;
	padding-right: 30px;
	/*
	width: 100px;
	height: 642px;
	left: 1384px;
	background: red;
	*/
	
	position: absolute;
	
}

#grid-west{
	/*
	width: 100px;
	height: 642px;
	background: blue;
	*/
	
	position: absolute;
}

#grid{
	/*
	width: 1284px;
	left: 100px;
	*/
	position: absolute;
	
}

/*======================
Function - Tile
======================*/
.function-tile{
	cursor: pointer;
	z-index: 2000;
	position: absolute;
}


/*======================
Menu Tile - Vinyl
======================*/


#menu-tile{ display:inline-block; width:103px; height:103px; top:50%; left:50%; background: #000; border-left: 1px solid #202020; border-bottom: 1px solid #202020; z-index: 9999; cursor: pointer;} 
#menu-tile ul{  margin: 0; padding: 0; list-style: none; }
#menu-tile ul li{ width:7px; height: 7px; display:block; float:left;  margin:0 2px 2px 0;  overflow:hidden; border:1px solid #4c4c4c; background-color:rgba(150, 149, 149, 0); }
#menu-tile ul li:nth-child(3n){ margin-right: 0; }
#wrap-menu-tile{ width:32px; height:32px; position:absolute; top:0; left:0; margin:auto; right: 0; bottom: 0;  }

.flip-container.flip .flipper {
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
}

/*======================
Menu Tile - Vinyl
======================*/

.flip-container {
	perspective: 1000px;
	-moz-perspective: 1000px;
}

.flip-container, .front, .backs {
	
}

.flipper {
	transition: 1s;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;

	position: relative;
}

.front, .backs {
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;

	position: absolute;
	top: 0;
	left: 0;
}

/* front pane, placed above back */
.front {
	z-index: 2;
	/* for firefox 31 */
	transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
}

.backs {
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
}

/*======================
Highlight
======================*/

.highlight-active {
	-webkit-filter: contrast(100%) brightness(200%);  /* Chrome, Safari, Opera */
	filter: contrast(100%) brightness(200%);
}

.highlight {
		
}

.pointer{
	cursor: pointer;
}

.highlight:hover{
	-webkit-filter: contrast(100%) brightness(200%);  /* Chrome, Safari, Opera */
	filter: contrast(100%) brightness(200%);
}

/*======================
Image-helpers
======================*/

.img-wrap{
	max-height: 100%;
	max-width: 100%;
}

.img-raw{
	max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

.img-raw-mask{
	width: 100%;
	height: 100%;
	max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	position: relative;
}

/*======================
Full Image Popup Clasess
======================*/
#close-btn {
	position: absolute;
	width: 20px;
	height: 18px;
	top: 0px;
	left: 278px;
	cursor: pointer;
	z-index:220;
	background-image: url('../images/close.png');
	background-repeat: no-repeat;
}

.imagePopUp{
	height: 100%;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background: #202020;
	z-index: 1000;
}

.imgwrap {
	height: 100%; /*can be anything*/
	width: 100%; /*can be anything*/
	display: inline-block;
	vertical-align: top; /*not required*/ 
	position: relative;
}

.blackborder{
	border: 1px solid black; /*not required*/
}

.imgraw {
	max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

.thumbWrapper{
	margin: 4px 2px;
	padding-right: 2px;
	overflow-y: scroll;
	text-align: center;
}

.thumb {
	max-height: 100%;
	max-width: 100%;
	width: 50%;
	height: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	margin-bottom: 2px;
	margin-top: 2px;
	border: 1px solid transparent;
}

.thumb:hover {
	max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	margin-bottom: 2px;
	margin-top: 2px;
	border: 1px solid rgba(200,200,200,0.5);
}

.thumbnail-active {
	max-height: 100%;
	max-width: 100%;
	width: 70%;
	height: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	margin-bottom: 2px;
	margin-top: 2px;
	border: 1px solid white;
}

.closeBtn{
	color: #AAAAAA;
	text-align: center;
	font-family: "Lucida Console", Verdana, sans-serif;
	margin: 0;
	cursor: pointer;
}

.thumbnail-container{
	height: inherit;
	overflow-y: scroll; 
	overflow-x: hidden;
	text-align: center;
	/*
	padding-left: 20%;
	padding-right: 20%;
	*/
}

.thumbnail-controls{
	text-align: center;
	min-height: 70px;
}

.paginator{
	text-align: center;
	margin-top: 10px;
	margin-bottom: 10px;
}

.controlText{
	text-align: center;
	color: #505050;
	font-family: Verdana, sans-serif;
	margin: 0;
	display: inline;
}

.arrow-down{
		cursor: pointer;
		margin-top: 8px;
		margin-bottom: 15px;
		
}

.arrow-up{
		cursor: pointer;
		margin-bottom: 8px;
		margin-top: 15px;
}

.foot-page{
	width: 70%;
	margin-top: 2%;

}

.title_text{
	/*font-family: Tahoma, Geneva, sans-serif;*/
	font-family:'newsanse-regular';
	/*font-weight: bold;
	color: #505050;*/
	color: #fff;
	margin-bottom: 10px;
}

.desc_text{
	font-family:'newsanse-regular';
	/*font-family: Tahoma, Geneva, sans-serif;*/
	font-size: smaller;
	color: #6E6E6E;
	margin: 0;
}

.share-icon{
	-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
		filter: grayscale(100%);
		height: 20px;
		margin: 0px 8px;
		cursor: pointer;
}

.like-icon{
	height: 20px;
	-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
		filter: grayscale(100%);
}

.share-container{
	display: inline-block;
		float: right;
		height: initial;
		margin-top: 25px;
}

.share-like-container{
	cursor: pointer;
	display: inline-block;
		margin-top: 25px;
		margin-right: 8px;
}

.no-select{
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}


/*===================
* Clock
====================*/

#clock-container{  display:inline-block; width:103px; height:103px; top:50%; left:50%; background: #000; border-left: 1px solid #202020; border-bottom: 1px solid #202020; z-index: 9999}
#clock-wrap{ position: relative; width: 100%; height: 100% ; cursor: pointer; z-index: 9999; background: #000}
#clock{ background:url(../images/clock/bg-clock.png) no-repeat; width:37px; height:36px; list-style: none; position:absolute; z-index:1; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 9999}
#second, #minute{ width: 3px; height: 37px; top: 0px; left: 16px; position:absolute; }
#second{ background:url(../images/clock/clock-hand-1.png) no-repeat; position: absolute; z-index: 2000; left:15px; top:3px; }
#minute{ background:url(../images/clock/clock-hand-2.png) no-repeat; position: absolute; z-index:3; }
#minute { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }


/*===================
* Clock Settings
====================*/

#clock-selector{ background: #000; position: absolute; /*z-index:999;*/  display: none}
#clock-selector ul { margin: 0; padding: 0; list-style:none; width:100%; text-align: center; position: relative; top:40%;}
#clock-selector ul li{ display: inline-block; border:1px solid #fff; width:5px; height: 5px; }

/*===================
* Music Player
====================*/
/*
#player-container{  display:inline-block; width:103px; height:103px; top:50%; left:50%; background: #000; border-left: 1px solid #202020; border-bottom: 1px solid #202020; z-index: 9999}
#player-wrap{ position: relative; width: 100%; height: 100% ; cursor: pointer; /*z-index: 9999; background: #000}
.play-btn{ width:27%; height:27%; position:absolute; left:37%; top:37%; }
.back, .forward{ width:9%; height:9%; position:absolute; top:47%; display: block; opacity: 0;}
.back{ left:17%;  }
.forward{ right:17%; }
/*.expand{ width:8%; height:8%; position:absolute; right:8%; top:8%;  }*/
.square{  position:absolute; cursor:pointer; border:1px solid; border-color: #969595; display: none}
.square:hover{ border-color: #fff; }
.square .selected{ border-color:#ffffff; }

.player-share-social-icon{
	-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
		filter: grayscale(100%);
		max-height: 60%;
		max-width: 60%;
		width: auto;
		height: auto;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;
}

/*===================
* Info Dialog
====================*/

#infoDialog {
	color: #D6D4D4;
}

#infoDialog .info-brief p{
	/*text-align: justify;
	font-weight: bold;*/
}

#infoDialog .info-review{
	margin-top: 2rem;
}

#infoDialog .info-content {
	/*text-align: justify;*/
	font-style: italic;
}

#infoDialog .info-author {
	text-align: right;
}

/*===================
* Contact form
====================*/

#contactWraper{ 
	/*margin:5% 0% 8% 11%; */
	width: 304px;
	height: 90%;
	opacity: 1;
	position: absolute;
	margin: auto !important;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}

.social-wrap{ /*height:5%; margin-bottom: 5%;*/ display: inline;}
#socialBarContainer{ height: auto !important; overflow: initial !important; width: auto !important;}
#contactText{ /*height:16%;*/ margin-bottom: 0%; }

.titleForm{
	color:#E2E2E2;
	margin-bottom: 0px !important;
}


.finput{
	background: #232323;
	margin: 1.5% 0%;
	padding: 2%;
	width: 100%;
	color:#969595;
	border: none;
}

.farea{

	background: #232323;
	margin: 1% 0%;
	padding: 2%;
	width: 100%;
	color:#969595;
	border: none;
}

.fbutton{
	background: #282828;
	border: none;
	color: #fff;
	font-family: 'newsanse-regular';
	margin: 0;
	padding: 8px 16px;
	margin-top: 3.5%;
	cursor: pointer;
}

#fcaptcha{
	margin: 1% 0px;
}

.fchk{
	margin: 10px 6px 10px 0px;
}

.textfont{
	color: #bbbbbb;
	margin: 5% 0px 4% 0px;
}

.textfont.msg{ 
	margin:5px 0px; 
}


label input {
	display: none;/* <-- hide the default checkbox */
}

label span {/* <-- style the artificial checkbox */
	height: 12px;
	width: 12px;
	border: 1px solid grey;
	display: inline-block;
	position: relative;
	bottom: -2px;
}

[type=checkbox]:checked + span:before {/* <-- style its checked state..with a ticked icon */
	content: '\2714';
	position: absolute;
	top: -1px;
	left: 1;
}

/*
input[type="checkbox"] {
		display:none;
}
input[type="checkbox"] + label span {
	border: 1px solid #999999;
	box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
		display:inline-block;
		width:15px;
		height:15px;
		vertical-align:bottom;
		cursor:pointer;
}

input[type="checkbox"] + label span:active,  input[type="checkbox"]:checked + label span:active{
	box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.5);
	vertical-align: bottom;
}

input[type="checkbox"]:checked + label span:after {
		content: '\2714';
	font-size: 14px;
	top: 0px;
	left: 5px;
	color: #99a1a7;
	vertical-align: bottom;
}
*/

input[type="text"]:valid, .farea:valid{
	font-weight: normal;
	color:#969595;
	font-family: 'newsanse-regular';
}


input[type="text"]:focus, .farea:focus{
	font-weight: normal;
	color:white;
	font-family: 'newsanse-regular';
}
/*
.social-icon{
	display: inline-block;
	-webkit-filter: grayscale(100%); 
	filter: grayscale(100%);
	margin-right: 40px;

	max-height: 100%;
	max-width: 100%;
}
*/

.social-icon{
	display: inline-block;
	-webkit-filter: grayscale(100%); 
	filter: grayscale(100%);
	/*margin-right: 24px;*/
	width:24px;
	height: 24px;
	cursor: pointer;
}

.social-icon:hover{
	-webkit-filter: contrast(0%);
    filter: contrast(0%);
}

.social-icon>img{
	display: block;
	max-width: 24px;
	max-height: 24px;
	position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
}

.oculto {display: none;}

/*===================
* Shop Options
====================*/

.shop-item-music-bg{
	opacity: 0.5;
}

.shop-item-music-bg:hover{
	opacity: 1;
}

.shop-container{  display:none; width:103px; height:103px; top:50%; left:50%; background: #4c4c4c; cursor: pointer;/*border-left: 1px solid #202020; border-bottom: 1px solid #202020;/* ;z-index: 9990*/}
.shop-subcontainer{  display:none; width:103px; height:103px; top:50%; left:50%; background: #717171; cursor: pointer;/*border-left: 1px solid #202020; border-bottom: 1px solid #202020;/* ;z-index: 9990*/}
.shop-wrap{ width: 100%;  cursor: pointer; z-index: 9999; background: #000; color: white; color:#FFF;}
.shop-title{ position: relative; width: 100%; /*padding-top: 30% ;*/ cursor: pointer; z-index: 9999; color: white; color:#bbbbbb; font-size: 14px;}

.shop-cate-selected{
	box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);
}

.shop-item-selected{
	z-index: 100;
	/*box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);*/
}

#format-wrapper label, #social-wrapper label{

		display: inline-block;
		cursor: pointer;
		position: relative;
		padding-left: 25px;
		margin-right: 15px;
		font-size: 13px;

}

#social-wrapper label{

	margin-right: 10px;

}

#format-wrapper input[type=radio], #social-wrapper input[type=radio]  {

	display: none;

}

#format-wrapper label:before, #social-wrapper label:before {

		content: "";
		display: inline-block;
 
		width: 16px;
		height: 16px;
 
		margin-right: 10px;
		position: absolute;
		left: 0;
		bottom: 1px;
		
		box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .3), 0px 1px 0px 0px rgba(255, 255, 255, .8);
		border-radius: 50%;
		border:1px solid #fff;

}

#format-wrapper input[type=radio]:checked + label:before, #social-wrapper input[type=radio]:checked + label:before {
		content: "\2022";
		color: #969595;
		font-size: 25px;
		text-align: center;
		line-height: 18px;
}

#social-wrapper img{
	width:70%;
	height: auto;
}

.tile-base-face-ready:hover{
	opacity: 1 !important;
}

/*New Master Tile classes*/
.tile-master-folder{
	cursor: pointer;
}

.tile-master-folder.clicked, .tile-base-folder.clicked{	
	z-index: 2000;
	/*box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);*/
}

.tile-divclick-folder{
	opacity: 0;
}

.tile-base-folder.tile-master-folder.clicked .tile-divclick-folder{
	background: white;
	opacity: 0.5;
}

.tile-base-folder.clicked .tile-divclick-folder{
	background: black;
	opacity: 0.5;
}


/*===================
* Shop Options - Prints
====================*/

.section-label{ font-size:10px; color:#ededed; position: absolute; top: 20%; left: 15px; }
.format-text{ font-size: 10px; width: 50%; float: left; margin-left: 5%; color:#969595; }
.shop-container-print-options-name{ display: block; text-align: center; left: 0; right: 0; font-size: 10px; position: absolute; top: 40%; text-transform: uppercase; }
.shop-container-print-info-text-name{ display: block; text-align: center; left: 0; right: 0; position: absolute; top: 44%; font-size: 11px; color: #c1c1c1; }

/*======================
Shop Options - ALbums
======================*/

.shop-container-album-options-album, .shop-container-album-options-artist, .shop-container-album-options-get, .shop-container-album-options-download{
	display: block; text-align: center; left: 0; right: 0; font-size: 10px; position: absolute;
}

.shop-container-album-options-album{  top: 25% }
.shop-container-album-options-artist{ top: 55%; color: #C1C1C1; text-transform:capitalize; }
.shop-container-album-options-get{  font-size: 9px;  top: 25%; color: #C1C1C1 }
.shop-container-album-options-download{ font-size: 11px; top: 55% }
.shop-container-album-info-text-album{  display: block; text-align: center; left: 0; right: 0; position: absolute; top: 40%; font-size: 11px;  }
.shop-container-album-info-text-artist{ display: block; text-align: center; left: 0; right: 0; position: absolute; top: 54%; font-size: 11px;  color: #c1c1c1; }

/*===================
* Music Player
====================*/

/*General*/
#player-container{  display:inline-block; width:103px; height:103px; top:50%; left:50%; background: #000; border-left: 1px solid #202020; border-bottom: 1px solid #202020; z-index: 0}
#player-wrap{ position: relative; width: 100%; height: 100% ; cursor: pointer; background: #000}
.play-btn{ width:30%; height:30%; position:absolute; left:35%; top:35%; }
.back, .forward{ width:9%; height:9%; position:absolute; top:42%; display: block; opacity: 0; padding: 4%;}
.back{ left:15%;  }
.forward{ right:15%; }
.expand{ width:8%; height:8%; position:absolute; right:4%; bottom:4%; opacity: 0; padding: 4%; }

#pb-seek-bar { height: 2px; background: #969595; cursor: pointer; border-bottom: 3px solid black; border-top: 3px solid black; position: relative; top: -3px;}
#pb-play-bar { height: 2px; background: white;}

/*Medium Player*/
#music-player{ position:absolute; /*left:50%; top:50%;*/ z-index:100; margin:0; border-left: solid 1px transparent; /*overflow:hidden; z-index: -1; display: none*/ opacity: 0}
#extended-player{ top: 0px; left: 0px; position:absolute; z-index:1; background: #000; height: 100%; min-height: 100px;}
#progress-bar{ width:0px; position:absolute; top:60%; left:50%; z-index:2;  }
#cover img{ width:auto; height: 100%; }
#track-info{ width:100%; height:60%; position:absolute; z-index:1; text-align:center;   top:0; font-family:'newsanse-regular'; opacity: 0;  }
#track-name { color:#FFF;  position:absolute;  width:100%; text-align:center;}
#album-name { color:#7D7D7D; position:absolute; width:100%; text-align:center;}
#artist-name{ color:#7D7D7D; position:absolute; top:52%; width:100%; text-align:center; }
.icons{ width:11%; /*height:10%;*/ position:absolute; z-index:1; bottom:25%; opacity: 0; }
.icons img{ width:100%; height:auto; margin: auto; top: 0; left: 0; bottom: 0; right: 0; position: absolute;}
#shop{ left:2%;  }
#player-wagon { left:2%; cursor: pointer;  }
#download{ left:12%;}
#player-share{ left:2%; bottom: 19% ; cursor: pointer;  filter: brightness(50%); -moz-filter: brightness(50%); -webkit-filter: brightness(50%);}

.player-share-social-triangle-base{ border-left: 5px solid transparent; border-top: 0px solid transparent; border-right: 5px solid transparent; border-bottom: 8.66px solid #202020;
	width: 0; height: 0; left:0; top:0; position: absolute; z-index: 1;
}

.player-share-social-triangle{ border-left: 4px solid transparent; border-top: 0px solid transparent; border-right: 4px solid transparent;
	border-bottom: 6.928px solid  black; width: 0; height: 0; left:-4px; top:3px;position: absolute;
}

.btn{ position:absolute; z-index:2000; opacity: 0; }
.btn img{ width:100%; height: auto; }

#back{ cursor: pointer; }
#play-btn{ cursor: pointer; }
#forward{ cursor: pointer; }

/*Full Player*/
#full-cover{ position:absolute; z-index:100; overflow:hidden; }
#full-cover img{ position:absolute;}
#track-list{ text-align:center; position:absolute; z-index:-1; background-color:#1C1C1C; overflow:auto; opacity: 0; display: none; }

#album-wrapper{ position:absolute; width:100%; height:auto; }
.album{ width:100%;  min-height:60px; height:13.21%; position:relative; border-bottom:1px solid #343434; background: #272727; }
.album-name{ text-transform:capitalize; color:#969696; top:22%;}
.album span, .easter-egg span{ display:block; width:100%; position:absolute; }
.easter-egg, .blank{  background:#4E4E4E; height:13.21%; width:100%; }


.album-tracks{ height:auto; display:none; background:#2c2c2c; border-bottom:1px solid #343434;}
.album-tracks.playing{ background: #1c1c1c }

.album-artist{ color:#4F4F4E; top: 50%; text-transform: capitalize; font-size: 13px;}

.track{ width:100%;  color:#5A5A5A; border-bottom:1px solid #222222; cursor: pointer; position: relative;}
.collapse{ width:14px; height: 8px; background: url(../images/player/collapse.png) center center no-repeat; display:block; position: absolute; right:5%; top:50%; margin:-16px 0 0 -5px; z-index: 10; cursor: pointer; padding: 10px 5px;}
.album.playing .collapse{  background: url(../images/player/collapse-select.png) center center no-repeat; }
.mini-play{ display:block; width:15px; height:20px; opacity: 0.5; cursor: pointer; position: absolute; z-index: 10; left:5%; top:50%; margin:-22px 0 0 -5px; padding: 10px 5px ; background: url(../images/player/play-track.png) center center no-repeat;  }
.mini-play:hover { display: block; opacity: 1; }

.playing {background: #000;}
.playing .album-name {color: #FFF; text-transform: capitalize; top:22%;}
.playing .album-artist {color: #777777; top: 50%; text-transform: capitalize; font-size: 13px;}



.mini-play.play{ background: url(../images/player/play-track.png) center center no-repeat;}
.mini-play.pause{ background: url(../images/player/pause-track.png) center center no-repeat; }

.track-play{ display:block; width:15px; height:20px; opacity: 0.5; cursor: pointer; position: absolute; z-index: 10; left:5%; top:50%; margin:-10px 0 0 0; background: url(../images/player/play-track.png) center center no-repeat; }
.track-play:hover { display: block; opacity: 1; }
.track-number{ display:block; width:18px; height:24px; opacity: 1; cursor: pointer; position: absolute; z-index: 10; right:5%; top:50%; margin:-12px 0 0 0; font-size: 0.7rem; }
.track-number:hover { display: block; opacity: 1; }

/*.album.playing .mini-play{ background: url(../images/player/pause-track.png) center center no-repeat; }*/

/*
.elapsed-time{ color: #8E8E8E; font-size: 0.70rem; left: 2%; position: absolute; top: 35%;}
.duration-time{ color: #8E8E8E; font-size: 0.70rem; right: 2%; position: absolute; top: 35%;}
*/

.elapsed-time{ color: #8E8E8E; font-size: 10px; left: 10px; position: absolute; top: calc(60% - 20px);}
.duration-time{ color: #8E8E8E; font-size: 10px; right: 10px; position: absolute; top: calc(60% - 20px);}

.track-time-info{ opacity: 0 }


/*======================
Easter Egg
======================*/
.easter-track, .easter-artist{ width:100%; display:block; text-align:center; position:absolute; z-index:200; opacity:0;  }
.easter-track{ color:#D8D8D8; }
.easter-artist{ color:#A5A5A5; } 
.easter-player-track{ color:#D8D8D8; font-size:14px; top:25%;}
.easter-player-artist{ color:#A5A5A5; font-size:13px; top:50%; }
.easter-play{ position: absolute; left:50%; opacity: 0; cursor: pointer;  }
.easter-play img{ width:100%; height: auto; }
.easter-new{ position: absolute; z-index:5; top:-13.21%; opacity:0; }
.easter-tile{ cursor: pointer; margin-left: 1px; margin-bottom: 1px; box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1); 
	user-drag: none; 
	user-select: none;
	-moz-user-select: none;
	-webkit-user-drag: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	z-index: 9991;
}


/*======================
Clock Tile Clasess
======================*/
.clock-speed{
	top:0;
	bottom: 0;
	margin: auto;
	height: 20px;
	width: 20px;
	line-height: 20px;
	text-align: center;
	opacity: 0;
	cursor: pointer;
	color: white;
	font-weight: normal;
	letter-spacing:0.025em; 
	word-spacing:-0.01875em;
	font-family: 'newsanse-regular';

	-webkit-user-select: none; /* Chrome/Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+ */
}

.clock-speed.up{
	font-size: 20px;
	position: absolute;
	right: 5%;

}

.clock-speed.down{
	font-size: 20px;
	position: absolute;
	left: 5%;
 
}

.clock-tile{
	position: relative;
	width: 100%;
	height: 100%;
	background: black;
}

.clock-wrap{
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	width: 27px;
	height: 27px;
}

.clock-raw {
	align-items:center;
	border-radius: 50%;
	border: solid 2px #808080;
	width: 23px;
	height: 23px;
	justify-content:center;
	-webkit-justify-content:center;
	position: absolute;

}

.hand {
	align-items:center;
	-webkit-align-items:center;
	
	border-radius: 50%;
	display:flex;
	display: -webkit-flex;
	
	justify-content:center;
	-webkit-justify-content:center;
	z-index: 2;

	height: 95%;
	width: 100%;

	-webkit-animation: timer 4s linear infinite;
	animation: timer 4s linear infinite;
	transform-origin: 50% 50%;
	-webkit-transform-origin: 50% 50%;
	animation-play-state: paused;
	-webkit-animation-play-state: running;

}

.hand:after {
	content: '';
	height: 40%;
	top: -20%;
	width: 1px;
	
	background: #808080;
	border-radius: 1px;
	
	position: relative;
}

@-webkit-keyframes timer {
	0% {
		-webkit-transform: none;
		transform: none;
	}
	
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes timer {
	0% {
		-webkit-transform: none;
		transform: none;
	}
	
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/*
 * Project: CirclePlayer
 * http://www.jplayer.org
 *
 * Copyright (c) 2012 Happyworm Ltd
 *
 * Author: Silvia Benvenuti
 * Edited by: Mark J Panaghiston
 * Date: 2nd October 2012
 * Artwork inspired by: http://forrst.com/posts/Untitled-CJz
 */

.clock-container {
	position:absolute;
	width:100%; /* 200 - (2 * 48) */
	height:100%;  
}

.clock-gauge-1,
.clock-gauge-2 {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	clip:rect(0px,20px,40px,0px);

	-moz-border-radius:50%;
	-webkit-border-radius:50%;
	border-radius:50%;

	background:url("../images/progress4.png") 0 0 no-repeat;
	background-size: contain;
}

.clock-gauge{
	opacity: 0;
	z-index: 1;
	position:absolute;
	width:40px;
	height:40px;
	clip:rect(0px,40px,40px,20px);
	display:none;
} 

.clock-gauge.cp-gt50,
.clock-gauge-1.cp-fallback{
	clip:rect(auto, auto, auto, auto);
}


/*======================
Shop Clasess
======================*/
.shop-container-album-options-album{ display: block; text-align: center; left: 0; right: 0; font-size: 10px; position: absolute; top: 25% }
.shop-container-album-options-artist{ display: block; text-align: center; left: 0; right: 0; font-size: 10px; position: absolute; top: 55%; color: #C1C1C1 }
.shop-container-album-options-get{ font-size: 10px; }
.shop-container-album-options-download{ font-size: 11px; }

/*======================
Normal Clasess
======================*/
body {/*html, body, #wrap-outter, #wrap-outter-false {*/
	overflow:hidden;
	background: #202020;
	height: 100%;
	margin: 0px;
	font-weight: normal;
	letter-spacing:0.025em; 
	word-spacing:-0.01875em;
	font-family: 'newsanse-regular';
}

.tile{
	vertical-align: middle;
	/*display: inline-block;  */
	display: table-cell;
}

.tile-row{
	vertical-align: middle;  
	display: none;
}

p{
	margin: 0px;
}

#wrap-outter {
		position: relative;
		height: 100%;
		overflow: hidden;
}

#wrap-inner {
		position: absolute;
		overflow: auto;
		margin: 0;
		padding: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		vertical-align: middle;
}

/*
#grid {
		/*display: inline-table;text-align: center;width: 100%;
		top:0;
		left: 0;
		bottom: 0;
		right: 0;
		margin: auto;
		position: absolute;
}
*/

#wrap-outter-false {
	z-index: 0;
	position: fixed;
		display: table;
}

#wrap-inner-false {
		display: table-cell;
		margin: 0;
		padding: 0;

		text-align: center;
		vertical-align: middle;
}

#grid-false {
		width: 100%;
		margin: auto;
		text-align: center;
		display: table;
}

.popuptmp{
	visibility: hidden; 
	position: absolute;
	padding: 20px;
	border: 1px solid black;
	background-color: #dddddd;
	font-size: 19px;
	top: 25%;
	left: 25%;
	width: 50%;
	height: 50%;

}

.cube2{
	position: absolute;
		-webkit-transition: 1s ease-in-out;
		-moz-transition: 1s ease-in-out;
		-o-transition: 1s ease-in-out;
		transition: 1s ease-in-out;
}

.cube1:hover + .cube2{
	-webkit-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		transform: rotate(360deg);
		left: calc(100% - 102px);
}


/*======================
Media Queries text
======================*/

@media screen and (max-width: 1480px){
	.lbl-news{
	color: #999999;
	margin: 2.5% 0px;
	font-size: 0.8em;
		display: inline-block;
	}
}

@media screen and (min-width: 1481px) and (max-width: 1600px){
	.lbl-news{
	color: #999999;
	margin: 3.5% 0px;
	font-size: 0.8em;
		display: inline-block;
	}
}

@media screen and (min-width: 1601px) and (max-width: 1876px){
	.lbl-news{
	color: #999999;
	margin: 4.5% 0px;
	font-size: 0.8em;
		display: inline-block;
	}
}

@media screen and (min-width: 1876px) and (max-width: 2248px){
	.lbl-news{
	color: #999999;
	margin: 5% 0px;
	font-size: 0.8em;
		display: inline-block;
	}
}

@media screen and (min-width: 2248px) and (max-width: 2480px){
	.lbl-news{
	color: #999999;
	margin: 3.5% 0px;
	font-size: 0.8em;
		display: inline-block;
	}
}

@media screen and (min-width: 2481px){
	.lbl-news{
	color: #999999;
	margin: 4.5% 0px;
	font-size: 0.8em;
		display: inline-block;
	}
}

/*======================
Media Queries text
======================*/

@media screen and (max-width: 1920px){
	.textfont{
		font-family:'newsanse-regular';
		letter-spacing: 0.025em;
		 word-spacing: -0.01875em;
		
		font-size: 0.85rem;
	}

	.textfont.lbl-news{
		color:#D6D4D4;
	}

	::-webkit-input-placeholder { color:#888888; font-family:'newsanse-regular'; font-size: 1.1em; background: #232323;}
	::-moz-placeholder { color:#888888; font-family:'newsanse-regular'; font-size: 1.1em; background: #232323;} /* firefox 19+ */
	:-ms-input-placeholder { color:#888888; font-family:'newsanse-regular'; font-size: 1.1em; background: #232323;} /* ie */
	input:-moz-placeholder { color:#888888; font-family:'newsanse-regular'; font-size: 1.1em; background: #232323;}
}

@media screen and (min-width: 1921px){
	.textfont{
		font-family:'newsanse-regular';
		letter-spacing: 0.025em;
		

		word-spacing: -0.01875em;
		font-size: 0.9em;
	}

	.textfont.lbl-news{
		color:#D6D4D4;
	}

	::-webkit-input-placeholder { color:#888888; font-family:'newsanse-regular'; font-size: 1em; background: #232323;}
	::-moz-placeholder { color:#888888; font-family:'newsanse-regular'; font-size: 1em; background: #232323;} /* firefox 19+ */
	:-ms-input-placeholder { color:#888888; font-family:'newsanse-regular'; font-size: 1em; background: #232323;} /* ie */
	input:-moz-placeholder { color:#888888; font-family:'newsanse-regular'; font-size: 1em; background: #232323;}
}

/*======================
Media Queries tiles styles
======================*/

.tile-base-action{
	user-drag: none; 
	user-select: none;
	-moz-user-select: none;
	-webkit-user-drag: none;
	-webkit-user-select: none;
	-ms-user-select: none;

	border-left: solid 1px #202020;
	border-bottom: solid 1px #202020;
	z-index: 0;
}

.tile-base-action.function-tile{
	z-index: 2000;
}

/*Small displays*/
@media screen and (max-width: 1024px){

	.tile-base {
		width: 7.8125%;
		height: auto;
		z-index: 0;
	}

	.tile-base-action {
		width: 7.8125%;
		height: auto;
		
		
	}

	.tile-base-action-parent {
		width: 7.8125%;
		height: auto;
		z-index: 0;
	}

	.tile-base-action-master-clicked{
		width: 7.8125%;
		height: auto;
		z-index: 20;
		margin-left: 1px;
		margin-bottom: 1px;  
		box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);
	}

	/*Contact*/
	.share-icon{ height: 15px; }
	.social-wrap{ margin-bottom: 5%; }
	#contactWraper{ 
		margin: 5% 0% 7% 11%;
	}
	#socialBarContainer{ height:18px; }
	#contactText{ margin-bottom: 0%; }

	/*FullImage*/
	.closeBtn{ font-size:0.8125rem; margin-bottom: 25px; }
	.controlText{ font-size:0.9rem; letter-spacing:0.025em;  word-spacing:-0.01875em; }
	.paginator{ margin-bottom: 25px; }
	.arrow-up img, .arrow-down img{ width:23%; }
	.thumbnail-controls{ margin-bottom: 25px; }
	.thumb, .thumb:hover, .thumbnail-active { width: 68%; }
	.titleForm{ font-size:0.85rem; margin-bottom: 5%; }
	.textfont{ font-size:0.78125rem;  }
	.title_text{ font-size: 0.9rem; }
	.textfont.msg{ font-size:0.724rem; }
	.farea:valid{font-size:0.724rem;  }
	.icons{ width:11%; }

	/*Player*/
	#shop{}
	#download{left:10%;}
	#player-share{ left:2%; bottom: 19% }
	#back{ width:8%; height:23.23%; left:37%; bottom: 8% }
	#play-btn{  width:8%; height:23.23%; left:46%; bottom: 8%; }
	#forward{ width:8%; height:23.23%; left:55%; bottom: 8%  }

	#track-name{ font-size:0.8rem; top:35%; }
	#album-name{ font-size: 0.75rem; top: 5%; }
	#artist-name{ font-size:0.75rem; top: 65%;  }

	.square:hover{ border:1px solid #ffffff;}
	#max{ width:8%; height:23.23%; border:1px solid #969595; position:absolute; bottom:13.3%; right:5%; cursor:pointer;}
	#mid{ width:5%; height:14.51%; border:1px solid #ffffff; position:absolute; bottom:17.745%; right:6.5%; cursor:pointer; }
	#mini{ width: 2%; height:5.80%; border:1px solid #969595; position:absolute;  bottom:22.1%; right:8%; cursor:pointer;  }
	#easter-play{ width:20px; height:20px; margin:0 0 0 -10px; top:60%;}

	 .section-label{ font-size:11px;  }
	.format-text{ font-size:10px; }
	.shop-container-print-options-name{ font-size:12px; }
	.shop-container-print-info-text-name{ font-size:12px; }
	.shop-container-album-info-text-artist{ font-size:11px; }
	.shop-container-album-info-text-album{ font-size: 12px; }
}

/*Normal displays*/
@media screen and (min-width: 1025px) and (max-width: 1366px){

	.tile-base {
		width: 7.6846%;
		height: auto;
		z-index: 0;
	}

	.tile-base-action {
		width: 7.6846%;
		height: auto;
		
	}

	.tile-base-action-parent {
		display: none;
		width: 7.6846%;
		height: auto;
	}

	.tile-base-action-master-clicked{
			width: 7.6846%;
		height: auto;
		z-index: 20;
		margin-left: 1px;
		margin-bottom: 1px;
		box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);
	}

	.share-icon{ height: 15px; }

	.social-wrap{ margin-bottom: 5%; }
	#contactWraper{ margin: 5% 0% 7% 11%; }
	#socialBarContainer{ height:18px; }
	#contactText{ margin-bottom: 0%; }


	.closeBtn{ font-size:0.9rem; margin-bottom: 30px; }
	.controlText{ font-size:0.9rem; letter-spacing:0.025em;  word-spacing:-0.01875em; }
	.paginator{ margin-bottom: 30px; }
	.arrow-up img, .arrow-down img{ width:20%; }
	.thumbnail-controls{ margin-bottom: 25px; }
	.thumb, .thumb:hover, .thumbnail-active { width: 60%; }

	.title_text{ font-size: 0.9rem; }

	.titleForm{ font-size:0.9rem; margin-bottom: 6%; }
	.textfont{ font-size:0.78125rem;  }
	.title_text{ font-size: 0.9rem; }
	.textfont.msg{ font-size:0.75rem; margin:10px 0; }
	.farea:valid{font-size:0.78125rem;  }
	.fbutton{ font-size:0.78rem; cursor: pointer;}

	.icons{ width:11%; }

	/*Player*/
	#shop{}
	#download{left:10.5%;}
	#player-share{ left:2%; bottom: 19% }

	#back{ width:8%; height:23.23%; left:37%; bottom: 8%; }
	#play-btn{  width:8%; height:23.23%; left:46%; bottom: 8%; }
	#forward{ width:8%; height:23.23%; left:55%; bottom: 8%  }

	#track-name{ font-size:0.8rem; top:35%; }
	#album-name{ font-size: 0.75rem; top: 5; }
	#artist-name{ font-size:0.75rem; top:65%;  }

	.square:hover{ border:1px solid #ffffff; }
	#max{ width:8%; height:23.23%; border:1px solid #969595; position:absolute; bottom:13.3%; right:5%; cursor:pointer;}
	#mid{ width:5%; height:14.51%; border:1px solid #ffffff; position:absolute; bottom:17.745%; right:6.5%; cursor:pointer; }
	#mini{ width: 2%; height:5.80%; border:1px solid #969595; position:absolute;  bottom:22.1%; right:8%; cursor:pointer;  }

	#easter-track{ font-size:14px; top:22%; }
	#easter-artist{ font-size:13px; top:50%; }
	#easter-play{ width:20px; height:20px; margin:0 0 0 -10px; top:60%;}

	.section-label{ font-size:12px;  }
	.format-text{ font-size:11px; }
	.shop-container-print-options-name{ font-size:13px; }
	.shop-container-print-info-text-name{ font-size:13px; }
	.shop-container-album-info-text-artist{ font-size:12px; }
	.shop-container-album-info-text-album{ font-size: 13px; }
}

/*Large displays*/
@media screen and (min-width: 1367px) and (max-width: 1600px){

	.tile-base {
		width: 6.7826%;
		height: auto;
		z-index: 0;
	}

	.tile-base-action {
		width: 6.7826%;
		height: auto;
		
	}

	.tile-base-action-parent {
		width: 6.7826%;
		height: auto;
		z-index: 10;
	}

	.tile-base-action-master-clicked{
			width: 6.7826%;
			height: auto;
		z-index: 20;
		margin-left: 1px;
		margin-bottom: 1px;
		box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);
	}

	.share-icon{ height: 15px; }
	.social-wrap{ margin-bottom: 5%; }
	#contactWraper{ margin: 5% 0% 7% 11%; }
	#socialBarContainer{ height:20px; }
	#contactText{ margin-bottom: 0%; }

	.closeBtn{ font-size:0.9rem; margin-bottom: 30px; }
	.controlText{ font-size:0.9rem; letter-spacing:0.025em;  word-spacing:-0.01875em; }
	.paginator{ margin-bottom: 30px; }
	.arrow-up img, .arrow-down img{ width:20%; }
	.thumbnail-controls{ margin-bottom: 25px; }
	.thumb, .thumb:hover, .thumbnail-active { width: 60%; }
	.title_text{ font-size: 0.9rem; }


	.titleForm{ font-size:0.9375rem; margin-bottom: 5%; }
	.textfont{ font-size:0.78125rem;  }
	.title_text{ font-size: 0.9rem; }
	.textfont.msg{ font-size:0.75rem; margin:10px 0px; }
	.farea:valid{font-size:0.78125rem;  }
	.fbutton{ font-size:0.78rem; }
	.finput{ font-size:0.75rem; }
	.icons{ width:11%; }


	/*Player*/
	#shop{}
	#download{left:10%;}
	#player-share{ left:2%; bottom: 19% }

	#back{ width:8%; height:23.23%; left:37%; bottom: 8% }
	#play-btn{  width:8%; height:23.23%; left:46%; bottom: 8%; }
	#forward{ width:8%; height:23.23%; left:55%; bottom: 8%  }

	#track-name{ font-size:0.85rem; top:35%; }
	#album-name{ font-size: 0.8rem; top: 5; }
	#artist-name{ font-size:0.8rem; top:65%;  }

	.square:hover{ border:1px solid #ffffff;}
	#max{ width:8%; height:23.23%; border:1px solid #969595; position:absolute; bottom:13.3%; right:5%; cursor:pointer;}
	#mid{ width:5%; height:14.51%; border:1px solid #ffffff; position:absolute; bottom:17.745%; right:6.5%; cursor:pointer; }
	#mini{ width: 2%; height:5.80%; border:1px solid #969595; position:absolute;  bottom:22.1%; right:8%; cursor:pointer;  }

	.album-name, .easter-track{ font-size:13px; top:22%; }
	.album-artist, .easter-artist{ font-size:12px; top:50%;  }
	.track{ font-size:12px; }
	.track-active{ font-size:12px; color:#FFF;}

	#easter-track{ font-size:14px; top:25%;}
	#easter-artist{ font-size:13px; top:43%; }
	#easter-play{ width:20px; height:20px; margin:0 0 0 -10px; top:60%;  }

	.section-label{ font-size:12px;  }
	.format-text{ font-size:11px; }
	.shop-container-print-options-name{ font-size:13px; }
	.shop-container-print-info-text-name{ font-size:13px; }
	.shop-container-album-info-text-artist{ font-size:12px; }
	.shop-container-album-info-text-album{ font-size: 13px; }
}

@media screen and (min-width: 1601px) and (max-width: 1920px){

	.tile-base {
		width: 6.2999%;
		height: auto; 
	}

	.tile-base-action {
		width: 6.2999%;
		height: auto; 
	}

	.tile-base-action-parent {
		width: 6.2999%;
		height: auto; 
	}

	.tile-base-action-master-clicked{
			width: 6.2999%;
			height: auto;
		z-index: 20;
		margin-left: 1px;
		margin-bottom: 1px;
		box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);
	}

	.share-icon{ height: 15px; }

	.social-wrap{ margin-bottom: 5%; }
	#contactWraper{ margin: 5% 0% 7% 11%; }
	#socialBarContainer{ height:20px; }
	#contactText{ /*height: 15%;*/ margin-bottom: 0%; }

	.titleForm{ font-size:1rem; margin-bottom: 5%; }
	.textfont{ font-size:0.85rem;  }
	.title_text{ font-size: 0.9rem; }
	.textfont.msg{ font-size:0.8rem; margin:10px 0px; }
	.farea:valid{font-size:0.78125rem;  }
	.fbutton{ font-size:0.78rem; }
	.finput{ font-size:0.75rem; }

	.fbutton{ font-size: 0.85rem; }

	.icons{ width:11%; }


	/*Player*/
	#shop{}
	#download{left:10%;}
	#player-share{ left:2%; bottom: 19% }

	#back{ width:8%; height:23.23%; left:37%; bottom: 8% }
	#play-btn{  width:8%; height:23.23%; left:46%; bottom: 8%; }
	#forward{ width:8%; height:23.23%; left:55%; bottom: 8%  }

	#track-name{ font-size:0.85rem; top:38%; }
	#album-name{ font-size: 0.8rem; top: 5; }
	#artist-name{ font-size:0.8rem; top:65%;  }

	.square:hover{ border:1px solid #ffffff;}
	#max{ width:8%; height:23.23%; border:1px solid #969595; position:absolute; bottom:13.3%; right:5%; cursor:pointer;}
	#mid{ width:5%; height:14.51%; border:1px solid #ffffff; position:absolute; bottom:17.745%; right:6.5%; cursor:pointer; }
	#mini{ width: 2%; height:5.80%; border:1px solid #969595; position:absolute;  bottom:22.1%; right:8%; cursor:pointer;  }

	.track{ font-size:13px; }
	.track-active{ font-size:13px; color:#FFF;}
	.album-name{ text-transform:capitalize; color:#969696; top:22%; font-size: 14px;}

	#easter-track{ font-size:14px; top:25%; }
	#easter-artist{ font-size:13px; top:43%; }
	#easter-play{ width:25px; height:25px; margin:0 0 0 -12px; top:60%;  }

	.shop-container-album-options-album{ font-size: 12px; }
	.shop-container-album-options-artist{ font-size: 12px; }
	.shop-container-album-options-get{ font-size: 10px; }
	.shop-container-album-options-download{ font-size: 11px; }

	.section-label{ font-size:12px;  }
	.format-text{ font-size:11px; }
	.shop-container-print-options-name{ font-size:13px; }
	.shop-container-print-info-text-name{ font-size:13px; }
	.shop-container-album-info-text-artist{ font-size:12px; }
	.shop-container-album-info-text-album{ font-size: 13px; }
}

@media screen and (min-width: 1921px)  and (max-width: 2560px){

	.tile-base {
		width: 5.4671%;
		height: auto;
		z-index: 0;
	}

	.tile-base-action{
		width: 5.4671%;
		height: auto;
		
	}

	.tile-base-action-parent{
		width: 5.4671%;
		height: auto;
		z-index: 10;
	}

	.tile-base-action-master-clicked{
			width: 5.4671%;
		height: auto;
		z-index: 20;
		margin-left: 1px;
		margin-bottom: 1px;
		box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);
	}

	.closeBtn{ font-size:1rem; margin-bottom: 35px; }
	.controlText{ font-size:1rem; letter-spacing:0.025em; word-spacing:-0.01875em; }
	.paginator{ margin-bottom: 30px; }
	.arrow-up img, .arrow-down img{ width:13%; }
	.thumbnail-controls{ margin-bottom: 25px;}

	.thumb, .thumb:hover, .thumbnail-active { width: 50%; }

	.social-wrap{ height:5%; margin-bottom: 5%; }
	.titleForm{ margin-bottom: 8%; }
	#contactText{  }

	.fbutton{ font-size: 0.85rem; letter-spacing: 0.025em; }
	.finput{ font-size: 0.85rem; height:10%; }
	.farea, .textfont{ font-size:0.85rem; }
	.textfont.msg{ font-size: 0.81rem; }

	.icons{ width:11%; }

	/*Player*/
	#shop{}
	#download{left:10%;}
	#player-share{ left:2%; bottom: 19% }

	#back{ width:8%; height:23.23%; left:37%; bottom: 8% }
	#play-btn{  width:8%; height:23.23%; left:46%; bottom: 8%; }
	#forward{ width:8%; height:23.23%; left:55%; bottom: 8%  }

	#track-name{ font-size:0.9rem; top:38%; }
	#album-name{ font-size: 0.85rem; top: 5; }
	#artist-name{ font-size:0.85rem; top:65%;  }

	.square:hover{ border:1px solid #ffffff;}
	#max{ width:8%; height:23.23%; border:1px solid #969595; position:absolute; bottom:13.3%; right:5%; cursor:pointer;}
	#mid{ width:5%; height:14.51%; border:1px solid #ffffff; position:absolute; bottom:17.745%; right:6.5%; cursor:pointer; }
	#mini{ width: 2%; height:5.80%; border:1px solid #969595; position:absolute;  bottom:22.1%; right:8%; cursor:pointer;  }

	.track{ font-size:13px; }
	.track-active{ font-size:13px; color:#FFF;}
	.album-name{ text-transform:capitalize; color:#969696; top:22%; font-size: 14px;}

	#easter-track{ font-size:14px; top:25%; }
	#easter-artist{ font-size:13px; top:43%; }
	#easter-play{ width:25px; height:25px; margin:0 0 0 -12px; top:60%;  }

	.shop-title{ font-size: 16px; }
	.shop-container-album-options-album{ font-size: 14px; }
	.shop-container-album-options-artist{ font-size: 14px; }
	.shop-container-album-options-get{ font-size: 12px; }
	.shop-container-album-options-download{ font-size: 13px; }

	.section-label{ font-size:13px;  }
	.format-text{ font-size:12px; }
	.shop-container-print-options-name{ font-size:14px; }
	.shop-container-print-info-text-name{ font-size:14px; }
	.shop-container-album-info-text-artist{ font-size:13px; }
	.shop-container-album-info-text-album{ font-size: 14px; }
}

@media screen and (min-width: 2561px)  and (max-width: 3840px){

	.tile-base {
		width: 4.2308%;
		height: auto; 
		z-index: 0;
	}

	.tile-base-action{
		width: 4.2308%;
		height: auto; 
		
	}

	.tile-base-action-parent{
		width: 4.2308%;
		height: auto; 
		z-index: 10;
	}

	.tile-base-action-master-clicked{
			width: 4.2308%;
			height: auto;
		z-index: 20;
		margin-left: 1px;
		margin-bottom: 1px;
		box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);
	}

	.thumb, .thumb:hover, .thumbnail-active { width: 50%; }

	#back{ width:8%; height:23.23%; left:37%; bottom: 8% }
	#play-btn{  width:8%; height:23.23%; left:46%; bottom: 8%; }
	#forward{ width:8%; height:23.23%; left:55%; bottom: 8%  }

	.track{ font-size:13px; }
	.track-active{ font-size:13px; color:#FFF;}
	.album-name{ text-transform:capitalize; color:#969696; top:22%; font-size: 14px;}

	#easter-track{ font-size:14px; top:25%; }
	#easter-artist{ font-size:13px; top:43%; }
	#easter-play{ width:25px; height:25px; margin:0 0 0 -12px; top:60%;  }
}

@media screen and (min-width: 3841px)  {

	.tile-base {
		width: 3.6449%;
		height: auto;
		z-index: 0;
	}

	.tile-base-action{
		width: 3.6449%;
		height: auto;
		
		border-left: solid 1px #202020;
		border-bottom: solid 1px #202020;
	}

	.tile-base-action-parent{
		width: 3.6449%;
		height: auto;
		z-index: 10;
	}

	.tile-base-action-master-clicked{
			width: 3.6449%;
			height: auto;
		z-index: 20;
		margin-left: 1px;
		margin-bottom: 1px;
		box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 1);
	}

	#back{ width:8%; height:23.23%; left:37%; bottom: 8% }
	#play-btn{  width:8%; height:23.23%; left:46%; bottom: 8%; }
	#forward{ width:8%; height:23.23%; left:55%; bottom: 8%  }

	.track{ font-size:13px; }
	.track-active{ font-size:13px; color:#FFF;}
	.album-name{ text-transform:capitalize; color:#969696; top:22%; font-size: 14px;}

	#easter-track{ font-size:14px; top:25%; }
	#easter-artist{ font-size:13px; top:43%; }
	#easter-play{ width:25px; height:25px; margin:0 0 0 -12px; top:60%;}
}

@font-face {
		font-family: 'newsanse-regular';
		src: url('../fonts/2a960d_2_0-webfont.eot');
		src: url('../fonts/2a960d_2_0-webfont.eot?#iefix') format('embedded-opentype'),
				 url('../fonts/2a960d_2_0-webfont.woff') format('woff'),
				 url('../fonts/2a960d_2_0-webfont.ttf') format('truetype'),
				 url('../fonts/2a960d_2_0-webfont.svg#newsanse-reguploaded_file') format('svg');
		font-weight: normal;
		font-style: normal;
	
}




