@charset "utf-8";

*{
	box-sizing: border-box
}


html{
	scroll-behavior: smooth;
	scroll-padding-top: 0px;
	overflow-x: hidden;
}

header{
	min-height: 60px;
	top: 0;
	left: 0;
	background-color: black;
	z-index: 100;
}

.navi{
	display: flex;
	justify-content: flex-end;
	list-style: none;
	align-content: flex-end;
	align-items: flex-end;
	margin: 0% 3%;
	gap: 3%;
	padding: 0;
	min-height: 50px;
}

.navi a:link{
	color:rgba(248, 211, 15, 1);
	text-decoration: none;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
}

.navi a:hover, a:visited{
	color: hsla(258,67%,56%,1.00);
	border-bottom: 1px solid hsla(204,27%,29%,1.00);
	padding-bottom: 2%;
	transition: 0.3s ease;
}

.section a:link, a:active{
	color: hsla(37,86%,57%,1.00)
}

.section a:hover, a:visited{
	color: hsla(336,81%,54%,1.00)
}

.logo{
	min-height: 5%;
	min-width: 5%;
	position: absolute;
	top: 0;
	left: 0;
	margin: 1%;
}

.container-fluid{
	width: 100% !important;
	position: relative;
	margin: 0 !important;
	padding: 0 !important;
}

section{
	min-height: 100vh;
	margin: auto;
	position: relative;
}

#home{
	background-color: rgba(138, 30, 30, 1);
	width: 100%;
	height: 825px;
}

img[alt="kdot1"]{
	width:150px;
	position: absolute;
	top: 0;
	left: 0;
}

img[alt="kdot nobg"]{
	width:700.97px;
	position: absolute;
	bottom: 0;
	left: -73px;
}

img[alt="kdot nfl"]{
	width:418px;
	position: absolute;
	top: 20px;
	right: 70px;
}

img[alt="crown"]{
	width:307px;
	position: absolute;
	top: 50px;
	left: 190px;
	transform: rotate(11.13deg);
	z-index: 3;
}

img[alt="kdot2"]{
	width:140px;
	position: absolute;
	top: 660px;
	left: 855px;
}

img[alt="kdotconcert"]{
	width:300px;
	position: absolute;
	top: -60px;
	right: 65px;
}

img[alt="humble1"]{
	width: 632px;
	position: absolute;
	top: 800px;
	left: 65px;
}

img[alt="humblegif"]{
	width: 567px;
	position: absolute;
	top: 1170px;
	right: 85px;
}

img[alt="damn"]{
	width: 1107px;
	position: absolute;
	bottom: 40px;
	left: 250px;
}

img[alt="gkmc"]{
	width: 493px;
	position: absolute;
	bottom: 380px;
	right: 80px;
}

img[alt="van"]{
	width: 708px;
	position: absolute;
	bottom: -200px;
	left: 200px;
	z-index: 4;
}

img[alt="damn1"]{
	position: absolute;
	top: 600px;
	left: -50px;
	width: 600px;
	border-radius: 50%;
	border: 5px black solid;
}

img[alt="play"]{
	width: 60px;
	position: absolute;
	bottom: 198px;
	right: 390px;
	z-index: 5;
	opacity: 70%;
}

img[alt="humble2"]{
	width: 529px;
	position: absolute;
	bottom: -100px;
	left: 350px;
	z-index: 5;
}

#intro{
	background-color: rgba(51, 10, 8, 1);
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 1797px;
}

.superscript {
	vertical-align: super;
	font-size: 60px; /* Adjust the size as needed */
	position: relative;
	top: -10px;
	left: -10px;
}

#intro h1{
	position: absolute;
	top: 300px;
	left: 110px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 140px;
	color: rgba(224, 224, 224, 1);
}

#intro h1+h1{
	position: absolute;
	top: 420px;
	left: 140px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 140px;
	color: rgba(224, 224, 224, 1);
}

#intro p{
	position: absolute;
	top: 860px;
	right: 130px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
	color: rgba(204, 176, 32, 1);
	width: 554px;
	text-align: right;
	line-height: 26px;
}

