@media only screen and (max-width: 766px)
{
    .side-right
    {
        padding-left: 30px;
    }

    .circle
    {
        right: auto;
        left: 4px;
    }

    div.verticalLine
    {
        border-left: 1px solid var(--accent);
        float: left;
        height: 100%;
        margin-left: -16px;
    }

    .f-row
    {
        padding-left: 10px;
    }

}
.buttonContMobile
{
    height: calc(100vh - 818px);
    padding: 0;
}


@media (min-width: 767px)
{
    .side-left
    {
        border-right: 1px solid var(--accent);
        padding-right: 37px;
    }

    .side-right
    {
        padding-left: 37px;
    }
}

.f-row
{
    height: 90px;
}

.f-row:first-child
{
    padding-top: 0px;
}

.f-row:last-child
{
    padding-bottom: 60px;
    margin-top: -24px;
}

.side-left
{
    position: relative;
}

.circle
{
    width: 20px;
    height: 20px;
    background-color: var(--accent);
    display: inline-block;
    border-radius: 50%;
    right: -10px;
    position: absolute;
}

#buttonContDesktop
{
    border-top: 1px solid var(--accent);
}

:root
{
    --circle-distance: 90px;
}

.circle1
{
    top: 0px;
}

.circle2
{
    top: calc(var(--circle-distance) * 1);
}

.circle3
{
    top: calc(var(--circle-distance) * 2);
}

.circle4
{
    top: calc(var(--circle-distance) * 3);
}

.circle5
{
    top: calc(var(--circle-distance) * 4);
}

.circle6
{
    top: calc(var(--circle-distance) * 5);
}