/* filweb flex grid inspired http://gridlex.devlint.fr*/
[class*=grid-], [class~=grid] {
    display: flex;
    box-sizing: border-box;
    flex-flow: row wrap;
    justify-content: left;
    margin: 0 -10px;
    padding-left: 0;
    padding-right: 0;
}

[class*=grid-]:after, [class~=grid]:after {
    clear: both;
}

[class*=grid-] > *, [class~=grid] > * {
    flex: 1;
    max-width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
    margin-left: 0;
    margin-right: 0;
}

/*genel uyum*/
[class*=grid-] img, [class~=grid] img {
    max-width: 100%;
}

@media (min-width: 577px) {
    [class*=grid] > * *:first-child:not(div, section) {
        margin-top: 0 !important;
    }
    
    [class*=grid] > * *:last-child:not(div, section) {
        margin-bottom: 0 !important;
    }
}

/*predifened grids*/
[class*=grid-1] > * {
    flex-basis: 100%;
    max-width: 100%;
}

[class*=grid-2] > * {
    flex-basis: 50%;
    max-width: 50%;
}

[class*=grid-3] > * {
    flex-basis: 33.33333%;
    max-width: 33.33333%;
}

[class*=grid-4] > * {
    flex-basis: 25%;
    max-width: 25%;
}

[class*=grid-5] > * {
    flex-basis: 20%;
    max-width: 20%;
}

[class*=grid-6] > * {
    flex-basis: 16.66667%;
    max-width: 16.66667%;
}

[class*=grid-7] > * {
    flex-basis: 14.28571%;
    max-width: 14.28571%;
}

[class*=grid-8] > * {
    flex-basis: 12.5%;
    max-width: 12.5%;
}

[class*=grid-9] > * {
    flex-basis: 11.11111%;
    max-width: 11.11111%;
}

[class*=grid-10] > * {
    flex-basis: 10%;
    max-width: 10%;
}

[class*=grid-11] > * {
    flex-basis: 9.09091%;
    max-width: 9.09091%;
}

[class*=grid-12] > * {
    flex-basis: 8.33333%;
    max-width: 8.33333%;
}

/*col widths*/
[class*=grid] > .col-12 {
    flex-basis: 100%;
    max-width: 100%;
}

[class*=grid] > .col-11 {
    flex-basis: 91.66667%;
    max-width: 91.66667%;
}

[class*=grid] > .col-10 {
    flex-basis: 83.33333%;
    max-width: 83.33333%;
}

[class*=grid] > .col-9 {
    flex-basis: 75%;
    max-width: 75%;
}

[class*=grid] > .col-8 {
    flex-basis: 66.66667%;
    max-width: 66.66667%;
}

[class*=grid] > .col-7 {
    flex-basis: 58.33333%;
    max-width: 58.33333%;
}

[class*=grid] > .col-6 {
    flex-basis: 50%;
    max-width: 50%;
}

[class*=grid] > .col-5 {
    flex-basis: 41.66667%;
    max-width: 41.66667%;
}

[class*=grid] > .col-4 {
    flex-basis: 33.33333%;
    max-width: 33.33333%;
}

[class*=grid] > .col-3 {
    flex-basis: 25%;
    max-width: 25%;
}

[class*=grid] > .col-2 {
    flex-basis: 16.66667%;
    max-width: 16.66667%;
}

[class*=grid] > .col-1 {
    flex-basis: 8.33333%;
    max-width: 8.33333%;
}

/* dikey column grid için düzeltme*/
.grid-column > *, .grid-lg-column > *, .grid-md-column > *, .grid-sm-column > * {
    max-width: none !important;
}

/*alignment*/
[class*=grid-center] {
    justify-content: center;
}

[class*=grid-right] {
    justify-content: flex-end;
    align-self: flex-end;
}

[class*=grid-space-between] {
    justify-content: space-between;
}

[class*=grid-space-around] {
    justify-content: space-around;
}

[class*=grid-no-wrap] {
    flex-wrap: nowrap;
}

[class*=grid-middle] {
    align-items: center;
}

[class*=grid-bottom] {
    align-items: flex-end;
}

[class*=col-top] {
    align-self: flex-start;
}

[class*=col-middle] {
    align-self: center;
}

[class*=col-bottom] {
    align-self: flex-end;
}

[class*=grid-row] {
    flex-flow: row wrap;
}

[class*=grid-reverse] {
    flex-flow: row-reverse wrap;
}

[class*=grid-column] {
    flex-flow: column wrap;
}

[class*=grid-column-reverse] {
    flex-flow: column-reverse wrap;
}

