﻿

/* Extra Small Devices, Phones */
@media only screen and (max-width : 576px) {
    .border-1 {
        border-width: 1px;
        border-style: solid;
        border-color: initial;
    }
    .border-top-1 {
        border-top-width: 1px;
        border-top-style: solid;
        border-top-color: initial;
    }

    .border-right-1 {
        border-right-width: 1px;
        border-right-style: solid;
        border-right-color: initial;
    }

    .border-bottom-1 {
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-bottom-color: initial;
    }

    .border-left-1 {
        border-left-width: 1px;
        border-left-style: solid;
        border-left-color: initial;
    }

    .border-top-0 {
        border-top: none;
    }

    .border-right-0 {
        border-right: 0;
    }

    .border-bottom-0 {
        border-bottom: 0;
    }

    .border-left-0 {
        border-left: 0;
    }

    .border-x-0 {
        border-left: 0;
        border-right: 0;
    }
    .border-y-0 {
        border-top: 0;
        border-bottom: 0;
    }

    .border-x-1 {
        border-left-width: 1px;
        border-left-style: solid;
        border-left-color: initial;

        border-right-width: 1px;
        border-right-style: solid;
        border-right-color: initial;

    }
    .border-y-1 {
        border-top-width: 1px;
        border-top-style: solid;
        border-top-color: initial;

        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-bottom-color: initial;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 576px) {

    .border-sm-1 {
        border-width: 1px !important;
        border-style: solid !important;
        border-color: initial;
    }
    .border-sm-top-1 {
        border-top-width: 1px !important;
        border-top-style: solid !important;
        border-top-color: initial;
    }

    .border-sm-right-1 {
        border-right-width: 1px !important;
        border-right-style: solid !important;
        border-right-color: initial;
    }

    .border-sm-bottom-1 {
        border-bottom-width: 1px !important;
        border-bottom-style: solid !important;
        border-bottom-color: initial;
    }

    .border-sm-left-1 {
        border-left-width: 1px !important;
        border-left-style: solid !important;
        border-left-color: initial;
    }

    .border-sm-top-0 {
        border-top: none !important;
    }

    .border-sm-right-0 {
        border-right: 0 !important;
    }

    .border-sm-bottom-0 {
        border-bottom: 0 !important;
    }

    .border-sm-left-0 {
        border-left: 0 !important;
    }

    .border-sm-x-0 {
        border-left: 0 !important;
        border-right: 0 !important;
    }
    .border-sm-y-0 {
        border-top: 0 !important;
        border-bottom: 0 !important;
    }

    .border-sm-x-1 {
        border-left-width: 1px !important;
        border-left-style: solid !important;
        border-left-color: initial;

        border-right-width: 1px !important;
        border-right-style: solid !important;
        border-right-color: initial;

    }
    .border-sm-y-1 {
        border-top-width: 1px !important;
        border-top-style: solid !important;
        border-top-color: initial;

        border-bottom-width: 1px !important;
        border-bottom-style: solid !important;
        border-bottom-color: initial;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 768px) {

    .border-md-1 {
        border-width: 1px !important;
        border-style: solid !important;
        border-color: initial;
    }
    .border-md-top-1 {
        border-top-width: 1px !important;
        border-top-style: solid !important;
        border-top-color: initial;
    }

    .border-md-right-1 {
        border-right-width: 1px !important;
        border-right-style: solid !important;
        border-right-color: initial;
    }

    .border-md-bottom-1 {
        border-bottom-width: 1px !important;
        border-bottom-style: solid !important;
        border-bottom-color: initial;
    }

    .border-md-left-1 {
        border-left-width: 1px !important;
        border-left-style: solid !important;
        border-left-color: initial;
    }

    .border-md-top-0 {
        border-top: none !important;
    }

    .border-md-right-0 {
        border-right: 0 !important;
    }

    .border-md-bottom-0 {
        border-bottom: 0 !important;
    }

    .border-md-left-0 {
        border-left: 0 !important;
    }

    .border-md-x-0 {
        border-left: 0 !important;
        border-right: 0 !important;
    }
    .border-md-y-0 {
        border-top: 0 !important;
        border-bottom: 0 !important;
    }

    .border-md-x-1 {
        border-left-width: 1px !important;
        border-left-style: solid !important;
        border-left-color: initial;

        border-right-width: 1px !important;
        border-right-style: solid !important;
        border-right-color: initial;

    }
    .border-md-y-1 {
        border-top-width: 1px !important;
        border-top-style: solid !important;
        border-top-color: initial;

        border-bottom-width: 1px !important;
        border-bottom-style: solid !important;
        border-bottom-color: initial;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 992px) {

    .border-lg-1 {
        border-width: 1px !important;
        border-style: solid !important;
        border-color: initial;
    }
    .border-lg-top-1 {
        border-top-width: 1px !important;
        border-top-style: solid !important;
        border-top-color: initial;
    }

    .border-lg-right-1 {
        border-right-width: 1px !important;
        border-right-style: solid !important;
        border-right-color: initial;
    }

    .border-lg-bottom-1 {
        border-bottom-width: 1px !important;
        border-bottom-style: solid !important;
        border-bottom-color: initial;
    }

    .border-lg-left-1 {
        border-left-width: 1px !important;
        border-left-style: solid !important;
        border-left-color: initial;
    }

    .border-lg-top-0 {
        border-top: none !important;
    }

    .border-lg-right-0 {
        border-right: 0 !important;
    }

    .border-lg-bottom-0 {
        border-bottom: 0 !important;
    }

    .border-lg-left-0 {
        border-left: 0 !important;
    }

    .border-lg-x-0 {
        border-left: 0 !important;
        border-right: 0 !important;
    }
    .border-lg-y-0 {
        border-top: 0 !important;
        border-bottom: 0 !important;
    }

    .border-lg-x-1 {
        border-left-width: 1px !important;
        border-left-style: solid !important;
        border-left-color: initial;

        border-right-width: 1px !important;
        border-right-style: solid !important;
        border-right-color: initial;

    }
    .border-lg-y-1 {
        border-top-width: 1px !important;
        border-top-style: solid !important;
        border-top-color: initial;

        border-bottom-width: 1px !important;
        border-bottom-style: solid !important;
        border-bottom-color: initial;
    }
}

/* Extra Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

    .border-xl-1 {
        border-width: 1px !important;
        border-style: solid !important;
        border-color: initial;
    }
    .border-xl-top-1 {
        border-top-width: 1px !important;
        border-top-style: solid !important;
        border-top-color: initial;
    }

    .border-xl-right-1 {
        border-right-width: 1px !important;
        border-right-style: solid !important;
        border-right-color: initial;
    }

    .border-xl-bottom-1 {
        border-bottom-width: 1px !important;
        border-bottom-style: solid !important;
        border-bottom-color: initial;
    }

    .border-xl-left-1 {
        border-left-width: 1px !important;
        border-left-style: solid !important;
        border-left-color: initial;
    }

    .border-xl-top-0 {
        border-top: none !important;
    }

    .border-xl-right-0 {
        border-right: 0 !important;
    }

    .border-xl-bottom-0 {
        border-bottom: 0 !important;
    }

    .border-xl-left-0 {
        border-left: 0 !important;
    }

    .border-xl-x-0 {
        border-left: 0 !important;
        border-right: 0 !important;
    }
    .border-xl-y-0 {
        border-top: 0 !important;
        border-bottom: 0 !important;
    }

    .border-xl-x-1 {
        border-left-width: 1px !important;
        border-left-style: solid !important;
        border-left-color: initial;

        border-right-width: 1px !important;
        border-right-style: solid !important;
        border-right-color: initial;

    }
    .border-xl-y-1 {
        border-top-width: 1px !important;
        border-top-style: solid !important;
        border-top-color: initial;

        border-bottom-width: 1px !important;
        border-bottom-style: solid !important;
        border-bottom-color: initial;
    }
}

//@each $breakpoint in map-keys($grid-breakpoints) {
//    @include media-breakpoint-up($breakpoint) {
//        $infix: breakpoint-infix($breakpoint, $grid-breakpoints);

//        .border#{$infix}-top {
//            border-top: $border-width solid $border-color !important;
//        }

//        .border#{$infix}-right {
//            border-right: $border-width solid $border-color !important;
//        }

//        .border#{$infix}-bottom {
//            border-bottom: $border-width solid $border-color !important;
//        }

//        .border#{$infix}-left {
//            border-left: $border-width solid $border-color !important;
//        }

//        .border#{$infix}-top-0 {
//            border-top: 0 !important;
//        }

//        .border#{$infix}-right-0 {
//            border-right: 0 !important;
//        }

//        .border#{$infix}-bottom-0 {
//            border-bottom: 0 !important;
//        }

//        .border#{$infix}-left-0 {
//            border-left: 0 !important;
//        }

//        .border#{$infix}-x {
//            border-left: $border-width solid $border-color !important;
//            border-right: $border-width solid $border-color !important;
//        }

//        .border#{$infix}-y {
//            border-top: $border-width solid $border-color !important;
//            border-bottom: $border-width solid $border-color !important;
//        }
//    }
//}
