*{
    box-sizing: border-box;
}

html, body{
    margin: 0;
    padding: 0;
    width: 100%;
}

body {
     font-family: 'Inter', sans-serif; 
     font-weight: 400;
}

header{
    background-color: #00728F;
    width: 100%;
    box-sizing: border-box;
    margin: 0%;
    height: 100px;
}

body {
    background-color: #E1E9F4;
    }

    .rechteck{
       background-color: #222222;
    color:#fff;
    width: 320px;
    margin: 0 auto;
    padding: 25px;
    border-radius: 15px;
    position: relative;
    box-sizing: border-box;
    }

input{
    width: 100%;
    padding: 8px;
    border-radius: 8px;
    border: none;
    background-color: #fff;
    box-sizing: border-box;
}

    h1{
        color: #fff;
        font-size: 180%;
        margin-left: 100px;
    }

    .login{
        background-color: #00728F;
        border-radius: 8px;
        border: none; 
        margin-left: 100px;
        color: #fff;
        font-size: 100%;
    }

    h3{
        color: #fff;
        font-size: 100%;
        margin-top: 40px;
        margin-left: 50px;
    }

    .x{
        background-color: #222222;
        color: #fff;
        border-radius: 8px;
        border: none;
        margin-left: 260px;
        position: absolute;
        top: 15px;
        right: 15px;
        font-size: large;
    }

    .x:hover{
        background-color: #00728F;
        color: #222222;
    }

    .login:hover{
        color: #222222;
    }

    h3:hover{
        color:#00728F;
    }

a{
    color: white;
}

a:hover{
    background-color: #00728F;
    color: #fff;
}