.saf-container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    box-sizing: border-box;
}

/*@media (min-width: 1200px) {
    .saf-container { max-width: 1140px; }
}*/

.saf-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

[class^="saf-col-"] {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    box-sizing: border-box;
}

.saf-col-1  { flex: 0 0 8.333333%; max-width: 8.333333%; }
.saf-col-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
.saf-col-3  { flex: 0 0 25%; max-width: 25%; }
.saf-col-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
.saf-col-6  { flex: 0 0 50%; max-width: 50%; }
.saf-col-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
.saf-col-9  { flex: 0 0 75%; max-width: 75%; }
.saf-col-12 { flex: 0 0 100%; max-width: 100%; }

.saf-col {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    padding: 0 15px;
}
.saf-no-wrap{
    white-space: nowrap;
}
.saf-border-bottom-none{
    border-bottom: none !important;
}
.saf-bg-white{
    background-color: white !important;
}
.saf-w50{
    width: 50% !important;
}
.saf-w60{
    width: 60% !important;
}
.saf-h50{
    height: 50px !important;
}
.saf-h100{
    height: 100px !important;
}
.saf-min-h50{
    min-height: 50px !important;
}
.saf-bold{
    font-weight: bold;
}
.saf-area-01{
    padding: .3rem;
}
.saf-area-01 .preview-section-title, .saf-area-01 .preview-table, .saf-area-01 .preview-row {
    border-left: 1px solid #666;
    border-right: 1px solid #666;
}