*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial, sans-serif;
}

.background{
position:fixed;
width:100%;
height:100%;
background:linear-gradient(45deg,#1b1f5f,#08122d,grey,navy);
background-size:400% 400%;
animation:gradient 12s infinite alternate;
z-index:-2;
}

@keyframes gradient{

0%{background-position:left;}
100%{background-position:right;}

}

header{

position:fixed;
width:100%;
padding:20px 8%;
display:flex;
justify-content:space-between;
align-items:center;
background:rgba(255,255,255,.05);
backdrop-filter:blur(15px);
z-index:999;

}

.logo{

font-size:28px;
font-weight:bold;
color:darkblue;

}

nav a{

text-decoration:none;
color:white;
margin-left:25px;
transition:.4s;

}

nav a:hover{

color:blue;

}

body{

    min-height:100vh;

    color:white;

}



.container{
    width:90%;
    
    max-width:1000px;
    
    text-align:center;
    
    padding-top:120px;
    
    margin:0 auto;
}



h1{

    color:mediumblue;

    margin-bottom:20px;

    text-align: center;
}



.container p{

    margin-bottom:30px;

    color:#ddd;

}


.artist-container{

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

}



.artist-card{

    background:#1c2b3a;

    width:250px;

    padding:20px;

    border-radius:15px;

    transition:.3s;

}



.artist-card:hover{

    transform:translateY(-8px);

    background:#263b50;

}



.artist-card img{

    width:150px;

    height:150px;

    border-radius:50%;

    object-fit:cover;

    border:3px solid #7ef9ff;

}



.artist-card h2{

    margin:15px 0 10px;

    color:#ffdd57;

}



.artist-card p{

    font-size:14px;

    color:#ccc;

}

.back{

    display:inline-block;

    margin-top:30px;

    padding:10px 25px;

    background:#7ef9ff;

    color:black;

    text-decoration:none;

    border-radius:20px;

}



.back:hover{

    background:white;

}