/* =====================================================
   ELITE STORE LAYOUT CSS
   Version : 1.0
===================================================== */


/* ==========================================
   CONTAINER
========================================== */

.container{
    width:100%;
    max-width:1320px;
    margin:0 auto;
    padding:0 15px;
}

.container-fluid{
    width:100%;
    padding:0 15px;
}


/* ==========================================
   GRID SYSTEM
========================================== */

.grid{
    display:grid;
}

.grid-2{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;
}

.grid-3{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.grid-4{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:30px;
}

.grid-5{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:30px;
}


/* ==========================================
   FLEXBOX
========================================== */

.flex{
    display:flex;
}

.flex-center{
    display:flex;
    justify-content:center;
    align-items:center;
}

.flex-between{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.flex-around{
    display:flex;
    justify-content:space-around;
    align-items:center;
}

.flex-column{
    display:flex;
    flex-direction:column;
}

.flex-wrap{
    flex-wrap:wrap;
}


/* ==========================================
   GAP UTILITIES
========================================== */

.gap-10{
    gap:10px;
}

.gap-20{
    gap:20px;
}

.gap-30{
    gap:30px;
}

.gap-40{
    gap:40px;
}


/* ==========================================
   ALIGNMENT
========================================== */

.items-center{
    align-items:center;
}

.items-start{
    align-items:flex-start;
}

.items-end{
    align-items:flex-end;
}

.justify-center{
    justify-content:center;
}

.justify-between{
    justify-content:space-between;
}

.justify-end{
    justify-content:flex-end;
}


/* ==========================================
   WIDTH
========================================== */

.w-100{
    width:100%;
}

.w-50{
    width:50%;
}

.w-auto{
    width:auto;
}


/* ==========================================
   HEIGHT
========================================== */

.h-100{
    height:100%;
}

.min-vh-100{
    min-height:100vh;
}


/* ==========================================
   SECTION SPACING
========================================== */

.section{
    padding:80px 0;
}

.section-sm{
    padding:50px 0;
}

.section-lg{
    padding:120px 0;
}


/* ==========================================
   OVERFLOW
========================================== */

.overflow-hidden{
    overflow:hidden;
}

.overflow-auto{
    overflow:auto;
}


/* ==========================================
   POSITION
========================================== */

.relative{
    position:relative;
}

.absolute{
    position:absolute;
}

.fixed{
    position:fixed;
}