/* -------------
    SOMMAIRE
------------- */

/*
    @AUTHOR : Nicolas BOUDOT

    PROPRIÉTÉ : OVERFLOW
    Styles liés à la propriété overflow
*/

/*
    01 - XS
        Overflow
        Overflow Y
        Overflow X
    02 - SM
    03 - MD
    04 - LG
    05 - XL
    06 - XXL
*/



/* -----------------
    01 - XS
        Overflow
----------------- */

.o-auto {
    overflow: auto;
}

.o-hidden {
    overflow: hidden;
}

.o-overlay {
    overflow: overlay;
}

.o-scroll {
    overflow: scroll;
}

.o-visible {
    overflow: visible;
}



/* -----------------
    01 - XS
        Overflow Y
----------------- */

.o-y-auto {
    overflow-y: auto;
}

.o-y-hidden {
    overflow-y: hidden;
}

.o-y-overlay {
    overflow-y: overlay;
}

.o-y-scroll {
    overflow-y: scroll;
}

.o-y-visible {
    overflow-y: visible;
}



/* -----------------
    01 - XS
        Overflow X
----------------- */

.o-x-auto {
    overflow-x: auto;
}

.o-x-hidden {
    overflow-x: hidden;
}

.o-x-overlay {
    overflow-x: overlay;
}

.o-x-scroll {
    overflow-x: scroll;
}

.o-x-visible {
    overflow-x: visible;
}



/* -----------------
    02 - SM
        Overflow
----------------- */

@media (min-width: 576px) {
    .o-sm-auto {
        overflow: auto;
    }

    .o-sm-hidden {
        overflow: hidden;
    }

    .o-sm-overlay {
        overflow: overlay;
    }

    .o-sm-scroll {
        overflow: scroll;
    }

    .o-sm-visible {
        overflow: visible;
    }
}



/* -----------------
    02 - SM
        Overflow Y
----------------- */

@media (min-width: 576px) {
    .o-y-sm-auto {
        overflow-y: auto;
    }

    .o-y-sm-hidden {
        overflow-y: hidden;
    }

    .o-y-sm-overlay {
        overflow-y: overlay;
    }

    .o-y-sm-scroll {
        overflow-y: scroll;
    }

    .o-y-sm-visible {
        overflow-y: visible;
    }
}



/* -----------------
    02 - SM
        Overflow X
----------------- */

@media (min-width: 576px) {
    .o-x-sm-auto {
        overflow-x: auto;
    }

    .o-x-sm-hidden {
        overflow-x: hidden;
    }

    .o-x-sm-overlay {
        overflow-x: overlay;
    }

    .o-x-sm-scroll {
        overflow-x: scroll;
    }

    .o-x-sm-visible {
        overflow-x: visible;
    }
}



/* -----------------
  03 - MD
        Overflow
----------------- */

@media (min-width: 768px) {
    .o-md-auto {
        overflow: auto;
    }

    .o-md-hidden {
        overflow: hidden;
    }

    .o-md-overlay {
        overflow: overlay;
    }

    .o-md-scroll {
        overflow: scroll;
    }

    .o-md-visible {
        overflow: visible;
    }
}



/* -----------------
  03 - MD
        Overflow Y
----------------- */

@media (min-width: 768px) {
    .o-y-md-auto {
        overflow-y: auto;
    }

    .o-y-md-hidden {
        overflow-y: hidden;
    }

    .o-y-md-overlay {
        overflow-y: overlay;
    }

    .o-y-md-scroll {
        overflow-y: scroll;
    }

    .o-y-md-visible {
        overflow-y: visible;
    }
}



/* -----------------
  03 - MD
        Overflow X
----------------- */

@media (min-width: 768px) {
    .o-x-md-auto {
        overflow-x: auto;
    }

    .o-x-md-hidden {
        overflow-x: hidden;
    }

    .o-x-md-overlay {
        overflow-x: overlay;
    }

    .o-x-md-scroll {
        overflow-x: scroll;
    }

    .o-x-md-visible {
        overflow-x: visible;
    }
}



