/*======================================================================
MF-04

GRID FOUNDATION
Version : 3.0
======================================================================*/

.ms-grid{

display:grid;

width:100%;

}


.ms-grid-1{

grid-template-columns:repeat(1,minmax(0,1fr));

}

.ms-grid-2{

grid-template-columns:repeat(2,minmax(0,1fr));

}

.ms-grid-3{

grid-template-columns:repeat(3,minmax(0,1fr));

}

.ms-grid-4{

grid-template-columns:repeat(4,minmax(0,1fr));

}

.ms-grid-5{

grid-template-columns:repeat(5,minmax(0,1fr));

}

.ms-grid-6{

grid-template-columns:repeat(6,minmax(0,1fr));

}


.ms-grid-auto-220{

grid-template-columns:
repeat(auto-fit,minmax(220px,1fr));

}

.ms-grid-auto-260{

grid-template-columns:
repeat(auto-fit,minmax(260px,1fr));

}

.ms-grid-auto-300{

grid-template-columns:
repeat(auto-fit,minmax(300px,1fr));

}

.ms-grid-auto-340{

grid-template-columns:
repeat(auto-fit,minmax(340px,1fr));

}


.ms-gap-none{

gap:0;

}

.ms-gap-xs{

gap:var(--ms-space-2);

}

.ms-gap-sm{

gap:var(--ms-space-4);

}

.ms-gap-md{

gap:var(--ms-space-6);

}

.ms-gap-lg{

gap:var(--ms-space-8);

}

.ms-gap-xl{

gap:var(--ms-space-10);

}

.ms-gap-2xl{

gap:var(--ms-space-12);

}

.ms-gap-3xl{

gap:var(--ms-space-16);

}


.ms-col-gap-xs{

column-gap:var(--ms-space-2);

}

.ms-col-gap-sm{

column-gap:var(--ms-space-4);

}

.ms-col-gap-md{

column-gap:var(--ms-space-6);

}

.ms-col-gap-lg{

column-gap:var(--ms-space-8);

}

.ms-col-gap-xl{

column-gap:var(--ms-space-10);

}


.ms-row-gap-xs{

row-gap:var(--ms-space-2);

}

.ms-row-gap-sm{

row-gap:var(--ms-space-4);

}

.ms-row-gap-md{

row-gap:var(--ms-space-6);

}

.ms-row-gap-lg{

row-gap:var(--ms-space-8);

}

.ms-row-gap-xl{

row-gap:var(--ms-space-10);

}


.ms-grid-center{

place-items:center;

}

.ms-grid-start{

place-items:start;

}

.ms-grid-end{

place-items:end;

}

.ms-grid-stretch{

place-items:stretch;

}


.ms-grid-content-center{

place-content:center;

}

.ms-grid-content-start{

place-content:start;

}

.ms-grid-content-end{

place-content:end;

}

.ms-grid-content-between{

align-content:space-between;

justify-content:space-between;

}


@media (max-width:1024px){

.ms-grid-tablet-1{

grid-template-columns:repeat(1,minmax(0,1fr));

}

.ms-grid-tablet-2{

grid-template-columns:repeat(2,minmax(0,1fr));

}

.ms-grid-tablet-3{

grid-template-columns:repeat(3,minmax(0,1fr));

}

}



@media (max-width:767px){

.ms-grid-mobile-1{

grid-template-columns:repeat(1,minmax(0,1fr));

}

.ms-grid-mobile-2{

grid-template-columns:repeat(2,minmax(0,1fr));

}

}


.ms-col-span-1{grid-column:span 1;}

.ms-col-span-2{grid-column:span 2;}

.ms-col-span-3{grid-column:span 3;}

.ms-col-span-4{grid-column:span 4;}

.ms-col-span-full{grid-column:1 / -1;}


.ms-row-span-1{grid-row:span 1;}

.ms-row-span-2{grid-row:span 2;}

.ms-row-span-3{grid-row:span 3;}
