@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400;1,600;1,700&display=swap");

/*! Spectre.css v0.5.1 | MIT License | github.com/picturepan2/spectre */
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

article,
aside,
footer,
header,
nav,
section {
    display: block
}

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

figcaption,
figure,
main {
    display: block
}

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

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

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

address {
    font-style: normal
}

b,
strong {
    font-weight: inherit;
    font-weight: bolder
}

code,
kbd,
pre,
samp {
    font-family: SF Mono, Segoe UI Mono, Roboto Mono, Menlo, Courier, monospace;
    font-size: 1em
}

dfn {
    font-style: italic
}

small {
    font-size: 80%;
    font-weight: 400
}

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

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

audio,
video {
    display: inline-block
}

audio:not([controls]) {
    display: none;
    height: 0
}

img {
    border-style: none
}

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

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    margin: 0
}

button,
input {
    overflow: visible
}

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
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    display: inline-block;
    vertical-align: baseline
}

textarea {
    overflow: auto
}

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

[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
}

details,
menu {
    display: block
}

summary {
    display: list-item;
    outline: none
}

canvas {
    display: inline-block
}

[hidden],
template {
    display: none
}

*,
:after,
:before {
    box-sizing: inherit
}

html {
    box-sizing: border-box;
    font-size: 20px;
    line-height: 1.5;
    -webkit-tap-highlight-color: transparent
}

body {
    background: #f6f7fb;
    color: #616161;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, sans-serif;
    overflow-x: hidden;
    text-rendering: optimizeLegibility
}

a {
    color: #3498db;
    outline: none;
    text-decoration: none
}

a:focus {
    box-shadow: 0 0 0 .1rem rgba(214, 234, 248, 0)
}

a.active,
a:active,
a:focus,
a:hover {
    color: #258cd1;
    text-decoration: underline
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: inherit;
    font-weight: 500;
    line-height: 1.2;
    margin-bottom: .5em;
    margin-top: 0
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-weight: 500
}

.h1,
h1 {
    font-size: 2rem
}

.h2,
h2 {
    font-size: 1.6rem
}

.h3,
h3 {
    font-size: 1.4rem
}

.h4,
h4 {
    font-size: 1.2rem
}

.h5,
h5 {
    font-size: 1rem
}

.h6,
h6 {
    font-size: .8rem
}

p {
    margin: 0 0 1rem
}

a,
ins,
u {
    text-decoration-skip: ink edges
}

abbr[title] {
    border-bottom: .05rem dotted;
    cursor: help;
    text-decoration: none
}

kbd {
    line-height: 1.2;
    padding: .1rem .15rem;
    background: #545454;
    color: #fff;
    font-size: .7rem
}

kbd,
mark {
    border-radius: .1rem
}

mark {
    background: #cddc39;
    color: #616161;
    padding: .05rem
}

blockquote {
    border-left: .1rem solid #dcdde1;
    margin-left: 0;
    padding: .4rem .8rem
}

blockquote p:last-child {
    margin-bottom: 0
}

ol,
ul {
    padding: 0
}

ol,
ol ol,
ol ul,
ul,
ul ol,
ul ul {
    margin: .8rem 0 .8rem .8rem
}

ol li,
ul li {
    margin-top: .4rem
}

ul {
    list-style: disc inside
}

ul ul {
    list-style-type: circle
}

ol {
    list-style: decimal inside
}

ol ol {
    list-style-type: lower-alpha
}

dl dt {
    font-weight: 700
}

dl dd {
    margin: .4rem 0 .8rem
}

:lang(zh) {
    font-family: -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, sans-serif
}

:lang(ja) {
    font-family: -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Hiragino Sans, Hiragino Kaku Gothic Pro, Yu Gothic, YuGothic, Meiryo, Helvetica Neue, sans-serif
}

:lang(ko) {
    font-family: -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Malgun Gothic, Helvetica Neue, sans-serif
}

.cjk ins,
.cjk u,
:lang(ja) ins,
:lang(ja) u,
:lang(zh) ins,
:lang(zh) u {
    border-bottom: .05rem solid;
    text-decoration: none
}

.cjk del+del,
.cjk del+s,
.cjk ins+ins,
.cjk ins+u,
.cjk s+del,
.cjk s+s,
.cjk u+ins,
.cjk u+u,
:lang(ja) del+del,
:lang(ja) del+s,
:lang(ja) ins+ins,
:lang(ja) ins+u,
:lang(ja) s+del,
:lang(ja) s+s,
:lang(ja) u+ins,
:lang(ja) u+u,
:lang(zh) del+del,
:lang(zh) del+s,
:lang(zh) ins+ins,
:lang(zh) ins+u,
:lang(zh) s+del,
:lang(zh) s+s,
:lang(zh) u+ins,
:lang(zh) u+u {
    margin-left: .125em
}

.table {
    border-collapse: collapse;
    border-spacing: 0;
    text-align: left;
    width: 100%
}

.table.table-striped tbody tr:nth-of-type(odd) {
    background: #fff
}

.table.table-hover tbody tr:hover,
.table.table-striped tbody tr.active,
.table tbody tr.active {
    background: #f7f7f7
}

.table.table-scroll {
    display: block;
    overflow-x: auto;
    padding-bottom: .75rem;
    white-space: nowrap
}

.table td,
.table th {
    border-bottom: .05rem solid #dcdde1;
    padding: .6rem .4rem
}

.table th {
    border-bottom-width: .1rem
}

.btn {
    transition: all .2s ease;
    appearance: none;
    border: .05rem solid #3498db;
    border-radius: .1rem;
    cursor: pointer;
    display: inline-block;
    font-size: .8rem;
    height: 1.8rem;
    line-height: 1rem;
    outline: none;
    padding: .35rem .4rem;
    text-align: center;
    text-decoration: none;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap
}

.btn:focus {
    box-shadow: 0 0 0 .1rem rgba(214, 234, 248, 0)
}

.btn:focus,
.btn:hover {
    background: #ededed;
    border-color: #00a1d4;
    text-decoration: none
}

.btn.active,
.btn:active {
    background: #00a1d4;
    border-color: #008ebb;
    color: #fff;
    text-decoration: none
}

.btn.active.loading:after,
.btn:active.loading:after {
    border-bottom-color: #fff;
    border-left-color: #fff
}

.btn.disabled,
.btn:disabled,
.btn[disabled] {
    cursor: default;
    opacity: .5;
    pointer-events: none
}

.btn.btn-primary {
    background: #3498db;
    border-color: #00a1d4;
    color: #fff
}

.btn.btn-primary:focus,
.btn.btn-primary:hover {
    background: #0099ca;
    border-color: #008ebb;
    color: #fff
}

.btn.btn-primary.active,
.btn.btn-primary:active {
    background: #0092c0;
    border-color: #0086b0;
    color: #fff
}

.btn.btn-error.loading:after,
.btn.btn-primary.loading:after,
.btn.btn-success.loading:after,
.btn.btn-warning.loading:after {
    border-bottom-color: #fff;
    border-left-color: #fff
}

.btn.btn-success {
    background: #2ecc71;
    border-color: #2bc06a;
    color: #fff
}

.btn.btn-success:focus {
    box-shadow: 0 0 0 .1rem rgba(46, 204, 113, 0)
}

.btn.btn-success:focus,
.btn.btn-success:hover {
    background: #2cc46c;
    border-color: #29b765;
    color: #fff
}

.btn.btn-success.active,
.btn.btn-success:active {
    background: #27af61;
    border-color: #25a25a;
    color: #fff
}

.btn.btn-error {
    background: #e74c3c;
    border-color: #e53f2e;
    color: #fff
}

.btn.btn-error:focus {
    box-shadow: 0 0 0 .1rem rgba(231, 76, 60, 0)
}

.btn.btn-error:focus,
.btn.btn-error:hover {
    background: #e64433;
    border-color: #e43725;
    color: #fff
}

.btn.btn-error.active,
.btn.btn-error:active {
    background: #e32f1c;
    border-color: #d62c1a;
    color: #fff
}

.btn.btn-link {
    background: transparent;
    border-color: transparent;
    color: #3498db
}

.btn.btn-link.active,
.btn.btn-link:active,
.btn.btn-link:focus,
.btn.btn-link:hover {
    color: #258cd1
}

.btn.btn-sm {
    font-size: .7rem;
    height: 1.4rem;
    padding: .15rem .3rem
}

.btn.btn-lg {
    font-size: .9rem;
    height: 2rem;
    padding: .45rem .6rem
}

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

.btn.btn-action {
    width: 1.8rem;
    padding-left: 0;
    padding-right: 0
}

.btn.btn-action.btn-sm {
    width: 1.4rem
}

.btn.btn-action.btn-lg {
    width: 2rem
}

.btn.btn-clear {
    background: transparent;
    border: 0;
    color: currentColor;
    height: .8rem;
    line-height: .8rem;
    margin-left: .2rem;
    margin-right: -2px;
    opacity: 1;
    padding: 0;
    text-decoration: none;
    width: .8rem
}

.btn.btn-clear:hover {
    opacity: .95
}

.btn.btn-clear:before {
    content: "\2715"
}

.btn-group {
    display: inline-flex;
    flex-wrap: wrap
}

.btn-group .btn {
    flex: 1 0 auto
}

.btn-group .btn:first-child:not(:last-child) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.btn-group .btn:not(:first-child):not(:last-child) {
    border-radius: 0;
    margin-left: -.05rem
}

.btn-group .btn:last-child:not(:first-child) {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    margin-left: -.05rem
}

.btn-group .btn.active,
.btn-group .btn:active,
.btn-group .btn:focus,
.btn-group .btn:hover {
    z-index: 1
}

.btn-group.btn-group-block {
    display: flex
}

.btn-group.btn-group-block .btn {
    flex: 1 0 0
}

.form-group:not(:last-child) {
    margin-bottom: .4rem
}

fieldset,
legend {
    margin-bottom: .8rem
}

legend {
    font-size: .9rem;
    font-weight: 500
}

.form-label {
    display: block;
    line-height: 1rem;
    padding: .4rem 0
}

.form-label.label-sm {
    font-size: .7rem;
    padding: .2rem 0
}

.form-label.label-lg {
    font-size: .9rem;
    padding: .5rem 0
}

.form-input {
    appearance: none;
    background: #fff;
    background-image: none;
    border: .05rem solid #c1c2c9;
    border-radius: .1rem;
    color: #616161;
    display: block;
    font-size: .8rem;
    height: 1.8rem;
    line-height: 1rem;
    max-width: 100%;
    outline: none;
    padding: .35rem .4rem;
    position: relative;
    transition: background .2s, border .2s, box-shadow .2s, color .2s;
    width: 100%
}

.form-input:focus {
    box-shadow: 0 0 0 .1rem rgba(214, 234, 248, 0);
    border-color: #3498db
}

.form-input::placeholder {
    color: #bababa
}

.form-input.input-sm {
    font-size: .7rem;
    height: 1.4rem;
    padding: .15rem .3rem
}

.form-input.input-lg {
    font-size: .9rem;
    height: 2rem;
    padding: .45rem .6rem
}

.form-input.input-inline {
    display: inline-block;
    vertical-align: middle;
    width: auto
}

.form-input[type=file],
textarea.form-input,
textarea.form-input.input-lg,
textarea.form-input.input-sm {
    height: auto
}

.form-input-hint {
    color: #bababa;
    font-size: .7rem;
    margin-top: .2rem
}

.has-success .form-input-hint,
.is-success+.form-input-hint {
    color: #2ecc71
}

.has-error .form-input-hint,
.is-error+.form-input-hint {
    color: #e74c3c
}

.form-select {
    appearance: none;
    -moz-appearance: none;
    border: .05rem solid #c1c2c9;
    border-radius: .1rem;
    color: inherit;
    font-size: .8rem;
    height: 1.8rem;
    line-height: 1rem;
    outline: none;
    padding: .35rem .4rem;
    vertical-align: middle;
    width: 100%;
    background: #fff
}

.form-select:focus {
    box-shadow: 0 0 0 .1rem rgba(214, 234, 248, 0);
    border-color: #3498db
}

.form-select::-ms-expand {
    display: none
}

.form-select.select-sm {
    font-size: .7rem;
    height: 1.4rem;
    padding: .15rem 1.1rem .15rem .3rem
}

.form-select.select-lg {
    font-size: .9rem;
    height: 2rem;
    padding: .45rem 1.4rem .45rem .6rem
}

.form-select[multiple],
.form-select[size] {
    height: auto;
    padding: .35rem .4rem
}

.form-select[multiple] option,
.form-select[size] option {
    padding: .1rem .2rem
}

.form-select:not([multiple]):not([size]) {
    background: #fff url(../images/chevron-down-outline.svg) no-repeat right .35rem center/.75rem .75rem;
    padding-right: 1.2rem
}

.has-icon-left,
.has-icon-right {
    position: relative
}

.has-icon-left .form-icon,
.has-icon-right .form-icon {
    height: .8rem;
    margin: 0 .35rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: .8rem;
    z-index: 2
}

.has-icon-left .form-icon {
    left: .05rem
}

.has-icon-left .form-input {
    padding-left: 1.5rem
}

.has-icon-right .form-icon {
    right: .05rem
}

.has-icon-right .form-input {
    padding-right: 1.5rem
}

.form-checkbox,
.form-radio,
.form-switch {
    display: block;
    line-height: 1rem;
    margin: .2rem 0;
    min-height: 1.4rem;
    padding: .2rem .4rem .2rem 1.2rem;
    position: relative
}

.form-checkbox input,
.form-radio input,
.form-switch input {
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    position: absolute;
    width: 1px
}

.form-checkbox input:focus+.form-icon,
.form-radio input:focus+.form-icon,
.form-switch input:focus+.form-icon {
    box-shadow: 0 0 0 .1rem rgba(214, 234, 248, 0);
    border-color: #3498db
}

.form-checkbox input:checked+.form-icon,
.form-radio input:checked+.form-icon,
.form-switch input:checked+.form-icon {
    background: #3498db;
    border-color: #3498db
}

.form-checkbox .form-icon,
.form-radio .form-icon,
.form-switch .form-icon {
    border: .05rem solid #c1c2c9;
    cursor: pointer;
    display: inline-block;
    position: absolute;
    transition: background .2s, border .2s, box-shadow .2s, color .2s
}

.form-checkbox.input-sm,
.form-radio.input-sm,
.form-switch.input-sm {
    font-size: .7rem;
    margin: 0
}

.form-checkbox.input-lg,
.form-radio.input-lg,
.form-switch.input-lg {
    font-size: .9rem;
    margin: .3rem 0
}

.form-checkbox .form-icon,
.form-radio .form-icon {
    background: #fff;
    height: .8rem;
    left: 0;
    top: .3rem;
    width: .8rem
}

.form-checkbox input:active+.form-icon,
.form-radio input:active+.form-icon {
    background: #f7f7f7
}

.form-checkbox .form-icon {
    border-radius: .1rem
}

.form-checkbox input:checked+.form-icon:before {
    background-clip: padding-box;
    border-color: #fff;
    border-style: solid;
    border-width: 0 .1rem .1rem 0;
    content: "";
    height: 9px;
    left: 50%;
    margin-left: -3px;
    margin-top: -6px;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 6px
}

.form-checkbox input:indeterminate+.form-icon {
    background: #3498db;
    border-color: #3498db
}

.form-checkbox input:indeterminate+.form-icon:before {
    background: #fff;
    content: "";
    height: 2px;
    left: 50%;
    margin-left: -5px;
    margin-top: -1px;
    position: absolute;
    top: 50%;
    width: 10px
}

.form-radio .form-icon {
    border-radius: 50%
}

.form-radio input:checked+.form-icon:before {
    background: #fff;
    border-radius: 50%;
    content: "";
    height: 6px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 6px
}

.form-switch {
    padding-left: 2rem
}

.form-switch .form-icon {
    background: #bababa;
    background-clip: padding-box;
    border-radius: .45rem;
    height: .9rem;
    left: 0;
    top: .25rem;
    width: 1.6rem
}

.form-switch .form-icon:before {
    background: #fff;
    border-radius: 50%;
    content: "";
    display: block;
    height: .8rem;
    left: 0;
    position: absolute;
    top: 0;
    transition: background .2s, border .2s, box-shadow .2s, color .2s, left .2s;
    width: .8rem
}

.form-switch input:checked+.form-icon:before {
    left: 14px
}

.form-switch input:active+.form-icon:before {
    background: #fff
}

.input-group {
    display: flex
}

.input-group .input-group-addon {
    background: #fff;
    border: .05rem solid #c1c2c9;
    border-radius: .1rem;
    line-height: 1rem;
    padding: .35rem .4rem;
    white-space: nowrap
}

.input-group .input-group-addon.addon-sm {
    font-size: .7rem;
    padding: .15rem .3rem
}

.input-group .input-group-addon.addon-lg {
    font-size: .9rem;
    padding: .45rem .6rem
}

.input-group .form-input,
.input-group .form-select {
    flex: 1 1 auto;
    width: 1%
}

.input-group .input-group-btn {
    z-index: 1
}

.input-group .form-input:first-child:not(:last-child),
.input-group .form-select:first-child:not(:last-child),
.input-group .input-group-addon:first-child:not(:last-child),
.input-group .input-group-btn:first-child:not(:last-child) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.input-group .form-input:not(:first-child):not(:last-child),
.input-group .form-select:not(:first-child):not(:last-child),
.input-group .input-group-addon:not(:first-child):not(:last-child),
.input-group .input-group-btn:not(:first-child):not(:last-child) {
    border-radius: 0;
    margin-left: -.05rem
}

.input-group .form-input:last-child:not(:first-child),
.input-group .form-select:last-child:not(:first-child),
.input-group .input-group-addon:last-child:not(:first-child),
.input-group .input-group-btn:last-child:not(:first-child) {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    margin-left: -.05rem
}

.input-group .form-input:focus,
.input-group .form-select:focus,
.input-group .input-group-addon:focus,
.input-group .input-group-btn:focus {
    z-index: 2
}

.input-group .form-select {
    width: auto
}

.input-group.input-inline {
    display: inline-flex
}

.form-input.is-success,
.form-select.is-success,
.has-success .form-input,
.has-success .form-select {
    background: #fff;
    border-color: #2ecc71
}

.form-input.is-success:focus,
.form-select.is-success:focus,
.has-success .form-input:focus,
.has-success .form-select:focus {
    box-shadow: 0 0 0 .1rem rgba(46, 204, 113, 0)
}

.form-input.is-error,
.form-select.is-error,
.has-error .form-input,
.has-error .form-select {
    background: #fff;
    border-color: #e74c3c
}

.form-input.is-error:focus,
.form-select.is-error:focus,
.has-error .form-input:focus,
.has-error .form-select:focus {
    box-shadow: 0 0 0 .1rem rgba(231, 76, 60, 0)
}

.form-checkbox.is-error .form-icon,
.form-radio.is-error .form-icon,
.form-switch.is-error .form-icon,
.has-error .form-checkbox .form-icon,
.has-error .form-radio .form-icon,
.has-error .form-switch .form-icon {
    border-color: #e74c3c
}

.form-checkbox.is-error input:checked+.form-icon,
.form-radio.is-error input:checked+.form-icon,
.form-switch.is-error input:checked+.form-icon,
.has-error .form-checkbox input:checked+.form-icon,
.has-error .form-radio input:checked+.form-icon,
.has-error .form-switch input:checked+.form-icon {
    background: #e74c3c;
    border-color: #e74c3c
}

.form-checkbox.is-error input:focus+.form-icon,
.form-radio.is-error input:focus+.form-icon,
.form-switch.is-error input:focus+.form-icon,
.has-error .form-checkbox input:focus+.form-icon,
.has-error .form-radio input:focus+.form-icon,
.has-error .form-switch input:focus+.form-icon {
    box-shadow: 0 0 0 .1rem rgba(231, 76, 60, 0);
    border-color: #e74c3c
}

.form-checkbox.is-error input:indeterminate+.form-icon,
.has-error .form-checkbox input:indeterminate+.form-icon {
    background: #e74c3c;
    border-color: #e74c3c
}

.form-input:not(:placeholder-shown):invalid {
    border-color: #e74c3c
}

