@font-face {
  font-family: "SC";
  font-style: normal;
  font-weight: 300;
  font-display: block;
  src: url(https://lovdin.com/fonts/saira-condensed-extralight.woff2) format("woff2"),
    url(https://lovdin.com/fonts/saira-condensed-extralight.woff) format("woff");
}

@font-face {
  font-family: "SC";
  font-style: normal;
  font-weight: 600;
  font-display: block;
  src: url(https://lovdin.com/fonts/saira-condensed-semibold.woff2) format("woff2"),
    url(https://lovdin.com/fonts/saira-condensed-semibold.woff) format("woff");
}

@font-face {
  font-family: "SCP";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url(https://lovdin.com/fonts/source-code-pro-regular.woff2) format("woff2"),
    url(https://lovdin.com/fonts/source-code-pro-regular.woff) format("woff");
}

html {
  height: 100%;
  line-height: 1.6;
  font-family: "SC", "Saira Condensed", "Open Sans", "PingFang SC", "Helvetica Neue",
    "Helvetica", "Microsoft YaHei", "Source Han Sans", "Noto Sans CJK SC",
    "Noto Sans SC", "Droid Sans", "WenQuanYi Micro Hei", "Arial", sans-serif;
  font-weight: 300;
}

body {
  height: 100%;
  margin: 0;
  padding: 0;
  background-color: #343A45;
  color: #F1F1F1;
}

code {
  font-family: "SCP", "Source Code Pro", "Consolas", "Ubuntu Mono", "Monaco", "Menlo",
    "Droid Sans Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", monospace;
  font-size: 14px;
  font-weight: 400;
}

.root-container {
  min-height: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
}

.main-container {
  -ms-flex-positive: 1;
      flex-grow: 1;
}

.header-container,
.footer-container {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  padding: 15px;
  z-index: 100;
}

.footer-container {
  -ms-flex-pack: center;
      justify-content: center;
}

.copyright {
  font-size: 12px;
  color: rgba(193, 197, 198, 0.3);
  text-align: center;
}

.copyright > .love {
  display: inline-block;
  font-size: 0;
  margin: 0 1px;
}

.copyright > .love::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+PHBhdGggZmlsbD0iIzVCNjE2OSIgZD0iTTEyOCAyNTUuNDNjLTIuMzIxIDAtNC4yODYtMS45NDctNS44OTMtMy41NTVMMzguNTM2IDE3MS4yNWMtLjg5My0uNzE0LTIuMTIxLTEuODc1LTMuNjgzLTMuNDgtMS41NjMtMS42MDctNC4wNDEtNC41MzMtNy40MzMtOC43NzNhMTE4LjI5MyAxMTguMjkzIDAgMCAxLTkuMTA3LTEzLjA1N2MtMi42NzgtNC40NjUtNS4wNjctOS44NjctNy4xNjYtMTYuMjA3QzkuMDQ4IDEyMy4zOTQgOCAxMTcuMjMxIDggMTExLjI1YzAtMTkuNjQ0IDUuNjY5LTM1IDE3LjAwOS00Ni4wNzJDMzYuMzQ4IDU0LjEwNiA1Mi4wMTggNDguNTcgNzIuMDE3IDQ4LjU3YzUuNTM2IDAgMTEuMTg0Ljk2MSAxNi45NDIgMi44ODEgNS43NTkgMS45MiAxMS4xMTcgNC41MDkgMTYuMDcyIDcuNzY4IDQuOTU1IDMuMjU4IDkuMjE5IDYuMzE3IDEyLjc5MSA5LjE3NEExMjMuNDE3IDEyMy40MTcgMCAwIDEgMTI4IDc3LjVhMTIzLjI0MyAxMjMuMjQzIDAgMCAxIDEwLjE4LTkuMTA3YzMuNTcxLTIuODU2IDcuODM0LTUuOTE2IDEyLjc4OS05LjE3NCA0Ljk1NS0zLjI1OSAxMC4zMTItNS44NDggMTYuMDcxLTcuNzY5IDUuNzU5LTEuOTE5IDExLjQwNy0yLjg4IDE2Ljk0Mi0yLjg4IDIwIDAgMzUuNjcgNS41MzYgNDcuMDA5IDE2LjYwN1MyNDggOTEuNjA2IDI0OCAxMTEuMjVjMCAxOS43MzItMTAuMjI1IDM5LjgyLTMwLjY3IDYwLjI2OGwtODMuNDM4IDgwLjM1NmMtMS42MDcgMS42MDgtMy41NzIgMy41NTYtNS44OTIgMy41NTZ6Ii8+PC9zdmc+);
}

.copyright > a {
  font-size: inherit;
  color: inherit;
  text-decoration: none;
}

@media screen and (max-width: 420px) {
  html {
    -webkit-text-size-adjust: 100%;
  }
}

@media not print {
  .only-print {
    display: none !important;
  }
}
.ux-container {
  display: block;
  margin: 0;
  padding: 0;
  position: fixed;
  z-index: 1000;
  left: 0;
  right: 0;
  top: 0;
  text-align: center;
}

.ux-hint {
  margin: 0;
  padding: 8px;
  font-size: 14px;
  font-weight: 300;
}

#noscript-hint {
  background-color: #FFAB40;
  color: #343A45;
  border-bottom: 1px dashed #343A45;
}

#outdated-hint {
  background-color: #FFAB40;
  color: #343A45;
}

#browser-download {
  background-color: #F25648;
  color: #F1F1F1;
  border-bottom: 1px dashed #343A45;
  font-size: 14px;
  font-weight: 100;
}

#outdated-browser-chrome, #outdated-browser-firefox {
  display: inline-block;
  margin: 0 20px;
  padding: 8px;
}