#intro div{
	position: absolute;
	top: 1400px;
	left: 240px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
	color: rgba(204, 176, 32, 1);
	width: 554px;
	text-align: center;
	line-height: 26px;
}

#music1{
	background-color: rgba(85, 5, 104, 1);
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 1628px;
}

#music1 h1{
	position: absolute;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 64px;
	color: rgba(224, 224, 224, 1);
	line-height: 68px;
	top: 150px;
	left: 70px;
}

#music1 p{
	position: absolute;
	width: 438px;
	text-align: right;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
	color: rgba(224, 224, 224, 1);
	line-height: 68px;
	top: 300px;
	right: 100px;
}

#music1 h2{
	position: absolute;
	top: 550px;
	left: 80px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 96px;
	color: rgba(248, 211, 15, 1);
}

#music1 h2+h2{
	position: absolute;
	top: 646px;
	left: 80px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 96px;
	color: rgba(248, 211, 15, 1);
}

.albumtitle1{
	position: absolute;
	bottom: 606px;
	left: 180px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 64px;
	color: rgba(248, 211, 15, 1);
}

.year1{
	letter-spacing: 30px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 30px;
	color: rgba(224, 224, 224, 1);
	position: absolute;
	top: 850px;
	left: 60px;
}

.content1{
	position: absolute;
	width: 708px;
	text-align: left;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
	color: rgba(224, 224, 224, 1);
	line-height: 26px;
	bottom: 400px;
	left: 180px;
}

#music2{
	background-color: rgba(91, 17, 17, 1);
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 1628px;
}

#music2 h1{
	position: absolute;
	text-align: right;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 64px;
	color: rgba(248, 211, 15, 1);
	line-height: 68px;
	top: 350px;
	right: 70px;
}

#music2 h1+p{
	position: absolute;
	text-align: right;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
	color: rgba(248, 211, 15, 1);
	top: 530px;
	right: 70px;
}

.year2{
	letter-spacing: 30px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 30px;
	color: rgba(224, 224, 224, 1);
	position: absolute;
	top: 750px;
	right: 550px;
}

.albumtitle2{
	position: absolute;
	top: 806px;
	right: 400px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 64px;
	color: rgba(248, 211, 15, 1);
}

#music2 h2{
	position: absolute;
	text-align: center;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
	color: rgba(224, 224, 224, 1);
	top: 950px;
	right: 180px;
	line-height: 26px;
	width: 708px;
}

#music2 h3{
	position: absolute;
	text-align: right;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
	color: rgba(224, 224, 224, 1);
	top: 1200px;
	right: 120px;
	line-height: 26px;
	width: 474px;
}

.cta-button {
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
    color: rgba(248, 211, 15, 1);
	background-color: rgba(157,72,74,1.00);
    padding: 15 50 0 100;
    text-decoration: none;
    font-size: 36px;
	text-align: right;
    border-radius: 3%;
    transition: background-color 0.3s ease, transform 0.3s ease;
    cursor: pointer;
    border: 1px rgba(248, 211, 15, 1) solid;
	position: absolute;
	bottom: 270px;
	right: 200px;
	width: 255px;
}

.cta-button:hover {
    background-color: hsla(258,67%,56%,1.00);
    transform: scale(1.05);
}

#albums{
	background-color: rgba(47, 7, 34, 1);
	top: 0;
	left: 0;
	width: 100%;
	height: 1300px;
}

#albums h1{
	text-align: center;
	width: 100%;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 80px;
	color: rgba(224, 224, 224, 1);
	padding-top: 200px;
	padding-right: auto;
	padding-left: auto;
}

#contact{
	background-color:rgba(84, 49, 92, 1);
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 847px;
}

#contact h1{
	position: absolute;
	text-align: left;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 64px;
	color: rgba(248, 211, 15, 1);
	top: 130px;
	left: 240px;
}

#contact h2{
	position: absolute;
	text-align: left;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 40px;
	color: rgba(224, 224, 224, 1);
	top: 280px;
	left: 420px;
}

#contact h2+h2{
	position: absolute;
	text-align: left;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 40px;
	color: rgba(224, 224, 224, 1);
	top: 410px;
	left: 420px;
}

