h1,
h2,
h3,
h4,
h5
{
    margin-top: 0;
}

h1
{
    margin-bottom: 15px;
}

h4
{
    font-size: 20px;
}

h5
{
    margin-bottom: 5px;
}

hr {
    box-shadow: 0 0;
    border-top: 1px solid #ccc;
    border-bottom: 0;
}

fieldset
{
    border: none;
    padding: 0;
    margin: 0;
}

.container
{
    /*min-height: 100vh;*/
}

.hidden
{
    display: none;
}

.mockup
{
    background-size: cover;
    background-position: center top;
    height: 100vh;
    max-width: 1600px;
    margin: 0 auto;
    filter: blur(10px);
}

.registration
{
    height: 100vh;
    position: fixed;
    z-index: 50;
    top: 0;
    width: 100%;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;

    .top
    {
        text-align: center;
    }

    .form
    {
        position: fixed;
        max-width: 500px;
        width: calc(100% - 40px);
        max-height: calc(100vh - 75px);
        overflow-y: auto;
        background-color: white;
        box-sizing: border-box;
        padding: 40px 40px 20px;
        margin: 20px;
        border-radius: 10px;
        box-shadow: 0 0 15px rgba(0,0,0,0.05);
    }

    .step
    {
        min-height: 165px;

        .stepMessage
        {
            font-weight: bold;
            color: #752121;
        }
    }

    .step.hidden
    {
        display: none;
    }

    .step.subcategories .group.hidden,
    .step.levels .group.hidden
    {
        display: none;
    }

    .radio .input
    {
        padding: 5px 0;
    }

    .input.required > label:after
    {
        content: "*";
        color: #dd0000;
    }

    .buttons
    {
        padding-top: 40px;

        button
        {
            -webkit-appearance: none;
            appearance: none;
            border: none;
            background-color: #005bd1; /* insert correct color */
            color: white;
            cursor: pointer;
            padding: 13px 25px;
            transition: all 0.2s;
            border-radius: 25px;
            margin: 0 5px;
            font-size: 17px;
            font-weight: bold;
            font-family: "Work Sans", sans-serif;
        }

        button:hover
        {
            background-color: #003bb1;
        }

        button.hidden
        {
            display: none;
            pointer-events: none;
        }

        button.disabled
        {
            opacity: 0.4;
            pointer-events: none;
        }
    }

    .bullets
    {
        padding-top: 25px;
        text-align: center;

        .bullet
        {
            display: inline-block;
            width: 10px;
            height: 10px;
            border-radius: 50%;
            line-height: 0;
            background: #eee;
            margin-right: 8px;
        }

        .bullet.active
        {
            background: #ccc;
        }

        .bullet.error
        {
            background: #c75e5e;
        }

        .bullet.error.active
        {
            background: #bd2121;
        }
    }
}

.profile_view
{
    .personal
    {
        .photo .img
        {
            width: 150px;
            height: 150px;
            background-size: cover;
            background-position: center;
        }
    }
}

@media(max-height: 100vh)
{
    .registration .form
    {
        top: 40px;
        bottom: auto;
        transform: none;
    }
}

@media(max-width: 640px)
{
    h1
    {
        font-size: 28px;
    }
}
