@charset "UTF-8";
/*
 * Fonts
*/
@import url("https://p.typekit.net/p.css?s=1&k=xhv4oil&ht=tk&f=13375.27992.34663.34664.34667.34668.34669.34670&a=21433994&app=typekit&e=css");
@font-face {
  font-family: 'Halyard Display';
  src: url(https://use.typekit.net/af/7e8d8a/00000000000000007735adb8/30/l?primer=057d1dff47772f391f5f6c189aa213bb70116047eaffac2e52d3626ff163c8d1&fvd=n4&v=3) format("woff2"), url(https://use.typekit.net/af/7e8d8a/00000000000000007735adb8/30/d?primer=057d1dff47772f391f5f6c189aa213bb70116047eaffac2e52d3626ff163c8d1&fvd=n4&v=3) format("woff"), url(https://use.typekit.net/af/7e8d8a/00000000000000007735adb8/30/a?primer=057d1dff47772f391f5f6c189aa213bb70116047eaffac2e52d3626ff163c8d1&fvd=n4&v=3) format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: 'Halyard Display';
  src: url(https://use.typekit.net/af/6780d0/00000000000000007735adc6/30/l?primer=057d1dff47772f391f5f6c189aa213bb70116047eaffac2e52d3626ff163c8d1&fvd=n6&v=3) format("woff2"), url(https://use.typekit.net/af/6780d0/00000000000000007735adc6/30/d?primer=057d1dff47772f391f5f6c189aa213bb70116047eaffac2e52d3626ff163c8d1&fvd=n6&v=3) format("woff"), url(https://use.typekit.net/af/6780d0/00000000000000007735adc6/30/a?primer=057d1dff47772f391f5f6c189aa213bb70116047eaffac2e52d3626ff163c8d1&fvd=n6&v=3) format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: 'Halyard Display';
  src: url(https://use.typekit.net/af/e51fb7/00000000000000007735adc9/30/l?primer=057d1dff47772f391f5f6c189aa213bb70116047eaffac2e52d3626ff163c8d1&fvd=n7&v=3) format("woff2"), url(https://use.typekit.net/af/e51fb7/00000000000000007735adc9/30/d?primer=057d1dff47772f391f5f6c189aa213bb70116047eaffac2e52d3626ff163c8d1&fvd=n7&v=3) format("woff"), url(https://use.typekit.net/af/e51fb7/00000000000000007735adc9/30/a?primer=057d1dff47772f391f5f6c189aa213bb70116047eaffac2e52d3626ff163c8d1&fvd=n7&v=3) format("opentype");
  font-weight: bold;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: 'Paralucent';
  src: url(https://use.typekit.net/af/302a59/00000000000000007735f0cd/30/l?primer=8fa4b058e82492e04d7cdf52b0e62c529469bc2a019e2b65c17d5e267ca91b8d&fvd=n9&v=3) format("woff2"), url(https://use.typekit.net/af/302a59/00000000000000007735f0cd/30/d?primer=8fa4b058e82492e04d7cdf52b0e62c529469bc2a019e2b65c17d5e267ca91b8d&fvd=n9&v=3) format("woff"), url(https://use.typekit.net/af/302a59/00000000000000007735f0cd/30/a?primer=8fa4b058e82492e04d7cdf52b0e62c529469bc2a019e2b65c17d5e267ca91b8d&fvd=n9&v=3) format("opentype");
  font-weight: bold;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: 'OCR A Std';
  src: url(https://use.typekit.net/af/3315df/000000000000000000012e5c/27/l?primer=8fa4b058e82492e04d7cdf52b0e62c529469bc2a019e2b65c17d5e267ca91b8d&fvd=n4&v=3) format("woff2"), url(https://use.typekit.net/af/3315df/000000000000000000012e5c/27/d?primer=8fa4b058e82492e04d7cdf52b0e62c529469bc2a019e2b65c17d5e267ca91b8d&fvd=n4&v=3) format("woff"), url(https://use.typekit.net/af/3315df/000000000000000000012e5c/27/a?primer=8fa4b058e82492e04d7cdf52b0e62c529469bc2a019e2b65c17d5e267ca91b8d&fvd=n4&v=3) format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }

/*** Variables ***/
/* 
 * ------------------------
 * Colors 
 * ------------------------
 */
/* 
 * ------------------------
 * Font Families
 * ------------------------
*/
/* 
 * ------------------------
 * Font Weights
 * ------------------------
 */
/* 
 * ------------------------
 * Media Queries
 * ------------------------
 */
/* 
 * ------------------------
 * Helpers
 * ------------------------
 */
* {
  box-sizing: border-box; }

html, body, div, p, h1, h2, h3, h4, h5, h6, ul, li, ol, dd, dl, dt, form, legend, label, fieldset, legend, address, center, acronym, iframe, blockquote, pre, code {
  margin: 0;
  padding: 0;
  font-style: normal;
  font-weight: normal;
  list-style: none; }

body {
  font-size: 16px;
  line-height: normal;
  font-family: "Halyard Display", Helvetica, Arial, sans-serif;
  background: #FFF;
  color: #020226; }

a, span {
  word-wrap: break-word; }

img, fieldset, iframe {
  border: 0; }

input, select, textarea {
  outline: none;
  font-family: "Halyard Display", Helvetica, Arial, sans-serif;
  font-size: 16px; }

button {
  font-family: "Halyard Display", Helvetica, Arial, sans-serif; }

textarea {
  resize: none; }

table {
  border-spacing: 0; }

table, tr, td, th, tbody, thead, tfoot, caption {
  border: 0;
  margin: 0;
  padding: 0;
  border-collapse: collapse;
  word-wrap: break-word; }

/*
 * Structure
*/
.columns-row {
  display: flex;
  flex-wrap: wrap;
  margin-left: -15px;
  margin-right: -15px; }
  .columns-row > .col, .columns-row > [class*=col-] {
    padding: 15px; }

.col {
  flex-basis: 0;
  flex-grow: 1;
  max-width: 100%; }

.col-1 {
  flex-basis: 8.3333333333%;
  max-width: 8.3333333333%; }

.col-2 {
  flex-basis: 16.6666666667%;
  max-width: 16.6666666667%; }

.col-3 {
  flex-basis: 25%;
  max-width: 25%; }

.col-4 {
  flex-basis: 33.3333333333%;
  max-width: 33.3333333333%; }

.col-5 {
  flex-basis: 41.6666666667%;
  max-width: 41.6666666667%; }

.col-6 {
  flex-basis: 50%;
  max-width: 50%; }

.col-7 {
  flex-basis: 58.3333333333%;
  max-width: 58.3333333333%; }

.col-8 {
  flex-basis: 66.6666666667%;
  max-width: 66.6666666667%; }

.col-9 {
  flex-basis: 75%;
  max-width: 75%; }

.col-10 {
  flex-basis: 83.3333333333%;
  max-width: 83.3333333333%; }

.col-11 {
  flex-basis: 91.6666666667%;
  max-width: 91.6666666667%; }

.col-12 {
  flex-basis: 100%;
  max-width: 100%; }

.col-offset-12 {
  margin-left: 100%; }

.col-offset-11 {
  margin-left: 91.66666667%; }

.col-offset-10 {
  margin-left: 83.33333333%; }

.col-offset-9 {
  margin-left: 75%; }

.col-offset-8 {
  margin-left: 66.66666667%; }

.col-offset-7 {
  margin-left: 58.33333333%; }

.col-offset-6 {
  margin-left: 50%; }

.col-offset-5 {
  margin-left: 41.66666667%; }

.col-offset-4 {
  margin-left: 33.33333333%; }

.col-offset-3 {
  margin-left: 25%; }

.col-offset-2 {
  margin-left: 16.66666667%; }

.col-offset-1 {
  margin-left: 8.33333333%; }

.col-offset-0 {
  margin-left: 0; }

@media (min-width: 576px) {
  .col-xs {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%; }
  .col-xs-1 {
    flex-basis: 8.3333333333%;
    max-width: 8.3333333333%; }
  .col-xs-2 {
    flex-basis: 16.6666666667%;
    max-width: 16.6666666667%; }
  .col-xs-3 {
    flex-basis: 25%;
    max-width: 25%; }
  .col-xs-4 {
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%; }
  .col-xs-5 {
    flex-basis: 41.6666666667%;
    max-width: 41.6666666667%; }
  .col-xs-6 {
    flex-basis: 50%;
    max-width: 50%; }
  .col-xs-7 {
    flex-basis: 58.3333333333%;
    max-width: 58.3333333333%; }
  .col-xs-8 {
    flex-basis: 66.6666666667%;
    max-width: 66.6666666667%; }
  .col-xs-9 {
    flex-basis: 75%;
    max-width: 75%; }
  .col-xs-10 {
    flex-basis: 83.3333333333%;
    max-width: 83.3333333333%; }
  .col-xs-11 {
    flex-basis: 91.6666666667%;
    max-width: 91.6666666667%; }
  .col-xs-12 {
    flex-basis: 100%;
    max-width: 100%; } }

@media (min-width: 768px) {
  .col-sm {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%; }
  .col-sm-1 {
    flex-basis: 8.3333333333%;
    max-width: 8.3333333333%; }
  .col-sm-2 {
    flex-basis: 16.6666666667%;
    max-width: 16.6666666667%; }
  .col-sm-3 {
    flex-basis: 25%;
    max-width: 25%; }
  .col-sm-4 {
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%; }
  .col-sm-5 {
    flex-basis: 41.6666666667%;
    max-width: 41.6666666667%; }
  .col-sm-6 {
    flex-basis: 50%;
    max-width: 50%; }
  .col-sm-7 {
    flex-basis: 58.3333333333%;
    max-width: 58.3333333333%; }
  .col-sm-8 {
    flex-basis: 66.6666666667%;
    max-width: 66.6666666667%; }
  .col-sm-9 {
    flex-basis: 75%;
    max-width: 75%; }
  .col-sm-10 {
    flex-basis: 83.3333333333%;
    max-width: 83.3333333333%; }
  .col-sm-11 {
    flex-basis: 91.6666666667%;
    max-width: 91.6666666667%; }
  .col-sm-12 {
    flex-basis: 100%;
    max-width: 100%; } }

@media (min-width: 992px) {
  .col-md {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%; }
  .col-md-1 {
    flex-basis: 8.3333333333%;
    max-width: 8.3333333333%; }
  .col-md-2 {
    flex-basis: 16.6666666667%;
    max-width: 16.6666666667%; }
  .col-md-3 {
    flex-basis: 25%;
    max-width: 25%; }
  .col-md-4 {
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%; }
  .col-md-5 {
    flex-basis: 41.6666666667%;
    max-width: 41.6666666667%; }
  .col-md-6 {
    flex-basis: 50%;
    max-width: 50%; }
  .col-md-7 {
    flex-basis: 58.3333333333%;
    max-width: 58.3333333333%; }
  .col-md-8 {
    flex-basis: 66.6666666667%;
    max-width: 66.6666666667%; }
  .col-md-9 {
    flex-basis: 75%;
    max-width: 75%; }
  .col-md-10 {
    flex-basis: 83.3333333333%;
    max-width: 83.3333333333%; }
  .col-md-11 {
    flex-basis: 91.6666666667%;
    max-width: 91.6666666667%; }
  .col-md-12 {
    flex-basis: 100%;
    max-width: 100%; } }

@media (min-width: 1200px) {
  .col-lg {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%; }
  .col-lg-1 {
    flex-basis: 8.3333333333%;
    max-width: 8.3333333333%; }
  .col-lg-2 {
    flex-basis: 16.6666666667%;
    max-width: 16.6666666667%; }
  .col-lg-3 {
    flex-basis: 25%;
    max-width: 25%; }
  .col-lg-4 {
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%; }
  .col-lg-5 {
    flex-basis: 41.6666666667%;
    max-width: 41.6666666667%; }
  .col-lg-6 {
    flex-basis: 50%;
    max-width: 50%; }
  .col-lg-7 {
    flex-basis: 58.3333333333%;
    max-width: 58.3333333333%; }
  .col-lg-8 {
    flex-basis: 66.6666666667%;
    max-width: 66.6666666667%; }
  .col-lg-9 {
    flex-basis: 75%;
    max-width: 75%; }
  .col-lg-10 {
    flex-basis: 83.3333333333%;
    max-width: 83.3333333333%; }
  .col-lg-11 {
    flex-basis: 91.6666666667%;
    max-width: 91.6666666667%; }
  .col-lg-12 {
    flex-basis: 100%;
    max-width: 100%; } }

@media (min-width: 1440px) {
  .col-xl {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%; }
  .col-xl-1 {
    flex-basis: 8.3333333333%;
    max-width: 8.3333333333%; }
  .col-xl-2 {
    flex-basis: 16.6666666667%;
    max-width: 16.6666666667%; }
  .col-xl-3 {
    flex-basis: 25%;
    max-width: 25%; }
  .col-xl-4 {
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%; }
  .col-xl-5 {
    flex-basis: 41.6666666667%;
    max-width: 41.6666666667%; }
  .col-xl-6 {
    flex-basis: 50%;
    max-width: 50%; }
  .col-xl-7 {
    flex-basis: 58.3333333333%;
    max-width: 58.3333333333%; }
  .col-xl-8 {
    flex-basis: 66.6666666667%;
    max-width: 66.6666666667%; }
  .col-xl-9 {
    flex-basis: 75%;
    max-width: 75%; }
  .col-xl-10 {
    flex-basis: 83.3333333333%;
    max-width: 83.3333333333%; }
  .col-xl-11 {
    flex-basis: 91.6666666667%;
    max-width: 91.6666666667%; }
  .col-xl-12 {
    flex-basis: 100%;
    max-width: 100%; } }

/* De SM hacia abajo */
@media (max-width: calc(768px - 1px)) {
  [class*=col-xs],
  [class*=col-sm],
  [class*=col-md],
  [class*=col-lg],
  [class*=col-xl] {
    width: 100%; }
  .col {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%; }
  .col-1 {
    flex-basis: 8.3333333333%;
    max-width: 8.3333333333%; }
  .col-2 {
    flex-basis: 16.6666666667%;
    max-width: 16.6666666667%; }
  .col-3 {
    flex-basis: 25%;
    max-width: 25%; }
  .col-4 {
    flex-basis: 33.3333333333%;
    max-width: 33.3333333333%; }
  .col-5 {
    flex-basis: 41.6666666667%;
    max-width: 41.6666666667%; }
  .col-6 {
    flex-basis: 50%;
    max-width: 50%; }
  .col-7 {
    flex-basis: 58.3333333333%;
    max-width: 58.3333333333%; }
  .col-8 {
    flex-basis: 66.6666666667%;
    max-width: 66.6666666667%; }
  .col-9 {
    flex-basis: 75%;
    max-width: 75%; }
  .col-10 {
    flex-basis: 83.3333333333%;
    max-width: 83.3333333333%; }
  .col-11 {
    flex-basis: 91.6666666667%;
    max-width: 91.6666666667%; }
  .col-12 {
    flex-basis: 100%;
    max-width: 100%; } }

/*
 * Text Colors
*/
.purple {
  color: #7739f5; }

.orange {
  color: #FFB632; }

.pink,
.red {
  color: #e6007e; }

.green {
  color: #00cc83; }

.black {
  color: #020226; }

.white {
  color: #FFF; }

.gray {
  color: #999; }

.gray-border {
  color: #CCC; }

/*
* Font Families 
*/
.font-body {
  font-family: "Halyard Display", Helvetica, Arial, sans-serif; }

.font-title, h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Paralucent", Halyard Display, Helvetica, Arial, sans-serif; }

.font-code, .cm-s-wormhole, code {
  font-family: "Courier", monospace;
  font-size: 15px; }

.font-annotation {
  font-family: "OCR A Std", Courier, monospace;
  font-family: 12px;
  letter-spacing: -1.8px;
  word-spacing: -3px;
  text-transform: uppercase; }

/*
* Font Weights 
*/
.regular {
  font-weight: normal; }

.semi {
  font-weight: 500; }

.bold {
  font-weight: bold; }

/*
 * Headings
*/
h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: normal;
  margin-bottom: 15px;
  font-weight: 500; }
  h1.no-margin,
  h2.no-margin,
  h3.no-margin,
  h4.no-margin,
  h5.no-margin,
  h6.no-margin {
    margin-bottom: 0 !important; }

h1 {
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 25px; }
  @media screen and (max-width: 1200px) {
    h1 {
      font-size: 28px; } }
h2 {
  font-size: 25px;
  margin-bottom: 20px; }

h3 {
  font-size: 20px; }

h4 {
  font-size: 18px; }

h5 {
  font-size: 16px; }

h6 {
  font-size: 16px; }

/*
 * Lists
*/
ol.list,
ul.list {
  margin-left: 20px !important; }
  ol.list li,
  ul.list li {
    margin-bottom: 15px;
    list-style: initial; }
    ol.list li > ul, ol.list li > ol,
    ul.list li > ul,
    ul.list li > ol {
      margin-top: 15px; }

ol.list li {
  list-style-type: decimal; }

/*
 * Links
*/
a,
.link {
  text-decoration: none;
  color: #7739f5;
  cursor: pointer;
  transition: color .1s ease-in-out; }
  a:hover,
  .link:hover {
    color: #570cef; }
  a.back:before,
  .link.back:before {
    content: "< "; }
  a.green,
  .link.green {
    color: #00cc83 !important; }
    a.green:hover,
    .link.green:hover {
      color: #00bd79 !important; }
  a.red,
  .link.red {
    color: #e6007e !important; }
    a.red:hover,
    .link.red:hover {
      color: #d70076 !important; }
  a.black,
  .link.black {
    color: #020226 !important;
    font-weight: 500; }
    a.black:hover,
    .link.black:hover {
      color: #7739f5 !important; }
  a.small,
  .link.small {
    font-size: 14px; }
  a.big,
  .link.big {
    font-size: 18px; }
  a.disabled, a.disabled:hover,
  .link.disabled,
  .link.disabled:hover {
    color: #999 !important;
    cursor: default; }

/*
 * Code Style
*/
/*
 * Code Mirror Wormhole Theme
*/
.cm-s-wormhole {
  line-height: 20px;
  border-radius: 10px;
  height: auto; }
  .cm-s-wormhole.CodeMirror,
  .cm-s-wormhole .CodeMirror-gutters {
    background-color: #020226 !important;
    color: #FFF !important;
    border: none; }
  .cm-s-wormhole .CodeMirror-gutters {
    color: #020226; }
  .cm-s-wormhole .CodeMirror-lines {
    padding-top: 25px;
    padding-bottom: 25px; }
  .cm-s-wormhole .CodeMirror-linenumbers {
    background: rgba(255, 255, 255, 0.1); }
  .cm-s-wormhole .CodeMirror-linenumber {
    padding: 0 15px 0 10px; }
  .cm-s-wormhole .CodeMirror-cursor {
    border-left: solid thin #FFF; }
  .cm-s-wormhole .CodeMirror-linenumber {
    color: #999; }
  .cm-s-wormhole .CodeMirror-selected {
    background: rgba(255, 255, 255, 0.1); }
  .cm-s-wormhole .CodeMirror-line::selection,
  .cm-s-wormhole .CodeMirror-line > span::selection,
  .cm-s-wormhole .CodeMirror-line > span > span::selection {
    background: rgba(255, 255, 255, 0.4); }
  .cm-s-wormhole .CodeMirror-line::-moz-selection,
  .cm-s-wormhole .CodeMirror-line > span::-moz-selection,
  .cm-s-wormhole .CodeMirror-line > span > span::-moz-selection {
    background: rgba(255, 255, 255, 0.4); }
  .cm-s-wormhole span.cm-comment {
    color: #00cc83; }
  .cm-s-wormhole span.cm-string,
  .cm-s-wormhole span.cm-string-2 {
    color: #e6007e; }
  .cm-s-wormhole span.cm-number {
    color: #8851f6; }
  .cm-s-wormhole span.cm-variable {
    color: #00cc83; }
  .cm-s-wormhole span.cm-variable-2 {
    color: white; }
  .cm-s-wormhole span.cm-def {
    color: #00cc83; }
  .cm-s-wormhole span.cm-operator {
    color: #e6007e; }
  .cm-s-wormhole span.cm-keyword {
    color: #e6007e; }
  .cm-s-wormhole span.cm-atom {
    color: #8851f6; }
  .cm-s-wormhole span.cm-meta {
    color: #FFF; }
  .cm-s-wormhole span.cm-tag {
    color: #FFB632; }
  .cm-s-wormhole span.cm-bracket {
    color: rgba(255, 182, 50, 0.4); }
  .cm-s-wormhole span.cm-attribute {
    color: #8851f6; }
  .cm-s-wormhole span.cm-qualifier {
    color: #00cc83; }
  .cm-s-wormhole span.cm-property {
    color: #8851f6; }
  .cm-s-wormhole span.cm-builtin {
    color: #00cc83; }
  .cm-s-wormhole span.cm-variable-3,
  .cm-s-wormhole span.cm-type {
    color: #00cc83; }
  .cm-s-wormhole .CodeMirror-activeline-background {
    background: rgba(255, 255, 255, 0.2); }
  .cm-s-wormhole .CodeMirror-matchingbracket {
    text-decoration: underline;
    color: white !important; }

/*
 * Helpers
*/
.hidden {
  display: none !important; }

.show {
  display: block !important; }

.imageText {
  overflow: hidden;
  text-indent: 10000px; }

hr {
  border: 0 none;
  margin: 15px 0;
  min-height: 1px;
  height: 1px;
  overflow: hidden;
  background: #CCC; }
  hr.no-margin {
    margin: 0; }
  hr.double-margin {
    margin: 30px 0; }

.hr {
  border-top: 1px solid #CCC; }

.space-between {
  display: flex;
  align-items: center;
  justify-content: space-between; }

.block {
  display: block; }

.inline {
  display: block; }

.inline-block {
  display: block; }

.flex {
  display: flex; }

.center {
  text-align: center; }

.left {
  text-align: left; }

.right {
  text-align: right; }

.text-overflow {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  word-wrap: normal; }

.relative {
  position: relative; }

.absolute {
  position: absolute; }

.fixed {
  position: fixed; }

/*
 * Animations / Transitions
*/
.transition {
  transition: all .375s ease-in-out; }

@keyframes highlight {
  0% {
    background: rgba(255, 182, 50, 0.2); }
  100% {
    background: none; } }

.highlight {
  animation: highlight 2s ease-in 1; }

/*
 * Components - TODO: Mover a otro lado. No corresponde tenerlo acá
*/
.box-item {
  background: #F5F5F5;
  padding: 25px 30px;
  margin-bottom: 30px;
  border-radius: 10px;
  border: 0; }
  .box-item h1, .box-item h2, .box-item h3, .box-item h4, .box-item h5, .box-item h6 {
    font-size: 20px;
    margin-bottom: 15px; }
  .box-item.with-border {
    border: 1px solid #CCC; }
  .box-item.more-rounded {
    border-radius: 24px; }
  .box-item.box-purple {
    background: rgba(119, 57, 245, 0.05);
    color: #020226; }
    .box-item.box-purple.with-border {
      border-color: #7739f5; }
  .box-item.box-orange {
    background: rgba(255, 182, 50, 0.1);
    color: #020226; }
    .box-item.box-orange.with-border {
      border-color: #FFB632; }
  .box-item.box-green {
    background: rgba(0, 204, 131, 0.1);
    color: #020226; }
    .box-item.box-green.with-border {
      border-color: #00cc83; }
  .box-item.box-pink {
    background: rgba(230, 0, 126, 0.05);
    color: #020226; }
    .box-item.box-pink.with-border {
      border-color: #e6007e; }
  .box-item.box-black {
    background: #020226;
    color: #FFF; }
    .box-item.box-black.with-border {
      border-color: #7739f5; }
  .box-item.box-white {
    background: #FFF;
    color: #7739f5; }
    .box-item.box-white.with-border {
      border-color: #CCC; }

a.box-item,
button.box-item {
  display: block;
  box-shadow: 0 0 0 #7739f5;
  transition: .2s ease-in-out;
  transition-property: box-shadow, color;
  color: #020226;
  outline: none; }
  a.box-item:hover,
  button.box-item:hover {
    box-shadow: 4px 4px 0 #7739f5;
    color: #7739f5; }
  a.box-item.box-orange,
  button.box-item.box-orange {
    box-shadow: 0 0 0 #FFB632; }
    a.box-item.box-orange:hover,
    button.box-item.box-orange:hover {
      box-shadow: 4px 4px 0 #FFB632;
      color: #FFB632; }
  a.box-item.box-green,
  button.box-item.box-green {
    box-shadow: 0 0 0 #00cc83; }
    a.box-item.box-green:hover,
    button.box-item.box-green:hover {
      box-shadow: 4px 4px 0 #00cc83;
      color: #00cc83; }
  a.box-item.box-pink,
  button.box-item.box-pink {
    box-shadow: 0 0 0 #e6007e; }
    a.box-item.box-pink:hover,
    button.box-item.box-pink:hover {
      box-shadow: 4px 4px 0 #e6007e;
      color: #e6007e; }
  a.box-item.box-white,
  button.box-item.box-white {
    box-shadow: 0 0 0 #7739f5; }
    a.box-item.box-white:hover,
    button.box-item.box-white:hover {
      box-shadow: 4px 4px 0 #7739f5;
      color: #7739f5; }

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

.clearfix {
  display: block; }

.FL {
  float: left; }

.FR {
  float: right; }

.DN {
  display: none; }

body {
  opacity: 1;
  background-color: #fbfbfb;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh; }

.container {
  margin: 0 auto; }

.error-pages {
  padding: 140px 0;
  /* Error images */
  /* List items */
  /* Brand logo */ }
  .error-pages h1 {
    font-family: "Halyard Display", Helvetica, Arial, sans-serif;
    font-weight: 300;
    margin: 30px 0 15px;
    line-height: 29px;
    font-size: 24px; }
  .error-pages p {
    font-size: 15px;
    color: #666;
    line-height: 21px;
    margin-bottom: 8px; }
    .error-pages p span.error-code {
      font-size: 12px;
      color: #999;
      margin-top: 20px;
      display: inline-block; }
  .error-pages .error-content {
    display: flex;
    align-items: center; }
  .error-pages .error-graphic {
    float: left;
    margin-right: 40px;
    width: 219px;
    flex: 0 0 219px;
    height: 249px;
    background-repeat: no-repeat; }
  .error-pages .error-graphic-not-found {
    background-image: url("../../portal/images/error-pages/error-not-found.png"); }
  .error-pages .error-graphic-internal {
    background-image: url("../../portal/images/error-pages/error-internal.png"); }
  .error-pages ul.list-item {
    margin: 80px 0 10px; }
    .error-pages ul.list-item li {
      display: inline; }
      .error-pages ul.list-item li a {
        color: #666; }
        .error-pages ul.list-item li a:hover {
          color: #000; }
      .error-pages ul.list-item li a:after {
        content: "-";
        margin: 0 15px; }
    .error-pages ul.list-item li:last-child a:after {
      content: "";
      margin: 0; }
  .error-pages .error-pages-logo {
    background: url("../../portal/images/error-pages/error-logo.png") center center no-repeat;
    width: 100px;
    height: 40px;
    margin: 0 auto; }
  @media screen and (max-width: 500px) {
    .error-pages .error-content {
      flex-direction: column; }
    .error-pages .error-graphic {
      flex: 0 0 249px;
      margin-right: 0; }
    .error-pages .text {
      text-align: center; } }