#contact h3{
	position: absolute;
	text-align: left;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 40px;
	color: rgba(224, 224, 224, 1);
	top: 540px;
	left: 420px;
}

.mediasocial{
	position: absolute;
	text-align: left;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 30px;
	color: rgba(248, 211, 15, 1);
	bottom: 40px;
	left: 140px;
	justify-content: flex-start;
	display: flex;
	gap: 14%
}

.mediasocial a:link{
	color:rgba(248, 211, 15, 1);
	text-decoration: none;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
}

.mediasocial a:hover, a:visited{
	color: rgba(248, 211, 15, 1);
	border-bottom: 1px solid rgba(5,5,5,1.00);
	padding-bottom: 2%;
	transition: 0.3s ease;
}
.arrow{
	position: absolute;
	bottom: 0px;
	right: 100px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 306px;
	color: rgba(248, 211, 15, 1);
}

#arrow{
	color: rgba(248, 211, 15, 1);	
}

#arrow a:link{
	color:rgba(248, 211, 15, 1);
	text-decoration: none;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
}

#arrow a:hover, a:visited{
	color: rgba(248, 211, 15, 1);
	border-bottom: 1px solid hsla(204,27%,29%,1.00);
	padding-bottom: 2%;
	transition: 0.3s ease;
}

form{
	margin:auto;
}

footer{
	background-color: black;
	height: 209px;
}

footer p{
	text-align: center;
	width: 897px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 16px;
	line-height: 26px;
	color: rgba(224, 224, 224, 1);
	padding-top: 50px;
	margin-right: auto;
	margin-left: auto;
}

footer div{
	text-align: center;
	width: 897px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 16px;
	line-height: 26px;
	color: rgba(224, 224, 224, 1);
	padding-top: 10px;
	margin-right: auto;
	margin-left: auto;
}

footer h1{
	text-align: center;
	width: 897px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 16px;
	line-height: 26px;
	color: rgba(224, 224, 224, 1);
	padding-top: 15px;
	margin-right: auto;
	margin-left: auto;
}

#home .hidden-1{
	position: absolute;
	top: 125px;
	left: 140px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 190px;
	color: rgba(248, 211, 15, 1);
}

#home .hidden-2{
	position: absolute;
	top: 300px;
	right: 120px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 190px;
	color: rgba(248, 211, 15, 1);
}

#home p{
	position: absolute;
	top: 550px;
	right: 120px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
	color: rgba(248, 211, 15, 1);
}

#home p+p{
	position: absolute;
	top: 580px;
	right: 120px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 24px;
	color: rgba(248, 211, 15, 1);
}

.sec-1 .hidden-1{
	opacity: 0;
	transition: all 3s ease;
	transform: translateX(-50%);
	position: absolute;
	top: 60px;
	left: 190px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 190px;
	color: rgba(248, 211, 15, 1);
}

.sec-1.show .hidden-1{
	opacity: 100;
	transform: translateX(0%);
	color: rgba(248, 211, 15, 1);
}

.sec-1 .hidden-2{
	opacity: 0;
	transition: all 3s ease-out;
	transform: translateY(150%)
}

.sec-1.show .hidden-2{
	opacity: 100;
	transform: translateY(0%)
}

.sec-2 .hidden-1{
	opacity: 0;
	transition: all 3s ease;
	transform: translateX(-50%);
}

.sec-2.show .hidden-1{
	opacity: 100;
	transform: translateX(0)
}

#songCover{
	width:600px;
	height:auto;
	margin: 100px 0 0 50px;
	border-radius: 50%;
	transition: transform 0.1s ease;
}

.carousel-container {
	width: 70%; /* Adjust this value as needed */
	margin:  auto;
	padding-top: 70px;
}

.carousel-item img {
	width: 100%; /* Adjust this value as needed */
	height: auto; /* Maintain aspect ratio */
	max-width: 60%; /* Max width for the image */
	margin: auto;
}

.carousel-item h5{
	background-color: rgba(0, 0, 0, 0.6);
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
	width: 50%;
	margin: auto;
}

