#central-body {

    .header-row {
        display: flex;
        width: 100%;
        flex-direction: column;
    }
}

.wysiwyg-content, .ckeditor_body {

}


.category-buttons {

    & {
        display: flex;
        margin: 20px 0;
        position: relative;
        width: 100%;
        justify-content: flex-start;
        z-index: 999;
    }

    .col-buttons {
        display: flex;
        gap: 18px 30px;
        flex-wrap: wrap;
    }

    .link_strojni_park {
        padding: clamp(12px, calc(11 / 1920 * 100vw), 11px) clamp(12px, calc(27 / 1920 * 100vw), 27px);
        font-size: clamp(18px, calc(20 / 1920 * 100vw), 20px);
        pointer-events: all;
        transition: background .3s ease-in-out, color .3s ease-in-out;
        display: flex;
        gap: 10px;
        min-width: 212px;
        justify-content: center;
        background: var(--g-color-ligh-blue);
        color: white;
        border: 1px solid var(--g-color-ligh-blue);
    }

    .link_poptat_sluzbu {
        padding: clamp(12px, calc(11 / 1920 * 100vw), 11px) clamp(12px, calc(27 / 1920 * 100vw), 27px);
        font-size: clamp(18px, calc(20 / 1920 * 100vw), 20px);

        pointer-events: all;
        transition: background .3s ease-in-out, color .3s ease-in-out;
        display: flex;
        gap: 10px;
        min-width: 212px;
        justify-content: center;
        background: var(--g-color-dark-blue-on-white);
        color: white;
        border: 1px solid var(--g-color-dark-blue-on-white);
    }
}

.effects {
    &.jak-probiha-zakazka-ruller {
        position: relative;
        margin-top: 65px;
        margin-bottom: clamp(80px, calc(150 / 1920 * 100vw), 150px);
    }

    &.jak-probiha-zakazka-ruller:before {
        content: "";
        position: absolute;
        z-index: 9;
        top: -11px;
        width: 100%;
        height: clamp(18px, calc(28 / 1920 * 100vw), 28px);
        background-size: cover;
        background: url('/_data/styly/zakoturcin/img/web/jak-probiha-zakazka-ruller.webp') no-repeat top;
    }

    .effect-greybox {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 452px;
        background: #e1e1e1;
        z-index: -1;
    }

    &.effects.right-bottom-screw-effect:after {
        content: "";
        position: absolute;
        height: clamp(100px, calc(275 / 1920 * 100vw), 275px);
        background: url(/_data/styly/zakoturcin/img/web/header-drill.svg) no-repeat;
        background-size: cover;
        z-index: -1;
    }

    &.effects.right-bottom-screw-effect:after {
        bottom: 0;
        right: 0;
        background-position: left;
        width: 34.5%;
    }

    @media (min-width: 1300px) {
        &.effects.right-bottom-screw-effect:after {
            width: 54.5%;
        }
    }
}