.form-input:not(:placeholder-shown):invalid:focus {
    box-shadow: 0 0 0 .1rem rgba(231, 76, 60, 0);
    background: #fff
}

.form-input:not(:placeholder-shown):invalid+.form-input-hint {
    color: #e74c3c
}

.form-input.disabled,
.form-input:disabled,
.form-select.disabled,
.form-select:disabled {
    background-color: #f7f7f7;
    cursor: not-allowed;
    opacity: .7
}

.form-input[readonly] {
    background-color: #fff
}

input.disabled+.form-icon,
input:disabled+.form-icon {
    background: #f7f7f7;
    cursor: not-allowed;
    opacity: .7
}

.form-switch input.disabled+.form-icon:before,
.form-switch input:disabled+.form-icon:before {
    background: #fff
}

.form-horizontal {
    padding: .4rem 0
}

.form-horizontal .form-group {
    display: flex;
    flex-wrap: wrap
}

.form-inline,
.label {
    display: inline-block
}

.label {
    border-radius: .1rem;
    line-height: 1.2;
    padding: .1rem .15rem;
    background: #f7f7f7;
    color: #6e6e6e
}

.label.label-rounded {
    border-radius: 5rem;
    padding-left: .4rem;
    padding-right: .4rem
}

.label.label-primary {
    background: #3498db;
    color: #fff
}

.label.label-secondary {
    background: #d6eaf8;
    color: #3498db
}

.label.label-success {
    background: #2ecc71;
    color: #fff
}

.label.label-warning {
    background: #f1c40f;
    color: #fff
}

.label.label-error {
    background: #e74c3c;
    color: #fff
}

code {
    line-height: 1.2;
    padding: .1rem .15rem;
    background: #fdf4f4;
    color: #e06870;
    font-size: 85%
}

.code,
code {
    border-radius: .1rem
}

.code {
    color: #616161;
    position: relative
}

.code:before {
    color: #bababa;
    content: attr(data-lang);
    font-size: .7rem;
    position: absolute;
    right: .4rem;
    top: .1rem
}

.code code {
    background: #fff;
    color: inherit;
    display: block;
    line-height: 1.5;
    overflow-x: auto;
    padding: 1rem;
    width: 100%
}

.img-responsive {
    display: block;
    height: auto;
    max-width: 100%
}

.img-fit-cover {
    object-fit: cover
}

.img-fit-contain {
    object-fit: contain
}

.video-responsive {
    display: block;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: 100%
}

.video-responsive:before {
    content: "";
    display: block;
    padding-bottom: 56.25%
}

.video-responsive embed,
.video-responsive iframe,
.video-responsive object {
    border: 0;
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
}

video.video-responsive {
    height: auto;
    max-width: 100%
}

video.video-responsive:before {
    content: none
}

.video-responsive-4-3:before {
    padding-bottom: 75%
}

.video-responsive-1-1:before {
    padding-bottom: 100%
}

.figure {
    margin: 0 0 .4rem
}

.figure .figure-caption {
    color: #7a7a7a;
    margin-top: .4rem
}

.container {
    margin-left: auto;
    margin-right: auto;
    padding-left: .4rem;
    padding-right: .4rem;
    width: 100%
}

.container.grid-xl {
    max-width: 1296px
}

.container.grid-lg {
    max-width: 976px
}

.container.grid-md {
    max-width: 856px
}

.container.grid-sm {
    max-width: 616px
}

.container.grid-xs {
    max-width: 496px
}

.show-lg,
.show-md,
.show-sm,
.show-xl,
.show-xs {
    display: none !important
}

.columns {
    display: flex;
    flex-wrap: wrap;
    margin-left: -.4rem;
    margin-right: -.4rem
}

.columns.col-gapless {
    margin-left: 0;
    margin-right: 0
}

.columns.col-gapless>.column {
    padding-left: 0;
    padding-right: 0
}

.columns.col-oneline {
    flex-wrap: nowrap;
    overflow-x: auto
}

.column {
    flex: 1;
    max-width: 100%;
    padding-left: .4rem;
    padding-right: .4rem
}

.column.col-1,
.column.col-2,
.column.col-3,
.column.col-4,
.column.col-5,
.column.col-6,
.column.col-7,
.column.col-8,
.column.col-9,
.column.col-10,
.column.col-11,
.column.col-12 {
    flex: none
}

.col-12 {
    width: 100%
}

.col-11 {
    width: 91.66666667%
}

.col-10 {
    width: 83.33333333%
}

.col-9 {
    width: 75%
}

.col-8 {
    width: 66.66666667%
}

.col-7 {
    width: 58.33333333%
}

.col-6 {
    width: 50%
}

.col-5 {
    width: 41.66666667%
}

.col-4 {
    width: 33.33333333%
}

.col-3 {
    width: 25%
}

.col-2 {
    width: 16.66666667%
}

.col-1 {
    width: 8.33333333%
}

.col-auto {
    flex: 0 0 auto;
    max-width: none;
    width: auto
}

.col-mx-auto {
    margin-right: auto
}

.col-ml-auto,
.col-mx-auto {
    margin-left: auto
}

.col-mr-auto {
    margin-right: auto
}

@media (max-width:1280px) {

    .col-xl-1,
    .col-xl-2,
    .col-xl-3,
    .col-xl-4,
    .col-xl-5,
    .col-xl-6,
    .col-xl-7,
    .col-xl-8,
    .col-xl-9,
    .col-xl-10,
    .col-xl-11,
    .col-xl-12 {
        flex: none
    }

    .col-xl-12 {
        width: 100%
    }

    .col-xl-11 {
        width: 91.66666667%
    }

    .col-xl-10 {
        width: 83.33333333%
    }

    .col-xl-9 {
        width: 75%
    }

    .col-xl-8 {
        width: 66.66666667%
    }

    .col-xl-7 {
        width: 58.33333333%
    }

    .col-xl-6 {
        width: 50%
    }

    .col-xl-5 {
        width: 41.66666667%
    }

    .col-xl-4 {
        width: 33.33333333%
    }

    .col-xl-3 {
        width: 25%
    }

    .col-xl-2 {
        width: 16.66666667%
    }

    .col-xl-1 {
        width: 8.33333333%
    }

    .hide-xl {
        display: none !important
    }

    .show-xl {
        display: block !important
    }
}

@media (max-width:960px) {

    .col-lg-1,
    .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-lg-10,
    .col-lg-11,
    .col-lg-12 {
        flex: none
    }

    .col-lg-12 {
        width: 100%
    }

    .col-lg-11 {
        width: 91.66666667%
    }

    .col-lg-10 {
        width: 83.33333333%
    }

    .col-lg-9 {
        width: 75%
    }

    .col-lg-8 {
        width: 66.66666667%
    }

    .col-lg-7 {
        width: 58.33333333%
    }

    .col-lg-6 {
        width: 50%
    }

    .col-lg-5 {
        width: 41.66666667%
    }

    .col-lg-4 {
        width: 33.33333333%
    }

    .col-lg-3 {
        width: 25%
    }

    .col-lg-2 {
        width: 16.66666667%
    }

    .col-lg-1 {
        width: 8.33333333%
    }

    .hide-lg {
        display: none !important
    }

    .show-lg {
        display: block !important
    }
}

@media (max-width:840px) {

    .col-md-1,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-md-10,
    .col-md-11,
    .col-md-12 {
        flex: none
    }

    .col-md-12 {
        width: 100%
    }

    .col-md-11 {
        width: 91.66666667%
    }

    .col-md-10 {
        width: 83.33333333%
    }

    .col-md-9 {
        width: 75%
    }

    .col-md-8 {
        width: 66.66666667%
    }

    .col-md-7 {
        width: 58.33333333%
    }

    .col-md-6 {
        width: 50%
    }

    .col-md-5 {
        width: 41.66666667%
    }

    .col-md-4 {
        width: 33.33333333%
    }

    .col-md-3 {
        width: 25%
    }

    .col-md-2 {
        width: 16.66666667%
    }

    .col-md-1 {
        width: 8.33333333%
    }

    .hide-md {
        display: none !important
    }

    .show-md {
        display: block !important
    }
}

@media (max-width:600px) {

    .col-sm-1,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12 {
        flex: none
    }

    .col-sm-12 {
        width: 100%
    }

    .col-sm-11 {
        width: 91.66666667%
    }

    .col-sm-10 {
        width: 83.33333333%
    }

    .col-sm-9 {
        width: 75%
    }

    .col-sm-8 {
        width: 66.66666667%
    }

    .col-sm-7 {
        width: 58.33333333%
    }

    .col-sm-6 {
        width: 50%
    }

    .col-sm-5 {
        width: 41.66666667%
    }

    .col-sm-4 {
        width: 33.33333333%
    }

    .col-sm-3 {
        width: 25%
    }

    .col-sm-2 {
        width: 16.66666667%
    }

    .col-sm-1 {
        width: 8.33333333%
    }

    .hide-sm {
        display: none !important
    }

    .show-sm {
        display: block !important
    }
}

@media (max-width:480px) {

    .col-xs-1,
    .col-xs-2,
    .col-xs-3,
    .col-xs-4,
    .col-xs-5,
    .col-xs-6,
    .col-xs-7,
    .col-xs-8,
    .col-xs-9,
    .col-xs-10,
    .col-xs-11,
    .col-xs-12 {
        flex: none
    }

    .col-xs-12 {
        width: 100%
    }

    .col-xs-11 {
        width: 91.66666667%
    }

    .col-xs-10 {
        width: 83.33333333%
    }

    .col-xs-9 {
        width: 75%
    }

    .col-xs-8 {
        width: 66.66666667%
    }

    .col-xs-7 {
        width: 58.33333333%
    }

    .col-xs-6 {
        width: 50%
    }

    .col-xs-5 {
        width: 41.66666667%
    }

    .col-xs-4 {
        width: 33.33333333%
    }

    .col-xs-3 {
        width: 25%
    }

    .col-xs-2 {
        width: 16.66666667%
    }

    .col-xs-1 {
        width: 8.33333333%
    }

    .hide-xs {
        display: none !important
    }

    .show-xs {
        display: block !important
    }
}

