.page-content {
  display: flex;
  justify-content: space-between; }

.content-left {
  width: 75%; }

.content-right {
  width: 20%; }

.right-navigation ul {
  list-style-type: none;
  position: fixed; }
  .right-navigation ul li a {
    text-decoration: none;
    color: #2D3236; }

#font-types {
  display: flex;
  align-items: baseline; }
  #font-types h1, #font-types h2, #font-types h3, #font-types p {
    padding: 0 30px 0 0; }

#font-container, #cta-container, #tab-container, #progress-container, #icon-container, #form-container {
  padding: 0 0 30px 0; }

.progress-button {
  margin: 30px 0 0 0; }

.example {
  background-color: #FFF;
  border: 1px solid #EAEAEA;
  padding: 10px;
  margin: 10px 0; }

.code-box {
  background-color: #FFF;
  border: 1px solid #EAEAEA;
  padding: 20px;
  margin: 0 0 14px 0; }

code ol {
  list-style-type: none; }

code .a {
  color: #414F5C; }

code .b {
  color: #017C9D; }

code .c {
  color: #019D76; }

code .d {
  color: #15B8AE; }

code .comment {
  color: #999; }

pre {
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
  font-size: 13px; }

.code {
  background-color: rgba(21, 184, 174, 0.25);
  padding: 1px 3px;
  border-radius: 5px;
  color: #019D76;
  font-family: monospace;
  font-size: 12px; }