		.player-bar {
			position: relative;
			height: 54px;
		}
		.player-bar-wpr {
			background-color: #FBC02D;
			min-height: 54px;
			border-top: 0px solid #283593;
			position: relative;
			font-family: 'Roboto', arial, sans-serif;
		}
		.player-bar .artwork {
			width: 42px;
			height: 42px;
			position: absolute;
			top: 6px;
			left: 17px;
			border-radius: 0px;
			background-size: cover;
		}
		.player-bar .metadata-ctr {
			max-width: 500px;
			position: relative;
			background: red;
			height: 54px;
			overflow: hidden;
		}
		.player-bar .metadata {
			margin-left: 73px;
			height: 54px;
			padding-top: 4px;
			box-sizing: border-box;
			display: inline-block;
		}
		.player-bar .songtitle {
			color: #000;
			font-size: 16px;
			font-weight: 500;
			margin-top: 3px;
			max-width: 300px;			
			overflow: hidden;
			text-overflow: ellipsis;	
			white-space: nowrap;
			text-transform: capitalize;
		}
		.player-bar .artist-info {
			color: #333;
			font-size: 14px;
			line-height: 16px;
			font-weight: 400;			
			max-width: 300px;			
			overflow: hidden;
			text-overflow: ellipsis;	
			white-space: nowrap;
			text-transform: capitalize;
		}
		.player-bar .controls-wpr {
			width: 120px;
			height: 54px;
			background-color: rgba(0,0,0,.0);	
			position: absolute;
			right: 0;
			left: 0;
			top: 0;
			margin-left: auto;
			margin-right: auto;
			border-radius: 50px;
			z-index: 10;
			display: flex;
		}
		.player-bar .ppBtn {			
			width: 46px;
			height: 46px;
			font-size: 32px;
			color: #000;
			line-height: 46px;
			text-align: center;
			position: absolute;
			right: 0;
			left: 0;
			margin-top: 6px;
			margin-left: auto;
			margin-right: auto;
			cursor: pointer;
			z-index: 15;
			border-radius: 50%;
		}
		
		.player-bar .play-btn:before {
			content: "\f04b";
			padding-left: 4px;
		}
		.player-bar .stop-btn:before {
			content: "\f04c";
			padding-left: 1px;
		}
		.player-bar .volume-slider {
			position: absolute;
			top: 23px;
			right: 22px;		
			z-index: 10;
		}
		.player-bar input[type=range] {
			width: 70px;
			height: 6px;
			background: none;
			padding: 6px 0px 6px 0px; 
			-webkit-appearance: none;
			transform: rotate(0deg);
			transform-origin: bottom;
			cursor: pointer;
		}
		.player-bar input[type=range]:focus {
			outline: none;
		}
		.player-bar input[type=range]::-webkit-slider-runnable-track {
			width: 100%;
			height: 6px;
			background-color: rgba(0,0,0,.16);	
			margin: 0;
			padding: 0;
			border: 0;
			border-radius: 8px;
			cursor: pointer;	
			animate: 0.2s;
		}
		.player-bar input[type=range]:focus::-webkit-slider-runnable-track {
			background-color: rgba(0,0,0,.16);
		}
		.player-bar input[type=range]::-webkit-slider-thumb {
			width: 10px;
			height: 10px;
			background-color: #000;
			margin-top: -2px;
			border-radius: 50%;
			cursor: pointer;
			-webkit-appearance: none;
		}
		.player-bar input[type=range]:hover::-webkit-slider-thumb {
			margin-top: -2px;
			-webkit-appearance: none;
			transform: scale(1.2);
		}
		.player-bar input[type=range]::-moz-range-track {
			width: 100%;
			height: 6px;
			background-color: rgba(255,255,255,.54);
			margin: 0;
			padding: 0;
			border: 0;
			border-radius: 8px;
			cursor: pointer;
			animate: 0.2s; 
		}
		.player-bar input[type=range]::-moz-range-thumb {
			width: 6px;
			height: 6px;
			background-color: #ccc;
			border: 5px solid #fff;
			border-radius: 50%;
			cursor: pointer;
		}
		.player-bar .icons {
			font-size: 24px;
			font-size: 400;
			width: 32px;
			height: 32px;
			line-height: 32px;
			text-align: center;
			color: #000;
			-webkit-transition: color 0.5s;
			-moz-transition: color 0.5s; 
			transition: color 0.5s;
			cursor: pointer;
		}
		.player-bar .icons-history {	
			position: absolute;
			right: 132px;
			top: 13px;			
		}
		.player-bar .icons-history:before {
			content: "\e889";		
		}
		.player-bar .icons-minimize {
			position: absolute;
			right: 166px;
			top: 13px;	
		}	
		.player-bar .icons-minimize:before {
			content: "\e15b";
		}		
		.player-bar .icons-close {
			position: absolute;
			right: 166px;
			top: 13px;	
			display: none;
		}
		.player-bar .icons-close:before {
			content: "\e316";
		}
		
		.player-bar .icons-popup:before {
			content: "\e04a";
			font-size: 23px;
			position: absolute;
			right: 168px;
			top: 13px;
		}
		.player-bar .icons-volume1 {
			position: absolute;
			top: 13px;
			right: 97px;
		}
		.player-bar .icons-volume1:before {
			content: "\e04f";
		}
		.player-bar .icons-volume2 {
			position: absolute;
			top: 13px;
			right: 99px;	
		}
		.player-bar .icons-volume2:before {
			content: "\e04d";
		}
		.player-bar .icons-volume3 {
			position: absolute;
			top: 13px;
			right: 97px;
		}
		.player-bar .icons-volume3:before {
			content: "\e050";
		}
		.page-header {
			position: relative;
		}
		.player-bar .icon-like {
			display: inline-block;
			color: #000;
			font-size: 22px;
			vertical-align: top;
			margin-top: 10px;
			margin-left: 12px;
			cursor: pointer;
		}
		.player-bar .icon-like:before {
			content: "\e87e";
		}
		.player-bar .liked:before {
			content: "\e87d";
			color: red;
		}
		
		.minimize .player-bar-wpr {
			width: 400px;
			position: fixed;
			height: 80px;
			bottom: 0px;
			right: 0px;
			-webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.1);
			-moz-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.1);
			box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.1);
		}
		
		.minimize .player-bar .metadata {
			margin-left: 0;
			height: 80px;
			padding-top: 16px;
			padding-left: 91px;
			box-sizing: border-box;
			display: inline-block;
		}
		
		.minimize .player-bar .songtitle {
			color: #333;
			font-size: 18px;
			font-weight: 500;
			max-width: 230px;
		}
		.minimize .player-bar .artist-info {
			color: rgba(0,0,0,.7);
			font-size: 16px;
			line-height: 18px;
			font-weight: 400;			
			max-width: 300px;
		}
		
		.minimize .player-bar-wpr .col-md-12 {
			padding: 0;
			margin: 0;
		}		
		.minimize .player-bar .artwork {
			width: 80px;
			height: 80px;
			position: absolute;
			top: 0px;
			left: 0px;
			border-radius: 0px;
		}		
		.minimize .player-bar .ppBtn {			
			width: 32px;
			height: 32px;
			font-size: 20px;
			color: #fff;
			line-height: 32px;
			text-align: center;
			position: absolute;
			left: 22px;
			top: 16px;
			border-radius: 0;
		}
		.minimize .player-bar .volume-slider, .minimize .player-bar .icons-history, .minimize .player-bar .icons-minimize {			
			display: none;
		}
		.minimize .player-bar .icons-volume1:before {
			top: 0px;
			right: 34px;
		}
		.minimize .player-bar .icons-volume2:before {
			top: 0px;
			right: 34px;	
		}
		.minimize .player-bar .icons-volume3:before {
			top: 0px;
			right: 34px;
		}
		.minimize .player-bar .icons-close:before {
			right: 8px;
			top: -2px;	
		}
		.minimize .player-bar .icons {
			font-size: 22px;
		}
		.minimize .player-bar .icon-like {
			display: block;
			font-size: 22px;
			vertical-align: none;
			margin-top: 0;
			margin-left: 0;
			position: absolute;
			top: 5px;
			right: 64px;
		}
		
		@media only screen and (max-width: 600px) {
			.player-bar .metadata-ctr {
				max-width: 300px;
			}
			.player-bar .metadata {
				margin-left: 62px;
			}
			.player-bar .songtitle {
				color: #333;
				max-width: 250px;
			}
			.player-bar .artist-info {
				color: rgba(0,0,0,.7);			
				max-width: 200px;
			}
			.player-bar .volume-slider, .player-bar .icons-minimize, .player-bar .icons-volume, .player-bar .icons-history {
				display: none;
			}
			.player-bar .ppBtn {
				right: 0px;
				left: auto;
				margin-left: 0;
				margin-right: 0;
			}
			.player-bar .icon-like {
				margin-left: 0px;
			}
			.player-bar .icons-history {
				right: 46px;		
			}
		}
		
		
		
		
		
		
		
		