$px: 0.0625em;

.section-level {
    width: 640*$px;
    border-radius: 15*$px;
    margin: 1em 0;
    overflow: hidden;

    a:hover {
        text-decoration: underline;
    }
}

.sections-row {
    display: table;
}

.section-type {
    display: table-cell;
    vertical-align: top;
    padding: 20*$px;

    h1 {
        text-transform: uppercase;
        margin: 0 0 1em 0;
        font-size: 1em;
    }

    img {
        float: left;
        margin-right: 16*$px;
        margin-bottom: 16*$px;
    }
}
.section-type-synthetic {
    width: 340*$px - 2 * 20*$px;
}
.section-type-course {
    width: 300*$px - 2 * 20*$px;
}

.section-type-project {
    width: 640*$px - 2 * 20*$px;
}

.section-level-gimnazjum {
    background: #f4ae83;
    color: #67584f;
    a, a:hover {
        color: #67584f;
    }

    .section-type-synthetic {
    }
    .section-type-course {
        background: #ed7831;
        color: #fff;
        a {
            color: #fff;
        }
    }
    .section-type-project {
        background-color: lighten(#f4ae83, 10);
    }
}


.section-level-liceum {
    background: #44b69f;
    color: #363a3e;
    a, a:hover {
        color: #363a3e;
    }

    .section-type-synthetic {
    }
    .section-type-course {
        background: #16a487;
        color: #fff;
        a {
            color: #fff;
        }
    }
    .section-type-project {
        background-color: lighten(#44b69f, 25);
    }
}


.course-boxes {
    h1 {
        color: #363a3e;
    }
    .section-level {
        background: white;
        border: 1px solid #777;
        a, a:hover {
            color: #363a3e;
        }
        .section-type {
            background: white;
        }
    }
    .section-type-synthetic {
        width: 300*$px - 2 * 20*$px;
    }
    .section-type-course {
        width: 340*$px - 2 * 20*$px;
    }
}


.section-links {
    float: right;
}

h2.section-header {
    margin: 0;
}


.section-list-toc {
    display: inline-block;
    vertical-align: top;
    width: 300*$px;
}