*{
    text-decoration: none;
    padding: 0;
    margin: 0;
    color: white;
    list-style: none;

}


body{

    background: linear-gradient(#5b0067 100%, purple);
    width: 100vw;
    height: 100vh;
    
}


.playlist{

    align-items: center;
    text-align: center;
}

.playlist iframe{
    height: 60vh;
    width: 95vw;
    border:2px solid black;
    border-radius: 15px;

}

.title > img{
    width: 10vw;
    height: 10vh;
}
.title{
    
  
    display: flex;
    color: white;
    justify-content: center;
    align-items: center;
    background:black;
    font-size: small;



    padding: 1rem;
    margin-bottom: 1rem;
   
}
h1{
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    color: white(24, 12, 32, 0.918);

}


.links ul{
    padding: 2rem;

    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
    

}

a {
    background:  transparent;
    border-radius: 10px;
    padding: 0.5rem 2rem;
    border:2px solid rgba(255, 255, 255, 0.298);
    color: white;
    font-family:monospace;
}

a:hover{
    background: white;
    color: black;
    transition: 1s;
}


svg{
    height: 5vh;
}
.links ul li{

    
    display: flex;
    gap: 20px;
    align-items: center;
    

}

.bord{
    border-bottom: 3px solid black;
}

.title h1:hover{
    color: rgb(177, 59, 177);
    font-size: 30px;
    transition: 2s;
}

.made{

    
    display: flex;
    justify-content: center;
    justify-items: center;
    

}

.made > h3{
    
    padding: 1.5rem;
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    font-weight: bolder;
    font-size: medium;
    
    color: black;

}
span{
    background: #000;
    padding: 0.5rem;
    border-radius: 5px;
    color:rgba(88, 71, 71, 0.564);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: medium;
    
 
}

@media (max-width:440px) {
    .playlist iframe{
        height: 70vh;
        width: 95vw;
        border:none;
    
    }
    .links ul{
        flex-direction: column;
        align-items: center;

    }
    .links ul li > a{
        border-color:rgba(255, 255, 255, 0.637);
        width: 80px;
        font-size: 17px;
        width: 100%;

    }
    .links ul li > svg{
        width: 50px;
    }

    .bord{
        
        display: none;
    }
    .title{
        margin-bottom: 2rem;
    }
}