/* See https://github.com/skeleton-framework/skeleton-framework/blob/master/src/css/_utils.css */

.u-full-width {
  width: 100%;
}

.u-max-full-width {
  max-width: 100%;
}


/* Floats */

.u-pull-right {
  float: right;
}

.u-pull-left {
  float: left;
}

.u-cf {
  content: "";
  display: table;
  clear: both;
}


/* Positioning */

.u-center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.u-line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;  
}

td.u-nowrap {
  white-space: nowrap;
}

/**
 * Note:
 *
 * Nest this class inside something with `position: relative` to have
 * your element centered relative to its containing element.
 *
 * Use this class without nesting it to have your element centered relative
 * to the viewport.
 */

.u-center-abs {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
}

/* Type */

.u-text-b {
  font-weight: bold;
}

.u-text-center {
  text-align: center !important;
}

.u-text-left {
  text-align: left !important;
}

.u-text-right {
  text-align: right !important;
}

.u-text-small {
  font-size: 75%;
}

.u-text-smaller {
  font-size: 50%;
}

.u-line-through {
  text-decoration: line-through;
}

.u-text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}


/* Peek a boo */

.u-hide {
  display: none;
}

.u-show {
  display: block;
}

.u-show-table-row {
  display: table-row;
}


.u-invisible {
  visibility: hidden !important;
}

.u-visible {
  visibility: visible !important;
}


/* Misc */

.u-red {
  color: red;
}

.u-reverse-blue {
  background: blue;
  font-weight: bold;
  color: white;
}

.u-reverse-red {
  background: red;
  font-weight: bold;
  color: white;
}

.u-reverse-yellow {
  background: yelloe;
  font-weight: bold;
  color: black;
}

.u-img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}