/* Reset
------------------------------ */
/* stylelint-disable */

/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
button,
hr,
input {
  overflow: visible;
}


canvas,
progress,
video {
  display: inline-block;
}

progress,
sub,
sup {
  vertical-align: baseline;
}

[type="checkbox"],
[type="radio"],
legend {
  box-sizing: border-box;
  padding: 0;
}

html {
  font-family: sans-serif;
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

article,
details,
footer,
header,
main,
menu,
nav,
section {
  display: block;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

hr {
  box-sizing: content-box;
  height: 0;
}

code,
pre {
  font-family: monospace, monospace;
  font-size: 1em;
}

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}

a:active,
a:hover {
  outline-width: 0;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}

b,
strong {
  font-weight: bolder;
}

mark {
  background-color: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

img {
  border-style: none;
}

svg:not(:root) {
  overflow: hidden;
}

button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button,
select {
  text-transform: none;
}

[type="reset"],
[type="submit"],
button,
html [type="button"] {
  -webkit-appearance: button;
}

[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner,
button::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring,
button:-moz-focusring {
  outline: ButtonText dotted 1px;
}

fieldset {
  border: 1px solid silver;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  color: inherit;
  display: table;
  max-width: 100%;
  white-space: normal;
}

textarea {
  overflow: auto;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

[hidden],
template {
  display: none;
}

/* --- Fonts --- */

/* open-sans-300 - latin */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url("https://fonts.gstatic.com/s/opensans/v15/mem5YaGs126MiZpBA-UN_r8OUuhpKKSTjw.woff2") format("woff2"),
    url("../fonts/opensans/open-sans-v15-latin-300.woff") format("woff");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* open-sans-regular - latin */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Open Sans Regular"), local("OpenSans-Regular"), url("https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0bf8pkAg.woff2") format("woff2"),
    url("../fonts/opensans/open-sans-v15-latin-regular.woff") format("woff");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* open-sans-italic - latin */
@font-face {
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 400;
  src: local("Open Sans Italic"), local("OpenSans-Italic"), url("https://fonts.gstatic.com/s/opensans/v15/mem6YaGs126MiZpBA-UFUK0Zdc1GAK6b.woff2") format("woff2"),
    url("../fonts/opensans/open-sans-v15-latin-italic.woff") format("woff");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* open-sans-600 - latin */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  src: local("Open Sans SemiBold"), local("OpenSans-SemiBold"), url("https://fonts.gstatic.com/s/opensans/v15/mem5YaGs126MiZpBA-UNirkOUuhpKKSTjw.woff2") format("woff2"),
    url("../fonts/opensans/open-sans-v15-latin-600.woff") format("woff");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* stylelint-enable */

/* Twitter bootstrap | Grid | http://getbootstrap.com/ */
.container {
  margin-left: auto;
  margin-right: auto;
  padding-right: 15px;
  padding-left: 15px;
  position: relative;
}

.container--fluid {
  padding: 0 15px;
  width: 100%;
}

.row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

@media (min-width: 576px) {
  .container {
    padding-right: 15px;
    padding-left: 15px;
    width: 540px;
    max-width: 100%;
  }

  .row {
    margin-right: -15px;
    margin-left: -15px;
  }
}

@media (min-width: 768px) {
  .container {
    padding-right: 15px;
    padding-left: 15px;
    width: 720px;
    max-width: 100%;
  }

  .row {
    margin-right: -15px;
    margin-left: -15px;
  }
}

@media (min-width: 992px) {
  .container {
    padding-right: 15px;
    padding-left: 15px;
    width: 960px;
    max-width: 100%;
  }

  .row {
    margin-right: -15px;
    margin-left: -15px;
  }
}

@media (min-width: 1200px) {
  .container {
    padding-right: 15px;
    padding-left: 15px;
    width: 1140px;
    max-width: 100%;
  }

  .row {
    margin-right: -15px;
    margin-left: -15px;
  }
}

.col,
.col-12,
.col-4,
.col-6,
.col-lg-1,
.col-lg-10,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-md-12,
.col-md-3,
.col-md-6,
.col-md-8,
.col-md-9,
.col-sm-12,
.col-sm-6,
.col-xl-2,
.col-xl-4,
.col-xl-8,
.col-xl-9 {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

.col {
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%;
}

.col-4 {
  -webkit-box-flex: 0;
}

.col-4 {
  -webkit-flex: 0 0 33.333333%;
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}

.col-6 {
  -webkit-box-flex: 0;
}

.col-6 {
  -webkit-flex: 0 0 50%;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
}

.col-12 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 100%;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}

@media (min-width: 576px) {
  .col,
  .col-12,
  .col-4,
  .col-6,
  .col-lg-1,
  .col-lg-10,
  .col-lg-12,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9,
  .col-md-12,
  .col-md-3,
  .col-md-6,
  .col-md-8,
  .col-md-9,
  .col-sm-12,
  .col-sm-6,
  .col-xl-2,
  .col-xl-4,
  .col-xl-8,
  .col-xl-9 {
    padding-right: 15px;
    padding-left: 15px;
  }

  .col-sm-6 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-sm-12 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

@media (min-width: 768px) {
  .col,
  .col-12,
  .col-4,
  .col-6,
  .col-lg-1,
  .col-lg-10,
  .col-lg-12,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9,
  .col-md-12,
  .col-md-3,
  .col-md-6,
  .col-md-8,
  .col-md-9,
  .col-sm-12,
  .col-sm-6,
  .col-xl-2,
  .col-xl-4,
  .col-xl-8,
  .col-xl-9 {
    padding-right: 15px;
    padding-left: 15px;
  }

  .col-md-3 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }

  .col-md-6 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-md-8 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.666667%;
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }

  .col-md-9 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }

  .col-md-12 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .offset-md-1 {
    margin-left: 8.333333%;
  }

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

@media (min-width: 992px) {
  .col,
  .col-12,
  .col-4,
  .col-6,
  .col-lg-1,
  .col-lg-10,
  .col-lg-12,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9,
  .col-md-12,
  .col-md-3,
  .col-md-6,
  .col-md-8,
  .col-md-9,
  .col-sm-12,
  .col-sm-6,
  .col-xl-2,
  .col-xl-4,
  .col-xl-8,
  .col-xl-9 {
    padding-right: 15px;
    padding-left: 15px;
  }

  .col-lg-1 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 8.333333%;
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }

  .col-lg-2 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.666667%;
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }

  .col-lg-3 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }

  .col-lg-4 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.333333%;
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .col-lg-5 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.666667%;
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  .col-lg-6 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-lg-7 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.333333%;
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }

  .col-lg-8 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.666667%;
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }

  .col-lg-9 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }

  .col-lg-10 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.333333%;
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }

  .col-lg-12 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .offset-lg-1 {
    margin-left: 8.333333%;
  }

  .offset-lg-2 {
    margin-left: 16.666667%;
  }

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

  .offset-lg-4 {
    margin-left: 33.333333%;
  }
}

@media (min-width: 1200px) {
  .col,
  .col-12,
  .col-4,
  .col-6,
  .col-lg-1,
  .col-lg-10,
  .col-lg-12,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9,
  .col-md-12,
  .col-md-3,
  .col-md-6,
  .col-md-8,
  .col-md-9,
  .col-sm-12,
  .col-sm-6,
  .col-xl-2,
  .col-xl-4,
  .col-xl-8,
  .col-xl-9 {
    padding-right: 15px;
    padding-left: 15px;
  }

  .col-xl-2 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.666667%;
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }

  .col-xl-4 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.333333%;
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .col-xl-8 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.666667%;
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }

  .col-xl-9 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }

  .offset-xl-1 {
    margin-left: 8.333333%;
  }

  .offset-xl-2 {
    margin-left: 16.666667%;
  }
}

.container--fluid {
  padding: 0 15px;
  width: 100%;
}

@media (min-width: 768px) {
  .container--fluid {
    width: 720px;
  }
}

@media (min-width: 992px) {
  .container--fluid {
    width: 960px;
  }
}

@media (min-width: 1200px) {
  .container--fluid {
    width: 1140px;
  }
}

@media (min-width: 1920px) {
  .container--fluid {
    width: 100%;
  }

  .container--fluid .row {
    padding-left: 30px;
    padding-right: 30px;
  }
}

/* Rulers */
hr {
  height: 1px;
  background: #e5e5e5;
  margin: 0;
  border: 0;
}