.navbar {
    align-items: stretch;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.navbar .navbar-section {
    align-items: center;
    display: flex;
    flex: 1 0 0
}

.navbar .navbar-section:not(:first-child):last-child {
    justify-content: flex-end
}

.navbar .navbar-center {
    align-items: center;
    display: flex;
    flex: 0 0 auto
}

.navbar .navbar-brand {
    font-size: .9rem;
    font-weight: 500;
    text-decoration: none
}

.version:after {
    content: "0.5.1"
}

.off-canvas .off-canvas-toggle {
    font-size: 1rem;
    left: 1.5rem;
    position: fixed;
    top: 1rem
}

.off-canvas .off-canvas-sidebar {
    width: 12rem
}

.docs-navbar {
    height: 3.8rem;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 100
}

.docs-navbar .btn {
    position: absolute;
    right: 1.5rem;
    top: 1rem
}

.docs-sidebar .docs-nav {
    bottom: 1.5rem;
    overflow-y: auto;
    padding: .5rem 1.5rem;
    position: fixed;
    top: 3.5rem;
    width: 12rem;
    -webkit-overflow-scrolling: touch
}

.docs-sidebar .accordion {
    margin-bottom: .75rem
}

.docs-sidebar .accordion input~.accordion-header {
    color: #6e6e6e;
    font-size: .65rem;
    font-weight: 600;
    text-transform: uppercase
}

.docs-sidebar .accordion input:checked~.accordion-header {
    color: #7a7a7a
}

.docs-sidebar .accordion .menu .menu-item {
    font-size: .7rem;
    padding-left: 1rem
}

.docs-sidebar .accordion .menu .menu-item>a {
    background: transparent;
    color: #7a7a7a;
    display: inline-block
}

.docs-content {
    flex: 1 1 auto;
    width: calc(100vw - 12rem)
}

.docs-content.off-canvas-content {
    padding: 0 4rem
}

.docs-content>.container {
    margin-left: 0;
    max-width: 800px;
    padding-bottom: 1.5rem
}

.docs-content .anchor {
    color: #e2f8fe;
    height: 0;
    margin-left: -2em;
    overflow: hidden;
    padding: 0 1em;
    position: absolute;
    text-align: center;
    width: 0;
    z-index: 100
}

.docs-content .anchor:focus,
.docs-content .anchor:hover {
    box-shadow: none;
    height: auto;
    text-decoration: none;
    width: 2em
}

.docs-content .s-subtitle,
.docs-content .s-title {
    color: #4f4f4f;
    line-height: 1.8rem;
    margin-bottom: 0;
    padding-bottom: 1rem;
    padding-top: 1rem;
    position: static
}

@supports (position:sticky) {

    .docs-content .s-subtitle,
    .docs-content .s-title {
        position: sticky;
        top: 0;
        z-index: 100
    }

    .docs-content .s-subtitle:before,
    .docs-content .s-title:before {
        background: #fff;
        bottom: 0;
        content: "";
        display: block;
        left: -10px;
        position: absolute;
        right: -10px;
        top: -5px;
        z-index: -1
    }
}

.docs-content .s-subtitle:hover .anchor,
.docs-content .s-title:hover .anchor {
    height: auto;
    width: 1em
}

.docs-content .s-subtitle+.docs-note,
.docs-content .s-title+.docs-note {
    margin-top: .4rem
}

.docs-content .docs-note {
    margin: 1.5rem 0
}

.docs-content .docs-ad {
    background: #fff;
    border-radius: .1rem;
    display: inline-block;
    padding: .4rem;
    position: relative
}

.docs-content .docs-ad:before {
    color: #bababa;
    content: "AD";
    font-size: .7rem;
    position: absolute;
    right: .4rem;
    top: .1rem
}

.docs-content .docs-ad.docs-ad-sidebar:before {
    content: none
}

.docs-content .carbon-wrap .carbon-img {
    display: block
}

.docs-content .carbon-wrap .carbon-text {
    color: #7a7a7a;
    display: block;
    font-size: .7rem
}

.docs-content .carbon-poweredby {
    color: #bababa;
    font-size: .7rem
}

.docs-content .column {
    padding: .4rem
}

.docs-content .docs-block {
    border-radius: .1rem;
    padding: .4rem
}

.docs-content .docs-block.bg-gray {
    background: #f7f7f7
}

.docs-content .docs-shape {
    height: 4.8rem;
    line-height: 1.2rem;
    padding: 1.8rem 0;
    width: 4.8rem
}

.docs-content .docs-dot {
    border-radius: 50%;
    display: inline-block;
    height: .5rem;
    padding: 0;
    width: .5rem
}

.docs-content .docs-table td,
.docs-content .docs-table th {
    padding: .75rem .25rem
}

.docs-content .docs-color {
    border-radius: .1rem;
    margin: .25rem 0;
    padding: .5rem
}

.docs-content .docs-color .color-subtitle {
    font-size: .7rem;
    opacity: .75
}

.docs-content .code {
    color: #7a7a7a
}

.docs-content .code .com {
    color: #bababa
}

.docs-content .code .tag {
    color: #3498db
}

.docs-content .code .atn {
    color: #7a7a7a
}

.docs-content .code .atv {
    color: #e06870
}

.docs-content .code[data-lang=Bash] .tag {
    margin-right: 1em;
    user-select: none
}

.docs-content .panel {
    height: 75vh
}

.docs-content .panel .tile {
    margin: .75rem 0
}

.docs-content .parallax {
    margin: 2rem auto
}

.docs-content .form-autocomplete .menu {
    position: static
}

.docs-content .example-tile-icon {
    align-content: space-around;
    align-items: center;
    background: #3498db;
    border-radius: .1rem;
    color: #fff;
    display: flex;
    font-size: 1.2rem;
    height: 2rem;
    width: 2rem
}

.docs-content .example-tile-icon .icon {
    margin: auto
}

.docs-content .comparison-slider {
    height: auto;
    padding-bottom: 56.2222%
}

.docs-content .comparison-slider .filter-grayscale {
    filter: grayscale(75%)
}

.docs-content .off-canvas {
    position: relative
}

.docs-content .off-canvas .off-canvas-toggle {
    left: .4rem;
    position: absolute;
    top: .4rem;
    z-index: 1
}

.docs-brand {
    color: #3498db;
    left: 1.5rem;
    position: fixed;
    top: .85rem
}

.docs-brand .docs-logo {
    align-items: center;
    border-radius: .1rem;
    display: inline-flex;
    height: 2rem;
    padding: .2rem;
    width: auto
}

.docs-brand .docs-logo:focus,
.docs-brand .docs-logo:hover {
    text-decoration: none
}

.docs-brand .docs-logo img {
    display: inline;
    height: auto;
    width: 1.6rem
}

.docs-brand .docs-logo h2 {
    display: inline;
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.5rem;
    margin-bottom: 0;
    margin-left: .5rem;
    margin-right: .5rem
}

.docs-footer {
    color: #bababa;
    padding: .5rem .5rem 1.5rem
}

.docs-footer a {
    color: #7a7a7a
}

.btn .feather {
    height: 1rem;
    vertical-align: middle
}

.section-hero {
    padding: 1rem .5rem
}

.section-hero .docs-brand {
    position: absolute;
    top: .85rem
}

.section-hero .docs-brand h2 {
    color: #3498db
}

.section-hero .column {
    padding: .4rem
}

.section-updates {
    padding: 4.5rem .5rem 3.5rem
}

.section-updates .card {
    border: 0;
    color: #878787;
    margin-bottom: 1rem
}

.section-features {
    padding: 4.5rem .5rem
}

.section-features .column {
    padding: .4rem
}

.section-footer {
    color: #bababa;
    padding: 1.8rem .75rem 1rem;
    position: relative;
    z-index: 200
}

.section-footer a {
    color: #7a7a7a
}

.grid-hero {
    padding-bottom: 2rem;
    padding-top: 6rem
}

.grid-hero h1 {
    color: #616161;
    font-size: 1.6rem;
    margin-bottom: 1.5rem
}

.grid-hero h2 {
    color: #6e6e6e;
    font-size: .9rem;
    font-weight: 400;
    line-height: 1.5rem;
    margin-bottom: 1.5rem
}

.grid-hero h2 u {
    border-bottom: .1rem solid;
    padding-bottom: .05rem;
    text-decoration: none
}

.grid-hero .card {
    background: none;
    border: 0;
    color: #878787;
    padding: .5rem
}

.grid-hero .card .card-title {
    color: #3498db;
    font-size: .9rem;
    margin-bottom: 0
}

@media (max-width:960px) {
    .off-canvas .off-canvas-toggle {
        z-index: 300
    }

    .docs-sidebar .docs-brand {
        margin: .85rem 1.5rem;
        padding: 0;
        position: static
    }

    .docs-sidebar .docs-nav {
        margin-top: 1rem;
        position: static
    }

    .docs-sidebar .menu .menu-item>a {
        padding: .3rem .4rem
    }

    .docs-navbar {
        backdrop-filter: blur(5px);
        background: hsla(0, 0%, 100%, .65);
        left: 0
    }

    .docs-content.off-canvas-content {
        min-width: auto;
        padding: 0 1.5rem;
        width: 100%
    }

    .docs-content .s-subtitle,
    .docs-content .s-title {
        padding-top: 5rem;
        position: static
    }

    .docs-content .s-subtitle:before,
    .docs-content .s-title:before {
        content: none
    }

    .section-hero .s-brand {
        height: 5rem;
        padding: 1.5rem .5rem;
        text-align: center;
        width: 100%
    }

    .section-hero .s-brand .s-logo {
        height: auto
    }

    .section-hero .s-brand img {
        height: 3.2rem;
        width: 3.2rem
    }

    .section-hero .s-brand h2 {
        display: none
    }
}

@media (max-width:600px) {
    .grid-hero h2 {
        font-size: .9rem
    }

    .grid-hero .card {
        padding: 0
    }

    .off-canvas .off-canvas-toggle {
        left: .5rem
    }

    .docs-navbar .btn {
        right: 1rem
    }

    .grid-hero .docs-brand {
        left: 1rem
    }

    .docs-sidebar .docs-brand {
        margin: .85rem 1rem
    }

    .docs-sidebar .docs-nav {
        padding: .5rem 1rem
    }

    .docs-content.off-canvas-content {
        padding: 0 .5rem
    }

    .docs-content .docs-block {
        padding: .4rem .1rem
    }

    .docs-content .anchor {
        display: none
    }
}

@media (min-width:1366px) {
    .docs-ad.docs-ad-sidebar {
        bottom: 1rem;
        position: fixed;
        right: 1rem;
        width: 7.3rem
    }
}

.accordion[open] .accordion-header .icon,
.accordion input:checked~.accordion-header .icon {
    transform: rotate(90deg)
}

.accordion[open] .accordion-body,
.accordion input:checked~.accordion-body {
    max-height: 50rem
}

.accordion .accordion-header {
    display: block;
    padding: .2rem .4rem
}

.accordion .accordion-header .icon {
    transition: all .2s ease
}

.accordion .accordion-body {
    margin-bottom: .4rem;
    max-height: 0;
    overflow: hidden;
    transition: max-height .2s ease
}

summary.accordion-header::-webkit-details-marker {
    display: none
}

.form-autocomplete {
    position: relative
}

.form-autocomplete .form-autocomplete-input {
    align-content: flex-start;
    display: flex;
    flex-wrap: wrap;
    height: auto;
    min-height: 1.6rem;
    padding: .1rem
}

.form-autocomplete .form-autocomplete-input.is-focused {
    box-shadow: 0 0 0 .1rem rgba(214, 234, 248, 0);
    border-color: #3498db
}

.form-autocomplete .form-autocomplete-input .form-input {
    border-color: transparent;
    box-shadow: none;
    display: inline-block;
    flex: 1 0 auto;
    height: 1.2rem;
    line-height: .8rem;
    margin: .1rem;
    width: auto
}

.form-autocomplete .menu {
    left: 0;
    position: absolute;
    top: 100%;
    width: 100%
}

.avatar {
    font-size: .8rem;
    height: 1.6rem;
    width: 1.6rem;
    background: #3498db;
    border-radius: 50%;
    color: hsla(0, 0%, 100%, .85);
    display: inline-block;
    font-weight: 300;
    line-height: 1.25;
    margin: 0;
    position: relative;
    vertical-align: middle
}

.avatar.avatar-xs {
    font-size: .4rem;
    height: .8rem;
    width: .8rem
}

.avatar.avatar-sm {
    font-size: .6rem;
    height: 1.2rem;
    width: 1.2rem
}

.avatar.avatar-md {
    font-size: 1rem;
    height: 2rem;
    width: 2rem
}

.avatar.avatar-lg {
    font-size: 1.2rem;
    height: 2.4rem;
    width: 2.4rem
}

.avatar.avatar-xl {
    font-size: 1.6rem;
    height: 3.2rem;
    width: 3.2rem
}

.avatar.avatar-xxl {
    font-size: 3rem;
    height: 6rem;
    width: 6rem
}

.avatar img,
.avatar object {
    border-radius: 50%;
    height: 100%;
    position: relative;
    width: 100%;
    z-index: 1
}

.avatar .avatar-icon,
.avatar .avatar-presence {
    background: #fff;
    bottom: 14.64%;
    height: 50%;
    padding: .1rem;
    position: absolute;
    right: 14.64%;
    transform: translate(50%, 50%);
    width: 50%;
    z-index: 2
}

.avatar .avatar-presence {
    background: #bababa;
    box-shadow: 0 0 0 .1rem #fff;
    border-radius: 50%;
    height: .5em;
    width: .5em
}

.avatar .avatar-presence.online {
    background: #2ecc71
}

.avatar .avatar-presence.busy {
    background: #e74c3c
}

.avatar .avatar-presence.away {
    background: #f1c40f
}

.avatar[data-initial]:before {
    color: currentColor;
    content: attr(data-initial);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1
}

.badge {
    position: relative;
    white-space: nowrap
}

.badge:not([data-badge]):after,
.badge[data-badge]:after {
    background: #3498db;
    background-clip: padding-box;
    border-radius: .5rem;
    box-shadow: 0 0 0 .1rem #fff;
    color: #fff;
    content: attr(data-badge);
    display: inline-block;
    transform: translate(-.1rem, -.5rem)
}

.badge[data-badge]:after {
    font-size: .7rem;
    height: .9rem;
    line-height: 1;
    min-width: .9rem;
    padding: .1rem .2rem;
    text-align: center;
    white-space: nowrap
}

.badge:not([data-badge]):after,
.badge[data-badge=""]:after {
    height: 6px;
    min-width: 6px;
    padding: 0;
    width: 6px
}

.badge.btn:after {
    top: 0;
    right: 0
}

.badge.avatar:after,
.badge.btn:after {
    position: absolute;
    transform: translate(50%, -50%)
}

.badge.avatar:after {
    top: 14.64%;
    right: 14.64%;
    z-index: 100
}

.badge.avatar-xs:after {
    content: "";
    height: .4rem;
    min-width: .4rem;
    padding: 0;
    width: .4rem
}

.breadcrumb {
    list-style: none;
    margin: .2rem 0;
    padding: .2rem 0
}

.breadcrumb .breadcrumb-item {
    color: #7a7a7a;
    display: inline-block;
    margin: 0;
    padding: .2rem 0
}

.breadcrumb .breadcrumb-item:not(:last-child) {
    margin-right: .2rem
}

.breadcrumb .breadcrumb-item:not(:last-child) a {
    color: #7a7a7a
}

.breadcrumb .breadcrumb-item:not(:first-child):before {
    color: #ededed;
    content: "/";
    padding-right: .4rem
}

.bar {
    background: #f7f7f7;
    border-radius: .1rem;
    display: flex;
    flex-wrap: nowrap;
    height: .8rem;
    width: 100%
}

.bar.bar-sm {
    height: .2rem
}

.bar .bar-item {
    background: #3498db;
    color: #fff;
    display: block;
    font-size: .7rem;
    flex-shrink: 0;
    line-height: .8rem;
    height: 100%;
    position: relative;
    text-align: center;
    width: 0
}

.bar .bar-item:first-child {
    border-bottom-left-radius: .1rem;
    border-top-left-radius: .1rem
}

.bar .bar-item:last-child {
    border-bottom-right-radius: .1rem;
    border-top-right-radius: .1rem;
    flex-shrink: 1
}

.bar-slider {
    height: .1rem;
    margin: .4rem 0;
    position: relative
}

.bar-slider .bar-item {
    left: 0;
    padding: 0;
    position: absolute
}

.bar-slider .bar-item:not(:last-child):first-child {
    background: #f7f7f7;
    z-index: 1
}

.bar-slider .bar-slider-btn {
    background: #3498db;
    border: 0;
    border-radius: 50%;
    height: .6rem;
    padding: 0;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(50%, -50%);
    width: .6rem
}

.bar-slider .bar-slider-btn:active {
    box-shadow: 0 0 0 .1rem #3498db
}

.card {
    background: #fff;
    border: .05rem solid #dcdde1;
    border-radius: .1rem;
    display: flex;
    flex-direction: column
}

.card .card-body,
.card .card-footer,
.card .card-header {
    padding: .8rem .8rem 0
}

.card .card-body:last-child,
.card .card-footer:last-child,
.card .card-header:last-child {
    padding-bottom: .8rem
}

.card .card-image {
    padding-top: .8rem
}

.card .card-image:first-child {
    padding-top: 0
}

.card .card-image:first-child img {
    border-top-left-radius: .1rem;
    border-top-right-radius: .1rem
}

.card .card-image:last-child img {
    border-bottom-left-radius: .1rem;
    border-bottom-right-radius: .1rem
}

.chip {
    align-items: center;
    background: #f7f7f7;
    border-radius: 5rem;
    color: #7a7a7a;
    display: inline-flex;
    font-size: 90%;
    height: 1.2rem;
    line-height: .8rem;
    margin: .1rem;
    max-width: 100%;
    padding: .2rem .4rem;
    text-decoration: none;
    vertical-align: middle
}

.chip.active {
    background: #3498db;
    color: #fff
}

.chip .avatar {
    margin-left: -.4rem;
    margin-right: .2rem
}

.dropdown {
    display: inline-block;
    position: relative
}

.dropdown .menu {
    animation: slide-down .15s ease 1;
    display: none;
    left: 0;
    max-height: 50vh;
    overflow-y: auto;
    position: absolute;
    top: 100%
}

.dropdown.dropdown-right .menu {
    left: auto;
    right: 0
}

.dropdown.dropdown-top .menu {
    top: -149px
}

.dropdown.active .menu,
.dropdown .dropdown-toggle:focus+.menu,
.dropdown .menu:hover {
    display: block
}

.dropdown .btn-group .dropdown-toggle:nth-last-child(2) {
    border-bottom-right-radius: .1rem;
    border-top-right-radius: .1rem
}

.empty {
    border-radius: .1rem;
    color: #7a7a7a;
    text-align: center;
    padding: 3.2rem 1.6rem
}

.empty .empty-icon {
    margin-bottom: .8rem
}

.empty .empty-subtitle,
.empty .empty-title {
    margin: .4rem auto
}

.empty .empty-action {
    margin-top: .8rem
}

.menu {
    box-shadow: 0 .05rem .2rem rgba(84, 84, 84, .3);
    background: #fff;
    border-radius: .1rem;
    list-style: none;
    margin: 0;
    min-width: 180px;
    padding: .4rem;
    transform: translateY(.2rem);
    z-index: 100
}

.menu.menu-nav {
    background: transparent;
    box-shadow: none
}

.menu .menu-item {
    margin-top: 0;
    padding: 0 .4rem;
    text-decoration: none;
    user-select: none
}

.menu .menu-item>a {
    border-radius: .1rem;
    color: inherit;
    display: block;
    margin: 0 -.4rem;
    padding: .2rem .4rem;
    text-decoration: none
}

.menu .menu-item>a.active,
.menu .menu-item>a:active,
.menu .menu-item>a:focus,
.menu .menu-item>a:hover {
    background: #ededed;
    color: #3498db
}

.menu .menu-item+.menu-item {
    margin-top: .2rem
}

.menu .menu-badge {
    float: right;
    padding: .2rem 0
}

.menu .menu-badge .btn {
    margin-top: -.1rem
}

.modal {
    align-items: center;
    bottom: 0;
    display: none;
    justify-content: center;
    left: 0;
    opacity: 0;
    overflow: hidden;
    padding: .4rem;
    position: fixed;
    right: 0;
    top: 0
}

.modal.active,
.modal:target {
    display: flex;
    opacity: 1;
    z-index: 400
}

.modal.active .modal-overlay,
.modal:target .modal-overlay {
    background: hsla(0, 0%, 100%, .75);
    bottom: 0;
    cursor: default;
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.modal.active .modal-container,
.modal:target .modal-container {
    animation: slide-down .2s ease 1;
    max-width: 640px;
    width: 100%;
    z-index: 1
}

.modal.modal-sm .modal-container {
    max-width: 320px;
    padding: 0 .4rem
}

.modal.modal-lg .modal-overlay {
    background: #fff
}

.modal.modal-lg .modal-container {
    box-shadow: none;
    max-width: 960px
}

.modal-container {
    box-shadow: 0 .2rem .5rem rgba(84, 84, 84, .3);
    background: #fff;
    border-radius: .1rem;
    display: block;
    padding: 0 .8rem;
    text-align: left
}

.modal-container .modal-header {
    padding: .8rem
}

.modal-container .modal-body {
    max-height: 75vh;
    overflow-y: auto;
    padding: .8rem;
    position: relative
}

.modal-container .modal-footer {
    padding: .8rem;
    text-align: right
}

.nav {
    display: flex;
    flex-direction: column;
    list-style: none;
    margin: .2rem 0
}

.nav .nav-item a {
    color: #7a7a7a;
    padding: .2rem .4rem;
    text-decoration: none
}

.nav .nav-item a:focus,
.nav .nav-item a:hover {
    color: #3498db
}

.nav .nav-item.active>a {
    color: #616161;
    font-weight: 700
}

.nav .nav-item.active>a:focus,
.nav .nav-item.active>a:hover {
    color: #3498db
}

.nav .nav {
    margin-bottom: .4rem;
    margin-left: .8rem
}

.pagination {
    display: flex;
    list-style: none;
    margin: .2rem 0;
    padding: .2rem 0
}

.pagination .page-item {
    margin: .2rem .05rem
}

.pagination .page-item span {
    display: inline-block;
    padding: .2rem
}

.pagination .page-item a {
    border-radius: .1rem;
    color: #7a7a7a;
    display: inline-block;
    padding: .2rem .4rem;
    text-decoration: none
}

.pagination .page-item a:focus,
.pagination .page-item a:hover {
    color: #3498db
}

.pagination .page-item.disabled a {
    cursor: default;
    opacity: .5;
    pointer-events: none
}

.pagination .page-item.active a {
    background: #3498db;
    color: #fff
}

.pagination .page-item.page-next,
.pagination .page-item.page-prev {
    flex: 1 0 50%
}

.pagination .page-item.page-next {
    text-align: right
}

.pagination .page-item .page-item-title {
    margin: 0
}

.pagination .page-item .page-item-subtitle {
    margin: 0;
    opacity: .5
}

.panel {
    border: .05rem solid #dcdde1;
    border-radius: .1rem;
    display: flex;
    flex-direction: column
}

.panel .panel-footer,
.panel .panel-header {
    flex: 0 0 auto;
    padding: .8rem
}

.panel .panel-nav {
    flex: 0 0 auto
}

.panel .panel-body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 0 .8rem
}

.popover {
    display: inline-block;
    position: relative
}

.popover .popover-container {
    left: 50%;
    opacity: 0;
    padding: .4rem;
    position: absolute;
    top: 0;
    transform: translate(-50%, -50%) scale(0);
    transition: transform .2s ease;
    width: 320px;
    z-index: 400
}

.popover .popover-container:hover,
.popover :focus+.popover-container,
.popover:hover .popover-container {
    display: block;
    opacity: 1;
    transform: translate(-50%, -100%) scale(1)
}

.popover.popover-right .popover-container {
    left: 100%;
    top: 50%
}

.popover.popover-right .popover-container:hover,
.popover.popover-right :focus+.popover-container,
.popover.popover-right:hover .popover-container {
    transform: translateY(-50%) scale(1)
}

.popover.popover-bottom .popover-container {
    left: 50%;
    top: 100%
}

.popover.popover-bottom .popover-container:hover,
.popover.popover-bottom :focus+.popover-container,
.popover.popover-bottom:hover .popover-container {
    transform: translate(-50%) scale(1)
}

.popover.popover-left .popover-container {
    left: 0;
    top: 50%
}

.popover.popover-left .popover-container:hover,
.popover.popover-left :focus+.popover-container,
.popover.popover-left:hover .popover-container {
    transform: translate(-100%, -50%) scale(1)
}

.popover .card {
    box-shadow: 0 .2rem .5rem rgba(84, 84, 84, .3);
    border: 0
}

.step {
    display: flex;
    flex-wrap: nowrap;
    list-style: none;
    margin: .2rem 0;
    width: 100%
}

.step .step-item {
    flex: 1 1 0;
    margin-top: 0;
    min-height: 1rem;
    text-align: center;
    position: relative
}

.step .step-item:not(:first-child):before {
    background: #3498db;
    content: "";
    height: 2px;
    left: -50%;
    position: absolute;
    top: 9px;
    width: 100%
}

.step .step-item a {
    color: #bababa;
    display: inline-block;
    padding: 20px 10px 0;
    text-decoration: none
}

.step .step-item a:before {
    background: #3498db;
    border: .1rem solid #fff;
    border-radius: 50%;
    content: "";
    display: block;
    height: .6rem;
    left: 50%;
    position: absolute;
    top: .2rem;
    transform: translateX(-50%);
    width: .6rem;
    z-index: 1
}

.step .step-item.active a:before {
    background: #fff;
    border: .1rem solid #3498db
}

.step .step-item.active~.step-item:before {
    background: #dcdde1
}

.step .step-item.active~.step-item a:before {
    background: #ededed
}

.tab {
    align-items: center;
    border-bottom: .05rem solid #dcdde1;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin: .2rem 0 .15rem
}

.tab .tab-item {
    margin-top: 0
}

.tab .tab-item a {
    border-bottom: .1rem solid transparent;
    color: inherit;
    display: block;
    margin: 0 .4rem 0 0;
    padding: .4rem .2rem .3rem;
    text-decoration: none
}

.tab .tab-item a:focus,
.tab .tab-item a:hover {
    color: #3498db
}

.tab .tab-item.active a,
.tab .tab-item a.active {
    border-bottom-color: #3498db;
    color: #3498db
}

.tab .tab-item.tab-action {
    flex: 1 0 auto;
    text-align: right
}

.tab .tab-item .btn-clear {
    margin-top: -.2rem
}

.tab.tab-block .tab-item {
    flex: 1 0 0;
    text-align: center
}

.tab.tab-block .tab-item a {
    margin: 0
}

.tab.tab-block .tab-item .badge[data-badge]:after {
    position: absolute;
    right: .1rem;
    top: .1rem;
    transform: translate(0)
}

.tab:not(.tab-block) .badge {
    padding-right: 0
}

.tile {
    align-content: space-between;
    align-items: flex-start;
    display: flex
}

.tile .tile-action,
.tile .tile-icon {
    flex: 0 0 auto
}

.tile .tile-content {
    flex: 1 1 auto
}

.tile .tile-content:not(:first-child) {
    padding-left: .4rem
}

.tile .tile-content:not(:last-child) {
    padding-right: .4rem
}

.tile .tile-subtitle,
.tile .tile-title {
    line-height: 1rem
}

.tile.tile-centered {
    align-items: center
}

.tile.tile-centered .tile-content {
    overflow: hidden
}

.tile.tile-centered .tile-subtitle,
.tile.tile-centered .tile-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 0
}

.toast {
    background: rgba(84, 84, 84, .9);
    border: .05rem solid #545454;
    border-radius: .1rem;
    display: block;
    padding: .4rem;
    width: 100%
}

.toast.toast-primary {
    background: rgba(52, 152, 219, .9);
    border-color: #3498db
}

.toast.toast-success {
    background: rgba(46, 204, 113, .9);
    border-color: #2ecc71
}

.toast.toast-warning {
    background: rgba(241, 196, 15, .9);
    border-color: #f1c40f
}

.toast.toast-error {
    background: rgba(231, 76, 60, .9);
    border-color: #e74c3c
}

.toast a {
    color: #fff;
    text-decoration: underline
}

.toast a.active,
.toast a:active,
.toast a:focus,
.toast a:hover {
    opacity: .75
}

.toast .btn-clear {
    margin: 4px -2px 4px 4px
}

.tooltip {
    position: relative
}

.tooltip:after {
    background: rgba(84, 84, 84, .9);
    border-radius: .1rem;
    bottom: 100%;
    color: #fff;
    content: attr(data-tooltip);
    display: block;
    font-size: .7rem;
    left: 50%;
    max-width: 320px;
    opacity: 0;
    overflow: hidden;
    padding: .2rem .4rem;
    pointer-events: none;
    position: absolute;
    text-overflow: ellipsis;
    transform: translate(-50%, .4rem);
    transition: all .2s ease;
    white-space: pre;
    z-index: 300
}

.tooltip:focus:after,
.tooltip:hover:after {
    opacity: 1;
    transform: translate(-50%, -.2rem)
}

.tooltip.disabled,
.tooltip[disabled] {
    pointer-events: auto
}

.tooltip.tooltip-right:after {
    bottom: 50%;
    left: 100%;
    transform: translate(-.2rem, 50%)
}

.tooltip.tooltip-right:focus:after,
.tooltip.tooltip-right:hover:after {
    transform: translate(.2rem, 50%)
}

.tooltip.tooltip-bottom:after {
    bottom: auto;
    top: 100%;
    transform: translate(-50%, -.4rem)
}

.tooltip.tooltip-bottom:focus:after,
.tooltip.tooltip-bottom:hover:after {
    transform: translate(-50%, .2rem)
}

.tooltip.tooltip-left:after {
    bottom: 50%;
    left: auto;
    right: 100%;
    transform: translate(.4rem, 50%)
}

.tooltip.tooltip-left:focus:after,
.tooltip.tooltip-left:hover:after {
    transform: translate(-.2rem, 50%)
}

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

    to {
        transform: rotate(1turn)
    }
}