.browsers-sprite {
  display: inline-block;
  overflow: hidden;
  background-repeat: no-repeat;
  background-image: url(../static/135ad3adb399963f.png);
}

.chrome-icon {
  width: 64px;
  height: 64px;
  background-position: -2px -2px;
}

.chrome-icon:active, .chrome-icon:focus, .chrome-icon:hover {
  background-position: -68px -2px;
}

.firefox-icon {
  width: 64px;
  height: 64px;
  background-position: -266px -2px;
}

.firefox-icon:active, .firefox-icon:focus, .firefox-icon:hover {
  background-position: -332px -2px;
}

.edge-icon {
  width: 64px;
  height: 64px;
  background-position: -134px -2px;
}

.edge-icon:active, .edge-icon:focus, .edge-icon:hover {
  background-position: -200px -2px;
}
#avatar-row {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: start;
      align-items: flex-start;
}

.avatar {
  display: block;
  overflow: hidden;
  width: 120px;
  height: 120px;
  background-color: #BBBCC4;
  background-image: url(../static/357461c9f79e7c3e.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  border: 6px #F1F1F1 solid;
  border-radius: 50%;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3) inset;
}
.avatar:active, .avatar:focus, .avatar:hover {
  background-color: #C6C7D0;
}
/***************** shiny *****************
.avatar::before {
  content: "";
  width: 40px;
  height: 120px;
  display: block;
  position: relative;
  z-index: 1;
  left: -80px;
  transform: skewX(-30deg);
  background-image: linear-gradient(rgba(255, 255, 255, 0),
    rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
}
.avatar:active::before,
.avatar:focus::before,
.avatar:hover::before {
  left: 160px;
  transition: left 0.5s ease-in;
}
***************** shiny *****************/
#social-row {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: start;
      align-items: flex-start;
}

.social {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 10px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  transition: transform 0.2s ease;
}
.social:active, .social:focus, .social:hover {
  transform: scale(1.125, 1.125);
}

