/* Fonts
   ------------------------------------------ */
* {
   color: $grey;
   font-size: $font-size-base;
   font-family: $font-family-base;
}

/* Titles
   ------------------------------------------ */
h1,
h2,
h3,
h4 {
   margin: 0 0 20px 0;

   &,
   span {
      color: $grey;
      font: {
         family: $font-family-base;
         size: 22px;
         weight: 600;
      }

      @media (max-width: $medium) {
         font-size: 22px;
         line-height: 24px;
      }
   }

   small {
      &,
      span {
         color: $orange;
         font-size: 16px;
         font-weight: 600;
      }
   }
}

h1 {
   small {
      display: block;
   }
}

h2 {
   font-size: 16px;
   color: $orange;
   margin-bottom: 10px;
   small {
      color: $grey;
      display: inline-block;
      font: {
         size: 12px;
         weight: 300;
      }
      line-height: 14px;
   }
   span {
      font-size: 16px;
   }
}

h3,
h3 span {
   font-size: 16px;
   small {
      color: #aaaaaa;
      display: block;
      font-size: 13px;
      margin-right: 10px;
   }
}

/* Links
   ------------------------------------------ */
a {
   color: $blue;
   span {
      color: $blue;
   }

   &:hover,
   &:focus {
      color: darken($blue, 10%);
      text-decoration: none;
   }
}

strong {
   font-weight: 600;
}

small,
small * {
   font-size: 12px;
}

/* Size
   ------------------------------------------ */
.font-big,
.font-big * {
   font-size: 20px !important;
}
.font-medium,
.font-medium * {
   font-size: 16px !important;
}
.font-small,
.font-small * {
   font-size: 12px !important;
}