
flexbox()
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;

clearfix()
  &:after
  &:before
    content " "
    display table
  &:after
    clear both

// Also see .s_Pg_DdX = an extra crossy cross, for the whole page.
// SMALLER_BUNDLE: Use a CSS class instead of dupl this background, almost 300 bytes!
// (Using `crossGray()` duplicates it.)  See .c_Cross below.
crossGray()
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' preserveAspectRatio='none' viewBox='0 0 100 100'><path d='M100 0 L0 100 ' stroke='%23555' stroke-width='1'/><path d='M0 0 L100 100 ' stroke='%23555' stroke-width='1'/></svg>");
  background-repeat:no-repeat;
  background-position:center center;

.c_Cross
  crossGray();

// Old clearfix list: (could start using the above clearfix() instead)
// Makes the root post wrap its (floating) children, don't know if
// needed for other horizontal threads.
.dw-t.dw-hz > .dw-p:after,
  // Wraps any floating reply or rate form (Debiki's or some other framework's,
  // e.g. WordPress' reply form). Unless the .dw-t wraps it, PNG arrow hiders
  // won't hide PNG arrows correctly (because the .dw-t and thus the arrow
  // hiders wouldn't be tall enough, if it didn't wrap floating children).
.dw-t:after,
  // Its children, .dw-p-bd-blk:s, float left.
.dw-p-bd:after,
  // Comment actions
.dw-p-as:after
  // Copied from jquery-ui-1.8.16.custom.css.
  content: "."
  display: block
  height: 0
  clear: both
  visibility: hidden


flip()
  -webkit-transform: scale(-1, 1)
  -moz-transform: scale(-1, 1)
  -ms-transform: scale(-1, 1)
  -o-transform: scale(-1, 1)
  transform: scale(-1, 1)

.dw-mirror
  -webkit-transform: scale(-1, 1)
  -moz-transform: scale(-1, 1)
  -ms-transform: scale(-1, 1)
  -o-transform: scale(-1, 1)
  transform: scale(-1, 1)

rotateFn(degrees)
  -webkit-transform: rotate(degrees);
  -moz-transform: rotate(degrees);
  -o-transform: rotate(degrees);
  -ms-transform: rotate(degrees);
  transform: rotate(degrees);

noUserSelect()
  -webkit-touch-callout: none; // iOS Safari
  -webkit-user-select: none;   // Chrome/Safari/Opera
  -khtml-user-select: none;    // Konqueror
  -moz-user-select: none;      // Firefox
  -ms-user-select: none;       // Internet Explorer/Edge
  user-select: none;

// Inverted icons (changes e.g. a black disc with a white question mark to a black circle,
// filled with white and a black question mark). This supposedly does *not* work in IE9,
// in IE9 I suppose the icon will just disappear (color: white). So be it.
.dw-icon-inverted
  text-shadow: -1px -1px 0 #333, 1px -1px 0 #333, -1px 1px 0 #333, 1px 1px 0 #333;
  color: white;

grayButtonColors()
  background: $grayButtonBgColor;
  border-color: $grayButtonBgColor;
  color: $grayButtonFontColor;
  &:hover
    background: $grayButtonBgHighlight;

// vim: fdm=marker et ts=2 sw=2 tw=0 fo=r list
