*{
    box-sizing: border-box;
    margin:0;
}
/* Header */
header{
    display:flex;
    justify-content: center;
    align-items: center;
    width:100%;
    height:100px;
    background: rgb(152,114,75);
    background: radial-gradient(circle, rgb(14, 62, 134) 0%, rgb(22, 145, 61) 50%, rgb(0, 51, 33) 100%);
    border-bottom:2px solid #000000;
    z-index: 99999;
}
#theHub{
    font-family: 'Turret Road', cursive;
    font-size:3rem;
    color:#ffffff;
}
/* main */
body{
    background-image: url(../IMG/background.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}
main{
    margin: 2rem 2vw 6rem 2vw;
    z-index:99999;
    
}
h1{
    font-family: 'turret Road', cursive;
    color:#ffffff;
}
h2, h3{
    font-family: 'turret Road', cursive; 
    margin: 2rem 0 2rem 0;
    color:#ffffff;
}
h4{
    display:none;
}
p, .reasons{
    font-family:Arial, Helvetica, sans-serif;
    margin:10px 0 10px 0;
    color:#ffffff;

}
#pointQuote{
    margin-top:20px;
}
/* fakta bokse */
.collapsible {
    padding: 8px;
    border:2px solid #ffffff;
    background-color: gray;
    font-family: 'turret road', cursive;
    font-size:20px;
    font-weight:600;
    margin-top:20px;
    text-align:center;
    color:#ffffff;
    cursor:pointer;
} 
.active, .collapsible:hover {
    background-color: rgb(14,62,134);
}
.content {
    padding: 0 18px;
    display: none;
    overflow: hidden;
    background-color: rgb(14,62,134);
    color:#ffffff;
    font-family:Arial, Helvetica, sans-serif;
    margin:10px 0 10px 0;
    color:#ffffff;
    padding:1rem;
}
li{
    margin:10px 0 10px 0;
    border-bottom:1px dotted #ffffff;
}
/* Spørgsmål */
article{
    max-width:1200px;
    margin:0 auto;
    display:flex;
    flex-direction: column;
    justify-content:center;
    margin-bottom:10vh;
}
img{
    max-width:100%;
    border:2px solid rgb(14, 62, 134);
    cursor:pointer;
    object-fit:contain;
    background-color:#ffffff;
}
button{
    padding: 8px;
    border:5px solid rgb(14,62,134);
    background-color: rgb(22,145,61);
    font-family: 'turret road', cursive;
    font-size:20px;
    font-weight:600;
    margin-top:20px;
    text-align:center;
    color:#ffffff;
    cursor:pointer;
}
.reasons{
    border:unset;
}
.list{
    background-color:yellow;
}
/* Link tilbage til The Tavern */
a{
    text-decoration:none;
    color:#ffffff;
    font-family: 'lobster', cursive;
    cursor:pointer;
    display:flex;
    justify-content: center;
    margin-top:50px;
}
footer{
    position:fixed;
    height:50px;
    display:flex;
    justify-content:center;
    align-items: center;
    width:100%;
    background: rgb(152,114,75);
    background: radial-gradient(circle, rgb(14, 62, 134) 0%, rgb(22, 145, 61) 50%, rgb(0, 51, 33) 100%);
    border-top:2px solid #000000;
    bottom:0;
    z-index: 99999;
}
#pointLine{
    font-family: 'Turret Road', cursive;
    font-size:1.6rem;
    font-weight:600;
    color:#ffffff;
}

@media only screen and (min-width: 600px) {

    main{
        margin: 2rem 10vw 6rem 10vw; 
    }
    div{
        display:grid;
        grid-template-columns: 1fr 1fr;
        grid-gap:10px;
    }
    button{
        width:400px;
    }
    img{
        aspect-ratio:41 / 27;
    }
}