style.css

* {
	padding: 0;
	margin: 0;
}

.container {
	width: auto;
}

h1 {
	text-align: center;
	font-size: 1.8rem;
	color: white;
	padding: 20 0px;
}

body {

	background-color: black;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

main {
	width: 90%;
	height: 550px;
	margin: auto;
	background-color: purple;
	border-radius: 1rem;
	border: 5px solid white;
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-wrap: wrap;
	padding: 1%;
	/*to wrap all the utem in the div to a particular width  in the border */
}

.info {
	color: grey;
	text-align: right;
	margin-right: 4rem;
	margin-top: 4px;
}

.song {
	width: 30%;
	height: 160px;
	box-shadow: 2px 2px 5px white;
	border-radius: 5%;
	cursor: pointer;
}

.a {
	background-image: url('images/title.jfif');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.b {
	background-image: url('images/taare_gin.jpg');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.c {
	background-image: url('images/khulke_jeene_ka.jfif');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.d {
	background-image: url('images/afreeda.jfif');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.e {
	background-image: url('images/main_tumhara.jfif');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.f {
	background-image: url('images/mera_naam_kizzie.jfif');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.g {
	background-image: url('images/kar_band.jfif');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.h {
	background-image: url('images/raja_ko_rani.jfif');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.i {
	background-image: url('images/maskhari.jfif');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}