/* ==========================
   RESET
========================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

/* ==========================
   BODY
========================== */

html,
body{
    width:100%;
    height:100%;
}

body{

    background-image:url("background.jpg");

    background-size:cover;

    background-position:center center;

    background-repeat:no-repeat;

    background-attachment:fixed;

    font-family:
        "Helvetica Neue",
        Helvetica,
        Arial,
        sans-serif;

    color:#ffffff;

}

/* ==========================
   DUNKLER ÜBERLAGERUNGSEFFEKT
========================== */

.overlay{

    width:100%;
    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

    background:rgba(0,0,0,.35);

    text-align:center;

    padding:40px;

}

/* ==========================
   INHALT
========================== */

.content{

    max-width:700px;

}

h1{

    font-size:clamp(2.8rem,7vw,5rem);

    font-weight:300;

    letter-spacing:.08em;

    margin-bottom:20px;

}

h2 {
    font-size:clamp(2rem,7vw,1.3rem) ;
    font-weight: 300;
    letter-spacing: .08em;
    margin-top: 1em;
    margin-bottom: 1em;
}

.claim{

    font-size:clamp(1.2rem,2vw,1.8rem);

    margin-bottom:25px;

    font-weight:300;

}

.text{

    font-size:clamp(1rem,1.3vw,1.2rem);

    line-height:1.7;

    opacity:.9;

}

/* ==========================
   LINK
========================== */

a{

    display:inline-block;

    margin-top:40px;

    color:white;

    text-decoration:none;

    border-bottom:1px solid rgba(255,255,255,.5);

    transition:.3s;

}

a:hover{

    border-bottom-color:white;

}