/* STAIRS */

.ce_list.style_stairs .center {
    padding-bottom: calc((var(--elements-per-row) - 1) * var(--offset));
}

.ce_list.style_stairs .max_elements_2 .list_element:nth-child(odd) {
    top: var(--offset);
}

.ce_list.style_stairs .max_elements_3 .list_element:nth-child(3n + 1) {
    top: calc(var(--offset) * 2);
}

.ce_list.style_stairs .max_elements_3 .list_element:nth-child(3n + 2) {
    top: var(--offset);
}

.ce_list.style_stairs .max_elements_4 .list_element:nth-child(4n + 1) {
    top: calc(var(--offset) * 3);
}

.ce_list.style_stairs .max_elements_4 .list_element:nth-child(4n + 2) {
    top: calc(var(--offset) * 2);
}

.ce_list.style_stairs .max_elements_4 .list_element:nth-child(4n + 3) {
    top: var(--offset);
}

@media screen and (max-width: 1400px) {
    .ce_list.style_stairs .max_elements_4 .list_element:nth-child(3n + 1) {
        top: calc(var(--offset) * 2);
    }

    .ce_list.style_stairs .max_elements_4 .list_element:nth-child(3n + 2) {
        top: var(--offset);
    }

    .ce_list.style_stairs .max_elements_4 .list_element:nth-child(3n + 3) {
        top: 0;
    }
}

@media screen and (max-width: 1000px) {
    .ce_list.style_stairs .max_elements_3 .list_element:nth-child(odd),
    .ce_list.style_stairs .max_elements_4 .list_element:nth-child(odd) {
        top: var(--offset);
    }

    .ce_list.style_stairs .max_elements_3 .list_element:nth-child(even),
    .ce_list.style_stairs .max_elements_4 .list_element:nth-child(even) {
        top: 0;
    }
}

@media screen and (max-width: 768px) {
    .ce_list.style_stairs .list_element {
        top: 0 !important;
    }
}

/* Deepening */

.ce_list.style_deepening .center {
    padding-bottom: var(--offset);
}

.ce_list.style_deepening .max_elements_3 .list_element:nth-child(3n + 2) {
    top: var(--offset);
}

.ce_list.style_deepening .max_elements_4 .list_element:nth-child(4n + 2),
.ce_list.style_deepening .max_elements_4 .list_element:nth-child(4n + 3) {
    top: var(--offset);
}

@media screen and (max-width: 1400px) {
    .ce_list.style_deepening .max_elements_4 .list_element:nth-child(n) {
        top: 0;
    }
    .ce_list.style_deepening .max_elements_4 .list_element:nth-child(3n + 2) {
        top: var(--offset);
    }
}

@media screen and (max-width: 1000px) {
    .ce_list.style_deepening .list_element {
        top: 0 !important;
    }
}