/*==========  Desktop First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

	.results div span.title {
		width: 50%;
	}

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
	.genre-padd {
		display: none;
		padding: 0px 0 50px 0 !important;
	}

	.genre .genre-padd a {
		display: block;
		max-width: 100%;
	}

	.results div span.title {
		width: 60%;
	}

	.button_list {
		display: block !important;
	}

	.mute, .volumeBar {
		display: none;
	}

	.progressBar {
		max-width: 100%;
	}

}

@media only screen and (max-width: 660px) {

	.col-xs-6 {
		width: 100%;
	}

	.popular_music {
		margin: 0px auto;
	}

	.results div span.title {
		width: 50%;
	}

	span.soc-buttons {
		display: block;
		padding: 12px 0 0;
		float: none;
		text-align: center;
	}

	.main-logo {
		font-size: 40px;
	}

	.popular {
		text-align: center;
		float: none !important;
		margin: 0;
	}

	.searchf {
		float: none !important;
		margin: 0px auto;
		width: 168px;
	}

	.search-line {
		padding: 10px 0 20px 0;
	}

	.results div {
		margin: 10px;
	}

	.content_wrapper {
		padding: 0;
	}
}


@media (max-width: 570px) {
	.results div span.title {
		width: 45%;
	}

	.results a.share {
		display: none;
	}

}



@media (max-width: 312px) {
	i.off {
		display: none;
	}

	.popular {
		background: #fff;
	}

	.results div span.title {
		width: 30%;
	}

}

/* Extra Small Devices, Phones137 */
@media only screen and (max-width : 480px) {
	.results div a.lyrics {
		display: none;
	}
}


@media (max-width: 570px) {
	.results div span.title {
		width: 40%;
	}
}


/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}


/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {

}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {

}

/* Small Devices, Tablets */
@media only screen and (min-width : 769px) {
	.genre-padd {
		display: block !important;
	}
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

}
/*
     */
/*
*/