/* ==========================================================================
  Styles for Routify Docs Website 2020
   ========================================================================== */
/* ==========================================================================
  Reset
   ========================================================================== */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* ==========================================================================
  s-fonts
   ========================================================================== */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/Inter-Regular.woff2?v=3.11") format("woff2"), url("../fonts/Inter-Regular.woff?v=3.11") format("woff"); }

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/Inter-Italic.woff2?v=3.11") format("woff2"), url("../fonts/Inter-Italic.woff?v=3.11") format("woff"); }

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/Inter-Medium.woff2?v=3.11") format("woff2"), url("../fonts/Inter-Medium.woff?v=3.11") format("woff"); }

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/Inter-MediumItalic.woff2?v=3.11") format("woff2"), url("../fonts/Inter-MediumItalic.woff?v=3.11") format("woff"); }

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/Inter-SemiBold.woff2?v=3.11") format("woff2"), url("../fonts/Inter-SemiBold.woff?v=3.11") format("woff"); }

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/Inter-SemiBoldItalic.woff2?v=3.11") format("woff2"), url("../fonts/Inter-SemiBoldItalic.woff?v=3.11") format("woff"); }

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/Inter-Bold.woff2?v=3.11") format("woff2"), url("../fonts/Inter-Bold.woff?v=3.11") format("woff"); }

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/Inter-BoldItalic.woff2?v=3.11") format("woff2"), url("../fonts/Inter-BoldItalic.woff?v=3.11") format("woff"); }

/* overpass-regular - latin */
@font-face {
  font-family: 'Overpass';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/overpass-v4-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Overpass Regular"), local("Overpass-Regular"), url("../fonts/overpass-v4-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/overpass-v4-latin-regular.woff2") format("woff2"), url("../fonts/overpass-v4-latin-regular.woff") format("woff"), url("../fonts/overpass-v4-latin-regular.ttf") format("truetype"), url("../fonts/overpass-v4-latin-regular.svg#Overpass") format("svg");
  /* Legacy iOS */ }

/* overpass-700 - latin */
@font-face {
  font-family: 'Overpass';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/overpass-v4-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("Overpass Bold"), local("Overpass-Bold"), url("../fonts/overpass-v4-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/overpass-v4-latin-700.woff2") format("woff2"), url("../fonts/overpass-v4-latin-700.woff") format("woff"), url("../fonts/overpass-v4-latin-700.ttf") format("truetype"), url("../fonts/overpass-v4-latin-700.svg#Overpass") format("svg");
  /* Legacy iOS */ }

/* ==========================================================================
   s-variables
   Prefixed with $g-
   ========================================================================== */
/* Semantic links to colors
   ========================================================================== */
/* Type
   ========================================================================== */
/* Breakpoints
   ========================================================================== */
/* Components
   =========================================================================== */
/* ==========================================================================
  e-base
  ---
  Only base element styling
   ========================================================================== */
*, *:before, *:after {
  box-sizing: border-box; }

html, body {
  height: 100%; }

html {
  scroll-behavior: smooth;
  font-size: 50%; }
  @media (min-width: 900px) {
    html {
      font-size: 62.5%; } }

body {
  border-top: 0.4rem solid #E938C2;
  background: #FFF;
  color: #4C5567;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  line-height: 1.7;
  font-size: 1.6rem; }

button, input {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }

/* ==========================================================================
  Object: svg icon
   ========================================================================== */
.o-svg-icon--size-16,
.o-svg-icon--size-16 svg {
  width: 1.6rem;
  height: 1.6rem; }

.o-svg-icon--size-18,
.o-svg-icon--size-18 svg {
  width: 1.8rem;
  height: 1.8rem; }

.o-svg-icon--size-20,
.o-svg-icon--size-20 svg {
  width: 2rem;
  height: 2rem; }

.o-svg-icon--size-24,
.o-svg-icon--size-24 svg {
  width: 2.4rem;
  height: 2.4rem; }

/* ==========================================================================
  c-button
   ========================================================================== */
/* Variables
   ========================================================================== */
/* Component
   ========================================================================== */
