@font-face {
	font-family: 'FontAwesome';
	src: url('../fonts/fontawesome-webfont.eot?v=4.4.0');
	src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
	font-weight: normal;
	font-style: normal;
}
.fa {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.fa-play-circle-o:before {
	content: "\f01d";
}
.fa-play-circle:before {
	content: "\f144";
}
.fa-play:before {
	content: "\f04b";
}
.fa-pause:before {
	content: "\f04c";
}
.albumSingle{
	padding: 100px 0;
}

#carousel {
	/*position: relative;*/
	height: 400px;
	/*top: 50%;*/
	/*transform: translateY(50%);*/
	overflow: hidden;
	position: relative;
}

#carousel div {
	position: absolute;
	transition: transform 1s, left 1s, opacity 1s, z-index 0s;
	opacity: 1;
}
#carousel div img {
	width: 400px;
	transition: width 1s;
}

#carousel div.hideLeft {
	left: 0%;
	opacity: 0;
	transform: translateY(50%) translateX(-50%);
}
#carousel div.hideLeft img {
	width: 200px;
}
#carousel div.hideRight {
	left: 100%;
	opacity: 0;
	transform: translateY(50%) translateX(-50%);
}
#carousel div.hideRight img {
	width: 200px;
}
#carousel div.prev {
	z-index: 5;
	left: 30%;
	transform: translateY(50px) translateX(-50%);
}
#carousel div.prev img {
	width: 300px;
}
#carousel div.prevLeftSecond {
	z-index: 4;
	left: 15%;
	transform: translateY(50%) translateX(-50%);
	opacity: 0.7;
}
#carousel div.prevLeftSecond img {
	width: 200px;
}
#carousel div.selected {
	z-index: 10;
	left: 50%;
	transform: translateY(0px) translateX(-50%);
}
#carousel div.next {
	z-index: 5;
	left: 70%;
	transform: translateY(50px) translateX(-50%);
}
#carousel div.next img {
	width: 300px;
}
#carousel div.nextRightSecond {
	z-index: 4;
	left: 85%;
	transform: translateY(50%) translateX(-50%);
	opacity: 0.7;
}
#carousel div.nextRightSecond img {
	width: 200px;
}

#song-info{
	background: linear-gradient(135deg, #43cbff 10%, #9708cc 100%);
	border-radius: 0.5rem;
	padding: 1rem;
	width: 400px;
}

#song-info.blue {
	background: linear-gradient(135deg, #8ADAB2 10%, #465efb 100%);
}

.generate-song{
	display: flex;
	align-items: center;
	justify-content: center;
}

.mobile-song-lyrics {
	background: rgba(255, 255, 255, 0.7);
	width: 240px;
	height: 240px;
	overflow-y: auto;
	z-index: 999;
	position: absolute;
	padding: 20px;
	border-radius: 15px;
	font-size: 14px;
	white-space: pre-wrap;
	left: 50%;
	top: 5%;
	transform: translateX(-50%);
	text-align: left;
	display: none;
}

#song-lyrics {
	font-size: 16px;
	overflow-y: hidden;
	height: 40px; /* Adjust as necessary */
	white-space: pre-wrap;
	position: relative;
	margin-top: 5px;
}



@media (max-width: 800px) {

	.albumSingle{
		padding: 100px 0;
	}

	#carousel {
		height: 340px;
		overflow: hidden;
	}

	#song-info{
		width: 80px;
		justify-content: center;
		padding: 0.4rem;
	}

	.song-details{
		display: none;
	}

	#carousel div img {
		width: 280px;
		transition: width 1s;
	}

	#carousel div.next img {
		width: 180px;
	}

	#carousel div.prev img {
		width: 180px;
	}

	#carousel div.prevLeftSecond img {
		width: 100px;
	}

	#carousel div.nextRightSecond img {
		width: 100px;
	}

	.mobile-song-lyrics {
		display: block;
	}
}