/*gutters*/
[class*=grid][class*=-noGutter] {
    margin: 0;
}

[class*=grid][class*=-noGutter] > * {
    padding: 0;
}

[class*=grid][class*=-smGutter] {
    margin: 0 -5px;
}

[class*=grid][class*=-smGutter] > * {
    padding: 0 5px;
}

[class*=grid][class*=-mdGutter] {
    margin: 0 -15px;
}

[class*=grid][class*=-mdGutter] > * {
    padding: 0 15px;
}

[class*=grid][class*=-lgGutter] {
    margin: 0 -20px;
}

[class*=grid][class*=-lgGutter] > * {
    padding: 0 20px;
}

[class*=grid][class*=-xlGutter] {
    margin: 0 -25px;
}

[class*=grid][class*=-xlGutter] > * {
    padding: 0 25px;
}

/*offsets*/
[class*=grid] > .offset-left-0 {
    margin-left: 0;
}

[class*=grid] > .offset-left-1 {
    margin-left: 8.33333%;
}

[class*=grid] > .offset-left-2 {
    margin-left: 16.66667%;
}

[class*=grid] > .offset-left-3 {
    margin-left: 25%;
}

[class*=grid] > .offset-left-4 {
    margin-left: 33.33333%;
}

[class*=grid] > .offset-left-5 {
    margin-left: 41.66667%;
}

[class*=grid] > .offset-left-6 {
    margin-left: 50%;
}

[class*=grid] > .offset-left-7 {
    margin-left: 58.33333%;
}

[class*=grid] > .offset-left-8 {
    margin-left: 66.66667%;
}

[class*=grid] > .offset-left-9 {
    margin-left: 75%;
}

[class*=grid] > .offset-left-10 {
    margin-left: 83.33333%;
}

[class*=grid] > .offset-left-11 {
    margin-left: 91.66667%;
}

[class*=grid] > .offset-right-0 {
    margin-right: 0;
}

[class*=grid] > .offset-right-1 {
    margin-right: 8.33333%;
}

[class*=grid] > .offset-right-2 {
    margin-right: 16.66667%;
}

[class*=grid] > .offset-right-3 {
    margin-right: 25%;
}

[class*=grid] > .offset-right-4 {
    margin-right: 33.33333%;
}

[class*=grid] > .offset-right-5 {
    margin-right: 41.66667%;
}

[class*=grid] > .offset-right-6 {
    margin-right: 50%;
}

[class*=grid] > .offset-right-7 {
    margin-right: 58.33333%;
}

[class*=grid] > .offset-right-8 {
    margin-right: 66.66667%;
}

[class*=grid] > .offset-right-9 {
    margin-right: 75%;
}

[class*=grid] > .offset-right-10 {
    margin-right: 83.33333%;
}

[class*=grid] > .offset-right-11 {
    margin-right: 91.66667%;
}

/*Düzeltme nested*/
[class*=grid][class*=col], [class*=grid] > [class*=grid] {
    margin-left: 0;
    margin-right: 0;
    padding: 0;
    max-width: none;
}

[class*=grid] * [class*=grid] {
    max-width: none;
}

/*Extras*/
[class*=grid-equal-height] > * {
    align-self: stretch;
    display: flex;
}

[class*=grid-equal-height] > * > * {
    box-sizing: border-box;
}

[class*=grid][class*=grid-noBottom] > * {
    margin-bottom: 0;
}

