/* tab control */
.tabcontrol
{
    display: inline-block;
    vertical-align: top;

    padding-top: 20px;
    padding-bottom: 20px;
    max-width: 20%;
    height: calc(100% - 40px);
    width: 10rem;

    background-color: #0004;

    border-radius: 20px 0px 0px 20px;
}

.tabcontrol *
{
    display: block;
}

.tabcontrol div
{
    cursor: pointer;

    padding-top: 20px;
    padding-bottom: 20px;
}

.tabcontrol div:hover
{
    background: #0004;
}

.tabcontrol div *
{
    margin: 0;
    text-align: center;
    text-decoration: none;
}

.tabcontrol .active
{
    background: #fff4;
}

/* tab container */
.tabs
{
    display: inline-block;
    vertical-align: top;

    width: calc(100% - 11rem);
    height: calc(100% - 1rem);
    margin-top: 1rem;
}

.tabs div
{
    height: 100%;
    width: 100%;
}

.tabs .hidden
{
    visibility: hidden;

    width: 0px;
    height: 0px;
}

/* other things */
.sided
{
    display: inline-block;
    vertical-align: top;

    width: 49%;
    height: 100%;
}

.sided p, .sided a
{
    margin: 0;
    height: 25px;
}