.align {
    &-top {
        align-items: flex-start;
    }

    &-center {
        align-items: center;
    }
    
    &-bottom {
        align-items: flex-end;
    }
}

.justify {
    &-left {
        justify-content: flex-start;
    }
    
    &-center {
        justify-content: center;
    }
    
    &-right {
        justify-content: flex-end;
    }
}


body .desktop {
    @media (min-width: $desktop-breakpoint) {
        &-align {
            &-top {
                align-items: flex-start;
            }
        
            &-center {
                align-items: center;
            }
            
            &-bottom {
                align-items: flex-end;
            }
        }
        
        &-justify {
            &-left {
                justify-content: flex-start;
            }
            
            &-center {
                justify-content: center;
            }
            
            &-right {
                justify-content: flex-end;
            }
        }
    }
}