/* Some global styles for responsive */
.container {
    width: 100%;
    margin: 0 auto;
}
.row {
    display: flex;
    flex-wrap: wrap;
}
.row.inline {
    display: inline-flex;
}
.row>* {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
}
.row.flex-direction-column {
    flex-direction: column;
}
.row.flex-direction-column.reverse {
    flex-direction: column-reverse;
}
.row.reverse {
    flex-direction: row-reverse;
}
.row.align-items-start {
    align-items: flex-start;
}
.row.align-items-center {
    align-items: center;
}
.row.align-items-end {
    align-items: flex-end;
}
.row.justify-content-center {
    justify-content: center;
}
.row.justify-content-right {
    justify-content: flex-end;
}
.row.justify-content-space-between {
    justify-content: space-between;
}
.row.justify-content-space-evenly {
    justify-content: space-evenly;
}
.row.flex-no-wrap {
    flex-wrap: nowrap;
}
/* Average all columns as default */
.col { flex: 1 0 0%; }
.col-1 { flex: 0 0 auto; width: 8.33333333%; }
.col-2 { flex: 0 0 auto; width: 16.66666667%; }
.col-3 { flex: 0 0 auto; width: 25%; }
.col-4 { flex: 0 0 auto; width: 33.33333333%; }
.col-5 { flex: 0 0 auto; width: 41.66666667%; }
.col-6 { flex: 0 0 auto; width: 50%; }
.col-7 { flex: 0 0 auto; width: 58.33333333%; }
.col-8 { flex: 0 0 auto; width: 66.66666667%; }
.col-9 { flex: 0 0 auto; width: 75%; }
.col-10 { flex: 0 0 auto; width: 83.33333333%; }
.col-11 { flex: 0 0 auto; width: 91.66666667%; }
.col-12 { flex: 0 0 auto; width: 100%; }
.flex-grow-0 {
    flex-grow: 0 !important;
}
.flex-grow-100 {
    flex-grow: 100 !important;
}
/* Draw all columns by content's width */
.row-cols-auto>* {
    flex: 0 0 auto;
    width: auto;
}
.col-auto {
    flex: 0 0 auto;
    width: auto;
}
.align-self-center {
    align-self: center;
}
.align-self-end {
    align-self: flex-end;
}

/* Break points */

@media (max-width: 575px) {
    .visible-xs-block {
        display: block !important;
    }
    .xs-hide,.hide-xs {
        display: none!important;
    }
    .ui-dialog .ui-dialog-buttonpane button.long-words,
    .ui-dialog.confirmDialog.long-text-button .ui-dialog-buttonpane button {
        min-width: 80%;
        margin-right: 0;
    }
}
@media (min-width: 576px) {
    body {
        min-width: 1180px;
    }
    .container {
        max-width: 1140px;
    }
    .size-chart-image {
        max-width: 900px;
    }
    .sm-col-1 { flex: 0 0 auto; width: 8.33333333%; }
    .sm-col-2 { flex: 0 0 auto; width: 16.66666667%; }
    .sm-col-3 { flex: 0 0 auto; width: 25%; }
    .sm-col-4 { flex: 0 0 auto; width: 33.33333333%; }
    .sm-col-5 { flex: 0 0 auto; width: 41.66666667%; }
    .sm-col-6 { flex: 0 0 auto; width: 50%; }
    .sm-col-7 { flex: 0 0 auto; width: 58.33333333%; }
    .sm-col-8 { flex: 0 0 auto; width: 66.66666667%; }
    .sm-col-9 { flex: 0 0 auto; width: 75%; }
    .sm-col-10 { flex: 0 0 auto; width: 83.33333333%; }
    .sm-col-11 { flex: 0 0 auto; width: 91.66666667%; }
    .sm-col-12 { flex: 0 0 auto; width: 100%; }
    .sm-col-auto {flex: 0 0 auto;width: auto;}

    .g-sm-text-uppercase {
        text-transform: uppercase;
    }

    .visible-sm-block {
        display: block !important;
    }
    .sm-hide,.hide-sm {
        display: none!important;
    }
}