/** @define Test */

/**
 * The 'describe' CSS counter
 */

.Test {
  counter-reset: test-describe;
}

.Test-describe::before {
  content: counter(test-describe);
  counter-increment: test-describe;
}

/**
 * The 'it' CSS counter
 */

.Test-describe {
  counter-reset: test-it;
}

.Test-it::before {
  content: counter(test-describe) "." counter(test-it);
  counter-increment: test-it;
}

/**
 * The test title
 */

.Test-title {
  background: #eee;
  color: #999;
  font-family: sans-serif;
  font-size: 2em;
  margin: 20px 0;
  padding: 20px;
}

/**
 * The test description and expectation titles
 */

.Test-describe,
.Test-it {
  background: #eee;
  border-left: 5px solid #666;
  color: #666;
  font-family: sans-serif;
  font-weight: bold;
  margin: 20px 0;
  padding: 0.75em 20px;
}

.Test-describe {
  font-size: 1.5em;
  margin: 60px 0 20px;
}

/**
 * The counter styles
 */

.Test-describe::before,
.Test-it::before {
  color: #999;
  display: inline-block;
  margin-right: 10px;
  min-width: 30px;
  text-transform: uppercase;
}

/** @define Module */

:root {

  /* gutter is the vertical space between Module-block(s) */

  /* padding for the Module-block */

  /* Separator border for the Module-block */
}

.Module,
.Module-block {
  margin: 0;
  padding: 0;
}

/**
 * Modifier: Module-block--separated
 * Separates a Module-block from the Module-block above
 */

.Module-block--separated {
  border-top: 1px solid #ccc;
}

/**
 * Modifier: Module--withGutter[Sm|Lg] where Sm = small, Lg = large
 * Adds vertical spacing between Module-block
 */

.Module--withGutter > .Module-block + .Module-block {
  margin-top: 1rem;
}

.Module--withGutterSm > .Module-block + .Module-block {
  margin-top: 0.5rem;
}

.Module--withGutterLg > .Module-block + .Module-block {
  margin-top: 3rem;
}

/**
 * Modifier: Module--withPadding[Sm|Lg] where Sm = small, Lg = large
 * Adds inner spacing to each Module-block
 */

.Module--withPadding > .Module-block {
  padding: 1rem;
}

.Module--withPaddingSm > .Module-block {
  padding: 0.5rem;
}

.Module--withPaddingLg > .Module-block {
  padding: 3rem;
}