/* -----------------
    04 - LG
        Overflow
----------------- */

@media (min-width: 992px) {
    .o-lg-auto {
        overflow: auto;
    }

    .o-lg-hidden {
        overflow: hidden;
    }

    .o-lg-overlay {
        overflow: overlay;
    }

    .o-lg-scroll {
        overflow: scroll;
    }

    .o-lg-visible {
        overflow: visible;
    }
}



/* -----------------
    04 - LG
        Overflow Y
----------------- */

@media (min-width: 992px) {
    .o-y-lg-auto {
        overflow-y: auto;
    }

    .o-y-lg-hidden {
        overflow-y: hidden;
    }

    .o-y-lg-overlay {
        overflow-y: overlay;
    }

    .o-y-lg-scroll {
        overflow-y: scroll;
    }

    .o-y-lg-visible {
        overflow-y: visible;
    }
}



/* -----------------
    04 - LG
        Overflow X
----------------- */

@media (min-width: 992px) {
    .o-x-lg-auto {
        overflow-x: auto;
    }

    .o-x-lg-hidden {
        overflow-x: hidden;
    }

    .o-x-lg-overlay {
        overflow-x: overlay;
    }

    .o-x-lg-scroll {
        overflow-x: scroll;
    }

    .o-x-lg-visible {
        overflow-x: visible;
    }
}



/* -----------------
    05 - XL
        Overflow
----------------- */

@media (min-width: 1200px) {
    .o-xl-auto {
        overflow: auto;
    }

    .o-xl-hidden {
        overflow: hidden;
    }

    .o-xl-overlay {
        overflow: overlay;
    }

    .o-xl-scroll {
        overflow: scroll;
    }

    .o-xl-visible {
        overflow: visible;
    }
}



/* -----------------
    05 - XL
        Overflow Y
----------------- */

@media (min-width: 1200px) {
    .o-y-xl-auto {
        overflow-y: auto;
    }

    .o-y-xl-hidden {
        overflow-y: hidden;
    }

    .o-y-xl-overlay {
        overflow-y: overlay;
    }

    .o-y-xl-scroll {
        overflow-y: scroll;
    }

    .o-y-xl-visible {
        overflow-y: visible;
    }
}



/* -----------------
    05 - XL
        Overflow X
----------------- */

@media (min-width: 1200px) {
    .o-x-xl-auto {
        overflow-x: auto;
    }

    .o-x-xl-hidden {
        overflow-x: hidden;
    }

    .o-x-xl-overlay {
        overflow-x: overlay;
    }

    .o-x-xl-scroll {
        overflow-x: scroll;
    }

    .o-x-xl-visible {
        overflow-x: visible;
    }
}



/* -----------------
    06 - XXL
        Overflow
----------------- */

@media (min-width: 1400px) {
    .o-xxl-auto {
        overflow: auto;
    }

    .o-xxl-hidden {
        overflow: hidden;
    }

    .o-xxl-overlay {
        overflow: overlay;
    }

    .o-xxl-scroll {
        overflow: scroll;
    }

    .o-xxl-visible {
        overflow: visible;
    }
}



/* -----------------
    06 - XXL
        Overflow Y
----------------- */

@media (min-width: 1400px) {
    .o-y-xxl-auto {
        overflow-y: auto;
    }

    .o-y-xxl-hidden {
        overflow-y: hidden;
    }

    .o-y-xxl-overlay {
        overflow-y: overlay;
    }

    .o-y-xxl-scroll {
        overflow-y: scroll;
    }

    .o-y-xxl-visible {
        overflow-y: visible;
    }
}



/* -----------------
    06 - XXL
        Overflow X
----------------- */

@media (min-width: 1400px) {
    .o-x-xxl-auto {
        overflow-x: auto;
    }

    .o-x-xxl-hidden {
        overflow-x: hidden;
    }

    .o-x-xxl-overlay {
        overflow-x: overlay;
    }

    .o-x-xxl-scroll {
        overflow-x: scroll;
    }

    .o-x-xxl-visible {
        overflow-x: visible;
    }
}