HR Styling

hr_styles.css

hr.transparent {
  width: 0; 
  height: 0; 
  border: none; 
  opacity: 0; 
  border-color: #fff; 
  color: #fff; 
  margin: 1em auto;
}

/* Displays as a centered `⋆ ⋆ ⋆` */
hr.stars {
  overflow: visible; /* For IE */
  padding: 0;
  border: none;
  color: #333;
  text-align: center;
  margin: 1em auto;
}
hr.stars:after {
  content: "⋆ ⋆ ⋆";
  display: inline-block;
  position: relative;
  font-size: 1.8em;
}

/* Glyph, by Harry Roberts
Double-line with `§` char in center
https://css-tricks.com/examples/hrs/ */
hr.style-eight {
  overflow: visible; /* For IE */
  padding: 0;
  border: none;
  border-top: medium double #333;
  color: #333;
  text-align: center;
}
hr.style-eight:after {
  content: "§";
  display: inline-block;
  position: relative;
  top: -0.7em;
  font-size: 1.5em;
  padding: 0 0.25em;
  background: white;
}