.flex-row {
    display: flex;
}

.flex-1 {
    flex: 1;
}

.wrap {
    flex-wrap: wrap;
}

.j-center {
    justify-content: center;
}

.ai-center {
    align-items: center;
}

.direction-row-reverse {
    flex-direction: row-reverse;
}


@media(max-width: $breakpoint-phone) {
    .sm-flex-row {
        display: flex;
    }
    
    .sm-flex-1 {
        flex: 1;
    }
    
    .sm-wrap {
        flex-wrap: wrap;
    }
    
    .sm-j-center {
        justify-content: center;
    }
    
    .sm-ai-center {
        align-items: center;
    }
    
    .sm-direction-row-reverse {
        flex-direction: row-reverse;
    }
}

@media(min-width: $breakpoint-phone) and (max-width: $breakpoint-tablet) {
    .md-flex-row {
        display: flex;
    }
    
    .md-flex-1 {
        flex: 1;
    }
    
    .md-wrap {
        flex-wrap: wrap;
    }
    
    .md-j-center {
        justify-content: center;
    }
    
    .md-ai-center {
        align-items: center;
    }
    
    .md-direction-row-reverse {
        flex-direction: row-reverse;
    }
}

@media(min-width: $breakpoint-tablet) {
    .lg-flex-row {
        display: flex;
    }
    
    .lg-flex-1 {
        flex: 1;
    }
    
    .lg-wrap {
        flex-wrap: wrap;
    }
    
    .lg-j-center {
        justify-content: center;
    }
    
    .lg-ai-center {
        align-items: center;
    }
    
    .lg-direction-row-reverse {
        flex-direction: row-reverse;
    }
}