.zhihu {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+PHBhdGggZmlsbD0iI0YxRjFGMSIgZD0iTTg2LjU1NyAxNDEuMjQ5aDQ5LjkxNGMwLTEzLjgxNC0zLjM5Ni0xOC43NDUtNS4zMzQtMTkuMjQyaC00My4xM2MuNDg5LS45ODYgMS45MzktMzIuMDcxIDIuNDI4LTU5LjIwMmg0MC43MDljLjk3LTEwLjM1OS0xLjQ0OS0xOS4yNDMtNS44MTUtMTkuNzMxSDUzLjEyMWMuOTY5LTQuNDQyIDEuOTM4LTkuMzczIDMuODc3LTE0LjgwMSAyLjQyNy03LjQgNC44NDYtMTQuODAxIDYuMzA0LTE3Ljc1OS0uOTY5LS45ODYtMi45MDgtLjQ4OS03LjI3NC45ODYtNC44NDYgMS40ODMtOC4yMzUgMi45NTgtMTIuMTExIDYuNDE1LTIuNDI4IDEuOTcyLTQuMzY2IDQuOTMtNS44MTUgNy44OTctNC4zNjcgMTEuMzQ1LTEzLjU3MSA0My45MDUtMjUuNjgyIDY2LjYwM0MzMS4zMTcgOTAuOTMxIDQwLjUyOSA4MC4wODQgNDMuNDM3IDcxLjJjMS40NTgtMi45NTggMS45MzgtNi40MTQgMi45MDctOC44NzVoMjUuMjAyYzAgMTEuMzQ1LS40ODkgMzIuMDYyLTIuNDI3IDU5LjY5LTIxLjgwNiAwLTMxLjk4Ny0uNDk3LTQ0LjA5OS0uNDk3LTYuNzg1IDEuOTczLTEwLjE4MiAxMi44MjgtMTEuMTQzIDE5LjczMUg2Ny4xOGMtMS40NSAxMC4zNTgtMS45MzkgMTUuNzg3LTUuODE2IDMxLjA3Ni03LjI2NiAyMi42OTgtMTguODk2IDQwLjQ1OC0zNC44ODYgNTYuMjQ0LTQuMzY2IDQuOTMtMTAuMTgyIDkuODctMTUuOTk4IDE0LjMwMy0uNDguNDg4LS40OC40ODgtLjQ4Ljk4NiA1LjMzNSA0LjkzMSAyNC43MTMgMCAyOC41OS0xLjQ4MiAzLjg3Ny0xLjQ4NCA3LjI2Ni0yLjQ3MiAxMC4xNzMtNC45MzMgMTAuMTgyLTguODgzIDIyLjc3NC0yOC42MTQgMzAuNTI4LTU4LjIxNSAyOS4wNzkgMzQuNTMyIDM1LjM3NSA0NC44OSA0Mi42NDEgNTMuMjc2aC45NjljMi40MjgtOC4zODcgMy44NzctMjIuMi45NjktMjkuMTA0bC0xLjkzOC0zLjQ1NmMtMTQuMDUtMTcuMjctMTQuMDUtMTcuMjctMzAuMDQ4LTM0LjUzMi05LjIwNCA3LjQwMS0xMS4xNDMgOS4zNzMtMTEuMTQzIDkuMzczczEuOTM5LTcuODg5IDIuNDE5LTExLjM0NGMyLjQyOC04Ljg4NSAyLjQyOC0xMy4zMjcgMy4zODktMjIuMjAxTTI0My4wODQgMzkuNjE3SDE1MS4wMWMtLjk3IDAtMi45MDggMS40ODMtMi45MDggMi45NTl2MTc1LjEyOWMwIC45ODUuOTcgMi40NyAyLjkwOCAyLjQ3aDE0LjU0Yy45NjkgMCAyLjQyNyA5Ljg2OCA2LjMwNSAyMC4yMjcgMjAuMzU0LTEzLjMyNSAyOS4wNy0xOC43NDQgMzMuNDM3LTIwLjIyN2gzNy44MDFjMS40NSAwIDIuNDI5LS45ODcgMi40MjktMi40NyAwLTExNi45MjEuNDc5LTU1Ljc0Ny40NzktMTc1LjYyNiAwLTEuNDgzLTEuOTM4LTIuNDY5LTIuOTA4LTIuNDY5bS0xNi45NjcgMTU5LjM0OGMwIC45ODctLjk2OSAxLjQ4NC0xLjQ1MSAxLjQ4NGgtMTkuODY0Yy0uNDg5IDAtLjk3LjQ5OC0uOTcuNDk4LTQuODQ3IDMuOTQ0LTEyLjExMiA4LjM4Ni0yNC4yMzIgMTUuMjg5LTEuOTM4LTYuOTAzLTMuODc2LTE1Ljc4Ny00LjM1OC0xNS43ODdoLTUuODE0Yy0uOTcgMC0xLjQ1LS40ODgtMS40NS0xLjQ4NFY2MC44MzNjMC0uOTg3Ljk3LTEuOTczIDEuNDUtMS45NzNoNTUuMjQ4Yy40ODEgMCAxLjQ1Ljk4NiAxLjQ1IDEuNDgzdjEzOC42MjQiLz48L3N2Zz4=);
}
.douban {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+PHBhdGggZmlsbD0iI0YxRjFGMSIgZD0iTTE3Ny43MjcgMTI4SDc3LjE5OFY3Ny43MzVoMTAwLjUyOFYxMjh6TTIyMy45NiAxMGM2LjA5MiAwIDExLjI4OSAyLjEwNSAxNS41OSA2LjMxNiA0LjMgNC4yMTEgNi40NSA5LjQ1MyA2LjQ1IDE1LjcyNXYxOTEuOTE4YzAgNi4wOTItMi4xNSAxMS4yODktNi40NSAxNS41OTEtNC4zMDEgNC4zLTkuNDk4IDYuNDUtMTUuNTkgNi40NUgzMS43NzJjLTYuMDkzIDAtMTEuMjQ1LTIuMTUtMTUuNDU2LTYuNDUtNC4yMTEtNC4zMDItNi4zMTYtOS40OTktNi4zMTYtMTUuNTkxVjMyLjA0MWMwLTYuMjcyIDIuMTA1LTExLjUxNCA2LjMxNi0xNS43MjVTMjUuNjc5IDEwIDMxLjc3MiAxMEgyMjMuOTZ6TTQyLjc5MiA0My41OTloMTcwLjE0NlYyNi45MzRINDIuNzkydjE2LjY2NXptMTcuNDcyIDE3LjIwM3Y4My41OTVoMTM0LjM5N1Y2MC44MDJINjAuMjY0ek0yMTguNTgzIDE5NC45M2gtNDYuMjMxbDE2LjM5Ni0yOS4yOTktMTguNTQ4LTEzLjk3OGExNDEuNTQ4IDE0MS41NDggMCAwIDAtMi40MTggNi4xODMgODMuNTYgODMuNTYgMCAwIDEtMi41NTQgNi4xODMgOTkuNTA3IDk5LjUwNyAwIDAgMS0zLjA5MiA2LjE4M2MtMy4wNDYgNS4xOTYtNS44MjQgMTAuMjU5LTguMzMzIDE1LjE4N3MtNC4yMSA4LjEwOC01LjEwNyA5LjU0MmgtNDEuNjYyYy0uNzE3LTEuNDM0LTIuMzMtNC42MTUtNC44MzgtOS41NDJhMjkyLjE4MyAyOTIuMTgzIDAgMCAwLTguMzMzLTE1LjE4NyA0MC41ODYgNDAuNTg2IDAgMCAxLTMuMjI2LTYuMTgzIDE0Mi44OTEgMTQyLjg5MSAwIDAgMS0yLjQxOS02LjE4MyAxNDQuNzE1IDE0NC43MTUgMCAwIDAtMi40MTktNi4xODNsLTE4LjU0NyAxMy45NzggMTYuMzk2IDI5LjI5OUgzNy40MTd2MTcuMjAyaDE4MS4xNjdWMTk0LjkzaC0uMDAxeiIvPjwvc3ZnPg==);
}
.github {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+PGcgZmlsbD0iI0YxRjFGMSI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMjguMDAxIDUuMTFDNTguNDIxIDUuMTEgMiA2MS41MiAyIDEzMS4xMWMwIDU1LjY3MiAzNi4xMDMgMTAyLjg5OSA4Ni4xNjcgMTE5LjU2MyA2LjI5NyAxLjE2NSA4LjYwOC0yLjczNSA4LjYwOC02LjA2NCAwLTMuMDA0LS4xMTYtMTIuOTMxLS4xNzEtMjMuNDU3LTM1LjA1NCA3LjYyLTQyLjQ0OS0xNC44NjctNDIuNDQ5LTE0Ljg2Ny01LjczMi0xNC41NjQtMTMuOTkxLTE4LjQzNi0xMy45OTEtMTguNDM2LTExLjQzMy03LjgyLjg2MS03LjY2MS44NjEtNy42NjEgMTIuNjUyLjg4OCAxOS4zMTYgMTIuOTg2IDE5LjMxNiAxMi45ODYgMTEuMjM2IDE5LjI2MSAyOS40NzYgMTMuNjk0IDM2LjY2NyAxMC40NzUgMS4xMy04LjE0MyA0LjM5Ni0xMy43MDUgNy45OTktMTYuODUyLTI3Ljk4Ni0zLjE4My01Ny40MDctMTMuOTkxLTU3LjQwNy02Mi4yNjggMC0xMy43NTYgNC45MjMtMjQuOTk4IDEyLjk4Mi0zMy44MjEtMS4zMDgtMy4xNzQtNS42MjEtMTUuOTg5IDEuMjIxLTMzLjM0NiAwIDAgMTAuNTgxLTMuMzg0IDM0LjY1OCAxMi45MTggMTAuMDUyLTIuNzkyIDIwLjgzMS00LjE5MiAzMS41MzktNC4yNDEgMTAuNzA2LjA0OSAyMS40OTMgMS40NDkgMzEuNTYzIDQuMjQxIDI0LjA1Mi0xNi4zMDIgMzQuNjE1LTEyLjkxOCAzNC42MTUtMTIuOTE4IDYuODU5IDE3LjM1NyAyLjU0OCAzMC4xNzIgMS4yMzggMzMuMzQ2IDguMDc4IDguODI0IDEyLjk2OCAyMC4wNjUgMTIuOTY4IDMzLjgyMSAwIDQ4LjM5Ni0yOS40NzcgNTkuMDQ5LTU3LjUzNSA2Mi4xNyA0LjUyMSAzLjkwOCA4LjU0NyAxMS41NzggOC41NDcgMjMuMzMxIDAgMTYuODU5LS4xNDcgMzAuNDMtLjE0NyAzNC41NzggMCAzLjM1NCAyLjI3MSA3LjI4MyA4LjY1NiA2LjA0OEMyMTcuOTQzIDIzMy45NzggMjU0IDE4Ni43NjIgMjU0IDEzMS4xMWMwLTY5LjU5LTU2LjQxMy0xMjYtMTI1Ljk5OS0xMjZ6Ii8+PHBhdGggZD0iTTQ5LjcyMyAxODYuMDJjLS4yNzcuNjI4LTEuMjY0LjgxNC0yLjE1OS4zODQtLjkxNS0uNDEyLTEuNDI3LTEuMjY0LTEuMTMyLTEuODkyLjI3MS0uNjQ1IDEuMjU4LS44MjIgMi4xNzEtLjM5Ni45MTUuNDEyIDEuNDM2IDEuMjc3IDEuMTIgMS45MDR6bS0xLjU1LTEuMTQ5TTU0LjgyNyAxOTEuNzEzYy0uNjAyLjU1NC0xLjc3Ni4yOTgtMi41NzMtLjU4My0uODI2LS44NzktLjk3OS0yLjA1NC0uMzY5LTIuNjIuNjE5LS41NTUgMS43NTktLjI5NCAyLjU4NC41ODIuODI1Ljg4OS45ODYgMi4wNTQuMzU4IDIuNjIxem0tMS4yMDItMS4yOTJNNTkuNzk1IDE5OC45NjdjLS43NzIuNTM3LTIuMDM2LjAzNi0yLjgxNS0xLjA4NC0uNzczLTEuMTIxLS43NzMtMi40NjYuMDE4LTMuMDAzLjc4LS41MzggMi4wMjUtLjA1NCAyLjgxNiAxLjA1Ni43NjkgMS4xMzkuNzY5IDIuNDg1LS4wMTkgMy4wMzF6bTAgME02Ni42MDIgMjA1Ljk4Yy0uNjkxLjc2Mi0yLjE2My41NTQtMy4yMzgtLjQ4NS0xLjEwMy0xLjAxNi0xLjQwOC0yLjQ1Ny0uNzE4LTMuMjE5LjctLjc2MyAyLjE4LS41NDcgMy4yNjUuNDgzIDEuMDkzIDEuMDE2IDEuNDI1IDIuNDY4LjY5MSAzLjIyMXptMCAwTTc1Ljk5IDIxMC4wNTFjLS4zMDYuOTg2LTEuNzIyIDEuNDM1LTMuMTQ4IDEuMDE2LTEuNDI2LS40MzItMi4zNTctMS41OS0yLjA3LTIuNTg0LjI5Ni0uOTk1IDEuNzItMS40NjMgMy4xNTYtMS4wMTUgMS40MjUuNDMxIDIuMzU4IDEuNTc3IDIuMDYyIDIuNTgzem0wIDBNODYuMzAzIDIxMC44MDVjLjAzNCAxLjA0MS0xLjE3NiAxLjg5OS0yLjY3NCAxLjkyLTEuNTA2LjAzMi0yLjcyNi0uODA4LTIuNzQyLTEuODI5IDAtMS4wNTIgMS4xODQtMS45MDMgMi42ODktMS45MjkgMS40OTgtLjAyOSAyLjcyNy44MDYgMi43MjcgMS44Mzh6bTAgME05NS44OTcgMjA5LjE3MWMuMTggMS4wMTUtLjg2MSAyLjA1NC0yLjM0OSAyLjMzMi0xLjQ2My4yNjktMi44MTYtLjM2LTMuMDA0LTEuMzYxLS4xODItMS4wNC44NzgtMi4wODMgMi4zMzktMi4zNTIgMS40OTEtLjI1OCAyLjgyNS4zNSAzLjAxNCAxLjM4MXptMCAwIi8+PC9nPjwvc3ZnPg==);
}
.dribbble {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTQgNC4wMDRoMjQ3Ljk5MnYyNDcuOTkySDR6Ii8+PHBhdGggZmlsbD0iI0YxRjFGMSIgZD0iTTI0OS40ODMgMTAzLjA0NmExMjQuMzUxIDEyNC4zNTEgMCAwIDAtNy4yNDgtMjMuMzEzYy0zLjA5Mi03LjM0OS02Ljk1NS0xNC40MzQtMTEuNDMzLTIxLjA1NGExMjQuMDkgMTI0LjA5IDAgMCAwLTMzLjQ4LTMzLjQ3NSAxMjMuNTI1IDEyMy41MjUgMCAwIDAtMjEuMDU3LTExLjQ0NGMtNy40OTYtMy4xNDgtMTUuMzQxLTUuNTk5LTIzLjMwMi03LjIxN2ExMjQuMjM1IDEyNC4yMzUgMCAwIDAtMjQuOTYtMi41MzhjLTguNDE1IDAtMTYuODEzLjg2LTI0Ljk3OSAyLjUzNi03Ljk2MSAxLjYxOC0xNS44MDggNC4wNjgtMjMuMzAyIDcuMjE3QTEyNC41NSAxMjQuNTUgMCAwIDAgNTguNjUgMjUuMjAyYTEyNC45NDYgMTI0Ljk0NiAwIDAgMC0xOC4zNDQgMTUuMTMzIDEyNS4wMDEgMTI1LjAwMSAwIDAgMC0xNS4xMjIgMTguMzQyYy00LjQ3OCA2LjYyMS04LjM0MSAxMy43MDYtMTEuNDMzIDIxLjA1NGExMjMuMzUgMTIzLjM1IDAgMCAwLTcuMjQ4IDIzLjMxMyAxMjUuNjM5IDEyNS42MzkgMCAwIDAgLjAwNiA0OS45MzkgMTIyLjcxMSAxMjIuNzExIDAgMCAwIDcuMjQ4IDIzLjI4NEExMjIuODA2IDEyMi44MDYgMCAwIDAgMjUuMTkgMTk3LjM1YTEyNi40MjEgMTI2LjQyMSAwIDAgMCAxNS4xMjIgMTguMzQyIDEyNi40MTIgMTI2LjQxMiAwIDAgMCAxOC4zNDQgMTUuMTIgMTI0LjIyIDEyNC4yMiAwIDAgMCAyMS4wNzEgMTEuNDMxIDEyMi4xMTYgMTIyLjExNiAwIDAgMCAyMy4zMDIgNy4yMTcgMTIzLjM5NSAxMjMuMzk1IDAgMCAwIDI0Ljk3OSAyLjUzNmM4LjM5OCAwIDE2Ljc5Ny0uODQ1IDI0Ljk2NC0yLjUzNmExMjIuMTIxIDEyMi4xMjEgMCAwIDAgMjMuMzAyLTcuMjE3IDEyMy41MyAxMjMuNTMgMCAwIDAgMjEuMDU3LTExLjQzMSAxMjUuOTUgMTI1Ljk1IDAgMCAwIDE4LjM1OC0xNS4xMmM1LjYtNS42MjggMTAuNzAzLTExLjc4MiAxNS4xMjItMTguMzQyYTEyMi43MzggMTIyLjczOCAwIDAgMCAxMS40MzMtMjEuMDgzIDEyMy44NDYgMTIzLjg0NiAwIDAgMCA3LjI0OC0yMy4yODQgMTI1LjQ4NSAxMjUuNDg1IDAgMCAwIDIuNTA5LTI0Ljk5MSAxMjUuNzY0IDEyNS43NjQgMCAwIDAtMi41MTgtMjQuOTQ2em0tMTUuNjE1IDIzLjg5NmMtMS41MzEtLjMzNS0zNy4zNzQtOC4wNDgtNzMuNzU1LTMuNDctLjc1OC0xLjgwOC0xLjUwMi0zLjYzLTIuMjktNS40NTQtMi4yMDEtNS4xOS00LjU3OC0xMC4zMjItNy4wNDMtMTUuMzY4IDQxLjgxOS0xNy4wNzMgNTguNzk0LTQxLjYxMiA1OC45OTctNDEuOTAzIDE0Ljg0NSAxOC4wMzggMjMuODQzIDQxLjA3NCAyNC4wOTEgNjYuMTk1em0tMzUuOTMtNzguMzk3Yy0uMjYzLjM5My0xNS4zNDIgMjMuMzU4LTU1LjMyNCAzOC4zMzEtMTguMDk2LTMzLjI1Ni0zNy45ODUtNTkuNjc3LTM5LjU3NC02MS43NzVhMTA1LjkxOCAxMDUuOTE4IDAgMCAxIDI0Ljk2NC0yLjk5YzI2LjgwMS4wMDIgNTEuMjg0IDEwLjAwMyA2OS45MzQgMjYuNDM0em0tOTUuMzA3LTIzLjM1N2MwIC4wMTUtLjAxNi4wMjktLjAxNi4wMjlzLS4xMzIuMDI5LS4zMjIuMDU4Yy4xMTktLjAyNy4yMjItLjA0My4zMzgtLjA4N3ptLTE5LjgxNiA3LjA1OGMxLjQxNSAxLjg4MiAyMC45OTggMjguNDMyIDM5LjMyNiA2MS4wMDItNTAuODQ2IDEzLjUxNi05NC45ODUgMTIuOTc3LTk3Ljc3MSAxMi45MzMgNi44NjktMzIuODA2IDI4LjkwMS01OS45OTcgNTguNDQ1LTczLjkzNXptLTYwLjcxOSA5NS43NDZjMC0xLjEyMi4wNTgtMi4yMy4wODctMy4zMzggMS44ODEuMDQ0IDU0LjIgMS4yMjUgMTA4LjcyMS0xNS4wOTEgMy4wMzIgNS45MzUgNS45MzUgMTEuOTg1IDguNTg5IDE4LjAwNy0xLjQwMS4zOC0yLjc4Ni44MDItNC4xNzEgMS4yNjktNTcuMTQ3IDE4LjQ1OC04Ni4xMzUgNjkuODY4LTg2LjEzNSA2OS44NjhzLjA0NC4wNDUuMDQ0LjA1OGMtMTYuODY5LTE4Ljc2Ni0yNy4xMzUtNDMuNTY1LTI3LjEzNS03MC43NzN6bTEwNS45MDggMTA1LjkxYy0yNS42MzQgMC00OS4xNDItOS4xMTEtNjcuNDctMjQuMjc2IDEuNDAxIDEuMTM3IDIuMzc3IDEuODUzIDIuMzc3IDEuODUzczIwLjI5Ny00NC4yNjUgODMuMS02Ni4xNDljLjIzMy0uMDg4LjQ4MS0uMTQ2LjcxNi0uMjIgMTQuOTAzIDM4LjcxIDIxLjA0MSA3MS4xMzcgMjIuNjE1IDgwLjM5NWExMDUuNTMzIDEwNS41MzMgMCAwIDEtNDEuMzM4IDguMzk3em01OS4xNzMtMTguMDhjLTEuMDc4LTYuMzg2LTYuNzIyLTM3LjQ3LTIwLjYxNy03NS42MjYgMzQuMTkyLTUuNDY4IDYzLjgwOSAzLjkwOCA2NS45OTYgNC42MjItNC43MTEgMjkuNTEtMjEuNjEzIDU0Ljk1My00NS4zNzkgNzEuMDA0eiIvPjwvc3ZnPg==);
}
.codepen {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+PHBhdGggZmlsbD0iI0YxRjFGMSIgZD0iTTM2LjkyOCAxNjQuNTYybDgwLjc1OSA1My44NHYtNDguMDgxbC00NC43MzItMjkuODY2LTM2LjAyNyAyNC4xMDd6bS04LjMwMy0xOS4yODVMNTQuNDczIDEyOGwtMjUuODQ4LTE3LjI3N3YzNC41NTR6bTEwOS42ODcgNzMuMTI1bDgwLjc1OS01My44NC0zNi4wMjYtMjQuMTA3LTQ0LjczMiAyOS44NjZ2NDguMDgxek0xMjggMTUyLjM3NUwxNjQuNDI5IDEyOCAxMjggMTAzLjYyNSA5MS41NzIgMTI4IDEyOCAxNTIuMzc1em0tNTUuMDQ1LTM2LjgzbDQ0LjczMi0yOS44Njd2LTQ4LjA4bC04MC43NTkgNTMuODQgMzYuMDI3IDI0LjEwN3pNMjAxLjUyNyAxMjhsMjUuODQ4IDE3LjI3N3YtMzQuNTU0TDIwMS41MjcgMTI4em0tMTguNDgyLTEyLjQ1NWwzNi4wMjYtMjQuMTA3LTgwLjc1OS01My44Mzl2NDguMDhsNDQuNzMzIDI5Ljg2NnpNMjQ4IDkxLjQzOHY3My4xMjVjMCAzLjY2LTEuNTE4IDYuNTE4LTQuNTU0IDguNTcxbC0xMDkuNjg4IDczLjEyNUMxMzEuODg0IDI0Ny40MiAxMjkuOTY1IDI0OCAxMjggMjQ4Yy0xLjk2NCAwLTMuODg0LS41OC01Ljc1OS0xLjc0MUwxMi41NTMgMTczLjEzNEM5LjUxOCAxNzEuMDggOCAxNjguMjIzIDggMTY0LjU2MlY5MS40MzhjMC0zLjY2MSAxLjUxOC02LjUxOCA0LjU1My04LjU3MkwxMjIuMjQxIDkuNzQxQzEyNC4xMTYgOC41ODEgMTI2LjAzNiA4IDEyOCA4YzEuOTY1IDAgMy44ODQuNTgxIDUuNzU5IDEuNzQxbDEwOS42ODggNzMuMTI1YzMuMDM1IDIuMDU0IDQuNTUzIDQuOTExIDQuNTUzIDguNTcyeiIvPjwvc3ZnPg==);
}
.twitter {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+PHBhdGggZmlsbD0iI0YxRjFGMSIgZD0iTTI1NiA0OC42MDRhMTA1LjAwMiAxMDUuMDAyIDAgMCAxLTMwLjE2NSA4LjI3YzEwLjg0My02LjUgMTkuMTcyLTE2Ljc5MiAyMy4wOTMtMjkuMDU4YTEwNS4xMTUgMTA1LjExNSAwIDAgMS0zMy4zNTQgMTIuNzQ2Yy05LjU4LTEwLjIwOC0yMy4yMzEtMTYuNTg2LTM4LjMzNi0xNi41ODYtMjkuMDA1IDAtNTIuNTIxIDIzLjUxNi01Mi41MjEgNTIuNTIxIDAgNC4xMTYuNDY1IDguMTI0IDEuMzYgMTEuOTY5LTQzLjY1LTIuMTktODIuMzUxLTIzLjEwMS0xMDguMjU0LTU0Ljg3Ni00LjUyMSA3Ljc1Ny03LjExMiAxNi43NzktNy4xMTIgMjYuNDA0IDAgMTguMjIyIDkuMjcyIDM0LjI5OCAyMy4zNjUgNDMuNzE2YTUyLjMxMSA1Mi4zMTEgMCAwIDEtMjMuNzg5LTYuNTY4Yy0uMDA1LjIxOS0uMDA1LjQzOC0uMDA1LjY2IDAgMjUuNDQ3IDE4LjEwNSA0Ni42NzQgNDIuMTMgNTEuNTAxYTUyLjYzOCA1Mi42MzggMCAwIDEtMjMuNzE4LjljNi42ODQgMjAuODY1IDI2LjA4MSAzNi4wNTEgNDkuMDYzIDM2LjQ3NC0xNy45NzUgMTQuMDg3LTQwLjYyMSAyMi40ODMtNjUuMjI5IDIyLjQ4My00LjIzOSAwLTguNDItLjI1LTEyLjUyOC0uNzM0IDIzLjI0MyAxNC45MDEgNTAuODUgMjMuNTk5IDgwLjUxIDIzLjU5OSA5Ni42MDUgMCAxNDkuNDMzLTgwLjAzMSAxNDkuNDMzLTE0OS40MzcgMC0yLjI3Ny0uMDUxLTQuNTQyLS4xNTItNi43OTVBMTA2LjcwNCAxMDYuNzA0IDAgMCAwIDI1NiA0OC42MDR6Ii8+PC9zdmc+);
}
.main-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: center;
      align-items: center;
  padding: 60px 15px 40px 15px;
  background-image: linear-gradient(#474E5D 0%, #343A45 75%);
}

