/*====== Varibles start =====*/
$gaps: (
0: 0,
1: 0.063, 2: 0.125, 3: 0.188,
4: 0.25, 5: 0.313, 6: 0.375, 7: 0.438, 
8: 0.5, 9: 0.563, 10: 0.625, 
12: 0.75, 
16: 1, 18: 1.125, 
20: 1.25, 22: 1.375, 
24: 1.5, 25: 1.563, 26: 1.625, 
28: 1.75, 30: 1.875, 
32: 2, 
36: 2.25, 
40: 2.5, 45: 2.813, 
48: 3, 50: 3.125, 55: 3.438, 
56: 3.5, 
60: 3.75,
64: 4
);


.al{
    // gap
    @each $key, $value in $gaps {
        &-gap-#{$key} {
            gap: $value+rem !important;
        }
    }

    //flex item center (dependent on 'flex' or 'inline-flex')
    &-flex-center{
        align-items: center !important;
        justify-content: center !important;
    }
}