.-break {
  position: relative;
  padding-bottom: 40px;
  margin-bottom: 40px;
}

.-break:after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  height: 1px;
  width: 50px;
  background: #d4d4d4;
}

.-break--small {
  padding-bottom: 20px;
}

.-text-left.-break:after {
  left: 0 !important;
}

.-text-center.-break:after {
  left: calc(50% - 25px) !important;
}

.-text-right.-break:after {
  left: calc(100% - 50px) !important;
}

/* Debugging */
@media (min-width: 1px) {
  .debug {
    text-align: center;
    z-index: 99999;
    background: pink;
    width: 18rem;
    height: 4rem;
    line-height: 4rem;
    position: fixed;
    padding: 0 10px;
    right: 0;
    bottom: 40px;
  }

  .debug:after {
    content: "col-  (0 - 575px)";
  }
}

@media (min-width: 576px) {
  .debug:after {
    content: "col-sm (> 576px)";
  }
}

@media (min-width: 768px) {
  .debug:after {
    content: "col-md- (> 768px)";
  }
}

@media (min-width: 992px) {
  .debug:after {
    content: "col-lg- (> 992px)";
  }
}

@media (min-width: 1200px) {
  .debug:after {
    content: "lg- (> 1200px)";
  }
}

/* Hide content responsive */
.-hide-xs,
.-hide-sm,
.-hide-md {
  display: none;
  visibility: hidden;
  position: absolute !important;
}

@media (min-width: 768px) {
  .-hide-xs {
    display: block;
    visibility: visible;
    position: inherit !important;
  }
}

@media (min-width: 992px) {
  .-hide-sm {
    display: block;
    visibility: visible;
    position: inherit !important;
  }
}

@media (min-width: 1200px) {
  .-hide-md {
    display: block;
    visibility: visible;
    position: inherit !important;
  }
}

/* Base
------------------------------ */

/* Only show install extension in Chrome */
.only_in_chrome {
  display: none !important;
}

.isChrome .only_in_chrome {
  display: block !important;
}

.isIe * {
  -ms-overflow-style: -ms-autohiding-scrollbar;
}

*,
*:after,
*:before {
  box-sizing: border-box;
}

::-moz-selection {
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
}

::selection {
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
}

/* --- */
html {
  font-size: 62.5%;
}

body,
input,
select,
textarea,
button,
label {
  font-family: "Open Sans", sans-serif;
}

h1,
h2,
h3,
h4,
h5 {
  font-family: "Open Sans", sans-serif;
  font-weight: 400;
  line-height: 1.3;
  margin-bottom: 2.5rem;
}

body {
  font-size: 1.6rem;
  line-height: 1.5625;
}

p {
  font-weight: 300;
  color: #7f7fa5;
  margin-top: 20px;
}

p:first-child {
  margin-top: 0;
}

/* --- */
a,
a:visited,
a:link {
  text-decoration: none;
  color: #799adc;
  transition: color 0.2s ease-out;
}

a:hover,
a:active,
a:focus {
  color: #6d8ac6;
}

/* Img */
.-img-fluid {
  max-width: 100%;
}

.-img-center {
  display: block;
  position: relative;
  margin-left: auto;
  margin-right: auto;
}

/* Typography -text-left, -text-right, -text-center */
.-text-left {
  text-align: left !important;
}

.-text-right {
  text-align: right !important;
}

.-text-center {
  text-align: center !important;
}


.-text-left-lg {
  text-align: inherit;
}

/* Item */
.-item-center {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

@media (min-width: 576px) {

  .-text-center-sm {
    text-align: center !important;
  }
}

@media (min-width: 768px) {

  .-text-right-md {
    text-align: right !important;
  }
}

@media (min-width: 992px) {
  .-text-left-lg {
    text-align: left !important;
  }

  .-text-center-lg {
    text-align: center !important;
  }
}

/* Typography no wrap */
.-text-nowrap {
  white-space: nowrap;
}

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

/* Typography -uppercase, -lowercase */
.-text-uppercase {
  text-transform: uppercase !important;
}

/* Letter spacings */

.-letter-spacing-1 {
  letter-spacing: 1px;
}

/* Text decoration */
.-text-underline {
  text-decoration: underline !important;
}

.-text-link {
  text-decoration: underline !important;
}

.-text-link:hover {
  text-decoration: inherit !important;
}

/* Text rotate */

/* Font style */
.-font-normal {
  font-style: normal !important;
}

/* Typography weights -light, -regular, -bold */
.-font-100 {
  font-weight: 100 !important;
}

.-font-300 {
  font-weight: 300 !important;
}

.-font-400 {
  font-weight: 400 !important;
}

.-font-600 {
  font-weight: 600 !important;
}

/* Typography sizes -tiny, -small, -large, -larger, -huge */

.-font-tiny {
  font-size: 1.2rem !important;
}

.-font-small {
  font-size: 1.4rem !important;
}

.-font-medium {
  font-size: 1.6rem !important;
}

.-font-large {
  font-size: 2rem !important;
}

/* Typography colors */
.-color-default {
  color: #7f7fa5 !important;
}

.-color-heading {
  color: #000 !important;
}

.-color-dark {
  color: #000 !important;
}

.-color-light {
  color: #fff !important;
}

/* Cursors */
.-cursor-default {
  cursor: default !important;
}

.-cursor-pointer {
  cursor: pointer !important;
}

.-cursor-events-none {
  pointer-events: none !important;
}

/* Buttons -primary. -secondary, -outline, -alert, -link, -shade, -font-icon */
.btn {
  width: auto;
  font-weight: 300;
  cursor: pointer;
  position: relative;
  display: inline-block;
  text-align: center;
  background-color: #7a8293;
  color: #fff;
  padding: 0.5em 1.3em;
  border-radius: 5px;
  text-decoration: none;
  border-width: 1px;
  border-style: solid;
  border-color: #7a8293;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  -webkit-appearance: none;
  outline: none;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: transform 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

.disable-pointer-events {
  pointer-events: none !important;
}

.btn:hover,
.btn:visited,
.btn:active,
.btn:focus,
.btn:link {
  color: #fff;
}

.btn:hover,
.btn:focus {
  transform: scale(1.05);
}

.btn:hover {
  background-color: #747b8c;
  border-color: #747b8c;
}

.btn-outline {
  background-color: #fff !important;
  border-color: #dedede;
  text-shadow: none;
  box-shadow: none !important;
  color: #799adc !important;
}

.btn-outline:hover,
.btn-outline:focus,
.btn-outline:active {
  background-color: #747b8c !important;
  color: #fff !important;
  border-color: #747b8c;
}

/* --- */
.btn-primary:hover,
.btn-primary:focus,
.btn-outline.btn-primary:hover,
.btn-outline.btn-primary:focus,
.btn-outline.btn-primary:active {
  border-color: #ffb541;
}

.btn-primary {
  background-color: #ffa800;
}

.btn-primary,
.btn-outline.btn-primary {
  border-color: #ffa800;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #fda700;
}

.btn-primary:active {
  background-color: #da9626;
  border-color: #da9626;
}

.btn-outline.btn-primary {
  color: #ffa800 !important;
}

.btn-outline:hover,
.btn-outline:focus,
.btn-outline:active {
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.btn-outline.btn-shade:hover {
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.015), 0 7px 11px 1px rgba(0, 0, 0, 0.07), 0 1px 1px -5px rgba(0, 0, 0, 0.07) !important;
}

.btn-outline.btn-shade:focus {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1) !important;
}

.btn-outline.btn-base-shade {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07) !important;
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07) !important;
  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07) !important;
}

.btn-outline.btn-primary:hover,
.btn-outline.btn-primary:focus,
.btn-outline.btn-primary:active {
  background-color: #fda700 !important;
}

.btn-outline.btn-secondary:hover,
.btn-outline.btn-secondary:focus,
.btn-outline.btn-secondary:active {
  background-color: #708fcc !important;
}

/* --- */
.btn-secondary:hover,
.btn-secondary:focus,
.btn-outline.btn-secondary:hover,
.btn-outline.btn-secondary:focus,
.btn-outline.btn-secondary:active {
  border-color: #708fcc;
}

.btn-secondary {
  background-color: #799adc;
}

.btn-secondary,
.btn-outline.btn-secondary {
  border-color: #799adc;
}

.btn-secondary:hover,
.btn.btn-secondary:focus {
  background-color: #708fcc;
}

.btn-secondary:active {
  border-color: #6d8ac6;
}