/* .rotate 
	animation: rotation 8s infinite linear;
}

@keyframes rotation {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
} */
@media only screen and (max-width: 996px){
html{
	scroll-behavior: smooth;
	scroll-padding-top:0px;
}

header{
	min-height: 30px;
	top: 0;
	left: 0;
	background-color: black;
	z-index: 100;
}

.navi{
	display: flex;
	justify-content: flex-end;
	list-style: none;
	align-content: flex-end;
	align-items: flex-end;
	margin: 0% 3%;
	gap: 3%;
	padding: 0;
	min-height: 30px;
}

.navi a:link{
	color:rgba(248, 211, 15, 1);
	text-decoration: none;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 14px;
}

.navi a:hover, a:visited{
	color: hsla(258,67%,56%,1.00);
	border-bottom: 1px solid hsla(204,27%,29%,1.00);
	padding-bottom: 2%;
	transition: 0.3s ease;
}

.section a:link, a:active{
	color: hsla(37,86%,57%,1.00)
}

.section a:hover, a:visited{
	color: hsla(336,81%,54%,1.00)
}

.logo{
	min-height: 5%;
	min-width: 5%;
	position: absolute;
	top: 0;
	left: 0;
	margin: 1%;
}

.container-fluid{
	width: 100% !important;
	position: relative;
	margin: 0 !important;
	padding: 0 !important;
}

section{
	min-height: 0;
	margin: auto;
	position: relative;
}

#home{
	background-color: rgba(138, 30, 30, 1);
	width: 100%;
	height: 350px;
}

img[alt="kdot1"]{
	width:70px;
	position: absolute;
	top: 0;
	left: 0;
}

img[alt="kdot nobg"]{
	width:300px;
	position: absolute;
	bottom: 0;
	left: -73px;
}

img[alt="kdot nfl"]{
	width:200px;
	position: absolute;
	top: 20px;
	right: 20px;
}

img[alt="crown"]{
	width:100px;
	position: absolute;
	top: 30px;
	left: 50px;
	transform: rotate(11.13deg);
	z-index: 3;
}

img[alt="kdot2"]{
	width:40px;
	position: absolute;
	top:270px;
	z-index:100;
	left: 250px;
}

img[alt="kdotconcert"]{
	width:90px;
	position: absolute;
	top: -30px;
	right: 65px;
}

img[alt="humble1"]{
	width: 180px;
	position: absolute;
	top: 400px;
	left: 20px;
}

img[alt="humblegif"]{
	width: 200px;
	position: absolute;
	top: 600px;
	right: 20px;
}

img[alt="damn"]{
	width: 300px;
	position: absolute;
	bottom: 20px;
	left: 60px;
}

img[alt="gkmc"]{
	width: 143px;
	position: absolute;
	bottom: 100px;
	right: 10px;
}

img[alt="van"]{
	width: 158px;
	position: absolute;
	bottom: -50px;
	left: 50px;
	z-index: 4;
}

img[alt="damn1"]{
	position: absolute;
	top: 300px;
	left: -70px;
	width: 240px;
	border-radius: 50%;
	border: 2px black solid;
}

img[alt="play"]{
	width: 60px;
	position: absolute;
	bottom: 198px;
	right: 390px;
	z-index: 5;
	opacity: 70%;
}

img[alt="humble2"]{
	width: 200px;
	position: absolute;
	bottom: -90px;
	left: 50px;
	z-index: 5;
}


#intro{
	background-color: rgba(51, 10, 8, 1);
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 810px;
}

.superscript {
	vertical-align: super;
	font-size: 20px; /* Adjust the size as needed */
	position: relative;
	top: 0px;
	left: -10px;
	width:100px;
	line-height: 20px;
}

#intro h1{
	position: absolute;
	top: 160px;
	left: 30px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 40px;
	color: rgba(224, 224, 224, 1);
}

#intro h1+h1{
	position: absolute;
	top: 200px;
	left: 50px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 40px;
	color: rgba(224, 224, 224, 1);
}

#intro p{
	position: absolute;
	top: 430px;
	right: 20px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	color: rgba(204, 176, 32, 1);
	width: 184px;
	text-align: right;
	line-height: 12px;
}