@keyframes slide-down {
    0% {
        opacity: 0;
        transform: translateY(-1.6rem)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.text-primary {
    color: #3498db
}

a.text-primary:focus,
a.text-primary:hover {
    color: #258cd1
}

.text-primary-light {
    color: #e2f8fe
}

a.text-primary-light:focus,
a.text-primary-light:hover {
    color: #c9f2fd
}

.text-dark-color-intense-light {
    color: #454559
}

a.text-dark-color-intense-light:focus,
a.text-dark-color-intense-light:hover {
    color: #3a3a4b
}

.text-secondary {
    color: #c9e4f6
}

a.text-secondary:focus,
a.text-secondary:hover {
    color: #b4d9f2
}

.text-gray {
    color: #bababa
}

a.text-gray:focus,
a.text-gray:hover {
    color: #adadad
}

.text-light {
    color: #fff
}

a.text-light:focus,
a.text-light:hover {
    color: #f2f2f2
}

.text-success {
    color: #2ecc71
}

a.text-success:focus,
a.text-success:hover {
    color: #29b765
}

.text-warning {
    color: #f1c40f
}

a.text-warning:focus,
a.text-warning:hover {
    color: #dab10d
}

.text-error {
    color: #e74c3c
}

a.text-error:focus,
a.text-error:hover {
    color: #e43725
}

.bg-primary {
    background: #3498db;
    color: #fff
}

.bg-secondary {
    background: #d6eaf8
}

.bg-dark {
    background: #545454;
    color: #fff
}

.bg-gray {
    background: #fff
}

.bg-success {
    background: #2ecc71;
    color: #fff
}

.bg-warning {
    background: #f1c40f;
    color: #fff
}

.bg-error {
    background: #e74c3c;
    color: #fff
}

.c-hand {
    cursor: pointer
}

.c-move {
    cursor: move
}

.c-zoom-in {
    cursor: zoom-in
}

.c-zoom-out {
    cursor: zoom-out
}

.c-not-allowed {
    cursor: not-allowed
}

.c-auto {
    cursor: auto
}

.d-block {
    display: block
}

.d-inline {
    display: inline
}

.d-inline-block {
    display: inline-block
}

.d-flex {
    display: flex
}

.d-inline-flex {
    display: inline-flex
}

.d-hide,
.d-none {
    display: none !important
}

.d-visible {
    visibility: visible
}

.d-invisible {
    visibility: hidden
}

.text-hide {
    background: transparent;
    border: 0;
    color: transparent;
    font-size: 0;
    line-height: 0;
    text-shadow: none
}

.text-assistive {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.divider,
.divider-vert {
    display: block;
    position: relative
}

.divider-vert[data-content]:after,
.divider[data-content]:after {
    background: #fff;
    color: #bababa;
    content: attr(data-content);
    display: inline-block;
    font-size: .7rem;
    padding: 0 .4rem;
    transform: translateY(-.65rem)
}

.divider {
    border-top: .05rem solid #dcdde1;
    height: .05rem;
    margin: .4rem 0
}

.divider[data-content] {
    margin: .8rem 0
}

.divider-vert {
    display: block;
    padding: .8rem
}

.divider-vert:before {
    border-left: .05rem solid #dcdde1;
    bottom: .4rem;
    content: "";
    display: block;
    left: 50%;
    position: absolute;
    top: .4rem;
    transform: translateX(-50%)
}

.divider-vert[data-content]:after {
    left: 50%;
    padding: .2rem 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%)
}

.loading {
    color: transparent !important;
    min-height: .8rem;
    pointer-events: none;
    position: relative
}

.loading:after {
    animation: loading .5s linear infinite;
    border-radius: 50%;
    border-color: transparent transparent #3498db #3498db;
    border-style: solid;
    border-width: .1rem;
    content: "";
    display: block;
    height: .8rem;
    left: 50%;
    margin-left: -.4rem;
    margin-top: -.4rem;
    position: absolute;
    top: 50%;
    width: .8rem;
    z-index: 1
}

.loading.loading-lg {
    min-height: 2rem
}

.loading.loading-lg:after {
    height: 1.6rem;
    margin-left: -.8rem;
    margin-top: -.8rem;
    width: 1.6rem
}

.clearfix:after,
.container:after {
    clear: both;
    content: "";
    display: table
}

.float-left {
    float: left !important
}

.float-right {
    float: right !important
}

.p-static,
.static {
    position: static
}

.p-relative,
.relative {
    position: relative
}

.absolute,
.p-absolute {
    position: absolute
}

.fixed,
.p-fixed {
    position: fixed
}

.p-sticky,
.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1000
}

.centered,
.p-centered {
    display: block;
    float: none;
    margin-left: auto;
    margin-right: auto
}

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

.m-0 {
    margin: 0
}

.mb-0 {
    margin-bottom: 0
}

.ml-0 {
    margin-left: 0
}

.mr-0 {
    margin-right: 0
}

.mt-0 {
    margin-top: 0
}

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

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

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

.m-1 {
    margin: .2rem
}

.mb-1 {
    margin-bottom: .2rem
}

.ml-1 {
    margin-left: .2rem
}

.mr-1 {
    margin-right: .2rem
}

.mt-1 {
    margin-top: .2rem
}

.mx-1 {
    margin-left: .2rem;
    margin-right: .2rem
}

.my-1 {
    margin-bottom: .2rem;
    margin-top: .2rem
}

.m-2 {
    margin: .4rem
}

.mb-2 {
    margin-bottom: .4rem
}

.ml-2 {
    margin-left: .4rem
}

.mr-2 {
    margin-right: .4rem
}

.mt-2 {
    margin-top: .4rem
}

.mx-2 {
    margin-left: .4rem;
    margin-right: .4rem
}

.my-2 {
    margin-bottom: .4rem;
    margin-top: .4rem
}

.m-3 {
    margin: .6rem
}

.mb-3 {
    margin-bottom: .6rem
}

.ml-3 {
    margin-left: .6rem
}

.mr-3 {
    margin-right: .6rem
}

.mt-3 {
    margin-top: .6rem
}

.mx-3 {
    margin-left: .6rem;
    margin-right: .6rem
}

.my-3 {
    margin-bottom: .6rem;
    margin-top: .6rem
}

.m-4 {
    margin: .8rem
}

.mb-4 {
    margin-bottom: .8rem
}

.ml-4 {
    margin-left: .8rem
}

.mr-4 {
    margin-right: .8rem
}

.mt-4 {
    margin-top: .8rem
}

.mx-4 {
    margin-left: .8rem;
    margin-right: .8rem
}

.my-4 {
    margin-bottom: .8rem;
    margin-top: .8rem
}

.m-10 {
    margin: 2rem
}

.mb-10 {
    margin-bottom: 2rem
}

.ml-10 {
    margin-left: 2rem
}

.mr-10 {
    margin-right: 2rem
}

.mt-10 {
    margin-top: 2rem
}

.mx-10 {
    margin-left: 2rem;
    margin-right: 2rem
}

.my-10 {
    margin-bottom: 2rem;
    margin-top: 2rem
}

.m-16 {
    margin: 3.2rem
}

.mb-16 {
    margin-bottom: 3.2rem
}

.ml-16 {
    margin-left: 3.2rem
}

.mr-16 {
    margin-right: 3.2rem
}

.mt-16 {
    margin-top: 3.2rem
}

.mx-16 {
    margin-left: 3.2rem;
    margin-right: 3.2rem
}

.my-16 {
    margin-bottom: 3.2rem;
    margin-top: 3.2rem
}

.p-0 {
    padding: 0
}

.pb-0 {
    padding-bottom: 0
}

.pl-0 {
    padding-left: 0
}

.pr-0 {
    padding-right: 0
}

.pt-0 {
    padding-top: 0
}

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

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

.p-1 {
    padding: .2rem
}

.pb-1 {
    padding-bottom: .2rem
}

.pl-1 {
    padding-left: .2rem
}

.pr-1 {
    padding-right: .2rem
}

.pt-1 {
    padding-top: .2rem
}

.px-1 {
    padding-left: .2rem;
    padding-right: .2rem
}

.py-1 {
    padding-bottom: .2rem;
    padding-top: .2rem
}

.p-2 {
    padding: .4rem
}

.pb-2 {
    padding-bottom: .4rem
}

.pl-2 {
    padding-left: .4rem
}

.pr-2 {
    padding-right: .4rem
}

.pt-2 {
    padding-top: .4rem
}

.px-2 {
    padding-left: .4rem;
    padding-right: .4rem
}

.py-2 {
    padding-bottom: .4rem;
    padding-top: .4rem
}

.p-3 {
    padding: .6rem
}

.pb-3 {
    padding-bottom: .6rem
}

.pl-3 {
    padding-left: .6rem
}

.pr-3 {
    padding-right: .6rem
}

.pt-3 {
    padding-top: .6rem
}

.px-3 {
    padding-left: .6rem;
    padding-right: .6rem
}

.py-3 {
    padding-bottom: .6rem;
    padding-top: .6rem
}

.p-4 {
    padding: .8rem
}

.pb-4 {
    padding-bottom: .8rem
}

.pl-4 {
    padding-left: .8rem
}

.pr-4 {
    padding-right: .8rem
}

.pt-4 {
    padding-top: .8rem
}

.px-4 {
    padding-left: .8rem;
    padding-right: .8rem
}

.py-4 {
    padding-bottom: .8rem;
    padding-top: .8rem
}

.p-10 {
    padding: 2rem
}

.pb-10 {
    padding-bottom: 2rem
}

.pl-10 {
    padding-left: 2rem
}

.pr-10 {
    padding-right: 2rem
}

.pt-10 {
    padding-top: 2rem
}

.px-10 {
    padding-left: 2rem;
    padding-right: 2rem
}

.py-10 {
    padding-bottom: 2rem;
    padding-top: 2rem
}

.p-16 {
    padding: 3.2rem
}

.pb-16 {
    padding-bottom: 3.2rem
}

.pl-16 {
    padding-left: 3.2rem
}

.pr-16 {
    padding-right: 3.2rem
}

.pt-16 {
    padding-top: 3.2rem
}

.px-16 {
    padding-left: 3.2rem;
    padding-right: 3.2rem
}

.py-16 {
    padding-bottom: 3.2rem;
    padding-top: 3.2rem
}

.rounded,
.s-rounded {
    border-radius: .1rem
}

.circle,
.s-circle {
    border-radius: 50%
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.text-center {
    text-align: center
}

.text-justify {
    text-align: justify
}

.text-lowercase {
    text-transform: lowercase
}

.text-uppercase {
    text-transform: uppercase
}

.text-capitalize {
    text-transform: capitalize
}

.text-normal {
    font-weight: 400
}

.text-bold {
    font-weight: 700
}

.text-italic {
    font-style: italic
}

.text-large {
    font-size: 1.2em
}

.text-small {
    font-size: .9em
}

.text-tiny {
    font-size: .8em
}

.text-muted {
    opacity: .8
}

.text-ellipsis {
    text-overflow: ellipsis
}

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

.text-clip {
    text-overflow: clip
}

.text-break {
    hyphens: auto;
    word-break: break-word;
    word-wrap: break-word
}

/*! Spectre.css Experimentals v0.5.1 | MIT License | github.com/picturepan2/spectre */
.calendar {
    border: .05rem solid #dcdde1;
    border-radius: .1rem;
    display: block;
    min-width: 280px;
    text-align: center
}

.calendar .calendar-nav {
    align-items: center;
    background: #fff;
    border-top-left-radius: .1rem;
    border-top-right-radius: .1rem;
    display: flex;
    font-size: .9rem;
    padding: .4rem
}

.calendar .calendar-body,
.calendar .calendar-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: .4rem 0
}

.calendar .calendar-body .calendar-date,
.calendar .calendar-header .calendar-date {
    flex: 0 0 14.28%;
    max-width: 14.28%
}

.calendar .calendar-header {
    background: #fff;
    border-bottom: .05rem solid #dcdde1;
    color: #bababa;
    font-size: .7rem
}

.calendar .calendar-body {
    color: #7a7a7a
}

.calendar .calendar-date {
    border: 0;
    padding: .2rem
}

.calendar .calendar-date .date-item {
    transition: all .2s ease;
    appearance: none;
    background: transparent;
    border: .05rem solid transparent;
    border-radius: 50%;
    color: #7a7a7a;
    cursor: pointer;
    font-size: .7rem;
    height: 1.4rem;
    line-height: 1rem;
    outline: none;
    padding: .1rem;
    position: relative;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    white-space: nowrap;
    width: 1.4rem
}

.calendar .calendar-date .date-item.date-today {
    border-color: #c9e4f6;
    color: #3498db
}

.calendar .calendar-date .date-item:focus {
    box-shadow: 0 0 0 .1rem rgba(214, 234, 248, 0)
}

.calendar .calendar-date .date-item:focus,
.calendar .calendar-date .date-item:hover {
    background: #e3f1fa;
    border-color: #c9e4f6;
    color: #3498db;
    text-decoration: none
}

.calendar .calendar-date .date-item.active,
.calendar .calendar-date .date-item:active {
    background: #00a1d4;
    border-color: #008ebb;
    color: #fff
}

.calendar .calendar-date .date-item.badge:after {
    position: absolute;
    top: 3px;
    right: 3px;
    transform: translate(50%, -50%)
}

.calendar .calendar-date .calendar-event:disabled,
.calendar .calendar-date .date-item:disabled,
.calendar .calendar-date.disabled .calendar-event,
.calendar .calendar-date.disabled .date-item {
    cursor: default;
    opacity: .25;
    pointer-events: none
}

.calendar .calendar-range {
    position: relative
}

.calendar .calendar-range:before {
    background: #d6eaf8;
    content: "";
    height: 1.4rem;
    left: 0;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%)
}

.calendar .calendar-range.range-start:before {
    left: 50%
}

.calendar .calendar-range.range-end:before {
    right: 50%
}

.calendar .calendar-range .date-item {
    color: #3498db
}

.calendar.calendar-lg .calendar-body {
    padding: 0
}

.calendar.calendar-lg .calendar-body .calendar-date {
    border-bottom: .05rem solid #dcdde1;
    border-right: .05rem solid #dcdde1;
    display: flex;
    flex-direction: column;
    height: 5.5rem;
    padding: 0
}

.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n) {
    border-right: 0
}

.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7) {
    border-bottom: 0
}

.calendar.calendar-lg .date-item {
    align-self: flex-end;
    height: 1.4rem;
    margin-right: .2rem;
    margin-top: .2rem
}

.calendar.calendar-lg .calendar-range:before {
    top: 19px
}

.calendar.calendar-lg .calendar-range.range-start:before {
    left: auto;
    width: 19px
}

.calendar.calendar-lg .calendar-range.range-end:before {
    right: 19px
}

.calendar.calendar-lg .calendar-events {
    flex-grow: 1;
    line-height: 1;
    overflow-y: auto;
    padding: .2rem
}

.calendar.calendar-lg .calendar-event {
    border-radius: .1rem;
    font-size: .7rem;
    display: block;
    margin: .1rem auto;
    overflow: hidden;
    padding: 3px 4px;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap
}

.carousel {
    background: #fff;
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%;
    -webkit-overflow-scrolling: touch
}

.carousel .carousel-container {
    height: 100%;
    left: 0;
    position: relative
}

.carousel .carousel-container:before {
    content: "";
    display: block;
    padding-bottom: 56.25%
}

.carousel .carousel-container .carousel-item {
    animation: carousel-slideout 1s ease-in-out 1;
    height: 100%;
    left: 0;
    margin: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.carousel .carousel-container .carousel-item:hover .item-next,
.carousel .carousel-container .carousel-item:hover .item-prev {
    opacity: 1
}

.carousel .carousel-container .item-next,
.carousel .carousel-container .item-prev {
    background: hsla(0, 0%, 92.9%, .25);
    border-color: hsla(0, 0%, 92.9%, .5);
    color: #ededed;
    opacity: 0;
    position: absolute;
    top: 50%;
    transition: all .4s ease;
    transform: translateY(-50%);
    z-index: 200
}

.carousel .carousel-container .item-prev {
    left: 1rem
}

.carousel .carousel-container .item-next {
    right: 1rem
}

.carousel .carousel-locator:first-of-type:checked~.carousel-container .carousel-item:first-of-type,
.carousel .carousel-locator:nth-of-type(2):checked~.carousel-container .carousel-item:nth-of-type(2),
.carousel .carousel-locator:nth-of-type(3):checked~.carousel-container .carousel-item:nth-of-type(3),
.carousel .carousel-locator:nth-of-type(4):checked~.carousel-container .carousel-item:nth-of-type(4) {
    animation: carousel-slidein .75s ease-in-out 1;
    opacity: 1;
    z-index: 100
}

.carousel .carousel-locator:first-of-type:checked~.carousel-nav .nav-item:first-of-type,
.carousel .carousel-locator:nth-of-type(2):checked~.carousel-nav .nav-item:nth-of-type(2),
.carousel .carousel-locator:nth-of-type(3):checked~.carousel-nav .nav-item:nth-of-type(3),
.carousel .carousel-locator:nth-of-type(4):checked~.carousel-nav .nav-item:nth-of-type(4) {
    color: #ededed
}

.carousel .carousel-nav {
    bottom: .4rem;
    display: flex;
    justify-content: center;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 10rem;
    z-index: 200
}

.carousel .carousel-nav .nav-item {
    color: hsla(0, 0%, 92.9%, .5);
    display: block;
    flex: 1 0 auto;
    height: 1.6rem;
    margin: .2rem;
    max-width: 2.5rem;
    position: relative
}

.carousel .carousel-nav .nav-item:before {
    background: currentColor;
    content: "";
    display: block;
    height: .1rem;
    position: absolute;
    top: .5rem;
    width: 100%
}

@keyframes carousel-slidein {
    0% {
        transform: translateX(100%)
    }

    to {
        transform: translateX(0)
    }
}

@keyframes carousel-slideout {
    0% {
        opacity: 1;
        transform: translateX(0)
    }

    to {
        opacity: 1;
        transform: translateX(-50%)
    }
}

.comparison-slider {
    height: 50vh;
    overflow: hidden;
    position: relative;
    width: 100%;
    -webkit-overflow-scrolling: touch
}

.comparison-slider .comparison-after,
.comparison-slider .comparison-before {
    height: 100%;
    left: 0;
    margin: 0;
    overflow: hidden;
    position: absolute;
    top: 0
}

.comparison-slider .comparison-after img,
.comparison-slider .comparison-before img {
    height: 100%;
    object-fit: cover;
    object-position: left center;
    position: absolute;
    width: 100%
}

.comparison-slider .comparison-before {
    width: 100%;
    z-index: 1
}

.comparison-slider .comparison-before .comparison-label {
    right: .8rem
}

.comparison-slider .comparison-after {
    max-width: 100%;
    min-width: 0;
    z-index: 2
}

.comparison-slider .comparison-after:before {
    background: transparent;
    content: "";
    cursor: default;
    height: 100%;
    left: 0;
    position: absolute;
    right: .8rem;
    top: 0;
    z-index: 1
}

.comparison-slider .comparison-after:after {
    background: currentColor;
    border-radius: 50%;
    box-shadow: 0 -5px, 0 5px;
    color: #fff;
    content: "";
    height: 3px;
    position: absolute;
    right: .4rem;
    top: 50%;
    transform: translate(50%, -50%);
    width: 3px
}

.comparison-slider .comparison-after .comparison-label {
    left: .8rem
}

.comparison-slider .comparison-resizer {
    animation: first-run 1.5s ease-in-out 1;
    cursor: ew-resize;
    height: .8rem;
    left: 0;
    max-width: 100%;
    min-width: .8rem;
    opacity: 0;
    outline: none;
    position: relative;
    resize: horizontal;
    top: 50%;
    transform: translateY(-50%) scaleY(30);
    width: 0
}

.comparison-slider .comparison-label {
    background: rgba(84, 84, 84, .5);
    bottom: .8rem;
    color: #fff;
    padding: .2rem .4rem;
    position: absolute;
    user-select: none
}

@keyframes first-run {
    0% {
        width: 0
    }

    25% {
        width: 2.4rem
    }

    50% {
        width: .8rem
    }

    75% {
        width: 1.2rem
    }

    to {
        width: 0
    }
}

.filter .filter-tag#tag-0:checked~.filter-nav .chip[for=tag-0],
.filter .filter-tag#tag-1:checked~.filter-nav .chip[for=tag-1],
.filter .filter-tag#tag-2:checked~.filter-nav .chip[for=tag-2],
.filter .filter-tag#tag-3:checked~.filter-nav .chip[for=tag-3],
.filter .filter-tag#tag-4:checked~.filter-nav .chip[for=tag-4],
.filter .filter-tag#tag-5:checked~.filter-nav .chip[for=tag-5],
.filter .filter-tag#tag-6:checked~.filter-nav .chip[for=tag-6],
.filter .filter-tag#tag-7:checked~.filter-nav .chip[for=tag-7],
.filter .filter-tag#tag-8:checked~.filter-nav .chip[for=tag-8] {
    background: #3498db;
    color: #fff
}

