$bg: #c55;
$dark: darken($bg, 15);


/* * * * * * * * * * * 
*      Dot Leader
* * * * * * * * * * * */

ul.leaders {
  max-width: 37em;
  padding: 0;
  overflow-x: hidden;
  list-style: none;
  
  li:before {
    float: left;
    width: 0;
    white-space: nowrap;
    color: $dark;
    content: ". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ";
  }
  
  span:first-child {
    font-weight: 600;
    letter-spacing: 2px;
    padding-right: 0.33em;
    background: $bg;
  }
  
  span + span {
    float: right;
    padding-left: 0.33em;
    background: $bg;
  }
  
  span + span:before {
    content: '$';
    padding-right: 0.15em;
  }
}

.fancy-rule {
  border:none;
  width:600px;
  overflow:hidden;
  height:20px;
  text-align: center;
  color: $dark;
}
.rgba {
  color: rgba(0,0,0,0.15);
}
.fancy-rule.asterism:before {
  content:"----";
  letter-spacing:-1px;
  
}

/* Page setup & Styling */
*::selection {
  background-color: #1a1a1a;
  color: aliceblue;
}
body {
  background-color: $bg;
  color: #feca1e;
  font-family: 'Avenir Next', sans-serif;
}
section {
  position: absolute;
  left: calc(50% - 14em);
  width: 38em;
}