.c-button {
  padding: 0.8rem 1.2rem;
  display: inline-flex;
  border-radius: 0.2rem;
  border: none;
  appearance: none;
  border-radius: 0.6rem;
  font-size: 1.6rem;
  align-items: center;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
  a.c-button {
    text-decoration: none; }
  .c-button .o-svg-icon * {
    fill: currentColor; }
  .c-button .c-button__icon-wrap:first-child {
    margin-right: 0.4rem; }
  .c-button .c-button__icon-wrap:last-child {
    margin-left: 0.4rem; }

/* Skin variants
 ========================================================================== */
.c-button--primary {
  background: #e938c2;
  color: #fff; }
  .c-button--primary:hover, .c-button--primary:focus {
    background: #ee66d0; }
  .c-button--primary:active {
    background: #d618ac; }

.c-button--outline {
  padding: calc(0.8rem - 0.1rem) calc(1.2rem - 0.1rem);
  border: 0.1rem solid #B2BACC;
  color: #4C5567; }
  .c-button--outline .svg-icon {
    margin: 0.2rem 0.6rem 0 0; }
    .c-button--outline .svg-icon * {
      fill: #4C5567; }
  .c-button--outline:hover {
    border-color: #4C5567; }

/* Size variants
 ========================================================================== */
.c-button--large {
  padding: 1.2rem 2.4rem; }

.c-button--small {
  font-size: 1.4rem;
  padding: 0.6rem 1rem; }

/* ==========================================================================
  Button toolbar
  ========================================================================== */
.c-button-toolbar {
  list-style: none;
  padding: 0;
  display: flex; }
  .c-button-toolbar .c-button {
    margin-right: 0.4rem; }

.c-button-toolbar .c-button:last-child {
  margin-right: 0; }

.c-blogpost > header h1, .c-blogpost > header h2 {
  font-size: 4.8rem;
  font-weight: 700;
  font-family: "Overpass", sans-serif; }
  .c-blogpost > header h1 a, .c-blogpost > header h2 a {
    text-decoration: none;
    color: #1D2C48; }

.c-blogpost-list .c-blogpost > header h1, .c-blogpost-list .c-blogpost > header h2 {
  font-size: 3.2rem; }

.c-blogpost > header p {
  color: #8D97AA; }

.c-blogpost > header {
  margin-bottom: 2.4rem; }

.c-blogpost.c-content h1, .c-blogpost.c-content h2, .c-blogpost.c-content h3 {
  margin-top: 4.8rem; }

.c-blogpost.c-content h4 {
  margin-top: 3.2rem; }

.c-blogpost.c-content h5 {
  margin-top: 2.8rem; }

/* ==========================================================================
  c-blogpost-layout  
   ========================================================================== */
.c-blogpost-layout {
  max-width: 80vw;
  margin: 0 auto; }
  @media (min-width: 1024px) {
    .c-blogpost-layout {
      max-width: 80rem; } }

.c-blogpost-list {
  max-width: 80rem;
  margin: 0 auto; }

.c-blogpost-list__item {
  margin-bottom: 6.4rem;
  padding-bottom: 6.4rem;
  border-bottom: 0.1rem solid #D1D7E2; }
  .c-blogpost-list__item:last-child {
    margin: 0;
    border: none; }

/* ==========================================================================
  c-blogpost-author
   ========================================================================== */
.c-blogpost-author {
  display: flex;
  background: #F3F6FA;
  padding: 2.4rem;
  margin-top: 3.2rem; }

.c-blogpost-author__img {
  border-radius: 100%;
  width: 7.2rem;
  height: 7.2rem;
  margin-right: 2.4rem;
  flex: 0 0 auto; }

.c-blogpost-author__name.c-blogpost-author__name.c-blogpost-author__name {
  /* override c-content */
  /* dirty but just a quick fix before launch, to actually fix, please don't let .c-blogpost-author be a child of .c-content*/
  margin: 0 0 1.2rem; }

.c-blogpost-author .c-horizontal-list {
  /* override c-content */
  margin: 0; }
  .c-blogpost-author .c-horizontal-list li {
    list-style: none; }

/* ==========================================================================
  c-container-horizontal
   ========================================================================== */
.c-container-horizontal {
  width: 100%;
  max-width: 124.8rem;
  margin: 0 auto;
  padding: 0 2.4rem; }
  @media (min-width: 900px) {
    .c-container-horizontal {
      padding: 0 4.8rem; } }

/* ==========================================================================
  c-container-vertical
   ========================================================================== */
.c-container-vertical {
  padding: 2.4rem 0; }
  @media (min-width: 900px) {
    .c-container-vertical {
      padding: 3.2rem 0; } }

.c-container-vertical--small {
  padding: 1.6rem; }
  @media (min-width: 900px) {
    .c-container-vertical--small {
      padding: 2.4rem 0; } }

/* ==========================================================================
  c-content
   ========================================================================== */
/* Headings
   ========================================================================== */
.c-h1, .c-content h1 {
  font-weight: 600;
  color: #1D2C48;
  line-height: 1.25;
  font-family: "Overpass", sans-serif;
  margin: 0 0 1.6rem;
  font-size: 3.2rem; }
  @media (min-width: 900px) {
    .c-h1, .c-content h1 {
      font-size: 4rem; } }

.c-h2, .c-content h2 {
  font-weight: 600;
  line-height: 1.25;
  color: #1D2C48;
  font-family: "Overpass", sans-serif;
  margin: 0 0 1.6rem;
  font-size: 2.4rem; }
  @media (min-width: 900px) {
    .c-h2, .c-content h2 {
      font-size: 3.2rem; } }

.c-h3, .c-content h3 {
  font-size: 1.8rem;
  font-weight: 600;
  color: #1D2C48;
  margin: 0 0 1.6rem; }

.c-h4, .c-content h4 {
  font-size: 1.6rem;
  font-weight: 600;
  color: #1D2C48;
  margin: 0 0 1.6rem; }

/* Regular text
   ========================================================================== */
.c-p, .c-content p {
  margin-bottom: 1.6rem; }

.c-p--small, .c-content p small {
  font-size: 1.4rem;
  margin-bottom: 1.4rem; }

/* Quotes
   ========================================================================== */
.c-blockquote, .c-content blockquote {
  font-style: italic;
  padding: 0 0 0 1.6rem;
  margin: 0 0 1.6rem;
  border-left: 0.4rem solid #D1D7E2; }

/* Lists
   ========================================================================== */
.c-ul, .c-content ul,
.c-ol, .c-content ol {
  margin: 0 0 1.6rem 2.4rem; }

.c-ul, .c-content ul ul,
.c-ol, .c-content ol ol {
  margin: 0 0 0 2.4rem; }

.c-ul > li,
.c-content ul > li {
  list-style: disc; }

.c-ol > li,
.c-content ol > li {
  list-style: decimal; }

.c-content pre, .c-pre {
  background: #250032;
  padding: 1.6rem;
  margin: 0 0 1.6rem; }
  .c-content pre .c-code, .c-content pre code, .c-pre .c-code, .c-pre code {
    color: #FFF;
    background: none; }

.c-code,
.c-content code {
  font-size: 85%;
  padding: 0;
  border-radius: 0.2rem;
  font-family: Monaco, Menlo, monospace;
  background: #FFF6FF; }

.c-content table {
  border: 0.1rem solid #D1D7E2;
  border-radius: 0.3rem;
  border-collapse: separate;
  width: 100%;
  margin: 0 0 2.4rem; }
  .c-content table th, .c-content table td {
    text-align: left; }
  .c-content table td,
  .c-content table th {
    text-align: left;
    vertical-align: top;
    position: relative;
    padding: 1.6rem;
    position: relative; }
  .c-content table th {
    font-weight: 500;
    border-bottom: 0.2rem solid #D1D7E2;
    vertical-align: top; }
  .c-content table td {
    border-bottom: 0.1rem solid #D1D7E2; }
  .c-content table tr:last-child td {
    border: none; }

.c-content a:link {
  color: #3F5EAA;
  text-decoration: none;
  border-bottom: 0.1rem solid rgba(63, 94, 170, 0.33); }

.c-content a:visited {
  color: #AD62BF;
  border-color: rgba(173, 98, 191, 0.33); }

.c-content a:hover,
.c-content a:focus,
.c-content a:active {
  color: #BD239B;
  text-decoration: none;
  border-bottom: 0.1rem solid rgba(189, 35, 155, 0.33); }

.c-content strong, .c-content b {
  font-weight: 600;
  color: #1D2C48; }

.c-content em, .c-content i {
  font-style: italic; }

.c-hr, .c-content hr {
  margin: 1.6rem 0;
  border: none;
  padding: 1.6rem 0;
  border-bottom: 0.1rem solid #B2BACC; }

.c-hr--big {
  margin: 3.2rem 0;
  padding: 3.2rem 0; }

/* ==========================================================================
  c-contributors
  ---
  List of contributors on home page
   ========================================================================== */
.c-contributors {
  border-top: 0.1rem solid #D1D7E2;
  border-bottom: 0.1rem solid #D1D7E2;
  padding: 6.4rem 0;
  text-align: center; }

.c-contributors__list {
  margin: 3.2rem 0 0;
  display: flex;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center; }

.c-contributors__list-item {
  flex: 0 0 auto;
  padding: 1.6rem 2.4rem; }
  .c-contributors__list-item a {
    display: block;
    text-decoration: none; }

/* ==========================================================================
  contributor
   ========================================================================== */
.c-contributor__img {
  border-radius: 100%;
  width: 3.2rem;
  height: 3.2rem; }
  @media (min-width: 900px) {
    .c-contributor__img {
      width: 4.8rem;
      height: 4.8rem; } }

.c-contributor__name {
  display: block;
  color: #4C5567;
  padding: 0.8rem 0 0; }

/* ==========================================================================
  c-footer
   ========================================================================== */
.c-footer {
  border-top: 0.1rem solid #D1D7E2;
  padding: 1.6rem 0;
  margin-top: 2.4rem; }
  @media (min-width: 900px) {
    .c-footer {
      margin-top: 4.8rem;
      padding: 1.6rem 3.2rem; } }

/* ==========================================================================
  File tree
  ---
  Illustration on home page in HTML
   ========================================================================== */
.c-file-tree .c-file-tree {
  padding-left: 3.2rem; }

.c-file-tree li {
  margin: 0.4rem 0; }

.c-file-tree__icon-wrap {
  margin-right: 1.2rem; }

.c-file-tree__filename {
  width: 14rem; }

/* ==========================================================================
  c-function-doc
   ========================================================================== */
/* Hash link */
.c-function-doc__header a {
  color: #0DA5CC;
  text-decoration: none;
  display: inline-block;
  height: 2.4rem;
  width: 2.4rem;
  text-align: center;
  line-height: 2.4rem;
  border-radius: 0.3rem;
  font-size: 90%; }

.c-function-doc__header a:hover {
  color: #0DA5CC;
  background: #D7F7FF;
  text-decoration: none;
  transition: 0.18s background ease-in-out; }

.c-function-doc__content {
  padding-left: 1.6rem; }

.c-function-doc__heading {
  font-size: 2.4rem;
  margin: 0 0 1.6rem; }

/* ==========================================================================
  c-header
  ---
  The general header
   ========================================================================== */
.c-header {
  padding: 2.4rem 0; }
  .c-header > .c-container-horizontal {
    align-items: center;
    display: flex;
    justify-content: space-between; }

/* ==========================================================================
  c-hero
  ---
  The intro on the home page
   ========================================================================== */
.c-hero {
  background: linear-gradient(0deg, white 0%, rgba(255, 255, 255, 0.5) 25%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.5) 75%, white 100%), url('data:image/svg+xml;utf8,\a     <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" opacity="0.05">\a       <pattern id="r" width="340" height="260" patternUnits="userSpaceOnUse">\a         <path  transform="scale(.35,.35) translate(0,0)" d=" M 107.05 356.88 L 171.45 237.943 L 270.41 237.878 C 345.625 237.878 345.375 126.937 270.41 126.937 L 14.65 126.937 L 81.29 8 L 271.41 8 L 271.41 8 C 367.686 8 445.85 86.164 445.85 182.44 C 445.85 278.716 367.686 356.88 271.41 356.88 L 271.41 356.88 L 271.41 356.88 L 107.05 356.88 L 107.05 356.88 Z  M 300.94 362.49 L 336.38 397.94 L 363.71 367.95 L 415.93 573.63 L 207.43 526.65 L 239.48 495.25 L 97.11 358.43 L 166.68 229.94 Q 235.849 229.875 270.41 229.875 C 335.5 229.875 335 134.94 270.41 134.94 Q 205.82 134.94 1 134.94 L 76.6 0 L 271.41 0 C 369.829 -0.081 450.359 80.317 453.815 177.871 C 456.998 267.692 389.017 348.079 300.94 362.49 L 300.94 362.49 L 300.94 362.49 Z  M 290.972 363.842 L 336.65 409.52 L 359.61 384.32 L 404.97 562.96 L 223.53 522.08 L 250.97 495.2 L 115.374 364.88 L 271.41 364.88 C 277.949 364.885 284.47 364.539 290.972 363.842 L 290.972 363.842 Z " fill-rule="evenodd" fill="rgb(0,0,0)"/>\a       </pattern>\a       <pattern id="r2" width="340" height="260" patternUnits="userSpaceOnUse">\a         <g transform="scale(-.35,.35) translate(-460 0)">\a           <path d=" M 107.05 356.88 L 171.45 237.943 L 270.41 237.878 C 345.625 237.878 345.375 126.937 270.41 126.937 L 14.65 126.937 L 81.29 8 L 271.41 8 L 271.41 8 C 367.686 8 445.85 86.164 445.85 182.44 C 445.85 278.716 367.686 356.88 271.41 356.88 L 271.41 356.88 L 271.41 356.88 L 107.05 356.88 L 107.05 356.88 Z  M 300.94 362.49 L 336.38 397.94 L 363.71 367.95 L 415.93 573.63 L 207.43 526.65 L 239.48 495.25 L 97.11 358.43 L 166.68 229.94 Q 235.849 229.875 270.41 229.875 C 335.5 229.875 335 134.94 270.41 134.94 Q 205.82 134.94 1 134.94 L 76.6 0 L 271.41 0 C 369.829 -0.081 450.359 80.317 453.815 177.871 C 456.998 267.692 389.017 348.079 300.94 362.49 L 300.94 362.49 L 300.94 362.49 Z  M 290.972 363.842 L 336.65 409.52 L 359.61 384.32 L 404.97 562.96 L 223.53 522.08 L 250.97 495.2 L 115.374 364.88 L 271.41 364.88 C 277.949 364.885 284.47 364.539 290.972 363.842 L 290.972 363.842 Z " fill-rule="evenodd" fill="rgb(0,0,0)"/>\a         </g>\a       </pattern>\a       <rect transform="translate(150, 130)" x="0" y="0" width="100%" height="100%" fill="url(%23r)"></rect>\a       <rect x="0" y="0" width="100%" height="100%" fill="url(%23r2)"></rect>\a     </svg>');
  display: flex;
  flex-direction: column-reverse; }
  @media (min-width: 900px) {
    .c-hero {
      padding: 9.6rem 0;
      flex-direction: row;
      justify-content: space-between;
      align-items: center; } }

.c-hero__content {
  width: 100%; }
  @media (min-width: 900px) {
    .c-hero__content {
      width: 50%;
      margin-right: 4rem;
      margin-bottom: 0; } }

.c-hero__para {
  padding: 0 0 1.6rem 0; }
  @media (min-width: 900px) {
    .c-hero__para {
      font-size: 2rem; } }

.c-hero__title {
  font-weight: 600;
  color: #1D2C48;
  line-height: 1.25;
  font-family: "Overpass", sans-serif;
  margin: 0 0 1.6rem;
  font-size: 2.8rem; }
  @media (min-width: 900px) {
    .c-hero__title {
      font-size: 4rem; } }

.c-hero__illustration {
  background-color: #fff6ff;
  border-radius: 0.8rem;
  width: 100%;
  margin-bottom: 3.2rem;
  padding: 1.6rem; }
  @media (min-width: 900px) {
    .c-hero__illustration {
      padding: 3.2rem 4rem;
      width: 50%;
      border: 0.1rem solid #fd8af7;
      background-color: #fff;
      margin-bottom: 0; } }

.c-hero__illustration img {
  max-width: 100%; }

.c-help-request {
  margin-top: 4.8rem; }

/* ==========================================================================
  c-horizontal-list
   ========================================================================== */
.c-horizontal-list {
  display: flex; }
  .c-horizontal-list > li {
    list-style: none;
    margin-right: 0.8rem; }
    .c-horizontal-list > li a:link {
      color: #3F5EAA;
      text-decoration: none; }
    .c-horizontal-list > li a:visited {
      color: #AD62BF;
      border-color: rgba(173, 98, 191, 0.33); }
    .c-horizontal-list > li a:hover,
    .c-horizontal-list > li a:focus,
    .c-horizontal-list > li a:active {
      color: #BD239B;
      text-decoration: none; }

.c-horizontal-list--bordered > li {
  padding-right: 0.8rem;
  border-right: 0.1rem solid #B2BACC; }
  .c-horizontal-list--bordered > li:last-child {
    border-right: none; }

.c-horizontal-list--icons > li a {
  display: flex; }
  .c-horizontal-list--icons > li a:link, .c-horizontal-list--icons > li a:visited {
    border: none;
    color: #4C5567; }
  .c-horizontal-list--icons > li a:hover, .c-horizontal-list--icons > li a:active {
    border-bottom: 0.1rem solid #B2BACC;
    color: #1D2C48; }
    .c-horizontal-list--icons > li a:hover .o-svg-icon, .c-horizontal-list--icons > li a:active .o-svg-icon {
      opacity: 0.7; }
  .c-horizontal-list--icons > li a .o-svg-icon {
    opacity: 0.5;
    position: relative;
    top: 0.3rem;
    margin-right: 0.4rem; }

/* ==========================================================================
  c-logo
   ========================================================================== */
.c-logo {
  display: flex;
  width: 12rem; }
  .c-logo img {
    width: 100%; }
  @media (min-width: 900px) {
    .c-logo {
      width: 17.2rem; } }

/* ==========================================================================
   c-navigation
   ========================================================================== */
.c-navigation ul {
  display: flex;
  align-items: center; }

.c-navigation ul li {
  list-style: none; }

.c-navigation .o-svg-icon path, .c-navigation .o-svg-icon circle {
  opacity: 0.5; }

.c-navigation li {
  margin-right: 0.8rem; }

.c-navigation li:nth-last-child(4) {
  margin-right: 2.4rem; }

.c-navigation li:nth-last-child(2),
.c-navigation li:nth-last-child(3) {
  margin-right: 0.2rem; }

.c-navigation a {
  display: block;
  text-decoration: none;
  color: #1D2C48;
  padding: 1rem 1.2rem;
  border-radius: .8rem; }
  .c-navigation a::first-letter {
    text-transform: capitalize; }
  .c-navigation a:hover, .c-navigation a:focus {
    color: #BD239B;
    background: #FFF6FF; }
    .c-navigation a:hover .o-svg-icon path, .c-navigation a:hover .o-svg-icon circle, .c-navigation a:focus .o-svg-icon path, .c-navigation a:focus .o-svg-icon circle {
      opacity: 1; }

.c-navigation__item--selected a {
  background-color: #FFE3FF;
  color: #BD239B; }

@media (max-width: 900px) {
  .c-navigation {
    display: none; } }

/* ==========================================================================
  c-navigation-mobile
   ========================================================================== */
.c-navigation-mobile__links li ul {
  padding-left: 2.4rem; }

.c-navigation-mobile__item a {
  font-size: 2rem;
  text-decoration: none;
  display: block;
  padding: 1.6rem;
  color: #1D2C48; }
  .c-navigation-mobile__item a::first-letter {
    text-transform: capitalize; }

.c-navigation-mobile__item .svg-icon {
  margin-right: 1.2rem; }

.c-navigation-mobile__item--active a,
.c-navigation-mobile__item-child--active a {
  background-color: #FFE3FF;
  border-radius: .8rem;
  color: #3F5EAA; }

.c-navigation-mobile__item ul {
  margin: 1.2rem 0 1.2rem 2.4rem;
  border-left: 0.2rem solid #E938C2;
  padding-left: 2.4rem; }

.c-navigation-mobile__section-header {
  background: none;
  border: none;
  width: 100%;
  font-size: 2rem;
  color: #1D2C48;
  display: flex;
  padding: 1.6rem;
  justify-content: space-between; }
  .c-navigation-mobile__section-header svg {
    opacity: 0.5; }
  .c-navigation-mobile__section-header > span::first-letter {
    text-transform: capitalize; }

/* ==========================================================================
   c-navigation-mobile-holder
   ---
   The frame in which the mobile nav lives
   ========================================================================== */
.c-navigation-mobile-holder {
  display: none;
  background: #FFF;
  bottom: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 10;
  height: 100%;
  overflow: auto; }
  @media (min-width: 900px) {
    .c-navigation-mobile-holder {
      display: none !important; } }

.c-navigation-mobile-holder--active {
  display: block;
  opacity: 1;
  pointer-events: auto; }

.c-navigation-mobile-holder--active > nav {
  padding: 9.6rem 2.4rem 4.8rem; }

.c-navigation-toggle {
  display: none;
  text-decoration: none;
  border: none;
  padding: 0;
  appearance: none;
  background: none;
  margin-right: 0.8rem; }

@media (max-width: 900px) {
  .c-navigation-toggle {
    display: flex; } }

.c-navigation-toggle {
  cursor: pointer;
  align-items: center;
  z-index: 11; }
  .c-navigation-toggle svg {
    display: block; }

.c-navigation-toggle__label {
  color: #1D2C48;
  margin-right: 0;
  display: inline-flex; }

.c-navigation-toggle__line1,
.c-navigation-toggle__line2,
.c-navigation-toggle__line3 {
  transform-origin: 20px 20px;
  transition: all 0.2s ease-in-out; }

.c-navigation-toggle__line1 {
  transform: translateY(-0.7rem); }

.c-navigation-toggle__line3 {
  transform: translateY(0.7rem); }

.c-navigation-toggle--active {
  background: #DEE3EC;
  border-radius: 100%; }
  .c-navigation-toggle--active svg * {
    fill: #1D2C48; }
  .c-navigation-toggle--active .c-navigation-toggle__label {
    color: #1D2C48; }
  .c-navigation-toggle--active .c-navigation-toggle__line1 {
    transform: rotate(-45deg); }
  .c-navigation-toggle--active .c-navigation-toggle__line2 {
    opacity: 0;
    transform: scaleX(0); }
  .c-navigation-toggle--active .c-navigation-toggle__line3 {
    transform: rotate(45deg); }

/* ==========================================================================
  c-note
   ========================================================================== */
.c-note {
  margin: 1.6rem 0;
  background: #FBE4FD;
  padding: 2.4rem;
  position: relative;
  display: flex;
  color: #1D2C48; }
  .c-note p:last-child {
    margin: 0; }

.c-note__icon {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  vertical-align: middle;
  margin-top: .2rem;
  margin-right: .8rem;
  opacity: 0.5; }
  .c-note__icon svg {
    display: block;
    width: 100%;
    height: 100%; }
  @media (min-width: 900px) {
    .c-note__icon {
      width: 2.4rem;
      height: 2.4rem;
      margin-right: 1.2rem; } }

.c-note__text {
  width: 95%; }

.c-note:after {
  content: ' ';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 2rem 2rem 0;
  border-color: transparent #F7D1FA transparent transparent;
  position: absolute;
  top: 0;
  right: 0; }

.c-note > *:last-child {
  margin-bottom: 0; }

.c-note code {
  background: #F9D5FC; }

.c-note--alternate {
  background: #E2F9FF; }
  .c-note--alternate:after {
    border-color: transparent #B7E4EF transparent transparent; }

.c-note--warning {
  background: #FFD7D7; }
  .c-note--warning svg path {
    fill: #BE1515; }
  .c-note--warning:after {
    border-color: transparent #F1C4C4 transparent transparent; }
  .c-note--warning code {
    background: #FFCCCC; }

/* ==========================================================================
  c-sidebar-layout
   ========================================================================== */
.c-sidebar-layout {
  margin: 3.6rem 0; }

.c-sidebar-layout__side {
  margin: 0 0 2.4rem; }

@media (max-width: 900px) {
  .c-sidebar-layout__side {
    display: none; } }

@media (min-width: 900px) {
  .c-sidebar-layout {
    display: flex; }
  .c-sidebar-layout__side {
    flex: 0 0 20%;
    margin-right: 6.4rem; }
  .c-sidebar-layout__main {
    flex: 1 1 auto;
    overflow-x: auto; }
    .c-sidebar-layout__main > .c-container-vertical:first-child {
      padding: 0; } }

/* ==========================================================================
   c-sidebar-nav
   ========================================================================== */
.c-sidebar-nav li {
  list-style: none;
  margin: 0 0 0.6rem; }
  .c-sidebar-nav li:last-child {
    margin: 0; }

.c-sidebar-layout__side nav {
  position: -webkit-sticky;
  /* Safari */
  position: sticky;
  top: 2rem;
  overflow-y: auto; }

.c-sidebar-nav a {
  text-decoration: none;
  display: block;
  padding: 1rem 1.6rem; }
  .c-sidebar-nav a:link, .c-sidebar-nav a:visited {
    color: #1D2C48; }
  .c-sidebar-nav a:hover, .c-sidebar-nav a:active, .c-sidebar-nav a:focus {
    color: #3F5EAA; }

.c-sidebar-nav__item a {
  border-radius: .8rem; }
  .c-sidebar-nav__item a:hover, .c-sidebar-nav__item a:focus {
    color: #BD239B;
    background: #FFF6FF; }
  .c-sidebar-nav__item a::first-letter {
    text-transform: capitalize; }

.c-sidebar-nav .c-sidebar-nav__item--selected > a {
  background: #FFE3FF; }
  .c-sidebar-nav .c-sidebar-nav__item--selected > a:link, .c-sidebar-nav .c-sidebar-nav__item--selected > a:visited {
    color: #BD239B; }

/* ==========================================================================
   c-sidebar-nav-child
   2nd level
   ========================================================================== */
.c-sidebar-nav-child {
  margin: 0.6rem 0 0.6rem 1.6rem;
  padding-left: 1.6rem;
  border-left: 0.2rem solid #E938C2; }

.c-sidebar-nav-child li {
  list-style: none;
  margin: 0 0 0.6rem; }
  .c-sidebar-nav-child li:last-child {
    margin: 0; }

.c-sidebar-nav-child a {
  text-decoration: none;
  display: block;
  color: #BD239B;
  padding: 0.8rem 1.6rem; }
  .c-sidebar-nav-child a:hover, .c-sidebar-nav-child a:focus {
    color: #E938C2; }

.c-sidebar-nav-child__item a {
  border-radius: .8rem; }
  .c-sidebar-nav-child__item a:hover, .c-sidebar-nav-child__item a:focus {
    color: #BD239B;
    background: #FFF6FF; }

.c-sidebar-nav-child .c-sidebar-nav-child__item--selected > a {
  background: #FFF0FF;
  color: #BD239B; }

/* ==========================================================================
  Pagination
   ========================================================================== */
.c-pagination {
  margin-top: 4.8rem;
  display: flex;
  justify-content: space-between; }

/* ==========================================================================
  Component: table
  ---
  Table styling
   ========================================================================== */
/* Variables
   ========================================================================== */
/* Component
   ========================================================================== */
.c-table {
  width: 100%; }
  .c-table th, .c-table td {
    text-align: left; }
  .c-table td,
  .c-table th {
    text-align: left;
    padding: 0.8rem 0;
    vertical-align: top;
    position: relative; }
  .c-table th {
    font-weight: 500; }

.c-table__row--alt td {
  background: #FFF4FF; }

.c-table--styled {
  margin: 0 0 2.4rem; }
  .c-table--styled th {
    font-weight: 500; }
  .c-table--styled th {
    border-bottom: 0.2rem solid #D1D7E2;
    vertical-align: top; }
  .c-table--styled td {
    border-bottom: 0.1rem solid #D1D7E2; }
  .c-table--styled tr:last-child td {
    border: none; }
  .c-table--styled td,
  .c-table--styled th {
    text-align: left;
    padding: 1.6rem;
    position: relative; }
  .c-table--styled td .c-button,
  .c-table--styled th .c-button {
    margin-bottom: -0.8rem;
    margin-top: -0.8rem; }
  .c-table--styled td input[type=checkbox] {
    margin: 0 auto; }

.c-table--bordered {
  border: 0.1rem solid #D1D7E2;
  border-radius: 0.3rem;
  border-collapse: separate; }

.c-table--nowrap th,
.c-table--nowrap td {
  white-space: nowrap; }

.c-table--align-middle td {
  vertical-align: middle; }

.c-table--striped tbody tr:nth-child(even) {
  background: #EEE; }

.c-table--no-margin {
  margin: 0; }

.c-table--align-middle td {
  vertical-align: middle; }

.c-table.c-table--horizontal th {
  width: 18rem;
  border-width: 0.1rem; }

.c-table.c-table--horizontal tr:last-child th {
  border: none; }

/* Invisible table structure
   ========================================================================== */
.c-table.c-table--invisible {
  border: 0;
  width: 100%; }
  .c-table.c-table--invisible tr th,
  .c-table.c-table--invisible tr td {
    border: 0;
    padding-left: 0;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem; }

/* Untable a table
   ========================================================================== */
.c-table--untable tr {
  display: block; }
  .c-table--untable tr th {
    display: block; }
  .c-table--untable tr td {
    display: block; }

@media (min-width: 900px) {
  .c-table--untable tr {
    display: table-row; }
    .c-table--untable tr th {
      display: table-cell; }
    .c-table--untable tr td {
      display: table-cell; } }

/* Responsive table
   Adapted from Bootstrap 4
   ========================================================================== */
.c-table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar; }
  .c-table-responsive > .c-table--bordered {
    border: 0; }

/* ==========================================================================
  c-tabs
   ========================================================================== */
.c-tabs {
  border-bottom: 0.1rem solid #D1D7E2; }

.c-tabs button {
  padding: .8rem 1.6rem;
  background: #FFF;
  color: #E938C2;
  border: none;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 1.6rem;
  font-weight: 500;
  position: relative;
  top: 0.1rem; }
  .c-tabs button:hover, .c-tabs button:focus {
    border-bottom: 0.2rem solid #E938C2;
    color: #4C5567;
    outline-style: none; }

.c-tabs .selected {
  border-bottom: 0.2rem solid #E938C2;
  color: #4C5567; }

/* ==========================================================================
  c-tabs-pages
   ========================================================================== */
.c-tabs-pages {
  margin-top: 0.8rem;
  margin-bottom: 1.6rem; }

/* ==========================================================================
  c-usps
   ========================================================================== */
.c-usps__item {
  margin: 0 0 3.2rem; }
  @media (min-width: 900px) {
    .c-usps__item {
      flex: 1 0 29%;
      padding-right: 4.8rem; } }

@media (min-width: 900px) {
  .c-usps {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around; } }

/* ==========================================================================
  u-flex
   ========================================================================== */
.u-flex {
  display: flex; }

/* ==========================================================================
  Utilities: generic (no category)
  ========================================================================== */
.u-sr-only {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden; }

/* ==========================================================================
  u-spacer
   ========================================================================== */
.u-spacer {
  padding: 1.6rem; }

.u-spacer-bottom--small {
  padding-bottom: 0.8rem; }

/* PrismJS 1.17.1
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
/**
 * prism.js default theme for JavaScript, CSS and HTML
 * Based on dabblet (http://dabblet.com)
 * @author Lea Verou
 */
/* Regular code blocks
   ========================================================================== */
code {
  padding: 0.2rem;
  color: #CE2F55;
  background: #FFF6FF;
  font-size: 1.4rem;
  font-family: "Source Code Pro", Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; }

code[class*="language-"],
pre[class*="language-"] {
  color: #FFF;
  background: none;
  border-radius: 0.3rem;
  font-family: "Source Code Pro", Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
  font-weight: 500;
  font-size: 1.4rem;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  line-height: 1.6;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none; }

pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
  text-shadow: none;
  background: #B750B9;
  color: #FFF; }

pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
code[class*="language-"]::selection, code[class*="language-"] ::selection {
  text-shadow: none;
  background: #B750B9;
  color: #FFF; }

@media print {
  code[class*="language-"],
  pre[class*="language-"] {
    text-shadow: none; } }

/* Code blocks
   ========================================================================== */
pre[class*="language-"] {
  padding: 1em;
  margin: 0.5em 0;
  overflow: auto; }

:not(pre) > code[class*="language-"],
pre[class*="language-"] {
  background: #310541; }

/* Inline code
   ========================================================================== */
:not(pre) > code[class*="language-"] {
  padding: .1em;
  border-radius: .3em;
  white-space: normal; }

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
  font-style: italic;
  font-weight: 400;
  color: #BDC4FF; }

.token.punctuation {
  color: #C872E7; }

.namespace {
  opacity: .7; }

.token.property,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
  color: #F4B4E0; }

.token.tag .token.tag {
  color: #F4B4E0; }

.token.selector,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
  color: #7AC04E; }

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
  color: #F4B4E0; }

.token.atrule,
.token.attr-value,
.token.keyword {
  color: white; }

.token.class-name,
.token.attr-name {
  color: #F4B4E0; }

.token.regex,
.token.important,
.token.variable,
.token.function {
  color: #CC556A; }

.token.important,
.token.bold {
  font-weight: bold; }

.token.italic {
  font-style: italic; }

.token.entity {
  cursor: help; }

/* Command line
   ========================================================================== */
.command-line-prompt {
  border-right: 1px solid #999;
  display: block;
  float: left;
  font-size: 100%;
  letter-spacing: -1px;
  margin-right: 1em;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.command-line-prompt > span:before {
  color: #999;
  content: ' ';
  display: block;
  padding-right: 0.8em; }

.command-line-prompt > span[data-user]:before {
  content: "[" attr(data-user) "@" attr(data-host) "] $"; }

.command-line-prompt > span[data-user="root"]:before {
  content: "[" attr(data-user) "@" attr(data-host) "] #"; }

.command-line-prompt > span[data-prompt]:before {
  content: attr(data-prompt); }

/* ==========================================================================
  Swatch (for styleguide)
  ========================================================================== */
.c-styleguide-color-swatch {
  flex: 0 0 auto;
  text-align: center;
  min-width: 12rem;
  margin: 2.4rem; }

.c-styleguide-color-swatch__line2 {
  font-size: 1.3rem;
  color: #8D97AA; }
  @media (prefers-color-scheme: dark) {
    .c-styleguide-color-swatch__line2 {
      color: #4C5567; } }

.c-styleguide-color-swatch__self {
  background: #666;
  margin: 0 auto 1.6rem;
  height: 4.8rem;
  width: 4.8rem;
  border-radius: 100%; }

/* ==========================================================================
  Swatch list (for styleguide)
  ========================================================================== */
.c-styleguide-color-swatch-list {
  display: flex;
  flex-wrap: wrap; }

/* ==========================================================================
  c-styleguide-icon-list
   ========================================================================== */
.c-styleguide-icon-list {
  columns: 3; }

/* ==========================================================================
  c-styleguide-icon  
   ========================================================================== */
.c-styleguide-icon {
  display: flex;
  margin: 0.4rem 0; }

.c-styleguide-icon__wrap {
  min-width: 4rem; }

/* ==========================================================================
  Styleguide component
   ========================================================================== */
.c-styleguide-component__inner {
  padding: 3.2rem;
  border: 0.1rem solid #DEE3EC;
  margin: 1.6rem 0; }

/*# sourceMappingURL=global.css.map */