#intro div{
	position: absolute;
	top: 640px;
	left: 20px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	color: rgba(204, 176, 32, 1);
	width: 184px;
	text-align: center;
	line-height: 12px;
}

#music1{
	background-color: rgba(85, 5, 104, 1);
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 800px;
}

#music1 h1{
	position: absolute;
	width: 89%;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 30px;
	color: rgba(224, 224, 224, 1);
	line-height: 32px;
	top: 40px;
	left: 20px;
}

#music1 p{
	position: absolute;
	width: 438px;
	text-align: right;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	color: rgba(224, 224, 224, 1);
	line-height: 10px;
	top: 180px;
	right: 10px;
}

#music1 h2{
	position: absolute;
	top: 350px;
	left: 20px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 30px;
	color: rgba(248, 211, 15, 1);
}

#music1 h2+h2{
	position: absolute;
	top: 380px;
	left: 20px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 30px;
	color: rgba(248, 211, 15, 1);
}

.albumtitle1{
	position: absolute;
	top: 490px;
	left: 30px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 28px;
	color: rgba(248, 211, 15, 1);
}

.year1{
	letter-spacing: 12px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 15px;
	color: rgba(224, 224, 224, 1);
	position: absolute;
	top: 470px;
	left: 10px;
}

.content1{
	position: absolute;
	width: 50%;
	text-align: left;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	color: rgba(224, 224, 224, 1);
	line-height: 12px;
	bottom: 130px;
	left: 30px;
}

#music2{
	background-color: rgba(91, 17, 17, 1);
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 730px;
}

#music2 h1{
	position: absolute;
	text-align: right;
	width: 90%;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 30px;
	color: rgba(248, 211, 15, 1);
	line-height: 32px;
	top: 100px;
	right: 20px;
}

#music2 h1+p{
	position: absolute;
	text-align: right;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	color: rgba(248, 211, 15, 1);
	top: 240px;
	right: 20px;
}

.year2{
	letter-spacing: 12px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 15px;
	color: rgba(224, 224, 224, 1);
	position: absolute;
	top: 340px;
	right: 160px;
}

.albumtitle2{
	position: absolute;
	top: 370px;
	right: 80px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 28px;
	color: rgba(248, 211, 15, 1);
}

#music2 h2{
	position: absolute;
	text-align: center;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	color: rgba(224, 224, 224, 1);
	top: 440px;
	right: 80px;
	line-height: 12px;
	width: 37%;
}

#music2 h3{
	position: absolute;
	text-align: right;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	color: rgba(224, 224, 224, 1);
	top: 560px;
	right: 20px;
	line-height: 12px;
	width: 30%;
}

.cta-button {
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
    color: rgba(248, 211, 15, 1);
	background-color: rgba(157,72,74,1.00);
    padding: 15 50 0 100;
    text-decoration: none;
    font-size: 10px;
	text-align: right;
    border-radius: 3%;
    transition: background-color 0.3s ease, transform 0.3s ease;
    cursor: pointer;
    border: 1px rgba(248, 211, 15, 1) solid;
	position: absolute;
	bottom: 70px;
	right: 80px;
	width: 20%;
}

.cta-button:hover {
    background-color: hsla(258,67%,56%,1.00);
    transform: scale(1.05);
}

#albums{
	background-color: rgba(47, 7, 34, 1);
	top: 0;
	left: 0;
	width: 100%;
	height: 600px;
}

#albums h1{
	text-align: center;
	width: 100%;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 30px;
	color: rgba(224, 224, 224, 1);
	padding-top: 200px;
	padding-right: auto;
	padding-left: auto;
}

#contact{
	background-color:rgba(84, 49, 92, 1);
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 497px;
}

#contact h1{
	position: absolute;
	text-align: left;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 30px;
	color: rgba(248, 211, 15, 1);
	top: 50px;
	left: 20px;
}

#contact h2{
	position: absolute;
	text-align: left;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 25px;
	color: rgba(224, 224, 224, 1);
	top: 160px;
	left: 40px;
}

#contact h2+h2{
	position: absolute;
	text-align: left;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 25px;
	color: rgba(224, 224, 224, 1);
	top: 200px;
	left: 40px;
}