.filter .filter-tag#tag-1:checked~.filter-body .filter-item:not([data-tag~=tag-1]),
.filter .filter-tag#tag-2:checked~.filter-body .filter-item:not([data-tag~=tag-2]),
.filter .filter-tag#tag-3:checked~.filter-body .filter-item:not([data-tag~=tag-3]),
.filter .filter-tag#tag-4:checked~.filter-body .filter-item:not([data-tag~=tag-4]),
.filter .filter-tag#tag-5:checked~.filter-body .filter-item:not([data-tag~=tag-5]),
.filter .filter-tag#tag-6:checked~.filter-body .filter-item:not([data-tag~=tag-6]),
.filter .filter-tag#tag-7:checked~.filter-body .filter-item:not([data-tag~=tag-7]),
.filter .filter-tag#tag-8:checked~.filter-body .filter-item:not([data-tag~=tag-8]) {
    display: none
}

.filter .filter-nav {
    margin: .4rem 0
}

.filter .filter-body {
    display: flex;
    flex-wrap: wrap
}

.meter {
    appearance: none;
    background: #fff;
    border: 0;
    border-radius: .1rem;
    display: block;
    width: 100%;
    height: .8rem
}

.meter::-webkit-meter-inner-element {
    display: block
}

.meter::-webkit-meter-bar,
.meter::-webkit-meter-even-less-good-value,
.meter::-webkit-meter-optimum-value,
.meter::-webkit-meter-suboptimum-value {
    border-radius: .1rem
}

.meter::-webkit-meter-bar {
    background: #fff
}

.meter::-webkit-meter-optimum-value {
    background: #2ecc71
}

.meter::-webkit-meter-suboptimum-value {
    background: #f1c40f
}

.meter::-webkit-meter-even-less-good-value {
    background: #e74c3c
}

.meter:-moz-meter-optimum,
.meter:-moz-meter-sub-optimum,
.meter:-moz-meter-sub-sub-optimum,
.meter::-moz-meter-bar {
    border-radius: .1rem
}

.meter:-moz-meter-optimum::-moz-meter-bar {
    background: #2ecc71
}

.meter:-moz-meter-sub-optimum::-moz-meter-bar {
    background: #f1c40f
}

.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar {
    background: #e74c3c
}

.off-canvas {
    display: flex;
    flex-flow: nowrap;
    height: 100%;
    position: relative;
    width: 100%
}

.off-canvas .off-canvas-toggle {
    display: block;
    left: .4rem;
    position: absolute;
    top: .4rem;
    transition: none;
    z-index: 1
}

.off-canvas .off-canvas-sidebar {
    background: #fff;
    bottom: 0;
    left: 0;
    min-width: 10rem;
    overflow-y: auto;
    position: fixed;
    top: 0;
    transform: translateX(-100%);
    transition: transform .25s ease;
    z-index: 300
}

.off-canvas .off-canvas-content {
    flex: 1 1 auto;
    height: 100%;
    padding: .4rem .4rem .4rem 4rem
}

.off-canvas .off-canvas-overlay {
    background: rgba(84, 84, 84, .1);
    border-color: transparent;
    border-radius: 0;
    bottom: 0;
    display: none;
    height: 100%;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%
}

.off-canvas .off-canvas-sidebar.active,
.off-canvas .off-canvas-sidebar:target {
    transform: translateX(0)
}

.off-canvas .off-canvas-sidebar.active~.off-canvas-overlay,
.off-canvas .off-canvas-sidebar:target~.off-canvas-overlay {
    display: block;
    z-index: 200
}

@media (min-width:1280px) {
    .off-canvas.off-canvas-sidebar-show .off-canvas-toggle {
        display: none
    }

    .off-canvas.off-canvas-sidebar-show .off-canvas-sidebar {
        flex: 0 0 auto;
        position: relative;
        transform: none
    }
}

.parallax {
    display: block;
    height: auto;
    position: relative;
    width: auto
}

.parallax .parallax-content {
    box-shadow: 0 1rem 2.1rem rgba(84, 84, 84, .3);
    height: auto;
    transform: perspective(1000px);
    transform-style: preserve-3d;
    transition: all .4s ease;
    width: 100%
}

.parallax .parallax-content:before {
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.parallax .parallax-front {
    align-items: center;
    color: #fff;
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    position: absolute;
    text-align: center;
    text-shadow: 0 0 20px rgba(84, 84, 84, .75);
    top: 0;
    transform: translateZ(50px) scale(.95);
    transition: all .4s ease;
    width: 100%;
    z-index: 1
}

.parallax .parallax-top-left {
    height: 50%;
    outline: none;
    position: absolute;
    width: 50%;
    z-index: 100;
    left: 0;
    top: 0
}

.parallax .parallax-top-left:focus~.parallax-content,
.parallax .parallax-top-left:hover~.parallax-content {
    transform: perspective(1000px) rotateX(3deg) rotateY(-3deg)
}

.parallax .parallax-top-left:focus~.parallax-content:before,
.parallax .parallax-top-left:hover~.parallax-content:before {
    background: linear-gradient(135deg, hsla(0, 0%, 100%, .35), transparent 50%)
}

.parallax .parallax-top-left:focus~.parallax-content .parallax-front,
.parallax .parallax-top-left:hover~.parallax-content .parallax-front {
    transform: translate3d(4.5px, 4.5px, 50px) scale(.95)
}

.parallax .parallax-top-right {
    height: 50%;
    outline: none;
    position: absolute;
    width: 50%;
    z-index: 100;
    right: 0;
    top: 0
}

.parallax .parallax-top-right:focus~.parallax-content,
.parallax .parallax-top-right:hover~.parallax-content {
    transform: perspective(1000px) rotateX(3deg) rotateY(3deg)
}

.parallax .parallax-top-right:focus~.parallax-content:before,
.parallax .parallax-top-right:hover~.parallax-content:before {
    background: linear-gradient(-135deg, hsla(0, 0%, 100%, .35), transparent 50%)
}

.parallax .parallax-top-right:focus~.parallax-content .parallax-front,
.parallax .parallax-top-right:hover~.parallax-content .parallax-front {
    transform: translate3d(-4.5px, 4.5px, 50px) scale(.95)
}

.parallax .parallax-bottom-left {
    height: 50%;
    outline: none;
    position: absolute;
    width: 50%;
    z-index: 100;
    bottom: 0;
    left: 0
}

.parallax .parallax-bottom-left:focus~.parallax-content,
.parallax .parallax-bottom-left:hover~.parallax-content {
    transform: perspective(1000px) rotateX(-3deg) rotateY(-3deg)
}

.parallax .parallax-bottom-left:focus~.parallax-content:before,
.parallax .parallax-bottom-left:hover~.parallax-content:before {
    background: linear-gradient(45deg, hsla(0, 0%, 100%, .35), transparent 50%)
}

.parallax .parallax-bottom-left:focus~.parallax-content .parallax-front,
.parallax .parallax-bottom-left:hover~.parallax-content .parallax-front {
    transform: translate3d(4.5px, -4.5px, 50px) scale(.95)
}

.parallax .parallax-bottom-right {
    height: 50%;
    outline: none;
    position: absolute;
    width: 50%;
    z-index: 100;
    bottom: 0;
    right: 0
}

.parallax .parallax-bottom-right:focus~.parallax-content,
.parallax .parallax-bottom-right:hover~.parallax-content {
    transform: perspective(1000px) rotateX(-3deg) rotateY(3deg)
}

.parallax .parallax-bottom-right:focus~.parallax-content:before,
.parallax .parallax-bottom-right:hover~.parallax-content:before {
    background: linear-gradient(-45deg, hsla(0, 0%, 100%, .35), transparent 50%)
}

.parallax .parallax-bottom-right:focus~.parallax-content .parallax-front,
.parallax .parallax-bottom-right:hover~.parallax-content .parallax-front {
    transform: translate3d(-4.5px, -4.5px, 50px) scale(.95)
}

.progress {
    appearance: none;
    background: #f7f7f7;
    border: 0;
    border-radius: .1rem;
    color: #3498db;
    height: .2rem;
    position: relative;
    width: 100%
}

.progress::-webkit-progress-bar {
    background: transparent;
    border-radius: .1rem
}

.progress::-webkit-progress-value {
    background: #3498db;
    border-radius: .1rem
}

.progress::-moz-progress-bar {
    background: #3498db;
    border-radius: .1rem
}

.progress:indeterminate {
    animation: progress-indeterminate 1.5s linear infinite;
    background: #f7f7f7 linear-gradient(90deg, #3498db 30%, #f7f7f7 0) 0 0/150% 150% no-repeat
}

.progress:indeterminate::-moz-progress-bar {
    background: transparent
}

@keyframes progress-indeterminate {
    0% {
        background-position: 200% 0
    }

    to {
        background-position: -200% 0
    }
}

.slider {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: transparent;
    display: block;
    width: 100%;
    height: 1.2rem
}

.slider:focus {
    box-shadow: 0 0 0 .1rem rgba(214, 234, 248, 0);
    outline: none
}

.slider.tooltip:not([data-tooltip]):after {
    content: attr(value)
}

.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    background: #3498db;
    border: 0;
    border-radius: 50%;
    height: .6rem;
    margin-top: -.25rem;
    transition: transform .2s;
    width: .6rem
}

.slider::-moz-range-thumb {
    background: #3498db;
    border: 0;
    border-radius: 50%;
    height: .6rem;
    transition: transform .2s;
    width: .6rem
}

.slider::-ms-thumb {
    background: #3498db;
    border: 0;
    border-radius: 50%;
    height: .6rem;
    transition: transform .2s;
    width: .6rem
}

.slider:active::-webkit-slider-thumb {
    transform: scale(1.25)
}

.slider:active::-moz-range-thumb {
    transform: scale(1.25)
}

.slider:active::-ms-thumb {
    transform: scale(1.25)
}

.slider.disabled::-webkit-slider-thumb,
.slider:disabled::-webkit-slider-thumb {
    background: #ededed;
    transform: scale(1)
}

.slider.disabled::-moz-range-thumb,
.slider:disabled::-moz-range-thumb {
    background: #ededed;
    transform: scale(1)
}

.slider.disabled::-ms-thumb,
.slider:disabled::-ms-thumb {
    background: #ededed;
    transform: scale(1)
}

.slider::-webkit-slider-runnable-track {
    background: #f7f7f7;
    border-radius: .1rem;
    height: .1rem;
    width: 100%
}

.slider::-moz-range-track {
    background: #f7f7f7;
    border-radius: .1rem;
    height: .1rem;
    width: 100%
}

.slider::-ms-track {
    background: #f7f7f7;
    border-radius: .1rem;
    height: .1rem;
    width: 100%
}

.slider::-ms-fill-lower {
    background: #3498db
}

.timeline .timeline-item {
    display: flex;
    margin-bottom: 1.2rem;
    position: relative
}

.timeline .timeline-item:before {
    background: #dcdde1;
    content: "";
    height: 100%;
    left: 11px;
    position: absolute;
    top: 1.2rem;
    width: 2px
}

.timeline .timeline-item .timeline-left {
    flex: 0 0 auto
}

.timeline .timeline-item .timeline-content {
    flex: 1 1 auto;
    padding: 2px 0 2px .8rem
}

.timeline .timeline-item .timeline-icon {
    border-radius: 50%;
    color: #fff;
    display: block;
    height: 1.2rem;
    text-align: center;
    width: 1.2rem
}

.timeline .timeline-item .timeline-icon:before {
    border: .1rem solid #3498db;
    border-radius: 50%;
    content: "";
    display: block;
    height: .4rem;
    left: .4rem;
    position: absolute;
    top: .4rem;
    width: .4rem
}

.timeline .timeline-item .timeline-icon.icon-lg {
    background: #3498db;
    line-height: 1rem
}

.timeline .timeline-item .timeline-icon.icon-lg:before {
    content: none
}

body {
    font-family: Source Sans Pro, sans-serif !important;
    font-weight: 400;
    font-size: .8rem;
    color: #545454
}

body.buying-landing {
    font-size: .9rem
}

* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 300 !important
}

h1 span,
h1 strong,
h1.text-bold,
h2 span,
h2 strong,
h2.text-bold,
h3 span,
h3 strong,
h3.text-bold,
h4 span,
h4 strong,
h4.text-bold,
h5 span,
h5 strong,
h5.text-bold,
h6 span,
h6 strong,
h6.text-bold {
    font-weight: 600 !important
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small {
    font-weight: 300 !important;
    color: #545454
}

.form-input,
input,
select,
textarea {
    margin-bottom: .5rem;
    border-color: #dcdde1;
    font-size: .75rem !important
}

input.form-input,
textarea.form-input {
    font-size: .85rem !important
}

.input-group {
    margin-bottom: .5rem
}

.input-group input {
    margin-bottom: 0
}

.form-input-hint {
    margin: -.25rem 0 0 !important
}

ul {
    list-style: disc outside
}

ol {
    counter-reset: item;
    margin: 0;
    line-height: 1.25rem
}

ol li {
    display: block;
    position: relative;
    padding-left: 1rem
}

ol li:before {
    content: counters(item, ".") ". ";
    counter-increment: item;
    display: inline-block;
    position: absolute;
    left: 0;
    width: 2rem
}

ol li ol>li {
    padding-left: 2rem
}

ol li ol>li ol>li {
    padding-left: 2.5rem
}

.bg-ennea-1 {
    background: #f99d1c
}

.text-ennea-1 {
    color: #f99d1c
}

.bg-ennea-1-light {
    background: #fdb813
}

.bg-ennea-1-dark {
    background: #df7e1b
}

.bg-ennea-2 {
    background: #b3d335
}

.text-ennea-2 {
    color: #b3d335
}

.bg-ennea-2-light {
    background: #d7df23
}

.bg-ennea-2-dark {
    background: #76b043
}

.bg-ennea-3 {
    background: #718339
}

.text-ennea-3 {
    color: #718339
}

.bg-ennea-3-light {
    background: #899a39
}

.bg-ennea-3-dark {
    background: #49692f
}

.bg-ennea-4 {
    background: #00ac5c
}

.text-ennea-4 {
    color: #00ac5c
}

.bg-ennea-4-light {
    background: #00af62
}

.bg-ennea-4-dark {
    background: #007947
}

.bg-ennea-5 {
    background: #005590;
    color: #fff
}

.text-ennea-5 {
    color: #005590
}

.bg-ennea-5-light {
    background: #0f6fa6;
    color: #fff
}

.bg-ennea-5-dark {
    background: #1f396c;
    color: #fff
}

.bg-ennea-6 {
    background: #6a5d9b;
    color: #fff
}

.text-ennea-6 {
    color: #6a5d9b
}

.bg-ennea-6-light {
    background: #8071b4;
    color: #fff
}

.bg-ennea-6-dark {
    background: #4a406c;
    color: #fff
}

.bg-ennea-7 {
    background: #669ad2
}

.text-ennea-7 {
    color: #669ad2
}

.bg-ennea-7-light {
    background: #88b2df
}

.bg-ennea-7-dark {
    background: #547bb2
}

.bg-ennea-8 {
    background: #e23e2d
}

.text-ennea-8 {
    color: #e23e2d
}

.bg-ennea-8-light {
    background: #ef4223
}

.bg-ennea-8-dark {
    background: #c4161c
}

.bg-ennea-9 {
    background: #a83f2b;
    color: #fff
}

.text-ennea-9 {
    color: #a83f2b
}

.bg-ennea-9-light {
    background: #a14f3a;
    color: #fff
}

.bg-ennea-9-dark {
    background: #8d3824;
    color: #fff
}

.bg-white {
    background: #fff
}

.bg-black {
    background: #000
}

.bg-grey {
    background: #dcdde1
}

.bg-grey-light {
    background: #f7f8f9
}

.bg-grey-dark {
    background: #acacac
}

.bg-grey-extra-dark {
    background: #535353
}

.bg-warning-light {
    background: #fbedb8 !important
}

.bg-warning-light .card,
.bg-warning-light .panel {
    box-shadow: 0 .25rem 1rem #f1c40f
}

.bg-warning {
    color: #545454
}

.bg-warning .card,
.bg-warning .panel {
    box-shadow: 0 .25rem 1rem #c29d0b
}

.bg-warning.chip {
    color: #fff
}

.text-warning-light {
    color: #f7dc6f
}

.bg-success-light {
    background: #d1f5e0 !important
}

.bg-success-light .card,
.bg-success-light .panel {
    box-shadow: 0 .25rem 1rem #2ecc71
}

.bg-success .card,
.bg-success .panel {
    box-shadow: 0 .25rem 1rem #25a25a
}

.bg-success .card .card-body,
.bg-success .card .card-header,
.bg-success .card .panel-body,
.bg-success .card p,
.bg-success .panel .card-body,
.bg-success .panel .card-header,
.bg-success .panel .panel-body,
.bg-success .panel p {
    color: #545454
}

.text-grey {
    color: #acacac
}

.text-dark,
a.text-dark {
    color: #545454 !important
}

a.text-dark:hover {
    color: #3498db !important
}

.text-success-light {
    color: #7ee2a8
}

.bg-error-light {
    background: #fbdedb !important
}

.bg-error .card,
.bg-error .panel {
    box-shadow: 0 .25rem 1rem #d62c1a
}

.text-error-light {
    color: #ed7669
}

.bg-primary-light {
    background: #cce5f6 !important
}

.bg-primary .card,
.bg-primary .panel {
    box-shadow: 0 .25rem 1rem #217dbb
}

.text-primary-light {
    color: #8bc4ea
}

.bg-warning-dark {
    background: #aa8a0a !important
}

.text-warning-dark {
    color: #dab10d
}

.bg-success-dark {
    background: #208e4e !important
}

.text-success-dark {
    color: #208e4e
}

.bg-error-dark {
    background: #bf2718 !important
}

.text-error-dark {
    color: #bf2718
}

.bg-primary-dark {
    background: #196090 !important
}

.text-primary-dark {
    color: #1d6fa5
}

.text-web-orange {
    color: #ff924e
}

.text-web-blue {
    color: #0099f3
}

.text-web-teal {
    color: #00c19b
}

.text-web-green {
    color: #15a455
}

.text-web-red {
    color: #dd4738
}

.text-web-cream {
    color: #f2cfa7
}

.text-web-dark-blue {
    color: #001120
}

.bg-web-blue-dark-2 {
    background: #001120
}

.bg-web-orange-2 {
    background: #ff924e
}

.bg-web-orange-dark {
    background: #f2664a
}

.bg-web-blue-2 {
    background: #0099f3
}

.bg-web-blue-light-2 {
    background: #94c4dc
}

.bg-web-mid-blue-dark {
    background: #0d1d2b
}

.bg-web-teal-2 {
    background: #00c19b
}

.bg-web-green-2 {
    background: #15a455
}

.bg-web-red-2 {
    background: #dd4738
}

.bg-web-cream {
    background: #f2cfa7
}

.bg-web-dark-blue-2 {
    background: #001120
}

.bg-web-grey-2 {
    background: #f7f4f0
}

.bg-web-grey-light-2 {
    background: #f7f7f7
}

.bg-web-grey-warm {
    background: #efdabb
}

.bg-web-pink {
    background: #fee4d5
}

.bg-web-purple {
    background: #693484
}

.bg-web-purple-extra-light {
    background: #c3aece
}

.bg-web-purple-light {
    background: #8e66a3
}

.bg-web-red {
    background: #cd4832
}

.bg-web-teal {
    background: #20b895
}

.bg-web-blue {
    background: #006bb6
}

.bg-web-blue-light {
    background: #0ac
}

.bg-web-blue-dark {
    background: #4765a0
}

.bg-web-green {
    background: #009d58
}

.bg-web-green-mid {
    background: #00885b
}

.bg-web-green-light {
    background: #49b95e
}

.bg-web-orange {
    background: #f2664a
}

.bg-web-level-2 {
    background: #f04e30
}

.bg-web-grey-dark {
    background: #4c4d4f
}

.bg-web-grey-light {
    background: #f7f7f7
}

html {
    height: 100%;
    width: 100%;
    background: #f6f7fb;
    overflow: auto;
    background: #fff;
    scroll-behavior: smooth
}

html body {
    background: #fff;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    height: 100%
}

html body.arial {
    font-family: Arial, Helvetica, sans-serif !important
}

html body #admin-header {
    box-shadow: none
}

