/* GRID COLUMNS */

    /* GRID OF TWO */

        .span_2_of_2 {
            width: 100%;
            }

        .span_1_of_2 {
            width: 49.2%;
            }

    /* GRID OF THREE */
    
        .span_3_of_3 {
            width: 100%; 
            }

        .span_2_of_3 {
            width: 66.13%; 
            }

        .span_1_of_3 {
            width: 32.26%; 
            }

    /* GRID OF FOUR */

        .span_4_of_4 {
            width: 100%; 
            }

        .span_3_of_4 {
            width: 74.6%; 
            }

        .span_2_of_4 {
            width: 49.2%; 
            }

        .span_1_of_4 {
            width: 23.8%; 
            }

    /* GRID OF FIVE */

        .span_5_of_5 {
            width: 100%;
            }

        .span_4_of_5 {
            width: 79.68%; 
            }

        .span_3_of_5 {
            width: 59.36%; 
            }

        .span_2_of_5 {
            width: 39.04%;
            }

        .span_1_of_5 {
            width: 18.72%;
            }

    /* GRID OF SIX */

        .span_6_of_6 {
            width: 100%;
            }

        .span_5_of_6 {
            width: 83.06%;
            }

        .span_4_of_6 {
            width: 66.13%;
            }

        .span_3_of_6 {
            width: 49.2%;
                }

        .span_2_of_6 {
            width: 32.26%;
            }

        .span_1_of_6 {
            width: 15.33%;
            }

    /* GRID OF SEVEN */

        .span_7_of_7 {
            width: 100%;
            }

        .span_6_of_7 {
            width: 85.48%;
            }

        .span_5_of_7 {
            width: 70.97%;
            }

        .span_4_of_7 {
            width: 56.45%;
                }

        .span_3_of_7 {
            width: 41.94%;
            }

        .span_2_of_7 {
            width: 27.42%;
            }

        .span_1_of_7 {
            width: 12.91%;
            }

    /* GRID OF EIGHT */

        .span_8_of_8 {
            width: 100%;
            }

        .span_7_of_8 {
            width: 87.3%; 
            }

        .span_6_of_8 {
            width: 74.6%; 
            }

        .span_5_of_8 {
            width: 61.9%; 
            }

        .span_4_of_8 {
            width: 49.2%; 
            }

        .span_3_of_8 {
            width: 36.5%;
            }

        .span_2_of_8 {
            width: 23.8%; 
            }

        .span_1_of_8 {
            width: 11.1%; 
            }

    /* GRID OF NINE */

        .span_9_of_9 {
            width: 100%;
            }

        .span_8_of_9 {
            width: 88.71%;
            }

        .span_7_of_9 {
            width: 77.42%; 
            }

        .span_6_of_9 {
            width: 66.13%; 
            }

        .span_5_of_9 {
            width: 54.84%; 
            }

        .span_4_of_9 {
            width: 43.55%; 
            }

        .span_3_of_9 {
            width: 32.26%;
            }

        .span_2_of_9 {
            width: 20.97%; 
            }

        .span_1_of_9 {
            width: 9.68%; 
            }

    /* GRID OF TEN */

        .span_10_of_10 {
            width: 100%;
            }

        .span_9_of_10 {
            width: 89.84%;
            }

        .span_8_of_10 {
            width: 79.68%;
            }

        .span_7_of_10 {
            width: 69.52%; 
            }

        .span_6_of_10 {
            width: 59.36%; 
            }

        .span_5_of_10 {
            width: 49.2%; 
            }

        .span_4_of_10 {
            width: 39.04%; 
            }

        .span_3_of_10 {
            width: 28.88%;
            }

        .span_2_of_10 {
            width: 18.72%; 
            }

        .span_1_of_10 {
            width: 8.56%; 
            }  

    /* GRID OF ELEVEN */

        .span_11_of_11 {
            width: 100%;
            }

        .span_10_of_11 {
            width: 90.76%;
            }

        .span_9_of_11 {
            width: 81.52%;
            }

        .span_8_of_11 {
            width: 72.29%;
            }

        .span_7_of_11 {
            width: 63.05%; 
            }

        .span_6_of_11 {
            width: 53.81%; 
            }

        .span_5_of_11 {
            width: 44.58%; 
            }

        .span_4_of_11 {
            width: 35.34%; 
            }

        .span_3_of_11 {
            width: 26.1%;
            }

        .span_2_of_11 {
            width: 16.87%; 
            }

        .span_1_of_11 {
            width: 7.63%; 
            }

    /* GRID OF TWELVE */

        .span_12_of_12 {
            width: 100%;
            }

        .span_11_of_12 {
            width: 91.53%;
            }

        .span_10_of_12 {
            width: 83.06%;
            }

        .span_9_of_12 {
            width: 74.6%;
            }

        .span_8_of_12 {
            width: 66.13%;
            }

        .span_7_of_12 {
            width: 57.66%; 
            }

        .span_6_of_12 {
            width: 49.2%; 
            }

        .span_5_of_12 {
            width: 40.73%; 
            }

        .span_4_of_12 {
            width: 32.26%; 
            }

        .span_3_of_12 {
            width: 23.8%;
            }

        .span_2_of_12 {
            width: 15.33%; 
            }

        .span_1_of_12 {
            width: 6.86%; 
            }