.btn-outline.btn-secondary {
  color: #799adc;
}

.btn-outline.btn-secondary:hover,
.btn-outline.btn-secondary:focus,
.btn-outline.btn-secondary:active {
  color: #fff !important;
  background-color: #708fcc !important;
}

/* --- */
.btn-tertiary:hover,
.btn-tertiary:focus,
.btn-outline.btn-tertiary:hover,
.btn-outline.btn-tertiary:focus,
.btn-outline.btn-tertiary:active {
  border-color: #3f4248;
}

.btn-tertiary {
  background-color: #3a3d43;
}

.btn-tertiary,
.btn-outline.btn-tertiary {
  border-color: #3a3d43;
}

.btn-tertiary:hover,
.btn.btn-tertiary:focus {
  background-color: #3f4248;
}

.btn-tertiary:active {
  border-color: #3f4248;
}

.btn-outline.btn-tertiary {
  color: #3a3d43 !important;
}

.btn-outline.btn-tertiary:hover,
.btn-outline.btn-tertiary:focus,
.btn-outline.btn-tertiary:active {
  color: #fff !important;
  background-color: #3f4248 !important;
}

/* --- */
.btn-alert:hover,
.btn-alert:focus,
.btn-outline.btn-alert:hover,
.btn-outline.btn-alert:focus,
.btn-outline.btn-alert:active {
  border-color: #da4363;
}

.btn-alert {
  background-color: #eb486a;
}

.btn-alert,
.btn-outline.btn-alert {
  border-color: #eb486a;
}

.btn-alert:hover,
.btn-alert:focus {
  background-color: #da4363 !important;
  color: #fff !important;
}

.btn-alert:active {
  background-color: #d3415f;
  border-color: #d3415f;
}

.btn-outline.btn-alert {
  color: #eb486a !important;
}

.btn-outline.btn-alert:hover,
.btn-outline.btn-alert:active,
.btn-outline.btn-alert:focus {
  color: #fff !important;
}

.btn-agree:hover,
.btn-agree:focus,
.btn-outline.btn-agree:hover,
.btn-outline.btn-agree:focus,
.btn-outline.btn-agree:active {
  border-color: #4dc44b;
}

.btn-agree {
  background-color: #4dc44b;
}

.btn-agree,
.btn-outline.btn-agree {
  border-color: #4dc44b;
}

.btn-agree:hover,
.btn-agree:focus {
  background-color: #4ba349 !important;
  color: #fff !important;
}

.btn-agree:active {
  background-color: #4ba349;
  border-color: #4ba349;
}

.btn-outline.btn-agree {
  color: #4dc44b !important;
}

.btn-outline.btn-agree:hover,
.btn-outline.btn-agree:active,
.btn-outline.btn-agree:focus {
  color: #fff !important;
}

/* --- */
.btn-link {
  background-color: transparent;
  border-color: transparent;
  color: #799adc !important;
  text-shadow: none;
  transform: scale(1) !important;
}

.btn-link:hover,
.btn-link:focus,
.btn-link:active {
  color: #6d8ac6 !important;
  background-color: transparent;
  border-color: transparent;
}

.btn-link:hover {
  text-decoration: underline;
}

/* --- */

/* --- */
.btn-shade {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 1px -2px rgba(0, 0, 0, 0.1);
}

.btn-shade:hover {
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.015), 0 7px 11px 1px rgba(0, 0, 0, 0.07), 0 1px 1px -5px rgba(0, 0, 0, 0.07);
}

.btn-shade:focus {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
}

.btn.-block {
  width: 100%;
}

/* --- */
.btn-circle {
  border-radius: 100%;
  overflow: hidden;
  padding: 0;
}

.btn-pill {
  border-radius: 100px;
}

/* --- */
.btn.btn-loading {
  color: transparent !important;
  min-height: 1.6rem;
  pointer-events: none;
  position: relative;
  text-shadow: none;
}

.btn.btn-loading:after {
  -webkit-animation: loading 500ms infinite linear;
  animation: loading 500ms infinite linear;
  border: 0.2rem solid #fff;
  border-radius: 0.8rem;
  border-right-color: rgba(0, 0, 0, 0) !important;
  border-top-color: rgba(0, 0, 0, 0) !important;
  content: "";
  display: block;
  height: 1.6rem;
  left: 50%;
  margin-left: -0.8rem;
  margin-top: -0.8rem;
  position: absolute;
  top: 50%;
  width: 1.6rem;
}

.btn.btn-loading > span {
  opacity: 0;
}

.btn-outline.btn-loading:after {
  border-color: #7a8293;
}

/* --- */
.btn-no-zoom,
.btn-no-zoom:hover,
.btn-no-zoom:visited,
.btn-no-zoom:active,
.btn-no-zoom:focus {
  transform: scale(1) !important;
}

/* --- */
.btn-row {
  display: flex;
  margin-left: -10px;
}

.btn-row .btn {
  flex: 1;
  margin: 0 0 0 10px;
}

/* --- */
.btn-group {
  display: flex;
}

.btn-group .btn.btn-selector,
.btn-group .btn.btn-selector:visited,
.btn-group .btn.btn-selector:focus,
.btn-group .btn.btn-selector:active {
  flex: 1;
  margin-left: 0;
  margin-right: 0;
  justify-content: center;
  background-color: #f8f9fb;
  border: 1px solid #dfe7f8;
  color: #789adc;
  font-weight: 400;
  text-shadow: none;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
  font-size: 1.3rem;
}

.btn-group .btn.btn-selector:hover,
.btn-group .btn.btn-selector.-active {
  box-shadow: inset 0 -2px 0 0 #f3a527;
  background: #fff;
  color: #000;
}

.btn-group .btn.btn-selector:first-child:not(:last-child) {
  border-radius: 5px 0 0 5px;
}

.btn-group .btn.btn-selector:not(:first-child):not(:last-child) {
  border-radius: 0;
  margin-left: -1px;
}

.btn-group .btn.btn-selector:last-child:not(:first-child) {
  border-radius: 0 5px 5px 0;
  margin-left: -1px;
}