.container {
    padding-left: 1.75rem;
    padding-right: 1.75rem
}

a {
    color: #00a1d4
}

a:hover {
    color: #3498db
}

h2,
h3,
h4,
h5 {
    color: #001120
}

.bg-web-dark-blue-2 h2,
.bg-web-dark-blue-2 h3,
.bg-web-dark-blue-2 h4,
.bg-web-dark-blue-2 h5 {
    color: #fff
}

.height-full {
    height: 100%;
    min-height: 100%
}

.vertical-align-middle {
    display: flex;
    align-items: center
}

.overflow-hidden {
    overflow: hidden
}

.no-border {
    border: none !important
}

.no-text-wrap {
    white-space: nowrap
}

#support-button {
    position: fixed;
    bottom: 15px;
    right: 15px;
    z-index: 5000
}

.s-rounded {
    border-radius: .5em
}

.s-rounded.left-only {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.s-rounded.right-only {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.s-rounded-plus {
    border-radius: .75rem
}

.disabled-wrapper {
    opacity: .5
}

.disabled-wrapper * {
    pointer-events: none
}

.d-border-none {
    border: none !important
}

.d-border {
    border: 1px solid #dcdde1
}

.d-border.border-primary {
    border: 2px solid #3498db
}

.modal.active,
.modal:target {
    z-index: 6000 !important
}

.modal.active .modal-overlay,
.modal.modal-lg.active .modal-overlay,
.modal.modal-lg:target .modal-overlay,
.modal:target .modal-overlay {
    background: rgba(0, 0, 0, .5)
}

.modal-container .modal-header {
    background: #454559;
    color: #fff;
    margin: 0 -.8rem .5rem
}

.modal#privacyPolicy .modal-body {
    overflow: hidden !important;
    margin-bottom: 2rem;
    padding-right: 0
}

.modal#privacyPolicy .modal-body iframe {
    border: none;
    height: 75vh !important;
    padding-bottom: 1rem
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

input[disabled] {
    cursor: not-allowed !important;
    color: #545454 !important
}

input[disabled].form-input::placeholder {
    color: #545454 !important
}

input[readonly] {
    background: #f6f6f8 !important
}

.report-thumb {
    height: 225px;
    border: 1px solid #ededed;
    box-shadow: 0 .25rem .5rem #dcdde1;
    margin: .5rem auto 1rem
}

.report-thumb.no-shadow {
    border: none !important;
    box-shadow: none !important
}

.report-thumb.couples {
    height: auto;
    width: 300px;
    transform: rotate(3deg);
    margin: 1rem auto
}

.toast {
    background: #454559;
    border: none;
    margin-bottom: .5rem;
    padding: 1em
}

.toast,
.toast .step-item a {
    color: #fff
}

.toast .step-item a:hover {
    color: #3498db !important
}

.toast .divider {
    border-color: #fff
}

.toast .columns {
    margin-bottom: 0 !important
}

.toast input,
.toast select {
    color: #545454
}

.toast.toast-notice {
    top: .5rem;
    right: .5rem;
    z-index: 10000 !important;
    width: auto !important
}

.toast.toast-slim {
    padding: .3rem 1rem
}

.toast a {
    color: #e2f8fe
}

.toast.toast-light {
    background: #82abd1
}

.toast.toast-light a,
.toast.toast-light ion-icon {
    color: #fff
}

.toast.toast-light .divider {
    border-color: #fff
}

.toast.toast-dark-light {
    background: #727292
}

.toast.toast-dark-light a,
.toast.toast-dark-light ion-icon {
    color: #fff
}

.toast.toast-dark-light .divider {
    border-color: #fff
}

.toast.toast-grey {
    background: #acacac
}

.toast.toast-grey a,
.toast.toast-grey ion-icon {
    color: #fff
}

.toast.toast-warning {
    color: #545454
}

.toast.toast-warning a {
    color: #00a1d4
}

.toast.toast-warning a.btn {
    color: #e2f8fe
}

.toast .btn {
    text-decoration: none
}

.btn {
    background: #fff;
    color: #3498db;
    border-color: #3498db;
    padding: .35rem .8rem
}

.btn:focus,
.btn:hover {
    background: #e2f8fe
}

.btn .material-icons,
.btn ion-icon {
    margin: -.2rem .25rem 0
}

.btn.dropdown-toggle {
    color: #545454
}

.btn.dropdown-toggle ion-icon {
    color: #3498db
}

.btn-transparent-light {
    background: transparent !important;
    border-color: #fff;
    color: #fff
}

.btn-transparent-light:focus,
.btn-transparent-light:hover {
    background: #fff !important;
    color: #00a1d4;
    border-color: #00a1d4
}

.btn-grey {
    background: #eeeef0;
    border-color: #dcdde1;
    color: #545454 !important
}

.btn-grey:focus,
.btn-grey:hover {
    background: #dbdbdf;
    border-color: #dbdbdf;
    color: #000
}

.btn-warning {
    background: #f1c40f;
    border-color: #e3b90d;
    color: #fff;
    color: #545454 !important
}

.btn-warning:focus {
    box-shadow: 0 0 0 .1rem rgba(241, 196, 15, 0)
}

.btn-warning:focus,
.btn-warning:hover {
    background: #e8bd0e;
    border-color: #dab10d;
    color: #fff
}

.btn-warning.active,
.btn-warning:active {
    background: #d0a90c;
    border-color: #c29d0b;
    color: #fff
}

.btn-success {
    background: #2ecc71;
    border-color: #2bc06a;
    color: #fff
}

.btn-success:focus {
    box-shadow: 0 0 0 .1rem rgba(46, 204, 113, 0)
}

.btn-success:focus,
.btn-success:hover {
    background: #2cc46c;
    border-color: #29b765;
    color: #fff
}

.btn-success.active,
.btn-success:active {
    background: #27af61;
    border-color: #25a25a;
    color: #fff
}

.btn-error {
    background: #e74c3c;
    border-color: #e53f2e;
    color: #fff
}

.btn-error:focus {
    box-shadow: 0 0 0 .1rem rgba(231, 76, 60, 0)
}

.btn-error:focus,
.btn-error:hover {
    background: #e64433;
    border-color: #e43725;
    color: #fff
}

.btn-error.active,
.btn-error:active {
    background: #e32f1c;
    border-color: #d62c1a;
    color: #fff
}

.btn-blue-web,
.btn-green-web,
.btn-lg-web,
.btn-orange-dark,
.btn-orange-web,
.btn-orange-web-warm,
.btn-red-web,
.btn-teal-web {
    font-weight: 600
}

.btn-lg-web {
    font-size: 1rem;
    height: 2.5rem;
    padding: .5rem 1rem;
    line-height: 1.5rem
}

.btn-green-web {
    background: #15a455 !important
}

.btn-green-web,
.btn-red-web {
    border: none !important;
    color: #fff !important
}

.btn-red-web {
    background: #dd4738 !important
}

.btn-orange-web {
    background: #ff924e !important
}

.btn-orange-dark,
.btn-orange-web {
    border: none !important;
    color: #fff !important
}

.btn-orange-dark {
    background: #f2664a !important
}

.btn-orange-web-warm {
    background: #ea7d22 !important
}

.btn-blue-web,
.btn-orange-web-warm {
    border: none !important;
    color: #fff !important
}

.btn-blue-web {
    background: #0099f3 !important
}

.btn-teal-web {
    background: #00c19b !important;
    border: none !important;
    color: #fff !important
}

.view-padding {
    padding: 1rem 1.25rem
}

.title {
    padding: .5rem 0 0
}

ion-icon {
    margin: -.1rem .25rem 0 0;
    vertical-align: middle;
    pointer-events: none
}

ion-icon[size=small] {
    font-size: 22px
}

ion-icon[size=medium] {
    font-size: 24px
}

ion-icon[size=large] {
    font-size: 32px
}

ion-icon[size=xlarge] {
    font-size: 48px
}

ion-icon[size=xxlarge] {
    font-size: 62px
}

.divider {
    margin: .75rem 0;
    border-top: 1px dotted #acacac
}

.divider.blue-divider {
    border-top: 2px solid #3498db;
    margin: 1rem 0
}

.divider.green-divider {
    border-top: 2px solid #2ecc71;
    margin: 1rem 0
}

.divider-vert:before {
    border-left: 1px dotted #acacac
}

#admin-header {
    position: relative;
    top: 0;
    z-index: 110;
    background: #fff;
    padding: .75rem 1rem;
    box-shadow: 0 0 11px rgba(0, 0, 0, .13);
    margin-bottom: 1rem
}

#admin-header.dark {
    background: #24253c;
    color: #fff
}

#admin-header.dark .navbar .btn-link {
    color: #e2f8fe
}

#admin-header.dark .navbar .btn-link ion-icon {
    margin-left: 0
}

#admin-header.dark .navbar .btn-link.active,
#admin-header.dark .navbar .btn-link:hover {
    color: #3498db
}

#admin-header.dark.transparent {
    background: rgba(0, 0, 0, .6);
    position: absolute;
    width: 100%;
    padding-bottom: 0
}

#admin-header.dark.transparent #admin-pre-header {
    background: none;
    padding: 0;
    margin: 0;
    position: relative;
    z-index: 10000
}

#admin-header.dark.transparent #admin-pre-header a.btn {
    border: 1px solid #3498db;
    margin-right: .25rem;
    text-transform: uppercase
}

#admin-header.dark.transparent #admin-pre-header a.btn:hover {
    background-color: #00a1d4
}

#admin-header.dark.transparent #admin-pre-header select {
    color: #545454;
    max-width: 200px
}

#admin-header.dark.universal {
    padding: .5rem 1rem 0;
    position: fixed !important;
    top: 0;
    left: 0;
    transition: .2s;
    z-index: 5000
}

#admin-header.dark.universal .navbar {
    margin-top: -10px
}

#admin-header.dark.universal img.desktop-logo {
    margin-top: -27px;
    margin-bottom: 5px;
    transition: .2s;
}

#admin-header.dark.universal .navbar a.btn-link {
    color: #fff !important;
    border: none !important;
    font-weight: 600
}

#admin-header.dark.universal .navbar a.btn-link:hover {
    color: #e2f8fe !important
}

#admin-header.dark.universal .navbar .mobile-menu-show a {
    color: #fff
}

#admin-header.dark.universal .dropdown-menu-wrapper {
    display: inline-block;
    height: 66px;
    margin-bottom: -30px
}

#admin-header.dark.universal .dropdown-menu-wrapper .dropdown-menu {
    background: #fff;
    border: 1px solid #eeeef0;
    border-top: 3px solid #3498db;
    left: 0;
    top: 92px;
    color: #545454;
    display: none;
    padding: 1rem
}

#admin-header.dark.universal .dropdown-menu-wrapper .dropdown-menu a {
    display: block;
    color: #545454;
    font-size: .7rem
}

#admin-header.dark.universal .dropdown-menu-wrapper .dropdown-menu a:hover {
    text-decoration: none
}

#admin-header.dark.universal .dropdown-menu-wrapper .dropdown-menu .item-wrap {
    width: 100%
}

#admin-header.dark.universal .dropdown-menu-wrapper .dropdown-menu .item-wrap .item {
    background: #f6f6f8;
    border: 1px solid #f6f6f8;
    display: block;
    margin-bottom: 10px;
    padding: 8px;
    clear: both;
    min-height: 78px;
    line-height: 50px
}

#admin-header.dark.universal .dropdown-menu-wrapper .dropdown-menu .item-wrap .item p {
    margin: 0;
    padding: 0;
    display: inline-block;
    vertical-align: middle;
    line-height: normal
}

#admin-header.dark.universal .dropdown-menu-wrapper .dropdown-menu .item-wrap .item:last-child {
    margin-bottom: 0
}

#admin-header.dark.universal .dropdown-menu-wrapper .dropdown-menu .item-wrap .item img {
    float: left;
    vertical-align: middle;
    margin-right: 10px
}

#admin-header.dark.universal .dropdown-menu-wrapper .dropdown-menu .item-wrap .item:hover {
    background: #eeeef0;
    border: 1px solid #dcdde1
}

#admin-header.dark.universal .dropdown-menu-wrapper:hover .dropdown-menu {
    display: block
}

#admin-header.dark.universal.scroll-scale {
    background: rgba(0, 0, 0, .8);
    padding: .25rem 1rem 0
}

#admin-header.dark.universal.scroll-scale .navbar-brand img {
    margin: .5rem 0 .7rem;
    width: 160px
}

#admin-header.dark.universal.scroll-scale .dropdown-menu-wrapper .dropdown-menu {
    top: 66px
}

#admin-header .columns {
    margin-bottom: 0 !important
}

#admin-header .event-page-header {
    font-weight: 600
}

#admin-header .event-page-header span {
    font-weight: 400;
    color: #dcdde1;
    display: inline-block;
    margin: 0 .25rem
}

#admin-header .product-logo {
    width: 180px;
    margin: 0
}

#admin-header .breadcrumb {
    margin: 0;
    padding: 0
}

#admin-header .breadcrumb .breadcrumb-item a {
    color: #545454
}

#admin-header .breadcrumb .breadcrumb-item:last-child a {
    color: #3498db
}

#admin-header input {
    margin-bottom: 0
}

#admin-header a.active,
#admin-header a:active,
#admin-header a:focus,
#admin-header a:hover {
    background: none
}

#admin-header a.off-canvas-toggle {
    color: #3498db;
    position: inherit;
    margin: 0 1rem 0 0;
    padding: 0;
    display: block
}

/* new nav test */

#admin-header.dark.universal .web-navigation {
    list-style: none;
    padding: 0;
    margin: 0.85rem 0 0;
    text-align: right;
  }
  
  #admin-header.dark.universal .web-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  #admin-header.dark.universal .web-navigation a {
    display: block;
  }
  
  #admin-header.dark.universal .web-navigation a ion-icon {
    display: none;
  }
  
  #admin-header.dark.universal .web-navigation>li {
    display: inline-block;
    width: auto;
  }
  
  #admin-header.dark.universal .web-navigation>li a {
    font-weight: 600;
    color: #fff;
    margin: 0 0.75rem;
    padding-bottom: 1.5rem;
    position: relative;
  }
  
  #admin-header.dark.universal .web-navigation>li:hover>a {
    text-decoration: none;
  }
  
  #admin-header.dark.universal .web-navigation>li.has-child:hover>a:after {
    content: "";
    position: absolute;
    left: 33%;
    bottom: -3px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #fff transparent;
    z-index: 9999;
  }
  
  #admin-header.dark.universal .web-navigation>li ul {
    position: absolute;
    width: 1296px;
    left: -999em;
    background: #fff;
    border: 1px solid #eeeef0;
    border-top: 3px solid #3498db;
    text-align: center !important;
    padding: 0.25rem 0.35rem 0.75rem;
  }
  
  #admin-header.dark.universal .web-navigation>li ul.last-item li {
    width: 24%;
  }
  
  #admin-header.dark.universal .web-navigation>li ul li {
    display: inline-block;
    width: 33%;
    vertical-align: top;
  }
  
  #admin-header.dark.universal .web-navigation>li ul li a.nav-item {
    color: #000;
    font-weight: 400;
    padding: 0;
    background: #f6f6f8;
    border: 1px solid #f6f6f8;
    display: block;
    margin: 0.1rem 0.2rem;
    padding: 6px 12px 6px 6px;
    clear: both;
    min-height: 30px;
    line-height: 30px;
    border-radius: 0.5em;
    text-align: left !important;
  }
  
  #admin-header.dark.universal .web-navigation>li ul li a.nav-item img {
    display: inline-block;
    border-radius: 0.25rem;
    width: 60px;
    vertical-align: middle;
    margin-right: 8px;
  }

  #admin-header.dark.universal .web-navigation>li ul li a.nav-item img.type {
    height: 60px;
    width: 60px;
    /* 45 */
  }
  
  #admin-header.dark.universal .web-navigation>li ul li a.nav-item:after {
    clear: both;
  }
  
  #admin-header.dark.universal .web-navigation>li ul li a.nav-item:hover {
    text-decoration: none;
    background: #e2f8fe;
    border: 1px solid #3498db;
  }
  
  #admin-header.dark.universal .web-navigation>li:hover ul {
    left: 0;
  }
  
  #admin-header.dark.universal.scroll-scale {
    background: rgba(0, 0, 0, 0.8);
    padding: 0.25rem 1rem 0;
  }
  
  #admin-header.dark.universal.scroll-scale .navbar-brand img.desktop-logo {
    margin: -24px 0 0;
    width: 165px;
  }
  
  #admin-header.dark.universal.scroll-scale .dropdown-menu-wrapper .dropdown-menu {
    top: 66px;
  }
  
  #admin-header.dark.universal.scroll-scale .web-navigation {
    margin: 0.25rem 0 0;
  }
  
  #admin-header.dark.universal.scroll-scale .web-navigation>li a {
    padding-bottom: 0.75rem;
  }

/* new nav end */

.banner {
    margin-top: -1rem;
    background-size: cover;
    padding: 2.5rem 0;
    margin-bottom: 1rem
}

.banner.banner-small {
    padding: 1rem
}

.banner .columns {
    margin-bottom: 0 !important
}

.banner h2.alpha-bg {
    background: rgba(0, 0, 0, .5);
    display: inline-block;
    color: #fff;
    padding: .75rem 1rem;
    margin: 0
}

.tile.task-tile {
    padding: .5rem;
    border: 1px solid #dcdde1;
    border-left-width: 6px;
    margin-bottom: .5rem
}

.tile.task-tile:hover {
    box-shadow: 0 .25rem .5rem #dcdde1
}

.tile.task-tile.error-state {
    border-left-color: #e74c3c
}

.tile.task-tile.warning-state {
    border-left-color: #f1c40f
}

.tile.task-tile.success-state {
    border-left-color: #2ecc71
}

.tile.task-tile.progress-state {
    border-left-color: #3498db
}

.tile.task-tile .tile-content:hover {
    cursor: pointer
}

.tile.task-tile .tile-action {
    border-left: 1px solid #eeeef0;
    margin-left: .5rem;
    padding-left: .5rem
}

.tile.task-tile .tile-title {
    margin-bottom: .5rem
}

.tile.task-tile .tile-subtitle {
    margin-bottom: 0
}

.card,
.empty,
.panel {
    box-shadow: 0 .25rem 1rem #dcdde1;
    border: none;
    background: #fff
}

.card.grey,
.empty.grey,
.panel.grey {
    box-shadow: none !important;
    border: none !important;
    background: #eeeef0
}

.card.grey:hover,
.empty.grey:hover,
.panel.grey:hover {
    box-shadow: none !important
}

.card:hover,
.empty:hover,
.panel:hover {
    box-shadow: 0 .25rem .25rem #acacac
}

.card .panel-nested,
.card .panel-nested .panel-body,
.empty .panel-nested,
.empty .panel-nested .panel-body,
.panel .panel-nested,
.panel .panel-nested .panel-body {
    margin: 0 !important;
    padding: 0 !important
}

.card .panel,
.empty .panel,
.panel .panel {
    box-shadow: 0 .25rem .5rem #eeeef0;
    border: 1px solid #eeeef0
}

.card .panel.dark,
.empty .panel.dark,
.panel .panel.dark {
    box-shadow: none;
    border: none
}

.card .panel.dark:hover,
.empty .panel.dark:hover,
.panel .panel.dark:hover {
    box-shadow: none !important
}