#contact h3{
	position: absolute;
	text-align: left;
	width: 1358px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 25px;
	color: rgba(224, 224, 224, 1);
	top: 240px;
	left: 40px;
}

.mediasocial{
	position: absolute;
	text-align: left;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 14px;
	color: rgba(248, 211, 15, 1);
	bottom: 40px;
	left: 15px;
	justify-content: flex-start;
	display: flex;
	gap: 6%
}

.mediasocial a:link{
	color:rgba(248, 211, 15, 1);
	text-decoration: none;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 14px;
}

.mediasocial a:hover, a:visited{
	color: rgba(248, 211, 15, 1);
	border-bottom: 1px solid rgba(5,5,5,1.00);
	padding-bottom: 2%;
	transition: 0.3s ease;
}
.arrow{
	position: absolute;
	bottom: 60px;
	right: 17px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 100px;
	color: rgba(248, 211, 15, 1);
}

#arrow{
	color: rgba(248, 211, 15, 1);	
}

#arrow a:link{
	color:rgba(248, 211, 15, 1);
	text-decoration: none;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
}

#arrow a:hover, a:visited{
	color: rgba(248, 211, 15, 1);
	border-bottom: 1px solid hsla(204,27%,29%,1.00);
	padding-bottom: 2%;
	transition: 0.3s ease;
}

form{
	margin:auto;
}

footer{
	background-color: black;
	height: 200px;
	
}

footer p{
	text-align: center;
	width: 95%;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	line-height: 12px;
	color: rgba(224, 224, 224, 1);
	padding-top: 50px;
	margin-right: auto;
	margin-left: auto;
}

footer div{
	text-align: center;
	width: 95%;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	line-height: 12px;
	color: rgba(224, 224, 224, 1);
	padding-top: 10px;
	margin-right: auto;
	margin-left: auto;
}

footer h1{
	text-align: center;
	width: 95%;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 10px;
	line-height: 12px;
	color: rgba(224, 224, 224, 1);
	padding-top: 15px;
	margin-right: auto;
	margin-left: auto;
}

#home .hidden-1{
	position: absolute;
	top: 60px;
	left: 20px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 70px;
	color: rgba(248, 211, 15, 1);
}

#home .hidden-2{
	position: absolute;
	top: 130px;
	right: 30px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 70px;
	color: rgba(248, 211, 15, 1);
}

#home p{
	position: absolute;
	top: 230px;
	right: 20px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 8px;
	color: rgba(248, 211, 15, 1);
}

#home p+p{
	position: absolute;
	top:240px;
	right: 20px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 8px;
	color: rgba(248, 211, 15, 1);
}

.sec-1 .hidden-1{
	opacity: 0;
	transition: all 3s ease;
	transform: translateX(-50%);
	position: absolute;
	top: 60px;
	left: 190px;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-size: 70px;
	color: rgba(248, 211, 15, 1);
}

.sec-1.show .hidden-1{
	opacity: 100;
	transform: translateX(0%);
	color: rgba(248, 211, 15, 1);
}

.sec-1 .hidden-2{
	opacity: 0;
	transition: all 3s ease-out;
	transform: translateY(150%)
}

.sec-1.show .hidden-2{
	opacity: 100;
	transform: translateY(0%)
}

.sec-2 .hidden-1{
	opacity: 0;
	transition: all 3s ease;
	transform: translateX(-50%);
}

.sec-2.show .hidden-1{
	opacity: 100;
	transform: translateX(0)
}

#songCover{
	width:100px;
	height:auto;
	margin: 100px 0 0 50px;
	border-radius: 50%;
	transition: transform 0.1s ease;
}

.carousel-container {
	width: 70%; /* Adjust this value as needed */
	margin:  auto;
	padding-top: 70px;
}

.carousel-item img {
	width: 100%; /* Adjust this value as needed */
	height: auto; /* Maintain aspect ratio */
	max-width: 70%; /* Max width for the image */
	margin: auto;
}

.carousel-item h5{
	background-color: rgba(0, 0, 0, 0.6);
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
	width: 50%;
	margin: auto;
}
	

	
}