.btn--icon-only {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Arrows */
.-larr,
.-tarr,
.-rarr,
.-barr {
  position: relative;
  padding-right: 3rem;
}

.-larr:after,
.-tarr:after,
.-rarr:after,
.-barr:after {
  background-image: url(../img/ui/arrows.svg);
  position: absolute;
  left: inherit;
  right: 15px;
  top: calc(50% - 4px);
  opacity: 0.75;
  width: 10px;
  height: 10px;
  content: "";
  background-repeat: no-repeat;
  transition: opacity 0.25s ease-in-out;
}

/* --- */
.-tarr:after {
  background-position: -10px -10px;
}

.-rarr:after {
  background-position: -30px -30px;
}

.-barr:after {
  background-position: -50px -50px;
}

.-larr:after {
  background-position: -70px -70px;
}

/* --- */
.btn.-tarr:after {
  background-position: -90px -90px;
}

.-box-overlay__bind--show .btn.-tarr:after {
  transform: rotate(180deg);
}

.btn.-rarr:after {
  background-position: -110px -110px;
}

.-rarr--light:after {
  background-position: -110px -110px !important;
}

.btn.-barr:after {
  background-position: -130px -130px;
}

.-barr--light:after {
  background-position: -130px -130px !important;
}

.-box-overlay__bind--show .btn.-barr:after {
  transform: rotate(180deg);
}

.btn.-larr:after {
  background-position: -150px -150px;
}

.-larr--light:after {
  background-position: -150px -150px !important;
}

/* --- */

/* --- */

a.-tarr:after,
.btn-outline.-tarr:after {
  background-position: -170px -170px;
}

.-rarr--link:after,
a.-rarr:after,
.btn-outline.-rarr:after {
  background-position: -190px -190px;
}

.-barr--link:after,
a.-barr:after,
.btn-outline.-barr:after {
  background-position: -210px -210px;
}


a.-larr:after,
.btn-outline.-larr:after {
  background-position: -230px -230px;
}

/* --- */

.btn-primary.btn-outline.-tarr:after {
  background-position: -250px -250px;
}


.btn-primary.btn-outline.-rarr:after {
  background-position: -270px -270px;
}


.btn-primary.btn-outline.-barr:after {
  background-position: -290px -290px;
}


.btn-primary.btn-outline.-larr:after {
  background-position: -310px -310px;
}

/* --- */
.btn-outline.-tarr:hover:after,
.btn-outline.-tarr:focus:after,
.btn-outline.-tarr:active:after {
  background-position: -90px -90px;
}

.btn-outline.-rarr:hover:after,
.btn-outline.-rarr:focus:after,
.btn-outline.-rarr:active:after {
  background-position: -110px -110px;
}

.btn-outline.-barr:hover:after,
.btn-outline.-barr:focus:after,
.btn-outline.-barr:active:after {
  background-position: -130px -130px;
}

.btn-outline.-larr:hover:after,
.btn-outline.-larr:focus:after,
.btn-outline.-larr:active:after {
  background-position: -150px -150px;
}

/* --- */
.btn.-rarr.-font-large {
  padding-right: 2em;
}

/* --- */
.-arr--prepend {
  padding-left: 3rem;
  padding-right: 1.3em;
}

.-arr--prepend:after {
  right: inherit;
  left: 15px;
}

.-arr--block {
  padding: 0.5em 1.3em;
}

.-arr--block:after {
  left: inherit;
  right: inherit;
  margin-left: 10px;
}

.btn-link.-arr--prepend {
  padding-left: 14px;
}

.btn-link.-arr--prepend:after {
  left: 0;
}

/* --- */
.pagination-item a.-larr {
  padding-left: 3rem;
}

.pagination-item a.-rarr {
  padding-right: 3rem;
}

/* States -visible, -hidden, .-disabled */
.-blurred {
  filter: blur(10px);
  -webkit-filter: blur(10px);
  -moz-filter: blur(10px);
  -ms-filter: blur(10px);
}

.-visible {
  opacity: 1;
  visibility: visible;
}

.-hidden {
  display: none;
  opacity: 0;
  z-index: -9999;
  visibility: hidden;
  line-height: 0;
  height: 0;
  width: 0;
  font-size: 0;
  overflow: hidden;
  position: absolute;
  pointer-events: none;
  left: 0;
  top: 0;
  animation: initial !important;
}

.-disabled {
  opacity: 0.3 !important;
  filter: alpha(opacity=40);
  pointer-events: none;
  cursor: not-allowed;
}

.-locked {
  opacity: 0.8;
  filter: alpha(opacity=80);
  pointer-events: none;
  cursor: not-allowed;
}

/* Scroll overflow -scroll, -no-scroll, -scroll-y, -scroll-x, -no-scroll-y, -no-scroll-x */

.-scroll-y {
  overflow-x: hidden;
  overflow-y: auto;
}

.-handheld-scroll-x {
  -webkit-overflow-scrolling: touch;
  overflow-x: auto;
  overflow-y: hidden;
  max-width: calc(100vw - 30px);
}

.-handheld-scroll-y {
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 99.9%;
}

.handheld__no-scroll {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

/* overflows */
.-overflow-initial {
  overflow: initial !important;
}

.-overflow-auto {
  overflow: auto !important;
}

.-overflow-auto-x {
  overflow-x: auto !important;
}

.-overflow-auto-y {
  overflow-y: auto !important;
}

.-overflow-hidden {
  overflow: hidden !important;
}

.-overflow-hidden-x {
  overflow-x: hidden !important;
}

.-resize-vertical {
  resize: vertical !important;
}

.-resize-none {
  resize: none !important;
}

/* Word breaks */
.-break-word {
  word-break: break-word;
}

.-break-word-all {
  word-break: break-all;
}

/* Custom Scroll bars */
.-scrollbar-light::-webkit-scrollbar,
.-scrollbar-dark::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

.-scrollbar-light::-webkit-scrollbar-thumb,
.-scrollbar-dark::-webkit-scrollbar-thumb {
  border-radius: 20px;
}

.-scrollbar-light::-webkit-scrollbar,
.-scrollbar-light::-webkit-scrollbar-thumb,
.-scrollbar-light:hover::-webkit-scrollbar-thumb,
.-scrollbar-light::-webkit-scrollbar-thumb:active {
  border: 1px solid #eee;
}

.-scrollbar-dark::-webkit-scrollbar,
.-scrollbar-dark::-webkit-scrollbar-thumb,
.-scrollbar-dark:hover::-webkit-scrollbar-thumb,
.-scrollbar-dark::-webkit-scrollbar-thumb:active {
  border: 1px solid #4e575c;
}

.-scrollbar-light::-webkit-scrollbar {
  background: #efefef;
}

.-scrollbar-light::-webkit-scrollbar-thumb {
  background: #b3b3b3;
}

.-scrollbar-light:hover::-webkit-scrollbar-thumb {
  background: #757779;
}

.-scrollbar-light::-webkit-scrollbar-thumb:active {
  background: #53585f;
}

.-scrollbar-dark::-webkit-scrollbar {
  background: #384248;
}

.-scrollbar-dark::-webkit-scrollbar-thumb {
  background: #05080a;
}

.-scrollbar-dark:hover::-webkit-scrollbar-thumb {
  background: #0d0e10;
}

.-scrollbar-dark::-webkit-scrollbar-thumb:active {
  background: #0d0e10;
}

/* List styles */
ul,
ol {
  list-style: outside none;
  margin: 0;
  padding: 0;
  color: #7f7fa5;
}

ul.list {
  list-style: outside disc;
  margin-left: 35px;
}

ul.list ul {
  list-style: outside circle;
  margin-left: 35px;
}

ol.list {
  list-style: outside decimal;
}

ol.list ol {
  list-style: outside lower-alpha;
  margin-left: 35px;
}

dl dt:first-child {
  margin-top: 0;
}

dl dt {
  font-size: 14px;
  font-weight: 600;
  color: #000;
  margin: 10px 0 0;
}

dl dd {
  font-size: 14px;
  font-weight: 400;
  color: #7f7fa5;
  margin: 0;
}

/* Code editor */
.editor {
  position: relative;
  width: 100%;
  font-family: "Lucida Console", Monaco, monospace;
  line-height: 2rem;
  font-size: 1.4rem;
  border-radius: 5px;
  background-color: #232d34;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.1);
}

code[class*="language-"],
pre[class*="language-"] {
  color: #b6bfd4;
  font-size: 1em;
  text-align: left;
  white-space: pre-wrap;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  line-height: 1.5;
  -moz-tab-size: 2;
  -o-tab-size: 2;
  tab-size: 2;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}

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

.modal-overlay pre[class*="language-"] {
  max-height: 220px;
}

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

.editor mark {
  background-color: #f1f1a2;
}

.token.comment,
.token.cdata {
  color: #b2b2b2;
}

.token.punctuation {
  color: #88c6be;
}

.token.tag {
  color: #fc929e;
}

.token.attr-name {
  color: #c5a5c5;
}

.token.namespace {
  opacity: 0.7;
}

.token.important,
.token.regex {
  color: #fff;
}

.token.property,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
  color: #5a9bcf;
}

.token.boolean {
  color: #ff8b50;
}

.token.function {
  color: #79b6f2;
}

.token.atrule,
.token.class-name {
  color: #fac863;
}

.token.selector,
.token.char {
  color: #d8dee9;
}

.token.keyword {
  color: #c5a5c5;
}

.token.string,
.token.attr-value {
  color: #8dc891;
}

.token.operator,
.token.entity,
.token.url,
.token.variable {
  color: #d7deea;
}

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

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

.token.entity {
  cursor: help;
}

pre[class*="language-"].line-numbers {
  position: relative;
  padding-left: 3.8em;
  counter-reset: linenumber;
}

pre[class*="language-"].line-numbers > code {
  position: relative;
  white-space: pre-wrap;
}

.editor .line-numbers .line-numbers-rows {
  position: absolute;
  pointer-events: none;
  top: 0;
  font-size: 100%;
  left: -3.8em;
  width: 3em; /* works for line-numbers below 1000 lines */
  letter-spacing: -1px;
  border-right: 1px solid #313b42;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.editor .line-numbers-rows > span {
  pointer-events: none;
  display: block;
  counter-increment: linenumber;
  min-height: 21px;
}

.editor .line-numbers-rows > span:before {
  content: counter(linenumber);
  color: #677490;
  display: block;
  padding-right: 0.8em;
  text-align: right;
}

.editor__badges {
  position: relative;
  width: 100%;
  height: auto;
  display: flex;
  justify-content: flex-end;
  margin-bottom: -15px;
  padding: 0 20px;
}

.editor__badges .editor__badge {
  text-transform: uppercase;
  margin-left: 20px;
  color: #fff;
  padding: 0 10px;
  border-radius: 0 0 5px 5px;
  font-size: 10px;
  letter-spacing: 0.5px;
  line-height: 20px;
  cursor: pointer;
  z-index: 2;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.editor__badges .editor__badge:first-child {
  margin-left: 0;
}

.editor__badges .editor__badge--language {
  background-color: rgba(36, 97, 137, 1);
}

.editor__badges .editor__badge--copy {
  background-color: rgba(49, 59, 66, 1);
}

.editor__badges .editor__badge--try {
  background-color: rgb(81, 195, 127);
}

.editor__badges .editor__badge--copy:hover {
  background-color: rgba(71, 80, 86, 1);
}

.editor__badges .editor__badge--try:hover {
  background-color: rgba(81, 195, 127, 0.9);
}

.editor-lang__html .editor__badge--language:after {
  content: "HTML";
}

.editor-lang__js .editor__badge--language:after {
  content: "JS";
}

.editor-lang__json .editor__badge--language:after {
  content: "JSON";
}

.editor-lang__txt .editor__badge--language:after {
  content: "TXT";
}

.editor-lang__php .editor__badge--language:after {
  content: "PHP";
}

/* Form
------------------------------ */
fieldset {
  padding: 0;
  margin: 0;
  border: 0;
}

input,
select,
textarea,
button,
label {
  font-size: 1.4rem;
  color: #000;
  font-weight: 400;
}

label {
  height: 35px;
  line-height: 35px;
  font-weight: 600;
  display: block;
  text-align: left;
}

select {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 12" width="26" height="12"><path fill="%23666" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>')
    center right no-repeat;
  padding-right: 3em;
}

input[type="submit"],
input[type="button"],
button {
  font-size: 1.6rem;
  line-height: 1.5625;
  outline: 0;
}

button {
  cursor: pointer;
  width: 100%;
}

input[type="text"],
input[type="number"],
input[type="email"],
input[type="tel"],
input[type="file"],
input[type="date"],
input[type="password"],
textarea,
select {
  border-radius: 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  outline: 0;
  border-width: 1px;
  border-style: solid;
  border-color: #e0e1e4;
  padding: 10px 12px;
  display: block;
  width: 100%;
  transition: border-color 0.08s ease-in-out;
  color: #444;
}

input[type="text"]::-ms-clear {
  display: none;
  width: 0;
  height: 0;
}

input[type="text"]:hover,
input[type="number"]:hover,
input[type="email"]:hover,
input[type="tel"]:hover,
input[type="file"]:hover,
input[type="date"]:hover,
input[type="color"]:hover,
input[type="password"]:hover,
textarea:hover,
select:hover {
  border-color: #a0a1aa;
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="file"]:focus,
input[type="date"]:focus,
input[type="color"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border-color: #ffa800;
}

input[type="radio"],
input[type="checkbox"],
label,
select {
  cursor: pointer;
}

input[type="color"] {
  background: #fff;
  -webkit-appearance: none;
  outline: none;
}

.form input[type="date"]::-webkit-calendar-picker-indicator {
  color: #666;
  font-size: 12px;
}

input[type="password"]::-ms-reveal {
  display: none;
}

/* --- */
:-webkit-autofill,
:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1337px #fff inset;
  background-clip: content-box;
}

::-webkit-input-placeholder {
  font-weight: 300;
  color: #cacaca;
  transition: color 0.3s ease-in-out;
}

::-moz-placeholder {
  font-weight: 300;
  color: #cacaca;
  transition: color 0.3s ease-in-out;
}

:-moz-placeholder {
  font-weight: 300;
  color: #cacaca;
  transition: color 0.3s ease-in-out;
}

:-ms-input-placeholder {
  font-weight: 300;
  color: GrayText;
  transition: color 0.3s ease-in-out;
}

/* --- */
.form-group {
  position: relative;
  margin: 0 0 10px;
}

.form-group-footer {
  border-top: 1px solid #e5e5e5;
  padding-top: 10px;
  margin-top: 30px;
}

/* Check + Radio boxes */
.form-checkbox,
.form-radio {
  position: relative;
  display: inline-block;
  line-height: 20px;
  padding: 9px 26px;
}

.form-checkbox input,
.form-radio input {
  display: none;
}

.form-checkbox i,
.form-radio i {
  background-color: #fff;
  position: absolute;
  top: 10px;
  left: 0;
  transition: all 0.15s ease;
  border: 1px solid #bbb;
  height: 16px;
  width: 16px;
}

.form-checkbox:hover i,
.form-radio:hover i {
  border-color: #7b7b7b;
}

.form-checkbox i {
  border-radius: 3px;
}

.form-radio i {
  border-radius: 100px;
}

.form-checkbox input:checked + i,
.form-radio input:checked + i {
  background-color: #ffa800;
  border-color: #ffa800;
}

.form-checkbox input:checked:disabled + i,
.form-radio input:checked:disabled + i {
  background-color: #bbb;
  border-color: #bbb;
}

.form-checkbox input:checked + i:after {
  position: absolute;
  height: 10px;
  width: 5px;
  margin-left: -2px;
  margin-top: -6px;
  border: 2px solid #fff;
  border-left-width: 0;
  border-top-width: 0;
  content: "";
  left: 50%;
  top: 50%;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.form-radio input:checked + i:after {
  position: absolute;
  height: 8px;
  width: 8px;
  margin-left: -4px;
  margin-top: -4px;
  background-color: #fff;
  border-radius: 100px;
  content: "";
  left: 50%;
  top: 50%;
}

.form-checkbox-label {
  color: #7f7fa5;
  transition: color 0.2s ease-in-out;
}

.form-checkbox-label:hover,
.form-checkbox input:checked ~ .form-checkbox-label {
  color: #000;
}

.form-checkbox input:indeterminate + i {
  background-color: #ffa800;
  border-color: #ffa800;
}

.form-checkbox input:indeterminate + i:after {
  position: absolute;
  height: 10px;
  width: 6px;
  margin-left: -3px;
  margin-top: -9px;
  border-bottom: 2px solid #fff;
  content: "";
  left: 50%;
  top: 50%;
}

/* --- */
.form-row-radio {
  display: flex;
  margin-top: 30px;
}

.form-row-radio label {
  flex: 1;
  height: auto;
  white-space: nowrap;
}

.form-row-radio label strong,
.form-row-radio label small {
  display: block;
  font-weight: 400;
}

.form-row-radio label strong {
  font-size: 16px;
}

.form-row-radio label small {
  color: #7f7fa5;
  font-size: 14px;
}

.form-row-radio label i {
  top: 50%;
  transform: translate3d(0, -50%, 0);
}

/* --- */

/* form */

/* Select boxes */
.form-group .form-select__select {
  vertical-align: middle;
  position: relative;
  z-index: 3;
}

.form-group .form-label + .form-select__select {
  margin-top: 0;
}

/* --- */
.form .form-group .form-select {
  height: 70px;
  padding: 35px 0 0;
}

.form .form-group .form-select__select {
  border-top: 0;
  border-right: 0;
  border-left: 0;
  border-radius: 0;
  padding: 10.1px 29px 8px 0;
}

.form .form-group.-active .form-select__select {
  color: inherit;
}

/* --- */
.form-group__col-flex {
  display: flex;
  flex-wrap: wrap;
}

.form-group__col-flex > div {
  width: 100%;
}

@media (min-width: 768px) {
  .form-group__col-flex > div {
    width: 50%;
  }
}

@media (min-width: 1200px) {
  .form-group__col-flex__3 > div {
    width: calc(100% / 3);
  }
}

/* --- */

/* Form default */
.form .form-input,
.form .form-textarea {
  background: transparent;
  border-top: 0;
  border-right: 0;
  border-left: 0;
  border-radius: 0;
}

.form .form-label {
  cursor: text;
  user-select: none;
  color: #a0a1a4;
  position: absolute;
  z-index: 2;
  width: 100%;
  left: 0;
  top: 34px;
  transform-origin: left top;
}

.form .form-group.-fixed .form-label {
  top: 3px !important;
  cursor: pointer;
  color: #a0a1a4;
}

/* --- */
.form .form-input {
  height: 70px;
  padding: 35px 0 0;
}

.form .form-textarea {
  height: 35px;
  margin: 45px 0 0;
  padding-left: 0;
  padding-right: 0;
  overflow: hidden;
  line-height: 1.15;
  resize: vertical;
}

.form .form-textarea + .form-label {
  top: -1px;
}

/* --- */

/* --- */
.form .form-group .form-input:-webkit-autofill + label.form-label {
  transition: inherit;
  top: 3px !important;
  color: #000;
  cursor: pointer;
}

.form .form-group .form-input:focus ~ label.form-label {
  transition: left 0.08s ease-in-out, top 0.08s ease-in-out;
}

.form .form-group .form-input:focus ~ label.form-label,
.form .form-group.-active label.form-label {
  top: 3px !important;
  color: #000;
  cursor: pointer;
}

.form .form-group.-active .form-textarea + label.form-label {
  top: -32px !important;
}

/* --- */
.form .form-group > .form-input::-webkit-input-placeholder {
  color: transparent;
  visibility: hidden;
}

.form .form-group > .form-input::-moz-placeholder {
  color: transparent;
  visibility: hidden;
}

.form .form-group > .form-input:-moz-placeholder {
  color: transparent;
  visibility: hidden;
}

.form .form-group > .form-input:-ms-input-placeholder {
  color: transparent;
  visibility: hidden;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .form .form-group > .form-input:-ms-input-placeholder {
    visibility: visible;
  }
}

/* --- */
.form .form-group.-active > .form-input::-webkit-input-placeholder {
  color: #cacaca;
  visibility: visible;
}

.form .form-group.-active > .form-input::-moz-placeholder {
  color: #cacaca;
  visibility: visible;
}

.form .form-group.-active > .form-input:-moz-placeholder {
  color: #cacaca;
  visibility: visible;
}

.form .form-group.-active > .form-input:-ms-input-placeholder {
  color: GrayText;
  visibility: visible;
}

.form .form-group-footer {
  border-top: 0;
  margin-top: 10px;
}

/* Form states */
.form-group.-error > label.form-label {
  color: #f00 !important;
}

.form-group.-error > input.form-input {
  border-color: #f00;
}

/* Form sub messages */
.form-msg {
  position: relative;
  font-size: 1.2rem;
  line-height: 1.4;
  margin-top: 5px;
}

.form-msg + .form-msg {
  margin-top: 0;
}

.form-msg--error {
  color: #f00;
}

.switch {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 24px;
}

.switch input {
  display: none;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #d4d7dc;
  -webkit-transition: background 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: background 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: #fff;
  -webkit-transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

input:checked + .slider {
  background-color: #ffa800;
}

input:focus + .slider {
  box-shadow: 0 0 1px #ffa800;
}

input:checked + .slider:before {
  -webkit-transform: translateX(16px);
  -ms-transform: translateX(16px);
  transform: translateX(16px);
  -webkit-transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

/* Pagination */
.pagination {
  display: inline-block;
  text-align: center;
  font-size: 1.4rem;
  white-space: nowrap;
}

.pagination-item {
  display: inline-block;
}

.pagination-item a {
  display: inline-flex;
  align-items: center;
  padding: 8px;
  height: 30px;
  border-radius: 3px;
  border: 1px solid transparent;
  transition: border 0.2s ease-in-out;
}

.pagination-item a:hover {
  color: #000;
  border-color: #ddd;
}

.pagination-item.-active a {
  background-color: transparent;
  border-color: transparent;
  color: #000;
}

.pagination-item:not(:first-child) {
  margin-left: 5px;
}

.pagination-item a[disabled] {
  opacity: 0.5;
  pointer-events: none;
  cursor: default;
}

.pagination-item span {
  color: #c2c4cb;
  font-weight: 100;
}

/* Message */
.message-block {
  border-radius: 5px;
  background-color: #edf1f9;
  border-style: solid;
  border-width: 1px;
  border-color: #edf1f9;
  padding: 20px;
  color: #7f7fa5;
}

.message-block h2,
.message-block h3 {
  margin-top: 0;
}

.message-block h3 {
  font-size: 2rem;
  margin-bottom: 1rem;
}

.message-block p {
  margin: 0 0 1rem;
}

.message-block p:last-child {
  margin-bottom: 0;
}

.message-block.-warning {
  background-color: #f9eded;
  border-color: #f9eded;
}

.message-block.-success {
  background-color: #eff9ed;
  border-color: #eff9ed;
}

.message-block.-hint {
  background-color: #fff8e8;
  border-color: #eadab8;
}

.message-block.-info {
  background-color: #f7f9ff;
  border-color: #f7f9ff;
}

.editor--plain-text {
  background-color: #222c34;
  color: #b6bfd4;
  font-family: "Lucida Console", Monaco, monospace;
  font-size: 1em;
  line-height: 1.5;
  border-radius: 5px;
  padding: 20px;
}

.editor--plain-text mark {
  background-color: #f1f1a2;
}

.-text-success {
  color: #4ba349 !important;
}

.-text-warning {
  color: #a34949 !important;
}

.message-block ol.list {
  list-style: inside decimal;
}

.message-block--link {
  color: #000 !important;
  display: block;
  text-align: center;
}

.message-block--link u {
  color: #6d8ac6;
}

.form-groups--maltego.-disabled {
  opacity: 0.5;
  pointer-events: none;
}

/* Helpers - layouts */

/* Positioning */

.-relative {
  position: relative;
}

/* Display */
.-inline {
  display: inline !important;
}

.-block {
  display: block !important;
}

.-inline-block {
  display: inline-block !important;
}

.-flex {
  display: flex !important;
}

.-inline-flex {
  display: inline-flex !important;
}

.-flex-row {
  flex-direction: row !important;
}

.-flex-column {
  flex-direction: column !important;
}

/* Column count and gap */

.-column-3 {
  column-count: 3;
  -moz-column-count: 3;
  -webkit-column-count: 3;
}

/* Flex on */
.-flex-1 {
  flex: 1 !important;
}

.-flex-2 {
  flex: 2 !important;
}

.-flex-auto {
  flex-basis: auto !important;
}

.-flex-shrink-0 {
  flex-shrink: 0 !important;
}

.-flex-shrink-1 {
  flex-shrink: 1 !important;
}

.-flex-grow-0 {
  flex-grow: 0 !important;
}

.-flex-grow-1 {
  flex-grow: 1 !important;
}

/* order styles */
.-order-1 {
  order: 1 !important;
}

.-order-2 {
  order: 2 !important;
}

@media (min-width: 992px) {
  .-order-lg-1 {
    order: 1 !important;
  }

  .-order-lg-2 {
    order: 2 !important;
  }
}

@media (min-width: 1200px) {
  .-order-lg-1 {
    order: 1 !important;
  }

  .-order-lg-2 {
    order: 2 !important;
  }
}

/* Align-items */

.-align-items-center {
  align-items: center !important;
}

.-align-items-baseline {
  align-items: baseline !important;
}

/* Justify content */
.-justify-content-start {
  justify-content: flex-start !important;
}

.-justify-content-center {
  justify-content: center !important;
}

.-justify-content-end {
  justify-content: flex-end !important;
}

.-justify-content-between {
  justify-content: space-between !important;
}

/* Align self */

.-align-self-center {
  align-self: center !important;
}

.-align-self-baseline {
  align-self: baseline !important;
}

/* Flex wrap */
.-flex-wrap {
  flex-wrap: wrap !important;
}

.-flex-nowrap {
  flex-wrap: nowrap !important;
}

/* Widths */

.-width-2 {
  width: 16.66666667% !important;
}

.-width-3 {
  width: 25% !important;
}

.-width-4 {
  width: 33.33333333% !important;
}

.-width-5 {
  width: 41.66666667% !important;
}

.-width-6 {
  width: 50% !important;
}

.-width-8 {
  width: 66.66666667% !important;
}

.-width-9 {
  width: 75% !important;
}

.-width-10 {
  width: 83.33333333% !important;
}

.-width-11 {
  width: 91.66666667% !important;
}

.-width-12 {
  width: 100% !important;
}

.-max-width-12 {
  max-width: 100% !important;
}

/* Heights */

.-height-6 {
  height: 50% !important;
}

.-height-8 {
  height: 66.66666667% !important;
}

.-height-12 {
  height: 100% !important;
}

@media (min-width: 992px) {

  .-width-lg-8 {
    width: 66.66666667% !important;
  }

  .-width-lg-10 {
    width: 83.33333333% !important;
  }
}

/* Offsets */
[class*="-offset-"] {
  position: relative;
}

/* Spacing -margin-*-*, -padding-*-* */
.-m-0 {
  margin: 0 !important;
}

.-mx-0 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.-mx-2 {
  margin-left: 20px !important;
  margin-right: 20px !important;
}

.-mx-3 {
  margin-left: 40px !important;
  margin-right: 40px !important;
}

.-my-0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.-my-1 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.-my-2 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.-my-3 {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}

.-my-4 {
  margin-top: 60px !important;
  margin-bottom: 60px !important;
}

.-my-5 {
  margin-top: 80px !important;
  margin-bottom: 80px !important;
}

.-mt-0 {
  margin-top: 0 !important;
}

.-mt-1 {
  margin-top: 10px !important;
}

.-mt-2 {
  margin-top: 20px !important;
}

.-mt-3 {
  margin-top: 40px !important;
}

.-mt-4 {
  margin-top: 60px !important;
}

.-mt-5 {
  margin-top: 80px !important;
}

.-mt-n1 {
  margin-top: -10px !important;
}

.-mr-0 {
  margin-right: 0 !important;
}

.-mr-1 {
  margin-right: 10px !important;
}

.-mr-2 {
  margin-right: 20px !important;
}

.-mr-3 {
  margin-right: 40px !important;
}

.-mb-0 {
  margin-bottom: 0 !important;
}

.-mb-1 {
  margin-bottom: 10px !important;
}

.-mb-2 {
  margin-bottom: 20px !important;
}

.-mb-3 {
  margin-bottom: 40px !important;
}

.-mb-4 {
  margin-bottom: 60px !important;
}

.-mb-5 {
  margin-bottom: 80px !important;
}

.-ml-0 {
  margin-left: 0 !important;
}

.-ml-1 {
  margin-left: 10px !important;
}

.-ml-2 {
  margin-left: 20px !important;
}

.-ml-3 {
  margin-left: 40px !important;
}

.-mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* --- */
.-p-0 {
  padding: 0 !important;
}

.-p-1 {
  padding: 10px !important;
}

.-p-2 {
  padding: 20px !important;
}

.-p-3 {
  padding: 40px !important;
}

.-px-0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.-px-1 {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.-px-2 {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.-px-4 {
  padding-left: 60px !important;
  padding-right: 60px !important;
}

.-py-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.-py-1 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.-py-3 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.-py-4 {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

.-py-5 {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.-pt-0 {
  padding-top: 0 !important;
}

.-pt-1 {
  padding-top: 10px !important;
}

.-pt-2 {
  padding-top: 20px !important;
}

.-pt-3 {
  padding-top: 40px !important;
}

.-pt-4 {
  padding-top: 60px !important;
}

.-pt-5 {
  padding-top: 80px !important;
}

.-pr-1 {
  padding-right: 10px !important;
}

.-pr-2 {
  padding-right: 20px !important;
}

.-pr-3 {
  padding-right: 40px !important;
}

.-pr-4 {
  padding-right: 60px !important;
}

.-pb-0 {
  padding-bottom: 0 !important;
}

.-pb-1 {
  padding-bottom: 10px !important;
}

.-pb-2 {
  padding-bottom: 20px !important;
}

.-pb-3 {
  padding-bottom: 40px !important;
}

.-pb-4 {
  padding-bottom: 60px !important;
}

.-pb-5 {
  padding-bottom: 80px !important;
}

.-pl-0 {
  padding-left: 0 !important;
}

.-pl-2 {
  padding-left: 20px !important;
}

@media (min-width: 576px) {

  .-px-sm-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

@media (min-width: 768px) {

  .-my-md-3 {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }

  .-mt-md-0 {
    margin-top: 0 !important;
  }

  .-py-md-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .-pt-md-2 {
    padding-top: 20px !important;
  }

  .-pr-md-4 {
    padding-right: 60px !important;
  }

  .-pl-md-4 {
    padding-left: 60px !important;
  }
}

@media (min-width: 992px) {

  .-mx-lg-0 {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .-mx-lg-1 {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }

  .-mx-lg-2 {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }

  .-mx-lg-3 {
    margin-left: 40px !important;
    margin-right: 40px !important;
  }

  .-my-lg-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .-mt-lg-0 {
    margin-top: 0 !important;
  }

  .-mb-lg-0 {
    margin-bottom: 0 !important;
  }

  .-mb-lg-4 {
    margin-bottom: 60px !important;
  }

  .-p-lg-0 {
    padding: 0 !important;
  }

  .-px-lg-5 {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }

  .-py-lg-3 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  .-pb-lg-5 {
    padding-bottom: 80px !important;
  }
}

@media (min-width: 1200px) {

  .-pt-xl-2 {
    padding-top: 20px !important;
  }

  .-pt-xl-4 {
    padding-top: 60px !important;
  }
}

/* border styles */
.-border {
  border: 1px solid #e5e5e5 !important;
}

.-border-t {
  border-top: 1px solid #e5e5e5;
}

.-border-r {
  border-right: 1px solid #e5e5e5;
}

.-border-b {
  border-bottom: 1px solid #e5e5e5;
}

.-border-l {
  border-left: 1px solid #e5e5e5;
}

.-border-0 {
  border: 0 !important;
}

.-border-b-0 {
  border-bottom: 0 !important;
}

/* box shadows */
.-box-shadow-1 {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
}

/* z-index */

/* border radius */

.-border-radius-3 {
  border-radius: 10px !important;
}

/* UI Elements
------------------------------ */

/* Fade */

/* Loaders */
.progress {
  position: relative;
  height: 4px;
  display: block;
  width: 100%;
  background-color: #fce5bd;
  border-radius: 2px;
  margin: 0.5rem 0 1rem 0;
  overflow: hidden;
}

.progress .indeterminate {
  background-color: #f3a527;
}

.progress .indeterminate:before {
  content: "";
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
}

.progress .indeterminate:after {
  content: "";
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
  animation-delay: 1.15s;
}

@keyframes indeterminate-short {
  0% {
    left: -200%;
    right: 100%;
  }

  60% {
    left: 107%;
    right: -8%;
  }

  100% {
    left: 107%;
    right: -8%;
  }
}

/* Font icons */

.-icon__circle,
.-icon__squared {
  text-align: center;
}


.-icon__circle .icon__wrapper,
.-icon__squared .icon__wrapper {
  text-align: center;
  display: inline-flex;
  height: 64px;
  width: 64px;
  justify-content: center;
  align-items: center;
}

.-icon--small .icon__wrapper {
  font-size: 24px;
  height: 48px;
  width: 48px;
  line-height: 48px;
}

.-icon__circle {
  border-radius: 50%;
}

.-icon__squared {
  border-radius: 10px;
}

.-icon__circle .icon__wrapper {
  border-radius: 50px;
}

.-icon__squared .icon__wrapper {
  border-radius: 10px;
}

.-font-icon__letter.-icon__squared,
.-font-icon__letter.-icon__circle,
.-font-icon__icon.-icon__squared,
.-font-icon__icon.-icon__circle {
  width: 64px;
  height: 64px;
  line-height: 64px;
  flex: 0 0 64px;
}

.-font-icon__letter.-icon__squared.-icon--small,
.-font-icon__letter.-icon__circle.-icon--small,
.-font-icon__icon.-icon__squared.-icon--small,
.-font-icon__icon.-icon__circle.-icon--small {
  width: 48px;
  height: 48px;
  line-height: 48px;
  flex: 0 0 48px;
}

.-font-icon__letter.-icon__circle .icon-wrapper,
.-font-icon__letter.-icon__squared .icon-wrapper {
  left: 0;
}

.-font-icon__favicon {
  background-color: #f2f6fd;
}

.-font-icon__favicon img {
  display: block;
  margin: 16px;
  width: 16px;
  height: 16px;
}

.-font-icon__icon {
  width: 48px;
  height: 48px;
  position: relative;
}

.-font-icon__icon .icon {
  margin: 8px;
}


.-icon__circle > div {
  margin-top: 10px;
  transition: all 0.2s ease-out;
  color: #7f7fa5;
  line-height: 1.3;
}


.-icon__circle .icon__wrapper {
  margin-top: 0;
}

.-icon__circle .icon__wrapper {
  background-color: #f2f6fd;
}

.-icon__circle:hover .icon__wrapper > div {
  color: #000;
}

.-icon--color-default .icon__wrapper {
  background-color: #ecf2f7;
}

.-icon--color-default svg {
  stroke: #b8beec;
}

.-icon--color-0,
.-icon--color-0 .icon__wrapper {
  background-color: rgba(255, 255, 255, 0.04);
}

.-icon--color-0 svg {
  stroke: #fff;
}

.-icon--color-1 .icon__wrapper {
  background-color: #ebf3ff;
}

.-icon--color-1 svg {
  stroke: #799adc;
}

.-icon--color-2 .icon__wrapper {
  background-color: #eff9ed;
}

.-icon--color-2 svg {
  stroke: #5ac45e;
}

.-icon--color-3 .icon__wrapper {
  background-color: #fbebeb;
}

.-icon--color-3 svg {
  stroke: #eb486a;
}

.-icon--color-4 .icon__wrapper {
  background-color: #edf5f8;
}

.-icon--color-4 svg {
  stroke: #33c4c2;
}

.-icon--color-5 .icon__wrapper {
  background-color: #f8f0f6;
}

.-icon--color-5 svg {
  stroke: #a26bb9;
}

.-icon--color-6 .icon__wrapper {
  background-color: #fcf7ef;
}

.-icon--color-6 svg {
  stroke: #f1a438;
}

.-icon--color-7 .icon__wrapper {
  background-color: #e3f5ff;
}

.-icon--color-7 svg {
  stroke: #46b9f5;
}

.-icon--color-8 .icon__wrapper {
  background-color: #e6f5ed;
}

.-icon--color-8 svg {
  stroke: #40b7a2;
}

.-icon--color-9 .icon__wrapper {
  background-color: #f7eded;
}

.-icon--color-9 svg {
  stroke: #924f4f;
}

.-icon--color-10 .icon__wrapper {
  background-color: #f5e9f4;
}

.-icon--color-10 svg {
  stroke: #e470c4;
}

.-icon--color-11 .icon__wrapper {
  background-color: #e2e8f6;
}

.-icon--color-11 svg {
  stroke: #7674ec;
}

.-icon--color-12 .icon__wrapper {
  background-color: #e0f4f7;
}

.-icon--color-12 svg {
  stroke: #6cb3bd;
}

.-icon--color-14 .icon__wrapper {
  background-color: #f7f6dc;
}

.-icon--color-14 svg {
  stroke: #bd861c;
}

.-icon--color-15 .icon__wrapper {
  background-color: #fff5eb;
  color: #d8b56f;
}

.-icon--color-15 svg {
  stroke: #d8b56f;
}

.-icon--color-16 .icon__wrapper {
  background-color: #f6e5e1;
  color: #c75959;
}

.-icon--color-16 svg {
  stroke: #c75959;
}

/* --- */

/* --- */
.-font-icon__letter {
  font-weight: 400;
  font-size: 24px;
}

.-font-icon__url:after {
  content: "";
  background-image: url(../img/ui/launch-url.svg);
  position: relative;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-left: 5px;
}

/* --- */

/* Tooltip */
.tooltip {
  position: absolute;
  z-index: 999;
}

.tooltip-box {
  position: relative;
  background-color: rgba(255, 255, 255, 1);
  color: #7f7fa5;
  padding: 15px;
  border-radius: 5px;
  box-shadow: 0 4px 34px 0 rgba(50, 48, 57, 0.4);
}

.tooltip--dark .tooltip-box {
  background-color: rgba(35, 45, 52, 0.97);
  color: #fff;
}

.tooltip-box__title {
  color: #000;
  font-size: 1.8rem;
  margin-bottom: 0;
}

.tooltip--dark .tooltip-box__title {
  color: #fff;
}

.tooltip-box__title:first-child {
  margin-top: 0;
}

.tooltip-box__title + .tooltip-box__paragraph {
  margin-top: 1rem;
}

.tooltip-box__paragraph + .tooltip-box__paragraph {
  margin: 1rem 0;
}

.tooltip--dark .tooltip-box__paragraph {
  color: #fff;
}

.tooltip-box__paragraph:last-child {
  margin-bottom: 0;
}

.tooltip [class*="tooltip-box__pos-"] {
  position: relative;
}

.tooltip [class*="tooltip-box__pos-"]:after {
  border: solid transparent;
  content: "";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-width: 10px;
}

.tooltip .tooltip-box__pos-b:after {
  border-top-color: #fff;
  top: 100%;
  left: 50%;
  margin-left: -10px;
}

.tooltip--dark .tooltip-box__pos-b:after {
  border-top-color: rgba(35, 45, 52, 0.97);
}

/* --- */
.tooltip.-animate {
  animation: upDown 1.5s 0.5s infinite linear, fadeIn 1s forwards;
}

/* --- */

.-fadeout {
  animation: fadeOut 0.5s forwards !important;
}

/* --- */
.splitter-line {
  position: relative;
  height: 1px;
}

.splitter-line:after {
  background: #dde2e9;
  bottom: -1px;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  width: 100%;
}

.splitter-line__gradient:after {
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(222, 232, 250, 0)), color-stop(50%, rgba(222, 232, 250, 1)), color-stop(100%, rgba(222, 232, 250, 0)));
  background: -webkit-linear-gradient(left, rgba(222, 232, 250, 0) 0%, rgba(222, 232, 250, 1) 50%, rgba(222, 232, 250, 0) 100%);
  background: -ms-linear-gradient(left, rgba(222, 232, 250, 0) 0%, rgba(222, 232, 250, 1) 50%, rgba(222, 232, 250, 0) 100%);
  background: -moz-linear-gradient(left, rgba(222, 232, 250, 0) 0%, rgba(222, 232, 250, 1) 50%, rgba(222, 232, 250, 0) 100%);
  background: -o-linear-gradient(left, rgba(222, 232, 250, 0) 0%, rgba(222, 232, 250, 1) 50%, rgba(222, 232, 250, 0) 100%);
  background: linear-gradient(to left, rgba(222, 232, 250, 0) 0%, rgba(222, 232, 250, 1) 50%, rgba(222, 232, 250, 0) 100%);
}

/* --- Heartbeat colors --- */
.heartbeat__bars .color-0 {
  background-color: #ececec;
}

.heartbeat__bars .color-1 {
  background-color: #ffecd0;
}

.heartbeat__bars .color-2 {
  background-color: #ffe5be;
}

.heartbeat__bars .color-3 {
  background-color: #f8cb87;
}

.heartbeat__bars .color-4 {
  background-color: #f3a527;
}

.heartbeat__bars .color-6 {
  background-color: #6c7786;
}

.heartbeat__bars [class*="color-"].-gradient:before {
  content: "";
  background: linear-gradient(rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.25));
  height: 100%;
  width: 100%;
  position: absolute;
  bottom: 0;
}

/* Disabled text selection in e.g. buttons */
.-no-select {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none;
}

/* --- Animations --- */
@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes slideIn {
  0% {
    transform: translateY(-5px);
  }

  100% {
    transform: translateY(0);
  }
}

@keyframes fadeInDelay {
  0% {
    opacity: 0;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes slideInDelay {
  0% {
    transform: translateY(-5px);
  }

  50% {
    transform: translateY(-5px);
  }

  100% {
    transform: translateY(0);
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes upDown {
  0% {
    transform: translate3d(0, 0, 0);
  }

  50% {
    transform: translate3d(0, -10px, 0);
  }

  100% {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes loading {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes buzz {
  10% {
    transform: rotate(20deg);
  }

  20% {
    transform: rotate(-20deg);
  }

  30% {
    transform: rotate(20deg);
  }

  40% {
    transform: rotate(-20deg);
  }

  50% {
    transform: rotate(10deg);
  }

  60% {
    transform: rotate(-10deg);
  }

  70% {
    transform: rotate(10deg);
  }

  80% {
    transform: rotate(-10deg);
  }

  90% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(0);
  }
}

/* -- SVG icon system -- */

/* default */
.icon {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1px;
}

/* sizes */

.icon--size-10 {
  width: 10px !important;
  height: 10px !important;
}

.icon--size-12 {
  width: 12px !important;
  height: 12px !important;
}

.icon--size-16 {
  width: 16px !important;
  height: 16px !important;
}

.icon--size-24 {
  width: 24px !important;
  height: 24px !important;
}

.icon--size-32 {
  width: 32px !important;
  height: 32px !important;
}

/* weights */
.icon--weight-medium {
  stroke-width: 1.5px !important;
}

.icon--weight-bold {
  stroke-width: 2px !important;
}

.icon--weight-extra-bold {
  stroke-width: 2.5px !important;
}

/* colors */
.icon--light {
  stroke: #fff !important;
}

.icon--fill--light {
  fill: #fff !important;
}

.icon--stroke--none {
  stroke: none !important;
}
