/*! VIEWPORT DISPLAY*/

:root {
    --view-breakpoint-xs: 0;
    --view-breakpoint-sm: 576px;
    --view-breakpoint-md: 768px;
    --view-breakpoint-lg: 992px;
    --view-breakpoint-xl: 1200px;
}

/*! XLARGE Viewport */
@media (min-width: 1200px) {
    .hidden-xl {
        display: none !important;
    }
}
/*! LARGE Viewport */
@media (min-width: 992px) and (max-width: 1199px) {
    .hidden-lg {
        display: none !important;
    }
}
/*! MEDIUM Viewport */
@media (min-width: 768px) and (max-width: 991px) {
    .hidden-md {
        display: none !important;
    }
}
/*! SMALL Viewport */
@media (min-width: 576px) and (max-width: 767px) {
    .hidden-sm {
        display: none !important;
    }
}
/*! XSMALL Viewport */
@media (max-width: 575px) {
    .hidden-xs {
        display: none !important;
    }
}

/*! Viewport MD/SM/XS - Hide Object */
@media (max-width: 991px) {
    .viewport-md-hide {
        display: none !important;
    }
}

/*! Viewport MD/LG/XL - Show Only Object */
@media (min-width: 992px) {
    .viewport-md-show {
        display: none !important;
    }
}

/*! Viewport SM/XS - Hide Object */
@media (max-width: 768px) {
    .viewport-mobile-hide {
        display: none !important;
    }
}

/*! Viewport XL/LG/MD - Show Only Object */
@media (min-width: 768px) {
    .viewport-mobile-show {
        display: none !important;
    }
}