.card.no-shadow,
.empty.no-shadow,
.panel.no-shadow {
    box-shadow: none
}

.card.no-shadow:hover,
.empty.no-shadow:hover,
.panel.no-shadow:hover {
    box-shadow: none !important
}

.card .card-header a .card-subtitle,
.card .card-header a .h5,
.empty .card-header a .card-subtitle,
.empty .card-header a .h5,
.panel .card-header a .card-subtitle,
.panel .card-header a .h5 {
    color: #545454
}

.card .card-header a:hover,
.empty .card-header a:hover,
.panel .card-header a:hover {
    text-decoration: none
}

.card .card-header a:hover .card-subtitle,
.card .card-header a:hover .h5,
.empty .card-header a:hover .card-subtitle,
.empty .card-header a:hover .h5,
.panel .card-header a:hover .card-subtitle,
.panel .card-header a:hover .h5 {
    color: #00a1d4
}

.card.tools-teams .card-title,
.empty.tools-teams .card-title,
.panel.tools-teams .card-title {
    color: #c33e13
}

.card.level-1 .card-title,
.empty.level-1 .card-title,
.panel.level-1 .card-title {
    color: #1b6395
}

.card.level-2 .card-title,
.empty.level-2 .card-title,
.panel.level-2 .card-title {
    color: #138d52
}

.card.dark,
.card.mid-dark,
.empty.dark,
.empty.mid-dark,
.panel.dark,
.panel.mid-dark {
    background: #454559;
    color: #fff
}

.card.dark a,
.card.mid-dark a,
.empty.dark a,
.empty.mid-dark a,
.panel.dark a,
.panel.mid-dark a {
    color: #fff;
    text-decoration: none;
    cursor: pointer !important
}

.card.dark a:hover,
.card.mid-dark a:hover,
.empty.dark a:hover,
.empty.mid-dark a:hover,
.panel.dark a:hover,
.panel.mid-dark a:hover {
    color: #e2f8fe;
    text-decoration: underline
}

.card.dark .timeline .timeline-item,
.card.mid-dark .timeline .timeline-item,
.empty.dark .timeline .timeline-item,
.empty.mid-dark .timeline .timeline-item,
.panel.dark .timeline .timeline-item,
.panel.mid-dark .timeline .timeline-item {
    margin-bottom: .75rem
}

.card.dark .timeline .timeline-item:before,
.card.mid-dark .timeline .timeline-item:before,
.empty.dark .timeline .timeline-item:before,
.empty.mid-dark .timeline .timeline-item:before,
.panel.dark .timeline .timeline-item:before,
.panel.mid-dark .timeline .timeline-item:before {
    background: #24253c
}

.card.dark .timeline .timeline-item .timeline-icon,
.card.mid-dark .timeline .timeline-item .timeline-icon,
.empty.dark .timeline .timeline-item .timeline-icon,
.empty.mid-dark .timeline .timeline-item .timeline-icon,
.panel.dark .timeline .timeline-item .timeline-icon,
.panel.mid-dark .timeline .timeline-item .timeline-icon {
    border: 2px solid #fff !important
}

.card.dark .timeline .timeline-item:last-child:before,
.card.mid-dark .timeline .timeline-item:last-child:before,
.empty.dark .timeline .timeline-item:last-child:before,
.empty.mid-dark .timeline .timeline-item:last-child:before,
.panel.dark .timeline .timeline-item:last-child:before,
.panel.mid-dark .timeline .timeline-item:last-child:before {
    background: transparent
}

.card.dark .step .step-item:not(:first-child):before,
.card.mid-dark .step .step-item:not(:first-child):before,
.empty.dark .step .step-item:not(:first-child):before,
.empty.mid-dark .step .step-item:not(:first-child):before,
.panel.dark .step .step-item:not(:first-child):before,
.panel.mid-dark .step .step-item:not(:first-child):before {
    background: #fff
}

.card.dark .step .step-item a,
.card.mid-dark .step .step-item a,
.empty.dark .step .step-item a,
.empty.mid-dark .step .step-item a,
.panel.dark .step .step-item a,
.panel.mid-dark .step .step-item a {
    color: #fff !important
}

.card.dark .step .step-item a:before,
.card.mid-dark .step .step-item a:before,
.empty.dark .step .step-item a:before,
.empty.mid-dark .step .step-item a:before,
.panel.dark .step .step-item a:before,
.panel.mid-dark .step .step-item a:before {
    width: .75rem;
    height: .75rem;
    top: .15rem;
    border-color: #fff !important;
    background: #00a1d4
}

.card.dark .step .step-item a:hover,
.card.mid-dark .step .step-item a:hover,
.empty.dark .step .step-item a:hover,
.empty.mid-dark .step .step-item a:hover,
.panel.dark .step .step-item a:hover,
.panel.mid-dark .step .step-item a:hover {
    color: #545454
}

.card.dark .step .step-item.active a,
.card.mid-dark .step .step-item.active a,
.empty.dark .step .step-item.active a,
.empty.mid-dark .step .step-item.active a,
.panel.dark .step .step-item.active a,
.panel.mid-dark .step .step-item.active a {
    font-weight: 600 !important;
    color: #3498db
}

.card.dark .step .step-item.active a ion-icon,
.card.mid-dark .step .step-item.active a ion-icon,
.empty.dark .step .step-item.active a ion-icon,
.empty.mid-dark .step .step-item.active a ion-icon,
.panel.dark .step .step-item.active a ion-icon,
.panel.mid-dark .step .step-item.active a ion-icon {
    color: #3498db
}

.card.dark .step .step-item .btn.btn-sm,
.card.mid-dark .step .step-item .btn.btn-sm,
.empty.dark .step .step-item .btn.btn-sm,
.empty.mid-dark .step .step-item .btn.btn-sm,
.panel.dark .step .step-item .btn.btn-sm,
.panel.mid-dark .step .step-item .btn.btn-sm {
    padding: .15rem .3rem
}

.card.dark table.table,
.card.mid-dark table.table,
.empty.dark table.table,
.empty.mid-dark table.table,
.panel.dark table.table,
.panel.mid-dark table.table {
    background: transparent !important
}

.card.dark table.table td,
.card.dark table.table th,
.card.mid-dark table.table td,
.card.mid-dark table.table th,
.empty.dark table.table td,
.empty.dark table.table th,
.empty.mid-dark table.table td,
.empty.mid-dark table.table th,
.panel.dark table.table td,
.panel.dark table.table th,
.panel.mid-dark table.table td,
.panel.mid-dark table.table th {
    border-color: #24253c
}

.card.dark table.table td:hover,
.card.dark table.table th:hover,
.card.mid-dark table.table td:hover,
.card.mid-dark table.table th:hover,
.empty.dark table.table td:hover,
.empty.dark table.table th:hover,
.empty.mid-dark table.table td:hover,
.empty.mid-dark table.table th:hover,
.panel.dark table.table td:hover,
.panel.dark table.table th:hover,
.panel.mid-dark table.table td:hover,
.panel.mid-dark table.table th:hover {
    background: transparent !important
}

.card.dark table.table thead,
.card.mid-dark table.table thead,
.empty.dark table.table thead,
.empty.mid-dark table.table thead,
.panel.dark table.table thead,
.panel.mid-dark table.table thead {
    background: #505067 !important
}

.card.dark table.table thead th,
.card.mid-dark table.table thead th,
.empty.dark table.table thead th,
.empty.mid-dark table.table thead th,
.panel.dark table.table thead th,
.panel.mid-dark table.table thead th {
    color: #fff;
    background: #505067 !important
}

.card.dark table.table thead th:hover,
.card.mid-dark table.table thead th:hover,
.empty.dark table.table thead th:hover,
.empty.mid-dark table.table thead th:hover,
.panel.dark table.table thead th:hover,
.panel.mid-dark table.table thead th:hover {
    background: #505067 !important
}

.card.dark table.table.table-striped tbody tr,
.card.dark table.table tbody,
.card.dark table.table tfoot,
.card.mid-dark table.table.table-striped tbody tr,
.card.mid-dark table.table tbody,
.card.mid-dark table.table tfoot,
.empty.dark table.table.table-striped tbody tr,
.empty.dark table.table tbody,
.empty.dark table.table tfoot,
.empty.mid-dark table.table.table-striped tbody tr,
.empty.mid-dark table.table tbody,
.empty.mid-dark table.table tfoot,
.panel.dark table.table.table-striped tbody tr,
.panel.dark table.table tbody,
.panel.dark table.table tfoot,
.panel.mid-dark table.table.table-striped tbody tr,
.panel.mid-dark table.table tbody,
.panel.mid-dark table.table tfoot {
    background: transparent !important
}

.card.dark table.table.table-striped tbody tr td .popover ion-icon[name=ellipsis-horizontal],
.card.mid-dark table.table.table-striped tbody tr td .popover ion-icon[name=ellipsis-horizontal],
.empty.dark table.table.table-striped tbody tr td .popover ion-icon[name=ellipsis-horizontal],
.empty.mid-dark table.table.table-striped tbody tr td .popover ion-icon[name=ellipsis-horizontal],
.panel.dark table.table.table-striped tbody tr td .popover ion-icon[name=ellipsis-horizontal],
.panel.mid-dark table.table.table-striped tbody tr td .popover ion-icon[name=ellipsis-horizontal] {
    color: #3498db
}

.card.dark table.table.table-striped tbody tr td:hover,
.card.mid-dark table.table.table-striped tbody tr td:hover,
.empty.dark table.table.table-striped tbody tr td:hover,
.empty.mid-dark table.table.table-striped tbody tr td:hover,
.panel.dark table.table.table-striped tbody tr td:hover,
.panel.mid-dark table.table.table-striped tbody tr td:hover {
    background: transparent !important
}

.card.dark table.table.table-striped thead tr:nth-of-type(odd),
.card.mid-dark table.table.table-striped thead tr:nth-of-type(odd),
.empty.dark table.table.table-striped thead tr:nth-of-type(odd),
.empty.mid-dark table.table.table-striped thead tr:nth-of-type(odd),
.panel.dark table.table.table-striped thead tr:nth-of-type(odd),
.panel.mid-dark table.table.table-striped thead tr:nth-of-type(odd) {
    background: #373746 !important
}

.card.dark table.table.table-striped thead tr:nth-of-type(odd) td:hover th:hover,
.card.mid-dark table.table.table-striped thead tr:nth-of-type(odd) td:hover th:hover,
.empty.dark table.table.table-striped thead tr:nth-of-type(odd) td:hover th:hover,
.empty.mid-dark table.table.table-striped thead tr:nth-of-type(odd) td:hover th:hover,
.panel.dark table.table.table-striped thead tr:nth-of-type(odd) td:hover th:hover,
.panel.mid-dark table.table.table-striped thead tr:nth-of-type(odd) td:hover th:hover {
    background: transparent !important
}

.card.dark table.table.table-striped tbody tr:nth-of-type(odd),
.card.mid-dark table.table.table-striped tbody tr:nth-of-type(odd),
.empty.dark table.table.table-striped tbody tr:nth-of-type(odd),
.empty.mid-dark table.table.table-striped tbody tr:nth-of-type(odd),
.panel.dark table.table.table-striped tbody tr:nth-of-type(odd),
.panel.mid-dark table.table.table-striped tbody tr:nth-of-type(odd) {
    background: #3f3f52 !important
}

.card.dark table.table.table-striped tbody tr:nth-of-type(odd) td:hover th:hover,
.card.mid-dark table.table.table-striped tbody tr:nth-of-type(odd) td:hover th:hover,
.empty.dark table.table.table-striped tbody tr:nth-of-type(odd) td:hover th:hover,
.empty.mid-dark table.table.table-striped tbody tr:nth-of-type(odd) td:hover th:hover,
.panel.dark table.table.table-striped tbody tr:nth-of-type(odd) td:hover th:hover,
.panel.mid-dark table.table.table-striped tbody tr:nth-of-type(odd) td:hover th:hover {
    background: transparent !important
}

.card.mid-dark,
.empty.mid-dark,
.panel.mid-dark {
    background: #82abd1
}

.card.mid-dark .divider,
.empty.mid-dark .divider,
.panel.mid-dark .divider {
    border-color: #fff
}

.card .columns,
.empty .columns,
.panel .columns {
    margin-bottom: 0 !important
}

.card .card-title .material-icons,
.card a,
.empty .card-title .material-icons,
.empty a,
.panel .card-title .material-icons,
.panel a {
    color: #3498db
}

.card a:active,
.card a:hover,
.empty a:active,
.empty a:hover,
.panel a:active,
.panel a:hover {
    color: #00a1d4
}

.card.active,
.empty.active,
.panel.active {
    color: #fff;
    background: #82abd1
}

.card.active a,
.card.active ion-icon,
.empty.active a,
.empty.active ion-icon,
.panel.active a,
.panel.active ion-icon {
    color: #fff
}

.card.active .text-primary,
.empty.active .text-primary,
.panel.active .text-primary {
    color: #e2f8fe
}

.card.active .text-warning,
.empty.active .text-warning,
.panel.active .text-warning {
    color: #fbeeba
}

.card.active .text-error,
.empty.active .text-error,
.panel.active .text-error {
    color: #fbe0dd
}

.card.active .text-success,
.empty.active .text-success,
.panel.active .text-success {
    color: #d1f5e0
}

.panel:hover {
    box-shadow: 0 .25rem 1rem #dcdde1 !important
}

.panel .panel-body {
    overflow: visible !important;
    padding: 0 1rem
}

.empty {
    background: #fff
}

.card .card-image {
    position: relative;
    z-index: 1;
    overflow: hidden
}

.card .card-image .card-overlay {
    position: absolute;
    z-index: 3;
    width: 100%;
    background: rgba(0, 0, 0, .5);
    color: #fff;
    text-align: center;
    top: 35%
}

.card .card-image .card-overlay h2 {
    margin: .5rem 0
}

.home-sections h2,
.home-sections h3 {
    /*font-size: 1.4rem;*/
    font-size: 32px;
    font-weight: 700 !important
}

.home-sections h2 .pre-title,
.home-sections h3 .pre-title {
    /*font-size: .9rem;*/
    font-size: 22px;
    font-weight: 400 !important
}

.home-sections .section-icon {
    width: 60%;
}

/*new*/

.home-sections.secondary-section .section-icon {
    width: auto !important;
    margin-bottom: 1rem !important;
}

.home-sections.secondary-section .height-full {
    padding-bottom: 0px !important;
}

/*end*/

.report-types .report-img {
    max-width: 250px
}

.what-nine-types .list-item {
    display: flex;
    align-items: flex-start;
    text-decoration: none
}

.what-nine-types .list-item .text-container {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin-left: 10px
}

.what-nine-types .list-item .text-container span,
.what-nine-types .list-item .text-container strong {
    align-self: flex-start
}

.what-nine-types .list-item .text-container span a,
.what-nine-types .list-item .text-container strong a {
    color: #fff
}

.botton-nav {
    border-bottom: 1px solid #263440;
    border-top: 6px solid #ff924e
}

#footer-content {
    text-align: right;
    color: #545454;
    padding: 1rem;
    margin-top: auto;
    background: #fff
}

#footer-content small {
    font-size: .75rem
}

#footer-content .columns {
    margin-bottom: 0
}

#footer-content.dark {
    background: #001120 !important;
    color: #fff;
    text-align: center
}

#footer-content.dark a {
    color: #6fd0f5
}

#footer-content.dark.universal {
    text-align: left;
    padding: 0
}

#footer-content.dark.universal a {
    color: #6fd0f5 !important
}

#footer-content.dark.universal a.btn-primary {
    color: #fff !important
}

#footer-content.dark.universal ul {
    list-style: none;
    margin: 0 0 0 .25rem
}

#footer-content.dark.universal ul li {
    margin-top: .25rem
}

#footer-content.dark.universal .pre-footer {
    padding: 2.5rem 0
}

#footer-content.dark.universal .post-footer {
    background: rgba(0, 0, 0, .5) !important;
    padding: 1rem 0
}

#mobile-menu.menu {
    background: #fff;
    top: 73px;
    left: 0;
    z-index: 5000;
    width: 100%
}

#mobile-menu.menu .accordion {
    border-bottom: 1px dotted #acacac
}

#mobile-menu.menu .accordion .accordion-header {
    padding: .4rem
}

#mobile-menu.menu .accordion .accordion-header ion-icon {
    color: #3498db
}

#mobile-menu.menu .accordion .accordion-body {
    margin-bottom: 0
}

#mobile-menu.menu .accordion .accordion-body .menu {
    box-shadow: none;
    padding-top: 0
}

#mobile-menu.menu .accordion .accordion-header,
#mobile-menu.menu .accordion .accordion-header a,
#mobile-menu.menu input,
#mobile-menu.menu select {
    color: #545454
}

#mobile-menu.menu .btn.btn-primary.btn-sm {
    background: #3fc1f2;
    border: .05rem solid #00a1d4;
    border-radius: .25em;
    color: #fff;
    cursor: pointer;
    line-height: 1rem;
    outline: none;
    font-size: .7rem;
    height: 1.4rem;
    padding: .15rem .3rem
}

#mobile-menu.menu .btn.btn-primary.btn-sm ion-icon {
    color: #fff
}

#mobile-menu.menu .divider-vert[data-content]:after,
#mobile-menu.menu .divider[data-content]:after {
    color: #9596a5;
    background: #24253c
}

#mobile-menu.menu .accordion a,
#mobile-menu.menu .accordion a:visited,
#mobile-menu.menu .menu-item a,
#mobile-menu.menu .menu-item a:visited {
    color: #545454;
    font-size: .75rem;
    background: none
}

#mobile-menu.menu .accordion a.active,
#mobile-menu.menu .accordion a:focus,
#mobile-menu.menu .accordion a:visited.active,
#mobile-menu.menu .accordion a:visited:focus,
#mobile-menu.menu .menu-item a.active,
#mobile-menu.menu .menu-item a:focus,
#mobile-menu.menu .menu-item a:visited.active,
#mobile-menu.menu .menu-item a:visited:focus {
    color: #545454 !important;
    background: none
}

#mobile-menu.menu .accordion a.active ion-icon,
#mobile-menu.menu .accordion a:focus ion-icon,
#mobile-menu.menu .accordion a:visited.active ion-icon,
#mobile-menu.menu .accordion a:visited:focus ion-icon,
#mobile-menu.menu .menu-item a.active ion-icon,
#mobile-menu.menu .menu-item a:focus ion-icon,
#mobile-menu.menu .menu-item a:visited.active ion-icon,
#mobile-menu.menu .menu-item a:visited:focus ion-icon {
    color: #3498db
}

#mobile-menu.menu .accordion a:hover,
#mobile-menu.menu .accordion a:visited:hover,
#mobile-menu.menu .menu-item a:hover,
#mobile-menu.menu .menu-item a:visited:hover {
    color: #3498db !important
}

#mobile-menu.menu .accordion a:hover ion-icon,
#mobile-menu.menu .accordion a:visited:hover ion-icon,
#mobile-menu.menu .menu-item a:hover ion-icon,
#mobile-menu.menu .menu-item a:visited:hover ion-icon {
    color: #00a1d4 !important
}

#mobile-menu.menu .accordion a:visited ion-icon,
#mobile-menu.menu .accordion a ion-icon,
#mobile-menu.menu .menu-item a:visited ion-icon,
#mobile-menu.menu .menu-item a ion-icon {
    color: #3498db
}

.mobile-menu-show {
    margin: .3rem -1rem .25rem 0
}

ul.no-bullets {
    margin: 0
}

ul.no-bullets li {
    list-style: none;
    border-bottom: 1px solid #eeeef0;
    padding-bottom: .35rem
}

ul.no-bullets.no-lines li {
    border-bottom: none;
    padding-bottom: 0
}

.scroll-to-anchor {
    display: block;
    visibility: hidden;
    position: relative;
    top: -120px;
    transition: top .5s ease-in-out
}

.fade-in {
    animation: fade-in 1.5s
}

.fade-out {
    animation: fade-out 1.5s
}

@keyframes fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fade-out {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.home-banner,
.page-banner,
.web-page-wrapper {
    padding-top: 120px
}

/* Begin NEW Banner */
#homeBanner {
    margin-bottom: 0;
    /*background: url('https://cdn.integrative9.com/website/images/home-header-1.webp') no-repeat left top #1D547D;*/
    background-color:  #1D547D;
    position: relative;
   /* background-size: contain;
    transition: background-image 2s ease-in-out;*/
}

