/*
 * Font Awesome is not needed for 6 glyphs. These are the same shapes, drawn as
 * currentColor masks, so the original markup (<i class="fa fa-bars">) keeps working
 * without loading 300 KB of icon font.
 */
.fa {
  display: inline-block;
  width: 1em;
  height: 1em;
  background: currentColor;
  vertical-align: -0.125em;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
}

.fa-bars {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3 12h466v60H3zM3 226h466v60H3zM3 440h466v60H3z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3 12h466v60H3zM3 226h466v60H3zM3 440h466v60H3z'/%3E%3C/svg%3E");
}

.fa-search {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 96-78 174-174 174S68 304 68 208 146 34 242 34s174 78 174 174zM242 62c-80 0-146 66-146 146s66 146 146 146 146-66 146-146S322 62 242 62zM480 480L342 342l22-22 138 138z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 96-78 174-174 174S68 304 68 208 146 34 242 34s174 78 174 174zM242 62c-80 0-146 66-146 146s66 146 146 146 146-66 146-146S322 62 242 62zM480 480L342 342l22-22 138 138z'/%3E%3C/svg%3E");
}

.fa-times {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M311 331l-117-117 117-117-30-30-117 117L64 64 34 94l117 117L34 328l30 30 117-117 117 117z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M311 331l-117-117 117-117-30-30-117 117L64 64 34 94l117 117L34 328l30 30 117-117 117 117z'/%3E%3C/svg%3E");
}

.fa-envelope-o {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M468 64H44C20 64 0 84 0 108v296c0 24 20 44 44 44h424c24 0 44-20 44-44V108c0-24-20-44-44-44zM44 92h424L256 288 44 92zM484 404H28L256 208l228 196z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M468 64H44C20 64 0 84 0 108v296c0 24 20 44 44 44h424c24 0 44-20 44-44V108c0-24-20-44-44-44zM44 92h424L256 288 44 92zM484 404H28L256 208l228 196z'/%3E%3C/svg%3E");
}

.fa-arrow-circle-right {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32C132 32 32 132 32 256s100 224 224 224 224-100 224-224S380 32 256 32zM256 60c108 0 196 88 196 196s-88 196-196 196S60 364 60 256 148 60 256 60zm108 196l-96 96-22-22 62-62-62-62 22-22 96 96z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32C132 32 32 132 32 256s100 224 224 224 224-100 224-224S380 32 256 32zM256 60c108 0 196 88 196 196s-88 196-196 196S60 364 60 256 148 60 256 60zm108 196l-96 96-22-22 62-62-62-62 22-22 96 96z'/%3E%3C/svg%3E");
}

.fa-play-circle {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32C132 32 32 132 32 256s100 224 224 224 224-100 224-224S380 32 256 32zM256 60c108 0 196 88 196 196s-88 196-196 196S60 364 60 256 148 60 256 60zm-40 120l160 76-160 76z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32C132 32 32 132 32 256s100 224 224 224 224-100 224-224S380 32 256 32zM256 60c108 0 196 88 196 196s-88 196-196 196S60 364 60 256 148 60 256 60zm-40 120l160 76-160 76z'/%3E%3C/svg%3E");
}