/* Small devices (max-width: 576px) */
@media (max-width: 575px) {
    /* Margin */
    .mx-sm-1 {margin-left: 8px !important; margin-right: 8px !important;}
    .mx-sm-2 {margin-left: 16px !important; margin-right: 16px !important;}
    .mx-sm-3 {margin-left: 24px !important; margin-right: 24px !important;}

    .my-sm-1 {margin-top: 8px !important; margin-bottom: 8px !important;}
    .my-sm-2 {margin-top: 16px !important; margin-bottom: 16px !important;}
    .my-sm-3 {margin-top: 24px !important; margin-bottom: 24px !important;}

    /* Padding */
    .px-sm-1 {padding-left: 8px !important; padding-right: 8px !important;}
    .px-sm-2 {padding-left: 16px !important; padding-right: 16px !important;}
    .px-sm-3 {padding-left: 24px !important; padding-right: 24px !important;}

    .py-sm-1 {padding-top: 8px !important; padding-bottom: 8px !important;}
    .py-sm-2 {padding-top: 16px !important; padding-bottom: 16px !important;}
    .py-sm-3 {padding-top: 24px !important; padding-bottom: 24px !important;}
}

/* Medium devices (min-width: 576px) */
@media (min-width: 576px) and (max-width: 767px) {
    /* Margin */
    .mx-md-1 {margin-left: 8px !important; margin-right: 8px !important;}
    .mx-md-2 {margin-left: 16px !important; margin-right: 16px !important;}
    .mx-md-3 {margin-left: 24px !important; margin-right: 24px !important;}

    .my-md-1 {margin-top: 8px !important; margin-bottom: 8px !important;}
    .my-md-2 {margin-top: 16px !important; margin-bottom: 16px !important;}
    .my-md-3 {margin-top: 24px !important; margin-bottom: 24px !important;}

    /* Padding */
    .px-md-1 {padding-left: 8px !important; padding-right: 8px !important;}
    .px-md-2 {padding-left: 16px !important; padding-right: 16px !important;}
    .px-md-3 {padding-left: 24px !important; padding-right: 24px !important;}

    .py-md-1 {padding-top: 8px !important; padding-bottom: 8px !important;}
    .py-md-2 {padding-top: 16px !important; padding-bottom: 16px !important;}
    .py-md-3 {padding-top: 24px !important; padding-bottom: 24px !important;}
}

/* Large devices (min-width: 768px) */
@media (min-width: 768px) and (max-width: 1199px) {
    /* Margin */
    .mx-lg-1 {margin-left: 8px !important; margin-right: 8px !important;}
    .mx-lg-2 {margin-left: 16px !important; margin-right: 16px !important;}
    .mx-lg-3 {margin-left: 24px !important; margin-right: 24px !important;}

    .my-lg-1 {margin-top: 8px !important; margin-bottom: 8px !important;}
    .my-lg-2 {margin-top: 16px !important; margin-bottom: 16px !important;}
    .my-lg-3 {margin-top: 24px !important; margin-bottom: 24px !important;}

/* Padding */
    .px-lg-1 {padding-left: 8px !important; padding-right: 8px !important;}
    .px-lg-2 {padding-left: 16px !important; padding-right: 16px !important;}
    .px-lg-3 {padding-left: 24px !important; padding-right: 24px !important;}

    .py-lg-1 {padding-top: 8px !important; padding-bottom: 8px !important;}
    .py-lg-2 {padding-top: 16px !important; padding-bottom: 16px !important;}
    .py-lg-3 {padding-top: 24px !important; padding-bottom: 24px !important;}
}

/* Extra large devices (min-width: 1200px) */
@media (min-width: 1200px) {
    /* Margin */
    .mx-xl-1 {margin-left: 8px !important; margin-right: 8px !important;}
    .mx-xl-2 {margin-left: 16px !important; margin-right: 16px !important;}
    .mx-xl-3 {margin-left: 24px !important; margin-right: 24px !important;}

    .my-xl-1 {margin-top: 8px !important; margin-bottom: 8px !important;}
    .my-xl-2 {margin-top: 16px !important; margin-bottom: 16px !important;}
    .my-xl-3 {margin-top: 24px !important; margin-bottom: 24px !important;}

    /* Padding */
    .px-xl-1 {padding-left: 8px !important; padding-right: 8px !important;}
    .px-xl-2 {padding-left: 16px !important; padding-right: 16px !important;}
    .px-xl-3 {padding-left: 24px !important; padding-right: 24px !important;}

    .py-xl-1 {padding-top: 8px !important; padding-bottom: 8px !important;}
    .py-xl-2 {padding-top: 16px !important; padding-bottom: 16px !important;}
    .py-xl-3 {padding-top: 24px !important; padding-bottom: 24px !important;}
}


@media (max-width: 767px) {
    .fdcr .moorl-column-layout {
        display: flex;
        flex-direction: column-reverse;
    }
}