#homeBanner .background-images-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
}

#homeBanner .bg-image {
position: absolute;
top: 0;
left: 0;
width: 60%;
height: 100%;
background-position: center;
background-size: cover;
opacity: 0;
transition: opacity 1.5s ease;
-moz-transition: opacity 1.5s ease; /* Firefox specific */
will-change: opacity; /* Performance hint */
}

#homeBanner .bg-image.active {
opacity: 1;
}

#homeBanner .home-banner-container {
position: relative;
z-index: 1; /* Keep content above backgrounds */
}
 /* END new banner */ 

.page-banner {
    border-bottom: 1px solid #dcdde1;
    margin-bottom: 2rem
}

.page-banner h1 {
    font-size: 2.4em
}

.home-banner-container,
.page-banner-container {
    padding: 4rem 2rem
}

.home-banner-container {
    padding: 1rem 2rem
}

.home-banner-container .home-banner-graphic {
    width: 800px;
    bottom: 0;
    left: -150px
}

.home-banner-container .home-banner-header {
    padding: 1rem;
    color: #fff
}

.home-banner-container .home-banner-header .pre-header {
    border-bottom: 1px solid #fff;
    font-size: 1rem
}

.home-banner-container .home-banner-header #take-test-hero {
    margin: 25% -25px 0;
    z-index: 5
}

.home-banner-container .home-banner-header .list-item {
    display: flex;
    align-items: center;
}

.home-banner-container .home-banner-header .list-item .list-item-text {
    margin-left: 0.6em;
}

.home-banner-container .home-banner-report {
    width: 250px
}

.page-banner-container .ieq9-banner-tag {
    bottom: -6px;
    right: 0
}

.page-banner-container .page-header-wrapper {
    background: rgba(0, 0, 0, .65);
    padding: .25rem 1rem;
    display: inline-block
}

.page-banner-container .page-header-wrapper h1,
.page-banner-container .page-header-wrapper h2,
.page-banner-container .page-header-wrapper h3,
.page-banner-container .page-header-wrapper h4 {
    color: #fff;
    display: inline
}

blockquote:before {
    color: #555;
    font-size: 4rem;
    content: "“";
    position: absolute;
    font-family: Georgia, serif
}

blockquote.top-quote {
    padding-top: 2rem
}

blockquote.top-quote:before {
    left: 46%;
    top: -1rem
}

blockquote.left-quote {
    padding-left: 1rem
}

blockquote.left-quote:before {
    left: 0;
    top: -1rem
}

blockquote.no-quote:before {
    content: "";
    display: none
}

.types-navigation {
    border-bottom: 1px solid #dcdde1
}

.types-navigation.bottom {
    border-top: 1px solid #dcdde1;
    border-bottom: none
}

.types-navigation .types-navigation-wrapper {
    line-height: .5rem;
    vertical-align: middle
}

.shadow-wrapper {
    z-index: 1
}

.shadow-wrapper blockquote {
    border-left: .2rem solid #acacac;
    margin-right: 0;
    min-height: 105px
}

.shadow-wrapper blockquote:after,
.shadow-wrapper blockquote:before {
    top: 80%;
    left: 5px;
    width: 50%;
    z-index: -1;
    content: "";
    bottom: 15px;
    max-width: 300px;
    background: #999;
    position: absolute
}

.shadow-wrapper blockquote:before {
    transform: rotate(-3deg);
    box-shadow: 0 15px 10px #999
}

.shadow-wrapper blockquote:after {
    left: auto;
    right: 5px;
    transform: rotate(3deg);
    box-shadow: 0 15px 10px #999
}

.page-navigation-wrapper .dropdown-menu {
    color: #545454;
    display: block;
    padding: 1rem;
    position: inherit !important
}

.page-navigation-wrapper .dropdown-menu a {
    display: block;
    color: #545454;
    font-size: .7rem
}

.page-navigation-wrapper .dropdown-menu a:hover {
    text-decoration: none
}

.page-navigation-wrapper .dropdown-menu .item-wrap {
    width: 100%
}

.page-navigation-wrapper .dropdown-menu .item-wrap .item {
    background: #f6f6f8;
    border: 1px solid #f6f6f8;
    display: block;
    margin-bottom: 10px;
    padding: 8px;
    clear: both;
    min-height: 78px;
    line-height: 50px
}

.page-navigation-wrapper .dropdown-menu .item-wrap .item p {
    margin: 0;
    padding: 0;
    display: inline-block;
    vertical-align: middle;
    line-height: normal
}

.page-navigation-wrapper .dropdown-menu .item-wrap .item:last-child {
    margin-bottom: 0
}

.page-navigation-wrapper .dropdown-menu .item-wrap .item img {
    float: left;
    vertical-align: middle;
    margin-right: 10px
}

.page-navigation-wrapper .dropdown-menu .item-wrap .item:hover {
    background: #eeeef0;
    border: 1px solid #dcdde1
}

.page-navigation-wrapper.about .dropdown-menu a,
.page-navigation-wrapper.contact .dropdown-menu a,
.page-navigation-wrapper.faculty .dropdown-menu a,
.page-navigation-wrapper.testimonials .dropdown-menu a {
    color: #fff
}

.ennea-clients #tns1-iw {
    height: 85px;
    margin-right: 0 !important;
    margin-left: -20px !important
}

.ennea-clients button {
    display: none
}

.ennea-clients .my-slider li.tns-item {
    text-align: center
}

.ennea-clients .my-slider li.tns-item img {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 0 auto
}

.articles-section .article-preview {
    max-width: 370px;
    margin: 0 auto
}

.articles-section .article-preview .article-image {
    z-index: 1
}

.articles-section .article-preview .article-image img {
    z-index: 2
}

.articles-section .article-preview .article-image .article-date {
    z-index: 3;
    padding: .25rem .75rem;
    background: #fff;
    text-align: center;
    line-height: .75rem;
    font-size: .5rem;
    top: 1rem;
    left: -.25rem;
    text-transform: uppercase
}

.articles-section .article-preview .article-image .article-date strong {
    display: block;
    font-size: .75rem
}

.article-template {
    padding-top: 160px;
    padding-bottom: 80px
}

.article-template .article-header .h6,
.article-template .article-header h6 {
    background: #4c4d4f;
    color: #fff;
    padding: .5rem 1rem;
    display: inline-flex;
    font-weight: 600 !important;
    margin-bottom: .5em
}

.article-template .article-header small {
    color: #acacac;
    font-size: .75rem
}

.article-template img.img-responsive.s-rounded.mt-4.mb-10.mb-sm-4 {
    width: 100%
}

.article-template .article-index .h4 strong,
.article-template .article-index h4 strong {
    margin-left: 5px
}

.article-template h3 {
    font-weight: 600 !important
}

.article-template recommended ul {
    list-style: none
}

.article-template recommended ul p {
    padding: 0
}

.article-template recommended img {
    margin-bottom: .25rem !important
}

.article-template blockquote:before {
    display: none
}

.ennea-testimonials {
    background: #fafafa
}

.ennea-testimonials .video-wrapper {
    width: 100%;
    height: 100%
}

.ennea-testimonials .video-wrapper iframe {
    width: 100%;
    aspect-ratio: 16/9
}

.ennea-testimonials .testimonial-wrapper blockquote {
    background: #fff;
    border: none;
    padding: 1.25rem 1.25rem 1.25rem 3rem;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 0
}

.ennea-testimonials .testimonial-wrapper blockquote:before {
    color: #bbb;
    font-size: 80px;
    content: "“";
    position: absolute;
    left: .75rem;
    top: 0;
    font-family: Georgia, serif
}

.ennea-testimonials .testimonial-wrapper .testimonial-author-image {
    width: 105px;
    height: 105px;
    overflow: hidden;
    border: 5px solid #acacac;
    margin: 0 1rem 0 0
}

.ennea-testimonials .testimonial-wrapper .testimonial-author-image img {
    width: 100%
}

.ennea-testimonials .testimonial-wrapper.bright-blue-border blockquote:before {
    color: #0086c2
}

.ennea-testimonials .testimonial-wrapper.bright-blue-border .testimonial-author-image {
    border-color: #0086c2
}

.ennea-testimonials .testimonial-wrapper.teal-border blockquote:before {
    color: #00bba6
}

.ennea-testimonials .testimonial-wrapper.teal-border .testimonial-author-image {
    border-color: #00bba6
}

.ennea-testimonials .testimonial-wrapper.mid-blue-border blockquote:before {
    color: #449ea7
}

.ennea-testimonials .testimonial-wrapper.mid-blue-border .testimonial-author-image {
    border-color: #449ea7
}

.ennea-testimonials .testimonial-wrapper.pink-border blockquote:before {
    color: #ff5a74
}

.ennea-testimonials .testimonial-wrapper.pink-border .testimonial-author-image {
    border-color: #ff5a74
}

.faq-wrapper .accordion .accordion-header {
    padding: 0
}

.faq-wrapper .accordion .accordion-header ion-icon {
    color: #fff
}

.faq-wrapper .accordion .accordion-body {
    padding: .25rem 0 0 1.5rem
}

mark {
    background: #e3ba70;
    font-weight: bolder
}

/* Animation */

.fromTopIn {
    transform: translate(0);
    opacity: 1
}

.fromTopIn,.fromTopOut {
    transition: transform 1s ease,opacity 1s ease
}

.fromTopOut {
    transform: translateY(-10px);
    opacity: 0
}

.fromBottomIn {
    transform: translate(0);
    opacity: 1
}

.fromBottomIn,.fromBottomOut {
    transition: transform 1s ease,opacity 1s ease
}

.fromBottomOut {
    transform: translateY(10px);
    opacity: 0
}

.fromLeftIn {
    transform: translate(0);
    opacity: 1
}

.fromLeftIn,.fromLeftOut {
    transition: transform 1s ease,opacity 1s ease
}

.fromLeftOut {
    transform: translate(-10px);
    opacity: 0
}

.fromRightIn {
    transform: translate(0);
    opacity: 1
}

.fromRightIn,.fromRightOut {
    transition: transform 1s ease,opacity 1s ease
}

.fromRightOut {
    transform: translate(10px);
    opacity: 0
}

.scaleUpIn {
    transform: scale(1);
    opacity: 1
}

.scaleUpIn,.scaleUpOut {
    transition: transform 1s ease,opacity 1s ease
}

.scaleUpOut {
    transform: scale(1.3);
    opacity: 0
}

.scaleDownIn {
    transform: scale(1);
    opacity: 1
}

.scaleDownIn,.scaleDownOut {
    transition: transform 1s ease,opacity 1s ease
}

.scaleDownOut {
    transform: scale(.7)
}

@media screen and (max-width:600px) {

    .height-full {
        height: auto;
        min-height: auto;
    }

    .float-sm-none {
        float: none !important
    }

    .p-sm-0 {
        padding: 0;
    }

    .m-sm-0 {
        margin: 0;
    }

    .pb-sm-0 {
        padding-bottom: 0
    }

    .p-sm-4 {
        padding: .8rem
    }

    .px-sm-4 {
        padding-left: .8rem;
        padding-right: .8rem
    }

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

    .py-sm-0 {
        padding-bottom: 0
    }

    .pt-sm-0,
    .py-sm-0 {
        padding-top: 0
    }

    .mb-sm-0 {
        margin-bottom: 0
    }

    .mt-sm-0 {
        margin-top: 0
    }

    .mt-sm-1 {
        margin-top: .25rem
    }

    .d-border-none {
        border: none !important
    }

    .mb-sm-4 {
        margin-bottom: .8rem
    }

    .mb-sm-3 {
        margin-bottom: .5rem;
    }

    .pb-sm-10 {
        padding-bottom: 1.5rem !important;
    }

    .mt-sm-4 {
        margin-top: .8rem
    }

    .ml-sm-0 {
        margin-left: 0
    }

    .mr-sm-0 {
        margin-right: 0
    }

    .my-sm-4 {
        margin-top: .8rem !important;
        margin-bottom: .8rem !important
    }

    .mx-sm-4 {
        margin-left: .8rem !important;
        margin-right: .8rem !important
    }

    .mx-sm-0 {
        margin-left: 0;
        margin-right: 0
    }

    .my-sm-0 {
        margin-top: 0;
        margin-bottom: 0
    }

    .sm-width-full {
        width: 100% !important
    }

    .mt-sm-250 {
        margin-top: 250px
    }

    .mt-sm-45 {
        margin-top: 45px
    }

    .intelligence-banner {
        padding-top: 8px !important
    }

    .icon-sm-lg {
        width: 85px !important;
        height: 85px !important;
        margin: 0 auto !important
    }

    .btn-lg-web {
        font-size: .85rem;
        height: 2rem;
        padding: .35rem .75rem;
        line-height: 1.25rem
    }

    span.report-list-info {
        max-width: 250px;
        display: inline-block;
    }

    .ennea-table-article td,
    .ennea-table-article th,
    table td,
    table th {
        font-size: .7rem !important
    }

    .home-banner-container,
    .page-banner-container {
        padding: 1rem 0!important;
    }

    .home-banner,
    .page-banner,
    .web-page-wrapper {
        padding-top: 100px;
        margin-bottom: 1rem
    }



    .home-banner .home-banner-header {
        padding: 0
    }

    .page-banner-container .page-header-wrapper {
        margin: .75rem 0 .25rem
    }

    .page-banner-container .ieq9-banner-tag img {
        width: 125px
    }

    .page-header-wrapper h1 {
        font-size: 1.5rem
    }

    .page-header-wrapper.has-banner-tag {
        margin-bottom: 2.25rem !important
    }

    .article-template {
        padding-top: 100px
    }

    .scroll-to-anchor {
        top: -100px;
        transition: top .5s ease-in-out
    }

    #admin-header a.off-canvas-toggle {
        margin-right: 0
    }

    td {
        border: none;
        padding: .3rem
    }

    td .popover.popover-left .popover-container {
        left: 50px !important
    }

    .navbar-section .dropdown .menu {
        right: 0;
        left: auto
    }

    .text-left-sm {
        text-align: left
    }

    .text-right-sm {
        text-align: right
    }

    .text-center-sm {
        text-align: center
    }

    .table tr.text-large td,
    .text-large {
        font-size: .85rem
    }

    .d-sm-block {
        display: block !important;
        float: none !important;
        width: 100%;
        margin: .25rem 0 !important
    }

    #admin-header .container {
        padding-left: .4rem;
        padding-right: .4rem
    }

    /*#admin-header a.navbar-brand {
        margin-left: 2.25rem
    }*/

    #admin-header.dark.universal.scroll-scale {
        padding: .5rem 1rem 0
    }

    #admin-header.dark.universal.scroll-scale .navbar-brand img {
        width: 175px;
        margin: 0 !important
    }

    #admin-header.dark.universal img.mobile-logo {
        /*margin: -20px 0 10px 0 !important;*/
        margin: 3px 0 10px 0 !important;
      }
    
      #admin-header.dark.universal .mobile-menu-show a {
        color: #fff;
      }
    
      #admin-header.dark.universal .web-navigation {
        position: absolute;
        left: 0;
        top: 83px;
        background: #fff;
        margin: 0px -20px;
        padding: 0.25rem;
        border-top: 3px solid #3498db;
        display: none;
      }

      #admin-header.dark.universal.scroll-scale .web-navigation {
        margin: -13px -20px 0!important;
    }
    
      #admin-header.dark.universal .web-navigation.responsive {
        display: block;
      }
    
      #admin-header.dark.universal .web-navigation>li {
        width: 100%;
        margin: 0;
        padding: 0;
        text-align: left;
        border-bottom: 1px dotted #acacac;
      }
    
      #admin-header.dark.universal .web-navigation>li a {
        margin: 0;
        padding: 0.25rem!important;
        color: #545454;
        font-size: .75rem;
        background: none;
        text-transform: uppercase;
      }
    
      #admin-header.dark.universal .web-navigation>li a ion-icon {
        color: #3498db;
        display: inline-block;
      }
    
      #admin-header.dark.universal .web-navigation>li a:hover {
        color: #00a1d4 !important;
      }
    
      #admin-header.dark.universal .web-navigation>li a:hover>a {
        color: #00a1d4 !important;
        text-decoration: none;
      }
    
      #admin-header.dark.universal .web-navigation>li a.btn-primary {
        background: #3498db;
        color: #fff;
      }
    
      #admin-header.dark.universal .web-navigation>li a.btn-primary ion-icon {
        color: #fff;
      }
    
      #admin-header.dark.universal .web-navigation>li a.btn-primary:hover {
        color: #fff !important;
      }
    
      #admin-header.dark.universal .web-navigation>li a.btn-primary:first-child {
        margin-bottom: 0.25rem;
      }
    
      #admin-header.dark.universal .web-navigation>li ul {
        width: 100%;
        left: -999em;
        position: absolute;
        margin-left: 1.25rem;
        padding: 0;
        border: none;
      }
    
      #admin-header.dark.universal .web-navigation>li ul.last-item li {
        width: 100%;
      }
    
      #admin-header.dark.universal .web-navigation>li ul li {
        width: 100%;
        margin: 0;
      }
    
      #admin-header.dark.universal .web-navigation>li ul li a.nav-item {
        background: transparent;
        border: none;
        margin: 0;
        padding: 0.15rem;
        min-height: auto;
        line-height: auto;
        color: #545454;
        font-size: .75rem;
        text-transform: inherit;
      }
    
      #admin-header.dark.universal .web-navigation>li ul li a.nav-item:hover {
        border: none;
        color: #00a1d4 !important;
        background: transparent;
      }
    
      #admin-header.dark.universal .web-navigation>li ul li a.nav-item img {
        display: none;
      }
    
      #admin-header.dark.universal .web-navigation>li.has-child:hover>a:after {
        display: none;
      }
    
      #admin-header.dark.universal .web-navigation>li:hover ul,
      #admin-header.dark.universal .web-navigation>li.has-child.touched ul {
        left: 0;
        position: inherit;
      }

    .container {
        padding-left: 1rem;
        padding-right: 1rem
    }
}

/* Right to left styles */

html[dir="rtl"] #admin-header.dark.transparent #admin-pre-header > .container.grid-xl {
    text-align: left;
}

html[dir="rtl"] #admin-header.dark.universal .web-navigation>li ul li {
    text-align: right;
}

html[dir="rtl"] #admin-header.dark.universal .web-navigation>li ul li a.nav-item {
	min-height: 75px;
    height: 75px;
}

html[dir="rtl"] #admin-header.dark.universal .web-navigation>li ul li a.nav-item img {
    float: right;
    margin-right: 0;
    margin-left: 8px
}

html[dir="rtl"] .what-nine-types .list-item a img {
    margin-left: 15px!important;
}

html[dir="rtl"] .get-your-type-large .col-mr-auto {
    margin-right: 0;
}

html[dir="rtl"] .home-banner-header > .mr-10 {
    margin-right: 0;
}

html[dir="rtl"] .mr-10 {
    margin-right: 0;
    margin-left: 2rem;
}

html[dir="rtl"] .text-right { /* test */
    text-align: left;
}

html[dir="rtl"] .text-left { /* test */
    text-align: right;
}

html[dir="rtl"] .mr-4 {
    margin-right: 0;
    margin-left: .8rem;
}

html[dir="rtl"] .ml-4 {
    margin-left: 0;
    margin-right: .8rem;
}

html[dir="rtl"] .btn-group .btn:first-child:not(:last-child) {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    margin-left: -.05rem;
}

html[dir="rtl"] .btn-group .btn:last-child:not(:first-child) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}


@media screen and (max-width:840px) {
    .text-left-sm {
        text-align: left
    }
}

@media screen and (max-width:960px) {

    #homeBanner {
        background-image: none !important;
    }
}

@media screen and (max-width:1125px) {
    .home-banner-container .home-banner-header #take-test-hero {
        margin: .25rem 0
    }

    .home-banner-container .home-banner-graphic {
        width: 715px
    }

}

@media screen and (max-width: 1366px) {

    #homeBanner {

        background-position: -60px top;
    }
}

@media screen and (max-width: 1280px) {
     #homeBanner .bg-image {
        display: none;
    }
}