body {
    margin: 20px;
    padding: 0px;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;

}

a {
    color: black;
}

main {
    padding: 20px;
    width: 50%;
    min-width: 600px;
}

.halbtag {
    padding: 20px;
    width: 50%;
    min-width: 600px;
    background: linear-gradient(-45deg, rgba(0,0,0,0.22), rgba(255,255,255,0.25));
    border-radius: 50px;
    box-shadow:
            12px 12px 16px 0 rgba(0, 0, 0, 0.25),
            -8px -8px 12px 0 rgba(255, 219, 239, 0.3);
    margin-bottom:1em;
    margin-top:1em;
}


li{
    list-style-type: none;
}
h1 {
    font-size: 28px;
    font-weight: 400;
}

h2 {
    font-size: 24px;
    font-weight: 600;
}

span{
    color: rgb(128, 109, 137);
    font-weight:600;
}
span::before{
    content:"@todo ";
    display: inline-block;
    padding-right:0.5em;
}


.square {
    width: 100px;
    height: 100px;
    background-color: #2ba3ff;
    border: 1px solid blue;
    margin: 10px;
}
.rectangle {
    width: 200px;
    height: 100px;
    background-color: blue;
    border-bottom: 3px dashed #f72919;
    margin: 10px;
}

.circle {
    height: 200px;
    width: 200px;
    background-color: #36a1b0;
    border-radius: 50%;
    box-shadow: 0 4px 8px 0 rgb(39, 66, 131), 0 6px 20px 0 rgb(255, 74, 70), 0px 50px 50px 0 rgb(46, 204, 255);
    margin: 50px;
}