/* ==========================================================
   MERITZA CLASSES
   CONTAINERS
   Version: 1.0.0
========================================================== */

/* ==========================================
   DEFAULT CONTAINER
========================================== */

.mc-container{

    width:100%;

    max-width:var(--mc-container);

    margin-inline:auto;

    padding-inline:var(--mc-space-20);

}

/* ==========================================
   FLUID CONTAINER
========================================== */

.mc-container-fluid{

    width:100%;

    padding-inline:var(--mc-space-20);

}

/* ==========================================
   SMALL CONTAINER
========================================== */

.mc-container-sm{

    width:100%;

    max-width:720px;

    margin-inline:auto;

    padding-inline:var(--mc-space-20);

}

/* ==========================================
   MEDIUM CONTAINER
========================================== */

.mc-container-md{

    width:100%;

    max-width:960px;

    margin-inline:auto;

    padding-inline:var(--mc-space-20);

}

/* ==========================================
   LARGE CONTAINER
========================================== */

.mc-container-lg{

    width:100%;

    max-width:1140px;

    margin-inline:auto;

    padding-inline:var(--mc-space-20);

}

/* ==========================================
   EXTRA LARGE CONTAINER
========================================== */

.mc-container-xl{

    width:100%;

    max-width:1440px;

    margin-inline:auto;

    padding-inline:var(--mc-space-24);

}

/* ==========================================
   SECTION SPACING
========================================== */

.mc-section{

    padding-block:80px;

}

.mc-section-sm{

    padding-block:48px;

}

.mc-section-lg{

    padding-block:120px;

}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width:991.98px){

    .mc-section{

        padding-block:64px;

    }

    .mc-section-lg{

        padding-block:96px;

    }

}

@media (max-width:767.98px){

    .mc-container,
    .mc-container-fluid,
    .mc-container-sm,
    .mc-container-md,
    .mc-container-lg,
    .mc-container-xl{

        padding-inline:16px;

    }

    .mc-section{

        padding-block:56px;

    }

    .mc-section-lg{

        padding-block:72px;

    }

}

@media (max-width:575.98px){

    .mc-container,
    .mc-container-fluid,
    .mc-container-sm,
    .mc-container-md,
    .mc-container-lg,
    .mc-container-xl{

        padding-inline:14px;

    }

    .mc-section{

        padding-block:48px;

    }

    .mc-section-lg{

        padding-block:64px;

    }
/* ==========================================
   FULL HEIGHT
========================================== */

.mc-container-full{

    width:100%;

    min-height:100vh;

}
}