// Visibility utilities
// @include responsive-invisibility('.visible-tn');
// @include responsive-invisibility('.visible-xl');

.visible-tn-block,
.visible-tn-inline,
.visible-tn-inline-block,
.visible-xl-block,
.visible-xl-inline,
.visible-xl-inline-block {
  display: none !important;
}


@include media-breakpoint-down(tn) {
// @media (max-width: $screen-tn-max) {
  // @include responsive-visibility('.visible-tn');
}
.visible-tn-block {
	@include media-breakpoint-down(tn) {
  //@media (max-width: $screen-tn-max) {
    display: block !important;
  }
}

.visible-tn-inline {
    @include media-breakpoint-down(tn) {
	  // @media (max-width: $screen-tn-max) {
    display: inline !important;
  }
}

.visible-tn-inline-block {
    @include media-breakpoint-down(tn) {
		// @media (max-width: $screen-tn-max) {
    display: inline-block !important;
  }
}

@include media-breakpoint-up(xl) {
//@media (min-width: $screen-xl-min) {
  // @include responsive-visibility('.visible-xl');
}

.visible-xl-block {
    @include media-breakpoint-up(xl) {
    // @media (min-width: $screen-xl-min) {
    display: block !important;
  }
}

.visible-xl-inline {
  @include media-breakpoint-up(xl) {
  // @media (min-width: $screen-xl-min) {
    display: inline !important;
  }
}

.visible-xl-inline-block {
  @include media-breakpoint-up(xl) {
	// @media (min-width: $screen-xl-min) {
			display: inline-block !important;
  }
}

@include media-breakpoint-down(tn) {
// @media (max-width: $screen-tn-max) {
  // @include responsive-invisibility('.hidden-tn');
}

@include media-breakpoint-up(xl) {
// @media (min-width: $screen-xl-min) {
  // @include responsive-invisibility('.hidden-xl');
}
