/*************************************************************************
    Flex Grid
    last update: 15.05.2019
*************************************************************************/

/* General */

.flex,
.fg {
    display: flex;
}

[class^="fg"] {
    width: 100%;
}

[class^="fg-gap"] {
    width: 0;
}

/* Master */

.fg-6a,
.fg-4a,
.fg-5x,
.fg-3a,
.fg-2a {
    flex-direction: row;
    flex-wrap: wrap;
}

.fg-12a {
    flex-direction: column;
}

.fg-12a > div {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.fg-6a > div {
    width: 50%;
}

.fg-4a > div {
    width: calc(100% / 3);
}

.fg-5x > div {
    width: 20%;
}

.fg-3a > div {
    width: 25%;
}

.fg-2a > div {
    width: calc(100% / 6);
}

/* Elements */

.fg > .fg-tm-gap-0,
.fg > .fg-gap-0,
.fg > .fg-tm-0,
.fg > .fg-0 {
    width: 0;
    display: none;
}

.fg > .fg-gap-1,
.fg > .fg-1 {
    width: calc(100% / 12);
}

.fg > .fg-gap-2,
.fg > .fg-2 {
    width: calc(100% / 6);
}

.fg > .fg-gap-3,
.fg > .fg-3 {
    width: 25%;
}

.fg > .fg-gap-4,
.fg > .fg-4 {
    width: calc(100% / 3);
}

.fg > .fg-gap-5,
.fg > .fg-5 {
    width: calc((100% / 12) * 5);
}

.fg > .fg-gap-6,
.fg > .fg-6 {
    width: 50%;
}

.fg > .fg-gap-7,
.fg > .fg-7 {
    width: calc((100% / 12) * 7);
}

.fg > .fg-gap-8,
.fg > .fg-8 {
    width: calc(100% / 1.5);
}

.fg > .fg-gap-9,
.fg > .fg-9 {
    width: 75%;
}

.fg > .fg-gap-10,
.fg > .fg-10 {
    width: calc((100% / 12) * 10);
}

.fg > .fg-gap-11,
.fg > .fg-11 {
    width: calc((100% / 12) * 11);
}

.fg > .fg-gap-12,
.fg > .fg-12 {
    width: 100%;
}

/* Helpers */

.fg-v-center,
.fg-center {
    align-items: center;
}

.fg-h-center,
.fg-center {
    justify-content: center;
}

/* Tiny Media */

@media screen and (max-width: 480px) { /* only for tm */

    /* Elements */

    .fg > .fg-tmo-gp-0,
    .fg > .fg-tmo-0 {
        width: 0;
        display: none;
    }

    .fg > .fg-tmo-gap-1,
    .fg > .fg-tmo-1 {
        width: calc(100% / 12);
    }

    .fg > .fg-tmo-gap-2,
    .fg > .fg-tmo-2 {
        width: calc(100% / 6);
    }

    .fg > .fg-tmo-gap-3,
    .fg > .fg-tmo-3 {
        width: 25%;
    }

    .fg > .fg-tmo-gap-4,
    .fg > .fg-tmo-4 {
        width: calc(100% / 3);
    }

    .fg > .fg-tmo-gap-5,
    .fg > .fg-tmo-5 {
        width: calc((100% / 12) * 5);
    }

    .fg > .fg-tmo-gap-6,
    .fg > .fg-tmo-6 {
        width: 50%;
    }

    .fg > .fg-tmo-gap-7,
    .fg > .fg-tmo-7 {
        width: calc((100% / 12) * 7);
    }

    .fg > .fg-tmo-gap-8,
    .fg > .fg-tmo-8 {
        width: calc(100% / 1.5);
    }

    .fg > .fg-tmo-gap-9,
    .fg > .fg-tmo-9 {
        width: 75%;
    }

    .fg > .fg-tmo-gap-10,
    .fg > .fg-tmo-10 {
        width: calc((100% / 12) * 10);
    }

    .fg > .fg-tmo-gap-11,
    .fg > .fg-tmo-11 {
        width: calc((100% / 12) * 11);
    }

    .fg > .fg-tmo-gap-12,
    .fg > .fg-tmo-12 {
        width: 100%;
    }

    /* Helpers */

    .fg-tmo-v-center,
    .fg-tmo-center {
        align-items: center;
    }

    .fg-tmo-h-center,
    .fg-tmo-center {
        justify-content: center;
    }  
}

/* Small Media */

@media screen and (max-width: 720px) { /* until sm */
    .fg-column-usm {
        flex-direction: column;
    }
}

@media screen and (min-width: 481px) { /* since sm */

    /* Master */

    .fg-sm-6a,
    .fg-sm-4a,
    .fg-sm-5x,
    .fg-sm-3a,
    .fg-sm-2a {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .fg-sm-12a {
        flex-direction: column;
    }

    .fg-sm-2a > div {
        width: calc(100% / 6);
    }

    .fg-sm-5x > div {
        width: 20%;
    }

    .fg-sm-3a > div {
        width: 25%;
    }

    .fg-sm-4a > div {
        width: calc(100% / 3);
    }

    .fg-sm-6a > div {
        width: 50%;
    }

    .fg-sm-12a > div {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    /* Elements */

    .fg > .fg-sm-gp-0,
    .fg > .fg-sm-0 {
        width: 0;
        display: none;
    }

    .fg > .fg-sm-gap-1,
    .fg > .fg-sm-1 {
        width: calc(100% / 12);
    }

    .fg > .fg-sm-gap-2,
    .fg > .fg-sm-2 {
        width: calc(100% / 6);
    }

    .fg > .fg-sm-gap-3,
    .fg > .fg-sm-3 {
        width: 25%;
    }

    .fg > .fg-sm-gap-4,
    .fg > .fg-sm-4 {
        width: calc(100% / 3);
    }

    .fg > .fg-sm-gap-5,
    .fg > .fg-sm-5 {
        width: calc((100% / 12) * 5);
    }

    .fg > .fg-sm-gap-6,
    .fg > .fg-sm-6 {
        width: 50%;
    }

    .fg > .fg-sm-gap-7,
    .fg > .fg-sm-7 {
        width: calc((100% / 12) * 7);
    }

    .fg > .fg-sm-gap-8,
    .fg > .fg-sm-8 {
        width: calc(100% / 1.5);
    }

    .fg > .fg-sm-gap-9,
    .fg > .fg-sm-9 {
        width: 75%;
    }

    .fg > .fg-sm-gap-10,
    .fg > .fg-sm-10 {
        width: calc((100% / 12) * 10);
    }

    .fg > .fg-sm-gap-11,
    .fg > .fg-sm-11 {
        width: calc((100% / 12) * 11);
    }

    .fg > .fg-sm-gap-12,
    .fg > .fg-sm-12 {
        width: 100%;
    }

    /* Helpers */

    .fg-sm-v-center,
    .fg-sm-center {
        align-items: center;
    }

    .fg-sm-h-center,
    .fg-sm-center {
        justify-content: center;
    }
}

@media screen and (min-width: 481px) and (max-width: 720px) { /* only for sm */

    /* Elements */

    .fg > .fg-smo-gp-0,
    .fg > .fg-smo-0 {
        width: 0;
        display: none;
    }

    .fg > .fg-smo-gap-1,
    .fg > .fg-smo-1 {
        width: calc(100% / 12);
    }

    .fg > .fg-smo-gap-2,
    .fg > .fg-smo-2 {
        width: calc(100% / 6);
    }

    .fg > .fg-smo-gap-3,
    .fg > .fg-smo-3 {
        width: 25%;
    }

    .fg > .fg-smo-gap-4,
    .fg > .fg-smo-4 {
        width: calc(100% / 3);
    }

    .fg > .fg-smo-gap-5,
    .fg > .fg-smo-5 {
        width: calc((100% / 12) * 5);
    }

    .fg > .fg-smo-gap-6,
    .fg > .fg-smo-6 {
        width: 50%;
    }

    .fg > .fg-smo-gap-7,
    .fg > .fg-smo-7 {
        width: calc((100% / 12) * 7);
    }

    .fg > .fg-smo-gap-8,
    .fg > .fg-smo-8 {
        width: calc(100% / 1.5);
    }

    .fg > .fg-smo-gap-9,
    .fg > .fg-smo-9 {
        width: 75%;
    }

    .fg > .fg-smo-gap-10,
    .fg > .fg-smo-10 {
        width: calc((100% / 12) * 10);
    }

    .fg > .fg-smo-gap-11,
    .fg > .fg-smo-11 {
        width: calc((100% / 12) * 11);
    }

    .fg > .fg-smo-gap-12,
    .fg > .fg-smo-12 {
        width: 100%;
    }

    /* Helpers */

    .fg-smo-v-center,
    .fg-smo-center {
        align-items: center;
    }

    .fg-smo-h-center,
    .fg-smo-center {
        justify-content: center;
    }    
}

/* Medium media */

@media screen and (max-width: 720px) { /* until mm */
    .fg-column-umm {
        flex-direction: column;
    }
}

@media screen and (min-width: 721px) { /* since mm */

    /* Master */

    .fg-mm-6a,
    .fg-mm-4a,
    .fg-mm-5x,
    .fg-mm-3a,
    .fg-mm-2a {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .fg-mm-12a {
        flex-direction: column;
    }

    .fg-mm-2a > div {
        width: calc(100% / 6);
    }

    .fg-mm-5x > div {
        width: 20%;
    }

    .fg-mm-3a > div {
        width: 25%;
    }

    .fg-mm-4a > div {
        width: calc(100% / 3);
    }    

   .fg-mm-6a > div {
        width: 50%;
    }

    .fg-mm-12a > div {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    /* Elements */

    .fg > .fg-mm-gp-0,
    .fg > .fg-mm-0 {
        width: 0;
        display: none;
    }

    .fg > .fg-mm-gap-1,
    .fg > .fg-mm-1 {
        width: calc(100% / 12);
    }

    .fg > .fg-mm-gap-2,
    .fg > .fg-mm-2 {
        width: calc(100% / 6);
    }

    .fg > .fg-mm-gap-3,
    .fg > .fg-mm-3 {
        width: 25%;
    }

    .fg > .fg-mm-gap-4,
    .fg > .fg-mm-4 {
        width: calc(100% / 3);
    }

    .fg > .fg-mm-gap-5,
    .fg > .fg-mm-5 {
        width: calc((100% / 12) * 5);
    }

    .fg > .fg-mm-gap-6,
    .fg > .fg-mm-6 {
        width: 50%;
    }

    .fg > .fg-mm-gap-7,
    .fg > .fg-mm-7 {
        width: calc((100% / 12) * 7);
    }

    .fg > .fg-mm-gap-8,
    .fg > .fg-mm-8 {
        width: calc(100% / 1.5);
    }

    .fg > .fg-mm-gap-9,
    .fg > .fg-mm-9 {
        width: 75%;
    }

    .fg > .fg-mm-gap-10,
    .fg > .fg-mm-10 {
        width: calc((100% / 12) * 10);
    }

    .fg > .fg-mm-gap-11,
    .fg > .fg-mm-11 {
        width: calc((100% / 12) * 11);
    }

    .fg > .fg-mm-gap-12,
    .fg > .fg-mm-12 {
        width: 100%;
    }

    /* Helpers */

    .fg-mm-v-center,
    .fg-mm-center {
        align-items: center;
    }

    .fg-mm-h-center,
    .fg-mm-center {
        justify-content: center;
    }
}

@media screen and (min-width: 720px) and (max-width: 992px) { /* only for mm */

    /* Elements */

    .fg > .fg-mmo-gp-0,
    .fg > .fg-mmo-0 {
        width: 0;
        display: none;
    }

    .fg > .fg-mmo-gap-1,
    .fg > .fg-mmo-1 {
        width: calc(100% / 12);
    }

    .fg > .fg-mmo-gap-2,
    .fg > .fg-mmo-2 {
        width: calc(100% / 6);
    }

    .fg > .fg-mmo-gap-3,
    .fg > .fg-mmo-3 {
        width: 25%;
    }

    .fg > .fg-mmo-gap-4,
    .fg > .fg-mmo-4 {
        width: calc(100% / 3);
    }

    .fg > .fg-mmo-gap-5,
    .fg > .fg-mmo-5 {
        width: calc((100% / 12) * 5);
    }

    .fg > .fg-mmo-gap-6,
    .fg > .fg-mmo-6 {
        width: 50%;
    }

    .fg > .fg-mmo-gap-7,
    .fg > .fg-mmo-7 {
        width: calc((100% / 12) * 7);
    }

    .fg > .fg-mmo-gap-8,
    .fg > .fg-mmo-8 {
        width: calc(100% / 1.5);
    }

    .fg > .fg-mmo-gap-9,
    .fg > .fg-mmo-9 {
        width: 75%;
    }

    .fg > .fg-mmo-gap-10,
    .fg > .fg-mmo-10 {
        width: calc((100% / 12) * 10);
    }

    .fg > .fg-mmo-gap-11,
    .fg > .fg-mmo-11 {
        width: calc((100% / 12) * 11);
    }

    .fg > .fg-mmo-gap-12,
    .fg > .fg-mmo-12 {
        width: 100%;
    }

    /* Helpers */

    .fg-mmo-v-center,
    .fg-mmo-center {
        align-items: center;
    }

    .fg-mmo-h-center,
    .fg-mmo-center {
        justify-content: center;
    }    
}

/* Large media */

@media screen and (max-width: 992px) { /* until lm */
    .fg-column-ulm {
        flex-direction: column;
    }
}

@media screen and (min-width: 993px) { /* since lm */

    /* Masters */

    .fg-lm-6a,
    .fg-lm-4a,
    .fg-lm-5x,
    .fg-lm-3a,
    .fg-lm-2a {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .fg-lm-12a {
        flex-direction: column;
    }

    .fg-lm-2a > div {
        width: calc(100% / 6);
    }

    .fg-lm-5x > div {
        width: 20%;
    }

    .fg-lm-3a > div {
        width: 25%;
    }

    .fg-lm-4a > div {
        width: calc(100% / 3);
    }

    .fg-lm-6a > div {
        width: 50%;
    }

    .fg-lm-12a > div {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    /* Elements */

    .fg > .fg-lm-gp-0,
    .fg > .fg-lm-0 {
        width: 0;
        display: none;
    }

    .fg > .fg-lm-gap-1,
    .fg > .fg-lm-1 {
        width: calc(100% / 12);
    }

    .fg > .fg-lm-gap-2,
    .fg > .fg-lm-2 {
        width: calc(100% / 6);
    }

    .fg > .fg-lm-gap-3,
    .fg > .fg-lm-3 {
        width: 25%;
    }

    .fg > .fg-lm-gap-4,
    .fg > .fg-lm-4 {
        width: calc(100% / 3);
    }

    .fg > .fg-lm-gap-5,
    .fg > .fg-lm-5 {
        width: calc((100% / 12) * 5);
    }

    .fg > .fg-lm-gap-6,
    .fg > .fg-lm-6 {
        width: 50%;
    }

    .fg > .fg-lm-gap-7,
    .fg > .fg-lm-7 {
        width: calc((100% / 12) * 7);
    }

    .fg > .fg-lm-gap-8,
    .fg > .fg-lm-8 {
        width: calc(100% / 1.5);
    }

    .fg > .fg-lm-gap-9,
    .fg > .fg-lm-9 {
        width: 75%;
    }

    .fg > .fg-lm-gap-10,
    .fg > .fg-lm-10 {
        width: calc((100% / 12) * 10);
    }

    .fg > .fg-lm-gap-11,
    .fg > .fg-lm-11 {
        width: calc((100% / 12) * 11);
    }

    .fg > .fg-lm-gap-12,
    .fg > .fg-lm-12 {
        width: 100%;
    }

    /* Helpers */

    .fg-lm-v-center,
    .fg-lm-center {
        align-items: center;
    }

    .fg-lm-h-center,
    .fg-lm-center {
        justify-content: center;
    }
}

@media screen and (min-width: 993px) and (max-width: 1250px) { /* only for lm */

    /* Elements */

    .fg > .fg-lmo-gp-0,
    .fg > .fg-lmo-0 {
        width: 0;
        display: none;
    }

    .fg > .fg-lmo-gap-1,
    .fg > .fg-lmo-1 {
        width: calc(100% / 12);
    }

    .fg > .fg-lmo-gap-2,
    .fg > .fg-lmo-2 {
        width: calc(100% / 6);
    }

    .fg > .fg-lmo-gap-3,
    .fg > .fg-lmo-3 {
        width: 25%;
    }

    .fg > .fg-lmo-gap-4,
    .fg > .fg-lmo-4 {
        width: calc(100% / 3);
    }

    .fg > .fg-lmo-gap-5,
    .fg > .fg-lmo-5 {
        width: calc((100% / 12) * 5);
    }

    .fg > .fg-lmo-gap-6,
    .fg > .fg-lmo-6 {
        width: 50%;
    }

    .fg > .fg-lmo-gap-7,
    .fg > .fg-lmo-7 {
        width: calc((100% / 12) * 7);
    }

    .fg > .fg-lmo-gap-8,
    .fg > .fg-lmo-8 {
        width: calc(100% / 1.5);
    }

    .fg > .fg-lmo-gap-9,
    .fg > .fg-lmo-9 {
        width: 75%;
    }

    .fg > .fg-lmo-gap-10,
    .fg > .fg-lmo-10 {
        width: calc((100% / 12) * 10);
    }

    .fg > .fg-lmo-gap-11,
    .fg > .fg-lmo-11 {
        width: calc((100% / 12) * 11);
    }

    .fg > .fg-lmo-gap-12,
    .fg > .fg-lmo-12 {
        width: 100%;
    }

    /* Helpers */

    .fg-lmo-v-center,
    .fg-lmo-center {
        align-items: center;
    }

    .fg-lmo-h-center,
    .fg-lmo-center {
        justify-content: center;
    }    
}

/* Huge media */

@media screen and (min-width: 1251px) {  /* since hm */

    /* Master */

    .fg-hm-6a,
    .fg-hm-4a,
    .fg-hm-5x,
    .fg-hm-3a,
    .fg-hm-2a {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .fg-hm-12a {
        flex-direction: column;
    }

    .fg-hm-2a > div {
        width: calc(100% / 6);
    }

    .fg-hm-5x > div {
        width: 20%;
    }

    .fg-hm-3a > div {
        width: 25%;
    }

   .fg-hm-4a > div {
        width: calc(100% / 3);
    }

    .fg-hm-6a > div {
        width: 50%;
    }

    .fg-hm-12a > div {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    /* Elements */

    .fg > .fg-hmo-gap-0,
    .fg > .fg-hm-gap-0,
    .fg > .fg-hmo-0 ,
    .fg > .fg-hm-0 {
        width: 0;
        display: none;
    }

    .fg > .fg-hmo-gap-1,
    .fg > .fg-hm-gap-1,
    .fg > .fg-hmo-1 ,
    .fg > .fg-hm-1 {
        width: calc(100% / 12);
    }

    .fg > .fg-hmo-gap-2,
    .fg > .fg-hm-gap-2,
    .fg > .fg-hmo-2 ,
    .fg > .fg-hm-2 {
        width: calc(100% / 6);
    }

    .fg > .fg-hmo-gap-3,
    .fg > .fg-hm-gap-3,
    .fg > .fg-hmo-3 ,
    .fg > .fg-hm-3 {
        width: 25%;
    }

    .fg > .fg-hmo-gap-4,
    .fg > .fg-hm-gap-4,
    .fg > .fg-hmo-4 ,
    .fg > .fg-hm-4 {
        width: calc(100% / 3);
    }

    .fg > .fg-hmo-gap-5,
    .fg > .fg-hm-gap-5,
    .fg > .fg-hmo-5 ,
    .fg > .fg-hm-5 {
        width: calc((100% / 12) * 5);
    }

    .fg > .fg-hmo-gap-6,
    .fg > .fg-hm-gap-6,
    .fg > .fg-hmo-6 ,
    .fg > .fg-hm-6 {
        width: 50%;
    }

    .fg > .fg-hmo-gap-7,
    .fg > .fg-hm-gap-7,
    .fg > .fg-hmo-7 ,
    .fg > .fg-hm-7 {
        width: calc((100% / 12) * 7);
    }

    .fg > .fg-hmo-gap-8,
    .fg > .fg-hm-gap-8,
    .fg > .fg-hmo-8 ,
    .fg > .fg-hm-8 {
        width: calc(100% / 1.5);
    }

    .fg > .fg-hmo-gap-9,
    .fg > .fg-hm-gap-9,
    .fg > .fg-hmo-9 ,
    .fg > .fg-hm-9 {
        width: 75%;
    }

    .fg > .fg-hmo-gap-10,
    .fg > .fg-hm-gap-10,
    .fg > .fg-hmo-10 ,
    .fg > .fg-hm-10 {
        width: calc((100% / 12) * 10);
    }

    .fg > .fg-hmo-gap-11,
    .fg > .fg-hm-gap-11,
    .fg > .fg-hmo-11 ,
    .fg > .fg-hm-11 {
        width: calc((100% / 12) * 11);
    }

    .fg > .fg-hmo-gap-12,
    .fg > .fg-hm-gap-12,
    .fg > .fg-hmo-12 ,
    .fg > .fg-hm-12 {
        width: 100%;
    }

    /* Helpers */

    .fg-hm-v-center,
    .fg-hmo-v-center,
    .fg-hm-center,
    .fg-hmo-center {
        align-items: center;
    }

    .fg-hm-h-center,
    .fg-hmo-h-center,
    .fg-hm-center,
    .fg-hmo-center {
        justify-content: center;
    }
}