@import url('https://fonts.cdnfonts.com/css/trajan-pro');
@import url('https://fonts.cdnfonts.com/css/perpetua-titling-mt');

body{
    background-image:url('./bilder/Hollow.jpg');
    background-attachment:fixed;
    background-repeat: no-repeat;
    text-align: center;
    font-family: 'Trajan Pro', sans-serif;

}

header{
    font-family: 'Perpetua Titling MT', sans-serif;
    background-color: rgba(48, 48, 48, 0.594);
    color: #fff;
    position: fixed;
    z-index: 10; /* högre än main */
    width: 100%;
    top: 0;
    left: 0;
    border-bottom:2px solid #000000;
}

header a{
    text-decoration: none;
    color: #fff;
}

header h1{
    border-bottom: #000 1px solid;
}

header a:hover{
    color: #000000;
}

main {
    text-align: center;
    color: #fff;
    margin-top: 200px;
    z-index: 2;
}

footer{
    color:#fff;
}

.navlinks{
    display: flex;
    border-radius: 10px;
    padding: 10px 0 20px 0;
    justify-content: space-around;

}

.navlinks a{
text-decoration: none;
font-size: larger;
color: #fff;
padding: 20px; 
border-radius: 10px;
}

h2{
    color: white;
    -webkit-text-stroke: 0.5px black; /* Outline thickness and color */
    -webkit-text-fill-color: white; 
}

h3{
    color: white; 
    -webkit-text-stroke: 0.5px black; 
    -webkit-text-fill-color: white;
}

h4{  
    color: white;
    -webkit-text-stroke: 0.5px black; 
    -webkit-text-fill-color: white; 
}

#container-song{
    text-align: center;
    margin-left: -40px;
}

fieldset{
    background-color: rgba(179, 55, 146, 0.231);
    border: #fff solid 2px;
}

fieldset legend{
    color: white;
    -webkit-text-stroke: 0.1px black; 
    -webkit-text-fill-color: white;
}

button{
    font-family: 'Trajan Pro', sans-serif;
    padding: 1rem;
}

button:hover{
    background-color: #202020c8;
    color: #fff;
    cursor:grab;
}

.hornet{
    box-shadow: 10px 10px 10px #000000;
    border-radius: 20px;
}

.larkin{
    color: #fff;
    text-decoration: underline;
}

.card{
    display: flex;
    flex-flow: column wrap;
    max-width: 350px;
    background-color: rgba(179, 55, 146, 0.231);
    border: #000000 solid 3px;
    border-radius: 20px;
    margin: 10px 0 10px 0;
    text-align: center;
}

#E2725B

.card img{
    border-radius: 20px;
}

.card button{
    margin-left: 4rem;
    margin-right: 4rem;
}

.container-silk{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}