#social-row {
  margin: 20px 0;
}

#intro-row {
  -ms-flex-positive: 1;
      flex-grow: 1;
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-align: stretch;
      align-items: stretch;
  color: #343A45;
}

.intro-column {
  -ms-flex-positive: 1;
      flex-grow: 1;
  -ms-flex-preferred-size: 32%;
      flex-basis: 32%;
  margin: 0 20px;
  padding: 20px;
  word-wrap: break-word;
  background-image: linear-gradient(#F1F1F1, #EAEAEA);
  border-radius: 8px;
}

.intro-column > hr {
  border-style: dashed;
}

.intro-column > h4 {
  margin: 0;
  font-size: 20px;
  font-weight: 500;
}

.intro-column > h6 {
  margin: 10px 0;
  font-size: 18px;
  font-weight: 500;
}

.intro-card-link {
  color: #4C78B1;
  text-decoration: none;
}

.intro-card-cc-image {
  display: inline-block;
  vertical-align: -8%;
  width: 16px;
  height: 16px;
  margin: 0 2px;
}

.intro-card-mail-image {
  display: inline-block;
  vertical-align: -9%;
  width: 146px;
  height: 16px;
  margin-right: 2px;
}

@media (min-width: 1201px) {
  #site-column {
    margin-left: 25px;
  }
  #answer-column {
    margin-right: 25px;
  }
}

@media (min-width: 961px) and (max-width: 1200px) {
  .intro-column {
    margin: 0 10px;
  }
  #site-column {
    margin-left: 5px;
  }
  #answer-column {
    margin-right: 5px;
  }

  .intro-column > ul {
    padding-left: 30px;
  }
}

@media (max-width: 960px) {
  #intro-row {
    width: 75%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: stretch;
        align-items: stretch;
  }

  .intro-column {
    margin: 0;
  }
  #site-column {
    -ms-flex-order: 1;
        order: 1;
    margin-top: 20px;
    margin-bottom: 20px;
  }
  #bio-column {
    -ms-flex-order: 0;
        order: 0;
  }
  #answer-column {
    -ms-flex-order: 2;
        order: 2;
  }
}

@media (max-width: 768px) {
  #intro-row {
    width: 85%;
  }
}

@media (max-width: 576px) {
  .social {
    width: 30px;
    height: 30px;
    margin: 0 8px;
  }

  #intro-row {
    width: 100%;
  }

  .intro-column {
    min-width: 240px;
    padding: 15px;
  }
}

@media (max-width: 420px) {
  .intro-column > ul {
    padding-left: 30px;
  }
}