/*RESPONSIVE * RESPONSIVE *  RESPONSIVE*/
/*XL*/
@media (min-width: 1367px) and (max-width: 1440px) {
    [class*=grid][class*=-xl-1] > * {
        flex-basis: 100%;
        max-width: 100%;
    }
    
    [class*=grid][class*=-xl-2] > * {
        flex-basis: 50%;
        max-width: 50%;
    }
    
    [class*=grid][class*=-xl-3] > * {
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    
    [class*=grid][class*=-xl-4] > * {
        flex-basis: 25%;
        max-width: 25%;
    }
    
    [class*=grid][class*=-xl-5] > * {
        flex-basis: 20%;
        max-width: 20%;
    }
    
    [class*=grid][class*=-xl-6] > * {
        flex-basis: 16.66667%;
        max-width: 16.66667%;
    }
    
    [class*=grid][class*=-xl-7] > * {
        flex-basis: 14.28571%;
        max-width: 14.28571%;
    }
    
    [class*=grid][class*=-xl-8] > * {
        flex-basis: 12.5%;
        max-width: 12.5%;
    }
    
    [class*=grid][class*=-xl-9] > * {
        flex-basis: 11.11111%;
        max-width: 11.11111%;
    }
    
    [class*=grid][class*=-xl-10] > * {
        flex-basis: 10%;
        max-width: 10%;
    }
    
    [class*=grid][class*=-xl-11] > * {
        flex-basis: 9.09091%;
        max-width: 9.09091%;
    }
    
    [class*=grid][class*=-xl-12] > * {
        flex-basis: 8.33333%;
        max-width: 8.33333%;
    }
    
    [class*=grid] > [class*=col-xl-1] {
        flex-basis: 8.33333%;
        max-width: 8.33333%;
    }
    
    [class*=grid] > [class*=col-xl-2] {
        flex-basis: 16.66667%;
        max-width: 16.66667%;
    }
    
    [class*=grid] > [class*=col-xl-3] {
        flex-basis: 25%;
        max-width: 25%;
    }
    
    [class*=grid] > [class*=col-xl-4] {
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    
    [class*=grid] > [class*=col-xl-5] {
        flex-basis: 41.66667%;
        max-width: 41.66667%;
    }
    
    [class*=grid] > [class*=col-xl-6] {
        flex-basis: 50%;
        max-width: 50%;
    }
    
    [class*=grid] > [class*=col-xl-7] {
        flex-basis: 58.33333%;
        max-width: 58.33333%;
    }
    
    [class*=grid] > [class*=col-xl-8] {
        flex-basis: 66.66667%;
        max-width: 66.66667%;
    }
    
    [class*=grid] > [class*=col-xl-9] {
        flex-basis: 75%;
        max-width: 75%;
    }
    
    [class*=grid] > [class*=col-xl-10] {
        flex-basis: 83.33333%;
        max-width: 83.33333%;
    }
    
    [class*=grid] > [class*=col-xl-11] {
        flex-basis: 91.66667%;
        max-width: 91.66667%;
    }
    
    [class*=grid] > [class*=col-xl-12] {
        flex-basis: 100%;
        max-width: 100%;
    }
    
    [class*=grid][class*=-xl-noBottom] > * {
        margin-bottom: 0;
    }
    
    [class*=grid-xl-row] {
        flex-flow: row wrap;
    }
    
    [class*=grid-xl-reverse] {
        flex-flow: row-reverse wrap;
    }
    
    [class*=grid-xl-column] {
        flex-flow: column wrap;
    }
    
    [class*=grid-xl-column-reverse] {
        flex-flow: column-reverse wrap;
    }
}

/*LG*/
@media (min-width: 1025px) and (max-width: 1366px) {
    [class*=grid][class*=-lg-1] > * {
        flex-basis: 100%;
        max-width: 100%;
    }
    
    [class*=grid][class*=-lg-2] > * {
        flex-basis: 50%;
        max-width: 50%;
    }
    
    [class*=grid][class*=-lg-3] > * {
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    
    [class*=grid][class*=-lg-4] > * {
        flex-basis: 25%;
        max-width: 25%;
    }
    
    [class*=grid][class*=-lg-5] > * {
        flex-basis: 20%;
        max-width: 20%;
    }
    
    [class*=grid][class*=-lg-6] > * {
        flex-basis: 16.66667%;
        max-width: 16.66667%;
    }
    
    [class*=grid][class*=-lg-7] > * {
        flex-basis: 14.28571%;
        max-width: 14.28571%;
    }
    
    [class*=grid][class*=-lg-8] > * {
        flex-basis: 12.5%;
        max-width: 12.5%;
    }
    
    [class*=grid][class*=-lg-9] > * {
        flex-basis: 11.11111%;
        max-width: 11.11111%;
    }
    
    [class*=grid][class*=-lg-10] > * {
        flex-basis: 10%;
        max-width: 10%;
    }
    
    [class*=grid][class*=-lg-11] > * {
        flex-basis: 9.09091%;
        max-width: 9.09091%;
    }
    
    [class*=grid][class*=-lg-12] > * {
        flex-basis: 8.33333%;
        max-width: 8.33333%;
    }
    
    [class*=grid] > [class*=col-lg-1] {
        flex-basis: 8.33333%;
        max-width: 8.33333%;
    }
    
    [class*=grid] > [class*=col-lg-2] {
        flex-basis: 16.66667%;
        max-width: 16.66667%;
    }
    
    [class*=grid] > [class*=col-lg-3] {
        flex-basis: 25%;
        max-width: 25%;
    }
    
    [class*=grid] > [class*=col-lg-4] {
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    
    [class*=grid] > [class*=col-lg-5] {
        flex-basis: 41.66667%;
        max-width: 41.66667%;
    }
    
    [class*=grid] > [class*=col-lg-6] {
        flex-basis: 50%;
        max-width: 50%;
    }
    
    [class*=grid] > [class*=col-lg-7] {
        flex-basis: 58.33333%;
        max-width: 58.33333%;
    }
    
    [class*=grid] > [class*=col-lg-8] {
        flex-basis: 66.66667%;
        max-width: 66.66667%;
    }
    
    [class*=grid] > [class*=col-lg-9] {
        flex-basis: 75%;
        max-width: 75%;
    }
    
    [class*=grid] > [class*=col-lg-10] {
        flex-basis: 83.33333%;
        max-width: 83.33333%;
    }
    
    [class*=grid] > [class*=col-lg-11] {
        flex-basis: 91.66667%;
        max-width: 91.66667%;
    }
    
    [class*=grid] > [class*=col-lg-12] {
        flex-basis: 100%;
        max-width: 100%;
    }
    
    [class*=grid][class*=-lg-noBottom] > * {
        margin-bottom: 0;
    }
    
    [class*=grid-lg-row] {
        flex-flow: row wrap;
    }
    
    [class*=grid-lg-reverse] {
        flex-flow: row-reverse wrap;
    }
    
    [class*=grid-lg-column] {
        flex-flow: column wrap;
    }
    
    [class*=grid-lg-column-reverse] {
        flex-flow: column-reverse wrap;
    }
}

/*MD*/
@media (min-width: 577px) and (max-width: 1024px) {
    [class*=grid][class*=-md-1] > * {
        flex-basis: 100%;
        max-width: 100%;
    }
    
    [class*=grid][class*=-md-2] > * {
        flex-basis: 50%;
        max-width: 50%;
    }
    
    [class*=grid][class*=-md-3] > * {
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    
    [class*=grid][class*=-md-4] > * {
        flex-basis: 25%;
        max-width: 25%;
    }
    
    [class*=grid][class*=-md-5] > * {
        flex-basis: 20%;
        max-width: 20%;
    }
    
    [class*=grid][class*=-md-6] > * {
        flex-basis: 16.66667%;
        max-width: 16.66667%;
    }
    
    [class*=grid][class*=-md-7] > * {
        flex-basis: 14.28571%;
        max-width: 14.28571%;
    }
    
    [class*=grid][class*=-md-8] > * {
        flex-basis: 12.5%;
        max-width: 12.5%;
    }
    
    [class*=grid][class*=-md-9] > * {
        flex-basis: 11.11111%;
        max-width: 11.11111%;
    }
    
    [class*=grid][class*=-md-10] > * {
        flex-basis: 10%;
        max-width: 10%;
    }
    
    [class*=grid][class*=-md-11] > * {
        flex-basis: 9.09091%;
        max-width: 9.09091%;
    }
    
    [class*=grid][class*=-md-12] > * {
        flex-basis: 8.33333%;
        max-width: 8.33333%;
    }
    
    [class*=grid] > [class*=col-md-1] {
        flex-basis: 8.33333%;
        max-width: 8.33333%;
    }
    
    [class*=grid] > [class*=col-md-2] {
        flex-basis: 16.66667%;
        max-width: 16.66667%;
    }
    
    [class*=grid] > [class*=col-md-3] {
        flex-basis: 25%;
        max-width: 25%;
    }
    
    [class*=grid] > [class*=col-md-4] {
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    
    [class*=grid] > [class*=col-md-5] {
        flex-basis: 41.66667%;
        max-width: 41.66667%;
    }
    
    [class*=grid] > [class*=col-md-6] {
        flex-basis: 50%;
        max-width: 50%;
    }
    
    [class*=grid] > [class*=col-md-7] {
        flex-basis: 58.33333%;
        max-width: 58.33333%;
    }
    
    [class*=grid] > [class*=col-md-8] {
        flex-basis: 66.66667%;
        max-width: 66.66667%;
    }
    
    [class*=grid] > [class*=col-md-9] {
        flex-basis: 75%;
        max-width: 75%;
    }
    
    [class*=grid] > [class*=col-md-10] {
        flex-basis: 83.33333%;
        max-width: 83.33333%;
    }
    
    [class*=grid] > [class*=col-md-11] {
        flex-basis: 91.66667%;
        max-width: 91.66667%;
    }
    
    [class*=grid] > [class*=col-md-12] {
        flex-basis: 100%;
        max-width: 100%;
    }
    
    [class*=grid][class*=-md-noBottom] > * {
        margin-bottom: 0;
    }
    
    [class*=grid-md-row] {
        flex-flow: row wrap;
    }
    
    [class*=grid-md-reverse] {
        flex-flow: row-reverse wrap-reverse;
    }
    
    [class*=grid-md-column] {
        flex-flow: column wrap;
    }
    
    [class*=grid-md-column-reverse] {
        flex-flow: column-reverse wrap;
    }
}

/*SM*/
@media (max-width: 576px) {
    [class*=grid] > *, [class*=grid] > [class*=col-] {
        flex-basis: 100%;
        max-width: 100%;
    }
    
    [class*=grid][class*=-sm-2] > * {
        flex-basis: 50%;
        max-width: 50%;
    }
    
    [class*=grid][class*=-sm-3] > * {
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    
    [class*=grid][class*=-sm-4] > * {
        flex-basis: 25%;
        max-width: 25%;
    }
    
    [class*=grid][class*=-sm-5] > * {
        flex-basis: 20%;
        max-width: 20%;
    }
    
    [class*=grid][class*=-sm-6] > * {
        flex-basis: 16.66667%;
        max-width: 16.66667%;
    }
    
    [class*=grid][class*=-sm-7] > * {
        flex-basis: 14.28571%;
        max-width: 14.28571%;
    }
    
    [class*=grid][class*=-sm-8] > * {
        flex-basis: 12.5%;
        max-width: 12.5%;
    }
    
    [class*=grid][class*=-sm-9] > * {
        flex-basis: 11.11111%;
        max-width: 11.11111%;
    }
    
    [class*=grid][class*=-sm-10] > * {
        flex-basis: 10%;
        max-width: 10%;
    }
    
    [class*=grid][class*=-sm-11] > * {
        flex-basis: 9.09091%;
        max-width: 9.09091%;
    }
    
    [class*=grid][class*=-sm-12] > * {
        flex-basis: 8.33333%;
        max-width: 8.33333%;
    }
    
    [class*=grid] > [class*=col-sm-1] {
        flex-basis: 8.33333%;
        max-width: 8.33333%;
    }
    
    [class*=grid] > [class*=col-sm-2] {
        flex-basis: 16.66667%;
        max-width: 16.66667%;
    }
    
    [class*=grid] > [class*=col-sm-3] {
        flex-basis: 25%;
        max-width: 25%;
    }
    
    [class*=grid] > [class*=col-sm-4] {
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    
    [class*=grid] > [class*=col-sm-5] {
        flex-basis: 41.66667%;
        max-width: 41.66667%;
    }
    
    [class*=grid] > [class*=col-sm-6] {
        flex-basis: 50%;
        max-width: 50%;
    }
    
    [class*=grid] > [class*=col-sm-7] {
        flex-basis: 58.33333%;
        max-width: 58.33333%;
    }
    
    [class*=grid] > [class*=col-sm-8] {
        flex-basis: 66.66667%;
        max-width: 66.66667%;
    }
    
    [class*=grid] > [class*=col-sm-9] {
        flex-basis: 75%;
        max-width: 75%;
    }
    
    [class*=grid] > [class*=col-sm-10] {
        flex-basis: 83.33333%;
        max-width: 83.33333%;
    }
    
    [class*=grid] > [class*=col-sm-11] {
        flex-basis: 91.66667%;
        max-width: 91.66667%;
    }
    
    [class*=grid] > [class*=col-sm-12] {
        flex-basis: 100%;
        max-width: 100%;
    }
    
    [class*=grid][class*=-sm-noBottom] > * {
        margin-bottom: 0;
    }
    
    [class*=grid] > [class*=offset-] {
        margin-left: 0;
        margin-right: 0;
    }
    
    [class*=grid-sm-row] {
        flex-flow: row wrap;
    }
    
    [class*=grid-sm-reverse] {
        flex-flow: row-reverse wrap-reverse;
    }
    
    [class*=grid-sm-column] {
        flex-flow: column wrap;
    }
    
    [class*=grid-sm-column-reverse] {
        flex-flow: column-reverse wrap;
    }
}

/*Üst sınırdan Responsive*/
/*XL*/
@media (max-width: 1440px) {
    [class*=grid] > .offset-xl-reset {
        margin-left: 0;
        margin-right: 0;
    }
}

/*LG*/
@media (max-width: 1366px) {
    [class*=grid] > .offset-lg-reset {
        margin-left: 0;
        margin-right: 0;
    }
}

/*MD*/
@media (max-width: 1024px) {
    [class*=grid] > .offset-md-reset {
        margin-left: 0;
        margin-right: 0;
    }
}
/*TODO: lg-hidden md-hidden*/