/*!
 * Dashcore 4.0 (https://themeforest.net/user/5studios)
 * Sass & Startup HTML Template
 * Main SCSS file
 * Copyright 2024 The 5studios.net team (https://5studios.net)
 *
 * [ TABLE OF CONTENTS ]
 *
 * 1. RESET STYLES
 * 2. NAVIGATION
 *   2.1 - Navigation base styles
 *   2.2 - Pills
 * 3. FORMS
 *   3.1 - Form
 *   3.2 - Buttons
 * 4. UTILITIES
 *   4.1 - Background
 *   4.2 - Border
 *   4.3 - Devices
 *   4.4 - Lists
 *   4.5 - Misc
 *   4.6 - Overlay
 *   4.7 - Position
 *   4.8 - Responsive
 *   4.9 - Spacing
 *   4.10 - Text
 *   4.11 - Type
 * 5. GENERAL CONTENT STYLES
 *   5.1 - Page Loader
 *   5.2 - Mockup
 *   5.3 - Icons
 * 6. SECTIONS
 *   6.1 - General Styles
 *   6.2 - Testimonials
 *   6.3 - Footer
 * 7. PRICING
 *   7.1 - General styles
 *   7.2 - Pricing heading
 * 8. PAGE HEADING
 * 9. CUSTOM
 */

/*!
 * Bootstrap custom components to include
 * Include parts of Bootstrap framework, if you wish to include all,
 * you can safely delete all the bellow imports and leave just the main bootstrap import file
 * @import "bootstrap/scss/bootstrap";
 */

body {
    overflow-x: hidden;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important
}

a {
    -webkit-transition: all .3s ease-in;
    transition: all .3s ease-in
}

a,
a:active,
a:focus,
a:hover {
    outline: 0 !important;
    -webkit-text-decoration: none;
    text-decoration: none
}

hr {
    border: 0;
    border-top: 1px solid #d9e2ef;
    border-top: 1px solid var(--dc-border-color);
    display: block;
    height: 1px;
    margin: 1em 0;
    padding: 0
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle
}

fieldset {
    border: 0;
    margin: 0;
    min-width: 0;
    padding: 0
}

textarea {
    resize: vertical
}

.browserupgrade {
    background: #ccc;
    color: #000;
    margin: .2em 0;
    padding: .2em 0
}

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

:root,
[data-bs-theme=light] {
    --dc-panel-bg: #fff;
    --dc-navbar-color-rgb: 255, 255, 255;
    --dc-navbar-sticky-color-rgb: 0, 0, 0
}

[data-bs-theme=dark] {
    --dc-panel-bg: #242526;
    --dc-navbar-sticky-color-rgb: 255, 255, 255
}

.alert-thin {
    border-left-width: 5px
}

.alert-outline,
.alert-thin {
    background-color: transparent
}

[data-bs-theme=dark] .btn-outline-secondary {
    --dc-btn-color: rgba(249, 251, 253, .85);
    --dc-btn-hover-color: #242526;
    --dc-btn-active-color: #242526;
    --dc-btn-border-color: rgba(249, 251, 253, .25);
    --dc-btn-hover-bg: #f9fbfd;
    --dc-btn-active-bg: #f9fbfd
}

[data-bs-theme=dark] .btn-secondary {
    --dc-btn-color: rgba(249, 251, 253, .85);
    --dc-btn-hover-color: #f9fbfd;
    --dc-btn-active-color: #f9fbfd;
    --dc-btn-border-color: transparent;
    --dc-btn-hover-border-color: transparent;
    --dc-btn-active-border-color: transparent;
    --dc-btn-bg: rgba(249, 251, 253, .06);
    --dc-btn-hover-bg: rgba(249, 251, 253, .12);
    --dc-btn-active-bg: rgba(249, 251, 253, .12);
    --dc-btn-disabled-bg: rgba(249, 251, 253, .05);
    --dc-btn-disabled-border-color: transparent
}

.btn-discord {
    --dc-btn-bg:#5865F2;
    --dc-btn-border-color:#5865F2;
    --dc-btn-hover-bg:#4752C4;
    --dc-btn-hover-border-color:#4752C4;
    --dc-btn-active-bg:#3c3aa3;
    --dc-btn-active-border-color:#3c3aa3;
    --dc-btn-color:#fff;
    --dc-btn-hover-color:#fff;
    --dc-btn-active-color:#fff;
}

.btn-facebook {
    --dc-btn-color: #fff;
    --dc-btn-bg: #3b5998;
    --dc-btn-border-color: #3b5998;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #324c81;
    --dc-btn-hover-border-color: #2f477a;
    --dc-btn-focus-shadow-rgb: 88, 114, 167;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #2f477a;
    --dc-btn-active-border-color: #2c4372;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #3b5998;
    --dc-btn-disabled-border-color: #3b5998
}

.btn-outline-facebook {
    --dc-btn-color: #3b5998;
    --dc-btn-border-color: #3b5998;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #3b5998;
    --dc-btn-hover-border-color: #3b5998;
    --dc-btn-focus-shadow-rgb: 59, 89, 152;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #3b5998;
    --dc-btn-active-border-color: #3b5998;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #3b5998;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #3b5998;
    --dc-gradient: none
}

.btn-google {
    --dc-btn-color: #000;
    --dc-btn-bg: #dd4b39;
    --dc-btn-border-color: #dd4b39;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #e26657;
    --dc-btn-hover-border-color: #e05d4d;
    --dc-btn-focus-shadow-rgb: 188, 64, 48;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #e46f61;
    --dc-btn-active-border-color: #e05d4d;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #dd4b39;
    --dc-btn-disabled-border-color: #dd4b39
}

.btn-outline-google {
    --dc-btn-color: #dd4b39;
    --dc-btn-border-color: #dd4b39;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #dd4b39;
    --dc-btn-hover-border-color: #dd4b39;
    --dc-btn-focus-shadow-rgb: 221, 75, 57;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #dd4b39;
    --dc-btn-active-border-color: #dd4b39;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #dd4b39;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #dd4b39;
    --dc-gradient: none
}

.btn-gplus {
    --dc-btn-color: #000;
    --dc-btn-bg: #dd4b39;
    --dc-btn-border-color: #dd4b39;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #e26657;
    --dc-btn-hover-border-color: #e05d4d;
    --dc-btn-focus-shadow-rgb: 188, 64, 48;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #e46f61;
    --dc-btn-active-border-color: #e05d4d;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #dd4b39;
    --dc-btn-disabled-border-color: #dd4b39
}

.btn-outline-gplus {
    --dc-btn-color: #dd4b39;
    --dc-btn-border-color: #dd4b39;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #dd4b39;
    --dc-btn-hover-border-color: #dd4b39;
    --dc-btn-focus-shadow-rgb: 221, 75, 57;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #dd4b39;
    --dc-btn-active-border-color: #dd4b39;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #dd4b39;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #dd4b39;
    --dc-gradient: none
}

.btn-twitter {
    --dc-btn-color: #000;
    --dc-btn-bg: #00aced;
    --dc-btn-border-color: #00aced;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #26b8f0;
    --dc-btn-hover-border-color: #1ab4ef;
    --dc-btn-focus-shadow-rgb: 0, 146, 201;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #33bdf1;
    --dc-btn-active-border-color: #1ab4ef;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #00aced;
    --dc-btn-disabled-border-color: #00aced
}

.btn-outline-twitter {
    --dc-btn-color: #00aced;
    --dc-btn-border-color: #00aced;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #00aced;
    --dc-btn-hover-border-color: #00aced;
    --dc-btn-focus-shadow-rgb: 0, 172, 237;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #00aced;
    --dc-btn-active-border-color: #00aced;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #00aced;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #00aced;
    --dc-gradient: none
}

.btn-linkedin {
    --dc-btn-color: #fff;
    --dc-btn-bg: #007bb6;
    --dc-btn-border-color: #007bb6;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #00699b;
    --dc-btn-hover-border-color: #006292;
    --dc-btn-focus-shadow-rgb: 38, 143, 193;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #006292;
    --dc-btn-active-border-color: #005c89;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #007bb6;
    --dc-btn-disabled-border-color: #007bb6
}

.btn-outline-linkedin {
    --dc-btn-color: #007bb6;
    --dc-btn-border-color: #007bb6;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #007bb6;
    --dc-btn-hover-border-color: #007bb6;
    --dc-btn-focus-shadow-rgb: 0, 123, 182;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #007bb6;
    --dc-btn-active-border-color: #007bb6;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #007bb6;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #007bb6;
    --dc-gradient: none
}

.btn-pinterest {
    --dc-btn-color: #fff;
    --dc-btn-bg: #cb2027;
    --dc-btn-border-color: #cb2027;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #ad1b21;
    --dc-btn-hover-border-color: #a21a1f;
    --dc-btn-focus-shadow-rgb: 211, 65, 71;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #a21a1f;
    --dc-btn-active-border-color: #98181d;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #cb2027;
    --dc-btn-disabled-border-color: #cb2027
}

.btn-outline-pinterest {
    --dc-btn-color: #cb2027;
    --dc-btn-border-color: #cb2027;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #cb2027;
    --dc-btn-hover-border-color: #cb2027;
    --dc-btn-focus-shadow-rgb: 203, 32, 39;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #cb2027;
    --dc-btn-active-border-color: #cb2027;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #cb2027;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #cb2027;
    --dc-gradient: none
}

.btn-git {
    --dc-btn-color: #fff;
    --dc-btn-bg: #666;
    --dc-btn-border-color: #666;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #575757;
    --dc-btn-hover-border-color: #525252;
    --dc-btn-focus-shadow-rgb: 125, 125, 125;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #525252;
    --dc-btn-active-border-color: #4d4d4d;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #666;
    --dc-btn-disabled-border-color: #666
}

.btn-outline-git {
    --dc-btn-color: #666;
    --dc-btn-border-color: #666;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #666;
    --dc-btn-hover-border-color: #666;
    --dc-btn-focus-shadow-rgb: 102, 102, 102;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #666;
    --dc-btn-active-border-color: #666;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #666;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #666;
    --dc-gradient: none
}

.btn-tumblr {
    --dc-btn-color: #fff;
    --dc-btn-bg: #32506d;
    --dc-btn-border-color: #32506d;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #2b445d;
    --dc-btn-hover-border-color: #284057;
    --dc-btn-focus-shadow-rgb: 81, 106, 131;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #284057;
    --dc-btn-active-border-color: #263c52;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #32506d;
    --dc-btn-disabled-border-color: #32506d
}

.btn-outline-tumblr {
    --dc-btn-color: #32506d;
    --dc-btn-border-color: #32506d;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #32506d;
    --dc-btn-hover-border-color: #32506d;
    --dc-btn-focus-shadow-rgb: 50, 80, 109;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #32506d;
    --dc-btn-active-border-color: #32506d;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #32506d;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #32506d;
    --dc-gradient: none
}

.btn-vimeo {
    --dc-btn-color: #000;
    --dc-btn-bg: #aad450;
    --dc-btn-border-color: #aad450;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #b7da6a;
    --dc-btn-hover-border-color: #b3d862;
    --dc-btn-focus-shadow-rgb: 145, 180, 68;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #bbdd73;
    --dc-btn-active-border-color: #b3d862;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #aad450;
    --dc-btn-disabled-border-color: #aad450
}

.btn-outline-vimeo {
    --dc-btn-color: #aad450;
    --dc-btn-border-color: #aad450;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #aad450;
    --dc-btn-hover-border-color: #aad450;
    --dc-btn-focus-shadow-rgb: 170, 212, 80;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #aad450;
    --dc-btn-active-border-color: #aad450;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #aad450;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #aad450;
    --dc-gradient: none
}

.btn-youtube {
    --dc-btn-color: #fff;
    --dc-btn-bg: #b00;
    --dc-btn-border-color: #b00;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #9f0000;
    --dc-btn-hover-border-color: #960000;
    --dc-btn-focus-shadow-rgb: 197, 38, 38;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #960000;
    --dc-btn-active-border-color: #8c0000;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #b00;
    --dc-btn-disabled-border-color: #b00
}

.btn-outline-youtube {
    --dc-btn-color: #b00;
    --dc-btn-border-color: #b00;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #b00;
    --dc-btn-hover-border-color: #b00;
    --dc-btn-focus-shadow-rgb: 187, 0, 0;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #b00;
    --dc-btn-active-border-color: #b00;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #b00;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #b00;
    --dc-gradient: none
}

.btn-flickr {
    --dc-btn-color: #000;
    --dc-btn-bg: #ff0084;
    --dc-btn-border-color: #ff0084;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #ff2696;
    --dc-btn-hover-border-color: #ff1a90;
    --dc-btn-focus-shadow-rgb: 217, 0, 112;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #ff339d;
    --dc-btn-active-border-color: #ff1a90;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #ff0084;
    --dc-btn-disabled-border-color: #ff0084
}

.btn-outline-flickr {
    --dc-btn-color: #ff0084;
    --dc-btn-border-color: #ff0084;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #ff0084;
    --dc-btn-hover-border-color: #ff0084;
    --dc-btn-focus-shadow-rgb: 255, 0, 132;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #ff0084;
    --dc-btn-active-border-color: #ff0084;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #ff0084;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #ff0084;
    --dc-gradient: none
}

.btn-reddit {
    --dc-btn-color: #000;
    --dc-btn-bg: #ff4500;
    --dc-btn-border-color: #ff4500;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #ff6126;
    --dc-btn-hover-border-color: #ff581a;
    --dc-btn-focus-shadow-rgb: 217, 59, 0;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #ff6a33;
    --dc-btn-active-border-color: #ff581a;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #ff4500;
    --dc-btn-disabled-border-color: #ff4500
}

.btn-outline-reddit {
    --dc-btn-color: #ff4500;
    --dc-btn-border-color: #ff4500;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #ff4500;
    --dc-btn-hover-border-color: #ff4500;
    --dc-btn-focus-shadow-rgb: 255, 69, 0;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #ff4500;
    --dc-btn-active-border-color: #ff4500;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #ff4500;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #ff4500;
    --dc-gradient: none
}

.btn-dribbble {
    --dc-btn-color: #000;
    --dc-btn-bg: #ea4c89;
    --dc-btn-border-color: #ea4c89;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #ed679b;
    --dc-btn-hover-border-color: #ec5e95;
    --dc-btn-focus-shadow-rgb: 199, 65, 116;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #ee70a1;
    --dc-btn-active-border-color: #ec5e95;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #ea4c89;
    --dc-btn-disabled-border-color: #ea4c89
}

.btn-outline-dribbble {
    --dc-btn-color: #ea4c89;
    --dc-btn-border-color: #ea4c89;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #ea4c89;
    --dc-btn-hover-border-color: #ea4c89;
    --dc-btn-focus-shadow-rgb: 234, 76, 137;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #ea4c89;
    --dc-btn-active-border-color: #ea4c89;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #ea4c89;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #ea4c89;
    --dc-gradient: none
}

.btn-skype {
    --dc-btn-color: #000;
    --dc-btn-bg: #00aff0;
    --dc-btn-border-color: #00aff0;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #26bbf2;
    --dc-btn-hover-border-color: #1ab7f2;
    --dc-btn-focus-shadow-rgb: 0, 149, 204;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #33bff3;
    --dc-btn-active-border-color: #1ab7f2;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #00aff0;
    --dc-btn-disabled-border-color: #00aff0
}

.btn-outline-skype {
    --dc-btn-color: #00aff0;
    --dc-btn-border-color: #00aff0;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #00aff0;
    --dc-btn-hover-border-color: #00aff0;
    --dc-btn-focus-shadow-rgb: 0, 175, 240;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #00aff0;
    --dc-btn-active-border-color: #00aff0;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #00aff0;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #00aff0;
    --dc-gradient: none
}

.btn-instagram {
    --dc-btn-color: #000;
    --dc-btn-bg: #dd2a7b;
    --dc-btn-border-color: #dd2a7b;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #e24a8f;
    --dc-btn-hover-border-color: #e03f88;
    --dc-btn-focus-shadow-rgb: 188, 36, 105;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #e45595;
    --dc-btn-active-border-color: #e03f88;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #dd2a7b;
    --dc-btn-disabled-border-color: #dd2a7b
}

.btn-outline-instagram {
    --dc-btn-color: #dd2a7b;
    --dc-btn-border-color: #dd2a7b;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #dd2a7b;
    --dc-btn-hover-border-color: #dd2a7b;
    --dc-btn-focus-shadow-rgb: 221, 42, 123;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #dd2a7b;
    --dc-btn-active-border-color: #dd2a7b;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #dd2a7b;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #dd2a7b;
    --dc-gradient: none
}

.btn-lastfm {
    --dc-btn-color: #fff;
    --dc-btn-bg: #c3000d;
    --dc-btn-border-color: #c3000d;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #a6000b;
    --dc-btn-hover-border-color: #9c000a;
    --dc-btn-focus-shadow-rgb: 204, 38, 49;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #9c000a;
    --dc-btn-active-border-color: #92000a;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #c3000d;
    --dc-btn-disabled-border-color: #c3000d
}

.btn-outline-lastfm {
    --dc-btn-color: #c3000d;
    --dc-btn-border-color: #c3000d;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #c3000d;
    --dc-btn-hover-border-color: #c3000d;
    --dc-btn-focus-shadow-rgb: 195, 0, 13;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #c3000d;
    --dc-btn-active-border-color: #c3000d;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #c3000d;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #c3000d;
    --dc-gradient: none
}

.btn-soundcloud {
    --dc-btn-color: #000;
    --dc-btn-bg: #f80;
    --dc-btn-border-color: #f80;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #ff9a26;
    --dc-btn-hover-border-color: #ff941a;
    --dc-btn-focus-shadow-rgb: 217, 116, 0;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #ffa033;
    --dc-btn-active-border-color: #ff941a;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #f80;
    --dc-btn-disabled-border-color: #f80
}

.btn-outline-soundcloud {
    --dc-btn-color: #f80;
    --dc-btn-border-color: #f80;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #f80;
    --dc-btn-hover-border-color: #f80;
    --dc-btn-focus-shadow-rgb: 255, 136, 0;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #f80;
    --dc-btn-active-border-color: #f80;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #f80;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #f80;
    --dc-gradient: none
}

.btn-behance {
    --dc-btn-color: #fff;
    --dc-btn-bg: #1769ff;
    --dc-btn-border-color: #1769ff;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #1459d9;
    --dc-btn-hover-border-color: #1254cc;
    --dc-btn-focus-shadow-rgb: 58, 128, 255;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #1254cc;
    --dc-btn-active-border-color: #114fbf;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #1769ff;
    --dc-btn-disabled-border-color: #1769ff
}

.btn-outline-behance {
    --dc-btn-color: #1769ff;
    --dc-btn-border-color: #1769ff;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #1769ff;
    --dc-btn-hover-border-color: #1769ff;
    --dc-btn-focus-shadow-rgb: 23, 105, 255;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #1769ff;
    --dc-btn-active-border-color: #1769ff;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #1769ff;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #1769ff;
    --dc-gradient: none
}

.btn-envato {
    --dc-btn-color: #000;
    --dc-btn-bg: #82b541;
    --dc-btn-border-color: #82b541;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #95c05e;
    --dc-btn-hover-border-color: #8fbc54;
    --dc-btn-focus-shadow-rgb: 111, 154, 55;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #9bc467;
    --dc-btn-active-border-color: #8fbc54;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #82b541;
    --dc-btn-disabled-border-color: #82b541
}

.btn-outline-envato {
    --dc-btn-color: #82b541;
    --dc-btn-border-color: #82b541;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #82b541;
    --dc-btn-hover-border-color: #82b541;
    --dc-btn-focus-shadow-rgb: 130, 181, 65;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #82b541;
    --dc-btn-active-border-color: #82b541;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #82b541;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #82b541;
    --dc-gradient: none
}

.btn-medium {
    --dc-btn-color: #000;
    --dc-btn-bg: #00ab6c;
    --dc-btn-border-color: #00ab6c;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #26b882;
    --dc-btn-hover-border-color: #1ab37b;
    --dc-btn-focus-shadow-rgb: 0, 145, 92;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #33bc89;
    --dc-btn-active-border-color: #1ab37b;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #00ab6c;
    --dc-btn-disabled-border-color: #00ab6c
}

.btn-outline-medium {
    --dc-btn-color: #00ab6c;
    --dc-btn-border-color: #00ab6c;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #00ab6c;
    --dc-btn-hover-border-color: #00ab6c;
    --dc-btn-focus-shadow-rgb: 0, 171, 108;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #00ab6c;
    --dc-btn-active-border-color: #00ab6c;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #00ab6c;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #00ab6c;
    --dc-gradient: none
}

.btn-spotify {
    --dc-btn-color: #000;
    --dc-btn-bg: #1db954;
    --dc-btn-border-color: #1db954;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #3fc46e;
    --dc-btn-hover-border-color: #34c065;
    --dc-btn-focus-shadow-rgb: 25, 157, 71;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #4ac776;
    --dc-btn-active-border-color: #34c065;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #1db954;
    --dc-btn-disabled-border-color: #1db954
}

.btn-outline-spotify {
    --dc-btn-color: #1db954;
    --dc-btn-border-color: #1db954;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #1db954;
    --dc-btn-hover-border-color: #1db954;
    --dc-btn-focus-shadow-rgb: 29, 185, 84;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #1db954;
    --dc-btn-active-border-color: #1db954;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #1db954;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #1db954;
    --dc-gradient: none
}

.btn-quora {
    --dc-btn-color: #fff;
    --dc-btn-bg: #a82400;
    --dc-btn-border-color: #a82400;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #8f1f00;
    --dc-btn-hover-border-color: #861d00;
    --dc-btn-focus-shadow-rgb: 181, 69, 38;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #861d00;
    --dc-btn-active-border-color: #7e1b00;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #a82400;
    --dc-btn-disabled-border-color: #a82400
}

.btn-outline-quora {
    --dc-btn-color: #a82400;
    --dc-btn-border-color: #a82400;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #a82400;
    --dc-btn-hover-border-color: #a82400;
    --dc-btn-focus-shadow-rgb: 168, 36, 0;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #a82400;
    --dc-btn-active-border-color: #a82400;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #a82400;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #a82400;
    --dc-gradient: none
}

.btn-xing {
    --dc-btn-color: #fff;
    --dc-btn-bg: #026466;
    --dc-btn-border-color: #026466;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #025557;
    --dc-btn-hover-border-color: #025052;
    --dc-btn-focus-shadow-rgb: 40, 123, 125;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #025052;
    --dc-btn-active-border-color: #024b4d;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #026466;
    --dc-btn-disabled-border-color: #026466
}

.btn-outline-xing {
    --dc-btn-color: #026466;
    --dc-btn-border-color: #026466;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #026466;
    --dc-btn-hover-border-color: #026466;
    --dc-btn-focus-shadow-rgb: 2, 100, 102;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #026466;
    --dc-btn-active-border-color: #026466;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #026466;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #026466;
    --dc-gradient: none
}

.btn-snapchat {
    --dc-btn-color: #000;
    --dc-btn-bg: #fffc00;
    --dc-btn-border-color: #fffc00;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #fffc26;
    --dc-btn-hover-border-color: #fffc1a;
    --dc-btn-focus-shadow-rgb: 217, 214, 0;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #fffd33;
    --dc-btn-active-border-color: #fffc1a;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #fffc00;
    --dc-btn-disabled-border-color: #fffc00
}

.btn-outline-snapchat {
    --dc-btn-color: #fffc00;
    --dc-btn-border-color: #fffc00;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #fffc00;
    --dc-btn-hover-border-color: #fffc00;
    --dc-btn-focus-shadow-rgb: 255, 252, 0;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #fffc00;
    --dc-btn-active-border-color: #fffc00;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fffc00;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #fffc00;
    --dc-gradient: none
}

.btn-telegram {
    --dc-btn-color: #000;
    --dc-btn-bg: #08c;
    --dc-btn-border-color: #08c;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #269ad4;
    --dc-btn-hover-border-color: #1a94d1;
    --dc-btn-focus-shadow-rgb: 0, 116, 173;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #33a0d6;
    --dc-btn-active-border-color: #1a94d1;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #08c;
    --dc-btn-disabled-border-color: #08c
}

.btn-outline-telegram {
    --dc-btn-color: #08c;
    --dc-btn-border-color: #08c;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #08c;
    --dc-btn-hover-border-color: #08c;
    --dc-btn-focus-shadow-rgb: 0, 136, 204;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #08c;
    --dc-btn-active-border-color: #08c;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #08c;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #08c;
    --dc-gradient: none
}

.btn-whatsapp {
    --dc-btn-color: #fff;
    --dc-btn-bg: #075e54;
    --dc-btn-border-color: #075e54;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #065047;
    --dc-btn-hover-border-color: #064b43;
    --dc-btn-focus-shadow-rgb: 44, 118, 110;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #064b43;
    --dc-btn-active-border-color: #05473f;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #fff;
    --dc-btn-disabled-bg: #075e54;
    --dc-btn-disabled-border-color: #075e54
}

.btn-outline-whatsapp {
    --dc-btn-color: #075e54;
    --dc-btn-border-color: #075e54;
    --dc-btn-hover-color: #fff;
    --dc-btn-hover-bg: #075e54;
    --dc-btn-hover-border-color: #075e54;
    --dc-btn-focus-shadow-rgb: 7, 94, 84;
    --dc-btn-active-color: #fff;
    --dc-btn-active-bg: #075e54;
    --dc-btn-active-border-color: #075e54;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #075e54;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #075e54;
    --dc-gradient: none
}

.btn-rss {
    --dc-btn-color: #000;
    --dc-btn-bg: #f26522;
    --dc-btn-border-color: #f26522;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #f47c43;
    --dc-btn-hover-border-color: #f37438;
    --dc-btn-focus-shadow-rgb: 206, 86, 29;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #f5844e;
    --dc-btn-active-border-color: #f37438;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #000;
    --dc-btn-disabled-bg: #f26522;
    --dc-btn-disabled-border-color: #f26522
}

.btn-outline-rss {
    --dc-btn-color: #f26522;
    --dc-btn-border-color: #f26522;
    --dc-btn-hover-color: #000;
    --dc-btn-hover-bg: #f26522;
    --dc-btn-hover-border-color: #f26522;
    --dc-btn-focus-shadow-rgb: 242, 101, 34;
    --dc-btn-active-color: #000;
    --dc-btn-active-bg: #f26522;
    --dc-btn-active-border-color: #f26522;
    --dc-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    --dc-btn-disabled-color: #f26522;
    --dc-btn-disabled-bg: transparent;
    --dc-btn-disabled-border-color: #f26522;
    --dc-gradient: none
}

.strong-top-bordered-card {
    -webkit-box-shadow: 0 13px 27px -5px rgba(50, 50, 93, .25), 0 8px 16px -8px rgba(0, 0, 0, .3), 0 -6px 16px -6px rgba(0, 0, 0, .025);
    box-shadow: 0 13px 27px -5px rgba(50, 50, 93, .25), 0 8px 16px -8px rgba(0, 0, 0, .3), 0 -6px 16px -6px rgba(0, 0, 0, .025)
}

.strong-top-bordered-card:before {
    background-color: #53f;
    border-top-left-radius: .5rem;
    border-top-left-radius: var(--dc-border-radius-lg);
    border-top-right-radius: .5rem;
    border-top-right-radius: var(--dc-border-radius-lg);
    content: "";
    display: block;
    height: 8px;
    width: 100%
}

.tool-description-card {
    bottom: -8rem;
    left: 10%;
    max-width: 80%;
    position: absolute;
    z-index: 1
}

@media(min-width:768px) {
    .tool-description-card {
        max-width: 60%
    }
}

@media(min-width:992px) {
    .tool-description-card {
        max-width: 40%
    }
}

.card-clean .card-header {
    border-bottom: none
}

.navbar-nav {
    position: relative
}

.nav-process {
    margin-left: -30px;
    min-height: 60px
}

.nav-process .nav-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.nav-process .nav-item:after,
.nav-process .nav-item:before {
    border-top: 1px dashed #53f;
    content: "";
    margin-top: .375rem;
    -webkit-transition: all .3s;
    transition: all .3s;
    width: 50%
}

.nav-process .nav-item:before {
    left: 0
}

.nav-process .nav-item:after {
    right: 0
}

.nav-process .nav-item:first-of-type:before,
.nav-process .nav-item:last-of-type:after {
    border: none
}

.nav-process.nav-circle .nav-item.active .nav-link:before {
    margin-top: -.375rem;
    padding: .75rem
}

.nav-process.nav-circle .nav-item.active .nav-link:after {
    color: #fff;
    content: attr(data-step);
    font-size: .55rem;
    font-weight: 700;
    position: absolute;
    top: 1px
}

.nav-process.nav-circle .nav-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    position: relative;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.nav-process.nav-circle .nav-link:before {
    background-color: #53f;
    border-radius: 50%;
    content: "";
    display: block;
    margin: 0 .5rem;
    padding: .375rem;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.nav-icon .icon {
    -webkit-transform: scale(.95);
    transform: scale(.95);
    -webkit-transition: -webkit-transform .3s linear;
    transition: -webkit-transform .3s linear;
    transition: transform .3s linear;
    transition: transform .3s linear, -webkit-transform .3s linear
}

.nav-icon .active .icon {
    -webkit-transform: scale(1.25);
    transform: scale(1.25)
}

.swiper-container .swiper-pagination-top {
    bottom: auto;
    top: 0
}

.swiper-pagination.highlight-active .swiper-pagination-bullet {
    -webkit-transition: width .3s ease-in-out;
    transition: width .3s ease-in-out;
    will-change: width
}

.swiper-pagination.highlight-active .swiper-pagination-bullet-active {
    border-radius: 4px;
    width: 18px
}

.swiper-container-rtl .swiper-button-next:after,
.swiper-container-rtl .swiper-button-prev:after {
    content: none !important
}

.swiper-button {
    cursor: pointer;
    -webkit-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out
}

.swiper-button:hover {
    color: #53f
}

.swiper-button-next:after,
.swiper-button-prev:after {
    content: none !important
}

.swiper-button.rounded-circle {
    background-color: #fff;
    background-color: var(--dc-panel-bg);
    background-image: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 3rem;
    outline: none;
    width: 3rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.swiper-nav-thumbs .nav-link {
    padding: .5rem .75rem
}

.swiper-nav-thumbs .nav-link .thumb {
    height: 2rem;
    line-height: 2rem;
    text-align: center;
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
    width: 2rem
}

.swiper-nav-thumbs .nav-link.active .thumb {
    -webkit-transform: scale(1.75);
    transform: scale(1.75)
}

.swiper-center-nav {
    position: relative
}

.swiper-center-nav .swiper-button {
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

@media(min-width:768px) {
    .swiper-center-nav .swiper-button {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.swiper-center-nav .swiper-button:hover {
    background-color: #53f;
    color: #fff
}

.swiper-center-nav .swiper-button-prev {
    left: 0
}

@media(min-width:768px) {
    .swiper-center-nav .swiper-button-prev {
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
    .swiper-center-nav .swiper-button-prev:hover {
        -webkit-transform: translate(-50%, -2px);
        transform: translate(-50%, -2px)
    }
}

.swiper-center-nav .swiper-button-next {
    right: 0
}

@media(min-width:768px) {
    .swiper-center-nav .swiper-button-next {
        -webkit-transform: translateX(50%);
        transform: translateX(50%)
    }
    .swiper-center-nav .swiper-button-next:hover {
        -webkit-transform: translate(50%, -2px);
        transform: translate(50%, -2px)
    }
}

.nav-tabs.tabs-clean .nav-link {
    border-color: transparent
}

.nav-tabs.tabs-clean .nav-link .icon {
    margin: auto;
    -webkit-transform: scale(.95);
    transform: scale(.95);
    -webkit-transition: -webkit-transform .3s linear;
    transition: -webkit-transform .3s linear;
    transition: transform .3s linear;
    transition: transform .3s linear, -webkit-transform .3s linear
}

.nav-tabs.tabs-clean .nav-link.active {
    background-color: transparent !important;
    border-bottom-color: #53f
}

.nav-tabs.tabs-clean .nav-link.active .icon {
    -webkit-transform: scale(1.25);
    transform: scale(1.25)
}

.nav-tabs.tabs-bordered .nav-link.active {
    border-top: 2px solid #53f
}

@media(min-width:768px) {
    .nav-tabs.nav-slide+.tab-content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        overflow: hidden
    }
    .nav-tabs.nav-slide+.tab-content>.tab-pane {
        display: block;
        margin-right: -100%;
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        -webkit-transition: -webkit-transform .4s ease-in-out;
        transition: -webkit-transform .4s ease-in-out;
        transition: transform .4s ease-in-out;
        transition: transform .4s ease-in-out, -webkit-transform .4s ease-in-out;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }
    .nav-tabs.nav-slide+.tab-content>.tab-pane.active {
        margin-right: 0;
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.breadcrumb {
    --dc-breadcrumb-font-weight: 600;
    font-weight: 600;
    font-weight: var(--dc-breadcrumb-font-weight)
}

.breadcrumb-item.active {
    font-weight: 400
}

.image-background {
    background-attachment: scroll;
    background-position: 50%;
    background-repeat: no-repeat;
    position: relative
}

.image-background.cover {
    background-size: cover
}

.image-background.contain {
    background-size: contain
}

.image-background.left-bottom {
    background-position: 0 bottom
}

.image-background.center-top {
    background-position: top
}

.image-background.center-bottom {
    background-position: bottom
}

.image-background.p100-top {
    background-position: 100% top
}

.image-background.p100-bottom {
    background-position: 100% bottom
}

.parallax {
    position: static
}

.parallax,
.parallax.blurred:before {
    background-attachment: fixed
}

.parallax.blurred:before {
    position: absolute
}

.bg-primary.edge.bottom-left {
    position: relative
}

.bg-primary.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2353F' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-primary.edge.bottom-right {
    position: relative
}

.bg-primary.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2353F' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-primary.edge.top-left {
    position: relative
}

.bg-primary.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2353F' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-primary.edge.top-right {
    position: relative
}

.bg-primary.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2353F' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-secondary.edge.bottom-left {
    position: relative
}

.bg-secondary.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23869AB8' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-secondary.edge.bottom-right {
    position: relative
}

.bg-secondary.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23869AB8' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-secondary.edge.top-left {
    position: relative
}

.bg-secondary.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23869AB8' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-secondary.edge.top-right {
    position: relative
}

.bg-secondary.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23869AB8' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-success.edge.bottom-left {
    position: relative
}

.bg-success.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2300B286' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-success.edge.bottom-right {
    position: relative
}

.bg-success.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2300B286' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-success.edge.top-left {
    position: relative
}

.bg-success.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2300B286' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-success.edge.top-right {
    position: relative
}

.bg-success.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2300B286' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-info.edge.bottom-left {
    position: relative
}

.bg-info.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230DCAF0' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-info.edge.bottom-right {
    position: relative
}

.bg-info.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230DCAF0' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-info.edge.top-left {
    position: relative
}

.bg-info.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230DCAF0' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-info.edge.top-right {
    position: relative
}

.bg-info.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230DCAF0' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-warning.edge.bottom-left {
    position: relative
}

.bg-warning.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFC041' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-warning.edge.bottom-right {
    position: relative
}

.bg-warning.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFC041' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-warning.edge.top-left {
    position: relative
}

.bg-warning.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFC041' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-warning.edge.top-right {
    position: relative
}

.bg-warning.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFC041' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-danger.edge.bottom-left {
    position: relative
}

.bg-danger.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FF0080' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-danger.edge.bottom-right {
    position: relative
}

.bg-danger.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FF0080' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-danger.edge.top-left {
    position: relative
}

.bg-danger.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FF0080' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-danger.edge.top-right {
    position: relative
}

.bg-danger.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FF0080' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-light.edge.bottom-left {
    position: relative
}

.bg-light.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23F9FBFD' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-light.edge.bottom-right {
    position: relative
}

.bg-light.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23F9FBFD' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-light.edge.top-left {
    position: relative
}

.bg-light.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23F9FBFD' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-light.edge.top-right {
    position: relative
}

.bg-light.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23F9FBFD' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-dark.edge.bottom-left {
    position: relative
}

.bg-dark.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2318191A' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-dark.edge.bottom-right {
    position: relative
}

.bg-dark.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2318191A' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-dark.edge.top-left {
    position: relative
}

.bg-dark.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2318191A' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-dark.edge.top-right {
    position: relative
}

.bg-dark.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2318191A' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-darker.edge.bottom-left {
    position: relative
}

.bg-darker.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23111212' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-darker.edge.bottom-right {
    position: relative
}

.bg-darker.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23111212' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-darker.edge.top-left {
    position: relative
}

.bg-darker.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23111212' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-darker.edge.top-right {
    position: relative
}

.bg-darker.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23111212' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-black.edge.bottom-left {
    position: relative
}

.bg-black.edge.bottom-left:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='m0 0 100 250V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-black.edge.bottom-right {
    position: relative
}

.bg-black.edge.bottom-right:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-black.edge.top-left {
    position: relative
}

.bg-black.edge.top-left:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-black.edge.top-right {
    position: relative
}

.bg-black.edge.top-right:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100L0 0z'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    height: 250px;
    left: 0;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-body.edge:after,
.bg-body.edge:before {
    background-color: rgba(255, 255, 255, var(--dc-bg-opacity));
    background-color: rgba(var(--dc-body-bg-rgb), var(--dc-bg-opacity))
}

.bg-body.edge.top-left {
    position: relative
}

.bg-body.edge.top-left:before {
    content: "";
    height: 250px;
    left: 0;
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    -webkit-mask-position: 50%;
    mask-position: 50%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-body.edge.bottom-right {
    position: relative
}

.bg-body.edge.bottom-right:after {
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    -webkit-mask-position: 50%;
    mask-position: 50%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-body-secondary.edge:after,
.bg-body-secondary.edge:before {
    background-color: rgba(241, 244, 248, var(--dc-bg-opacity));
    background-color: rgba(var(--dc-secondary-bg-rgb), var(--dc-bg-opacity))
}

.bg-body-secondary.edge.top-left {
    position: relative
}

.bg-body-secondary.edge.top-left:before {
    content: "";
    height: 250px;
    left: 0;
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    -webkit-mask-position: 50%;
    mask-position: 50%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.bg-body-secondary.edge.bottom-right {
    position: relative
}

.bg-body-secondary.edge.bottom-right:after {
    bottom: -250px;
    content: "";
    height: 250px;
    left: 0;
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 0h100L0 250z'/%3E%3C/svg%3E");
    -webkit-mask-position: 50%;
    mask-position: 50%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.bg-body-tertiary.edge:after,
.bg-body-tertiary.edge:before {
    background-color: rgba(249, 251, 253, var(--dc-bg-opacity));
    background-color: rgba(var(--dc-tertiary-bg-rgb), var(--dc-bg-opacity))
}

.bg-body-tertiary.edge.top-left {
    position: relative
}

.bg-body-tertiary.edge.top-left:before {
    content: "";
    height: 250px;
    left: 0;
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 250'%3E%3Cpath d='M0 250h100V0z'/%3E%3C/svg%3E");
    -webkit-mask-position: 50%;
    mask-position: 50%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    right: 0;
    top: -250px;
    width: 100%;
    z-index: 1
}

.ipad,
.iphone,
.iphone-x {
    margin: 0 auto;
    position: relative
}

.ipad:after,
.ipad:before,
.iphone-x:after,
.iphone-x:before,
.iphone:after,
.iphone:before {
    content: "";
    position: absolute
}

.ipad:before,
.iphone-x:before,
.iphone:before {
    border-radius: 30px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
    height: 4px;
    left: 0;
    right: 0;
    width: 45px
}

.ipad:after,
.iphone-x:after,
.iphone:after {
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, .03);
    box-shadow: 0 0 0 2px rgba(0, 0, 0, .03);
    display: block;
    height: 8px;
    left: 50%;
    width: 8px
}

.ipad .screen,
.iphone .screen,
.iphone-x .screen {
    margin: 0 auto;
    overflow: hidden
}

.ipad .screen img,
.iphone .screen img,
.iphone-x .screen img {
    max-width: 100%
}

.ipad,
.iphone {
    background: #fff;
    border-radius: 36px;
    -webkit-box-shadow: inset 0 4px 10px 1px #fff, inset 0 0 6px 0 rgba(66, 77, 86, .5), 0 2px 0 #aeb5bb, 0 20px 50px -25px rgba(0, 0, 0, .5);
    box-shadow: inset 0 4px 10px 1px #fff, inset 0 0 6px 0 rgba(66, 77, 86, .5), 0 2px 0 #aeb5bb, 0 20px 50px -25px rgba(0, 0, 0, .5);
    max-width: 255px;
    padding: 55px 0
}

.ipad:before,
.iphone:before {
    background: #e3e8eb;
    margin: -25px auto 0
}

.ipad:after,
.iphone:after {
    background: #e3e8eb;
    margin-left: -45px;
    top: 30px
}

.ipad .screen,
.iphone .screen {
    width: 90%
}

.ipad .screen img,
.iphone .screen img {
    -webkit-box-shadow: 0 0 0 1px rgba(0, 17, 53, .16);
    box-shadow: 0 0 0 1px rgba(0, 17, 53, .16)
}

.ipad .button,
.iphone .button {
    border: 1px solid #d9e2ef;
    border-radius: 50%;
    bottom: 1.75%;
    -webkit-box-shadow: inset 0 0 1px 2px #e3e8eb;
    box-shadow: inset 0 0 1px 2px #e3e8eb;
    height: 0;
    left: 50%;
    padding-top: 36px;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 36px
}

.ipad.small,
.iphone.small {
    border-radius: 26px;
    max-width: 185px;
    padding: 45px 0
}

.ipad.small:before,
.iphone.small:before {
    width: 35px
}

.ipad.small:after,
.iphone.small:after {
    top: 20px
}

.ipad.small .button,
.iphone.small .button {
    margin-left: -8px;
    padding-top: 28px;
    width: 28px
}

.ipad.landscape,
.iphone.landscape {
    padding: 1rem 3rem
}

.ipad.landscape:after,
.ipad.landscape:before,
.iphone.landscape:after,
.iphone.landscape:before {
    left: 16%;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ipad.landscape .button,
.iphone.landscape .button {
    left: 100%;
    margin-left: -50px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.ipad:before {
    content: none
}

.ipad.portrait:after {
    left: 50%;
    margin-left: 0;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.iphone-x {
    max-width: 243.75px;
    padding: 9.75px
}

.iphone-x .screen {
    border-radius: 13px
}

.iphone-x .screen img {
    -webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, .015);
    box-shadow: 0 0 1px 1px rgba(0, 0, 0, .015)
}

.iphone-x .notch {
    background-color: #242526;
    border-radius: 13px;
    height: 22.75px;
    left: 50%;
    position: absolute;
    top: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 135.85px
}

.iphone-x.light,
.iphone-x.light .notch {
    background-color: #f1f4f8
}

.iphone-x.light:after,
.iphone-x.light:before {
    background-color: #e3e8eb
}

.device-twin {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 425px;
    position: relative;
    width: 100%
}

.device-twin .mockup {
    -webkit-box-shadow: inset 0 4px 10px 1px #fff, inset 0 0 6px 0 rgba(66, 77, 86, .5), 0 20px 50px -25px rgba(0, 0, 0, .5), 0 0 1px rgba(0, 0, 0, .1);
    box-shadow: inset 0 4px 10px 1px #fff, inset 0 0 6px 0 rgba(66, 77, 86, .5), 0 20px 50px -25px rgba(0, 0, 0, .5), 0 0 1px rgba(0, 0, 0, .1);
    max-width: 190px
}

@media(min-width:768px) {
    .device-twin .phone {
        -webkit-transition: all .4s ease;
        transition: all .4s ease
    }
    .device-twin .phone.front:hover {
        -webkit-transform: rotate(2deg) translate3d(0, -8px, 0);
        transform: rotate(2deg) translate3d(0, -8px, 0)
    }
    .device-twin .phone.absolute {
        margin-top: -30px
    }
    .device-twin .phone.absolute:hover {
        -webkit-transform: rotate(-2deg) translate3d(-10px, 0, 0);
        transform: rotate(-2deg) translate3d(-10px, 0, 0)
    }
}

.device-twin.free-width {
    max-width: none
}

.browser {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #fff), color-stop(10%, #eef1f3));
    background: linear-gradient(#fff 1%, #eef1f3 10%);
    border-radius: .4em;
    padding-top: 2em;
    position: relative
}

.browser:before {
    background: #f44;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 1px #f44, 1.5em 0 0 1px #9b3, 3em 0 0 1px #fb5;
    box-shadow: 0 0 0 1px #f44, 1.5em 0 0 1px #9b3, 3em 0 0 1px #fb5;
    content: "";
    display: block;
    height: .5em;
    left: 1em;
    position: absolute;
    top: .75em;
    width: .5em
}

.browser img {
    max-width: 100%
}

.browser.shadow {
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .3), 0 2px 4px rgba(0, 0, 0, .09);
    box-shadow: 0 0 1px rgba(0, 0, 0, .3), 0 2px 4px rgba(0, 0, 0, .09)
}

.browser.border {
    border: 1px solid #d9e2ef
}

.fade-bottom:after {
    background: -webkit-gradient(linear, left top, left bottom, from(hsla(0, 0%, 100%, 0)), color-stop(70%, #fff), to(#fff));
    background: linear-gradient(hsla(0, 0%, 100%, 0), #fff 70%, #fff);
    bottom: -25px;
    content: "";
    display: block;
    height: 85px;
    left: 0;
    position: absolute;
    right: 0
}

.shape-divider {
    pointer-events: none;
    position: absolute
}

.shape-divider-bottom {
    bottom: 0;
    left: 0;
    right: 0
}

.shape-divider-bottom>* {
    -webkit-transform-origin: top center;
    transform-origin: top center
}

@media(min-width:768px) {
    .shape-divider-bottom {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.shape-divider-fluid-x>* {
    height: auto;
    width: 100%
}

.shape-divider-fluid-y>* {
    height: 100%;
    width: auto
}

.shape-divider svg {
    fill: currentColor;
    -webkit-transform: scale(2);
    transform: scale(2)
}

.shape-divider-waves svg {
    height: 133px;
    left: 0;
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
    width: calc(159% + 1.3px)
}

.overlay .shape-divider {
    z-index: 1
}

.icon {
    display: inline-block;
    margin-left: 5px;
    margin-right: 15px;
    padding: 0;
    text-align: center;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.icon i {
    margin: 0
}

.logo {
    max-height: 50px
}

img.icon {
    max-width: 54px
}

.icon-sm {
    height: .85rem;
    line-height: .85rem;
    text-align: center;
    width: .85rem
}

.icon-md {
    height: 2rem;
    line-height: 2rem;
    text-align: center;
    width: 2rem
}

.icon-lg {
    height: 3.25rem;
    line-height: 3.25rem;
    text-align: center;
    width: 3.25rem
}

.icon-xl {
    height: 4.5rem;
    line-height: 4.5rem;
    text-align: center;
    width: 4.5rem
}

.icon-xxl {
    height: 6.5rem;
    line-height: 6.5rem;
    text-align: center;
    width: 6.5rem
}

.icon-l {
    height: 1.125rem;
    line-height: 1.125rem;
    width: 1.125rem
}

.icon-2l,
.icon-l {
    text-align: center
}

.icon-2l {
    height: 2.25rem;
    line-height: 2.25rem;
    width: 2.25rem
}

.icon-2xl {
    height: 9rem;
    line-height: 9rem;
    text-align: center;
    width: 9rem
}

.icon-2xxl {
    height: 13rem;
    line-height: 13rem;
    text-align: center;
    width: 13rem
}

.stroke-primary {
    stroke: #53f
}

.stroke-secondary {
    stroke: #869ab8
}

.stroke-success {
    stroke: #00b286
}

.stroke-info {
    stroke: #0dcaf0
}

.stroke-warning {
    stroke: #ffc041
}

.stroke-danger {
    stroke: #ff0080
}

.stroke-light {
    stroke: #f9fbfd
}

.stroke-dark {
    stroke: #18191a
}

.stroke-darker {
    stroke: #111212
}

.stroke-black {
    stroke: #000
}

.icon-shape {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.icon-shape .shape,
.icon-shape .shape-lg {
    max-width: 3.25rem
}

.icon-shape .shape-xl {
    max-width: 4.5rem
}

.icon-shape .shape-xxl {
    max-width: 6.5rem
}

.icon-shape .icon {
    margin: 0
}

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

.overlay {
    position: relative
}

.overlay:after {
    background-color: rgba(36, 37, 38, .6);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 1;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0
}

.overlay [class^=container],
.overlay>.content {
    position: relative;
    z-index: 1
}

.overlay.overlay-primary:after {
    background-color: rgba(85, 51, 255, .6)
}

.overlay.overlay-primary.alpha-1:after {
    background-color: rgba(85, 51, 255, .1)
}

.overlay.overlay-primary.alpha-2:after {
    background-color: rgba(85, 51, 255, .2)
}

.overlay.overlay-primary.alpha-3:after {
    background-color: rgba(85, 51, 255, .3)
}

.overlay.overlay-primary.alpha-4:after {
    background-color: rgba(85, 51, 255, .4)
}

.overlay.overlay-primary.alpha-5:after {
    background-color: rgba(85, 51, 255, .5)
}

.overlay.overlay-primary.alpha-6:after {
    background-color: rgba(85, 51, 255, .6)
}

.overlay.overlay-primary.alpha-7:after {
    background-color: rgba(85, 51, 255, .7)
}

.overlay.overlay-primary.alpha-8:after {
    background-color: rgba(85, 51, 255, .8)
}

.overlay.overlay-primary.alpha-9:after {
    background-color: rgba(85, 51, 255, .9)
}

.overlay.overlay-secondary:after {
    background-color: rgba(134, 154, 184, .6)
}

.overlay.overlay-secondary.alpha-1:after {
    background-color: rgba(134, 154, 184, .1)
}

.overlay.overlay-secondary.alpha-2:after {
    background-color: rgba(134, 154, 184, .2)
}

.overlay.overlay-secondary.alpha-3:after {
    background-color: rgba(134, 154, 184, .3)
}

.overlay.overlay-secondary.alpha-4:after {
    background-color: rgba(134, 154, 184, .4)
}

.overlay.overlay-secondary.alpha-5:after {
    background-color: rgba(134, 154, 184, .5)
}

.overlay.overlay-secondary.alpha-6:after {
    background-color: rgba(134, 154, 184, .6)
}

.overlay.overlay-secondary.alpha-7:after {
    background-color: rgba(134, 154, 184, .7)
}

.overlay.overlay-secondary.alpha-8:after {
    background-color: rgba(134, 154, 184, .8)
}

.overlay.overlay-secondary.alpha-9:after {
    background-color: rgba(134, 154, 184, .9)
}

.overlay.overlay-success:after {
    background-color: rgba(0, 178, 134, .6)
}

.overlay.overlay-success.alpha-1:after {
    background-color: rgba(0, 178, 134, .1)
}

.overlay.overlay-success.alpha-2:after {
    background-color: rgba(0, 178, 134, .2)
}

.overlay.overlay-success.alpha-3:after {
    background-color: rgba(0, 178, 134, .3)
}

.overlay.overlay-success.alpha-4:after {
    background-color: rgba(0, 178, 134, .4)
}

.overlay.overlay-success.alpha-5:after {
    background-color: rgba(0, 178, 134, .5)
}

.overlay.overlay-success.alpha-6:after {
    background-color: rgba(0, 178, 134, .6)
}

.overlay.overlay-success.alpha-7:after {
    background-color: rgba(0, 178, 134, .7)
}

.overlay.overlay-success.alpha-8:after {
    background-color: rgba(0, 178, 134, .8)
}

.overlay.overlay-success.alpha-9:after {
    background-color: rgba(0, 178, 134, .9)
}

.overlay.overlay-info:after {
    background-color: rgba(13, 202, 240, .6)
}

.overlay.overlay-info.alpha-1:after {
    background-color: rgba(13, 202, 240, .1)
}

.overlay.overlay-info.alpha-2:after {
    background-color: rgba(13, 202, 240, .2)
}

.overlay.overlay-info.alpha-3:after {
    background-color: rgba(13, 202, 240, .3)
}

.overlay.overlay-info.alpha-4:after {
    background-color: rgba(13, 202, 240, .4)
}

.overlay.overlay-info.alpha-5:after {
    background-color: rgba(13, 202, 240, .5)
}

.overlay.overlay-info.alpha-6:after {
    background-color: rgba(13, 202, 240, .6)
}

.overlay.overlay-info.alpha-7:after {
    background-color: rgba(13, 202, 240, .7)
}

.overlay.overlay-info.alpha-8:after {
    background-color: rgba(13, 202, 240, .8)
}

.overlay.overlay-info.alpha-9:after {
    background-color: rgba(13, 202, 240, .9)
}

.overlay.overlay-warning:after {
    background-color: rgba(255, 192, 65, .6)
}

.overlay.overlay-warning.alpha-1:after {
    background-color: rgba(255, 192, 65, .1)
}

.overlay.overlay-warning.alpha-2:after {
    background-color: rgba(255, 192, 65, .2)
}

.overlay.overlay-warning.alpha-3:after {
    background-color: rgba(255, 192, 65, .3)
}

.overlay.overlay-warning.alpha-4:after {
    background-color: rgba(255, 192, 65, .4)
}

.overlay.overlay-warning.alpha-5:after {
    background-color: rgba(255, 192, 65, .5)
}

.overlay.overlay-warning.alpha-6:after {
    background-color: rgba(255, 192, 65, .6)
}

.overlay.overlay-warning.alpha-7:after {
    background-color: rgba(255, 192, 65, .7)
}

.overlay.overlay-warning.alpha-8:after {
    background-color: rgba(255, 192, 65, .8)
}

.overlay.overlay-warning.alpha-9:after {
    background-color: rgba(255, 192, 65, .9)
}

.overlay.overlay-danger:after {
    background-color: rgba(255, 0, 128, .6)
}

.overlay.overlay-danger.alpha-1:after {
    background-color: rgba(255, 0, 128, .1)
}

.overlay.overlay-danger.alpha-2:after {
    background-color: rgba(255, 0, 128, .2)
}

.overlay.overlay-danger.alpha-3:after {
    background-color: rgba(255, 0, 128, .3)
}

.overlay.overlay-danger.alpha-4:after {
    background-color: rgba(255, 0, 128, .4)
}

.overlay.overlay-danger.alpha-5:after {
    background-color: rgba(255, 0, 128, .5)
}

.overlay.overlay-danger.alpha-6:after {
    background-color: rgba(255, 0, 128, .6)
}

.overlay.overlay-danger.alpha-7:after {
    background-color: rgba(255, 0, 128, .7)
}

.overlay.overlay-danger.alpha-8:after {
    background-color: rgba(255, 0, 128, .8)
}

.overlay.overlay-danger.alpha-9:after {
    background-color: rgba(255, 0, 128, .9)
}

.overlay.overlay-light:after {
    background-color: rgba(249, 251, 253, .6)
}

.overlay.overlay-light.alpha-1:after {
    background-color: rgba(249, 251, 253, .1)
}

.overlay.overlay-light.alpha-2:after {
    background-color: rgba(249, 251, 253, .2)
}

.overlay.overlay-light.alpha-3:after {
    background-color: rgba(249, 251, 253, .3)
}

.overlay.overlay-light.alpha-4:after {
    background-color: rgba(249, 251, 253, .4)
}

.overlay.overlay-light.alpha-5:after {
    background-color: rgba(249, 251, 253, .5)
}

.overlay.overlay-light.alpha-6:after {
    background-color: rgba(249, 251, 253, .6)
}

.overlay.overlay-light.alpha-7:after {
    background-color: rgba(249, 251, 253, .7)
}

.overlay.overlay-light.alpha-8:after {
    background-color: rgba(249, 251, 253, .8)
}

.overlay.overlay-light.alpha-9:after {
    background-color: rgba(249, 251, 253, .9)
}

.overlay.overlay-dark:after {
    background-color: rgba(24, 25, 26, .6)
}

.overlay.overlay-dark.alpha-1:after {
    background-color: rgba(24, 25, 26, .1)
}

.overlay.overlay-dark.alpha-2:after {
    background-color: rgba(24, 25, 26, .2)
}

.overlay.overlay-dark.alpha-3:after {
    background-color: rgba(24, 25, 26, .3)
}

.overlay.overlay-dark.alpha-4:after {
    background-color: rgba(24, 25, 26, .4)
}

.overlay.overlay-dark.alpha-5:after {
    background-color: rgba(24, 25, 26, .5)
}

.overlay.overlay-dark.alpha-6:after {
    background-color: rgba(24, 25, 26, .6)
}

.overlay.overlay-dark.alpha-7:after {
    background-color: rgba(24, 25, 26, .7)
}

.overlay.overlay-dark.alpha-8:after {
    background-color: rgba(24, 25, 26, .8)
}

.overlay.overlay-dark.alpha-9:after {
    background-color: rgba(24, 25, 26, .9)
}

.overlay.overlay-darker:after {
    background-color: rgba(17, 18, 18, .6)
}

.overlay.overlay-darker.alpha-1:after {
    background-color: rgba(17, 18, 18, .1)
}

.overlay.overlay-darker.alpha-2:after {
    background-color: rgba(17, 18, 18, .2)
}

.overlay.overlay-darker.alpha-3:after {
    background-color: rgba(17, 18, 18, .3)
}

.overlay.overlay-darker.alpha-4:after {
    background-color: rgba(17, 18, 18, .4)
}

.overlay.overlay-darker.alpha-5:after {
    background-color: rgba(17, 18, 18, .5)
}

.overlay.overlay-darker.alpha-6:after {
    background-color: rgba(17, 18, 18, .6)
}

.overlay.overlay-darker.alpha-7:after {
    background-color: rgba(17, 18, 18, .7)
}

.overlay.overlay-darker.alpha-8:after {
    background-color: rgba(17, 18, 18, .8)
}

.overlay.overlay-darker.alpha-9:after {
    background-color: rgba(17, 18, 18, .9)
}

.overlay.overlay-black:after {
    background-color: rgba(0, 0, 0, .6)
}

.overlay.overlay-black.alpha-1:after {
    background-color: rgba(0, 0, 0, .1)
}

.overlay.overlay-black.alpha-2:after {
    background-color: rgba(0, 0, 0, .2)
}

.overlay.overlay-black.alpha-3:after {
    background-color: rgba(0, 0, 0, .3)
}

.overlay.overlay-black.alpha-4:after {
    background-color: rgba(0, 0, 0, .4)
}

.overlay.overlay-black.alpha-5:after {
    background-color: rgba(0, 0, 0, .5)
}

.overlay.overlay-black.alpha-6:after {
    background-color: rgba(0, 0, 0, .6)
}

.overlay.overlay-black.alpha-7:after {
    background-color: rgba(0, 0, 0, .7)
}

.overlay.overlay-black.alpha-8:after {
    background-color: rgba(0, 0, 0, .8)
}

.overlay.overlay-black.alpha-9:after {
    background-color: rgba(0, 0, 0, .9)
}

.zoom-image {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: hidden;
    position: relative
}

.zoom-image img {
    max-width: 100%;
    -webkit-transition: -webkit-transform 2s ease;
    transition: -webkit-transform 2s ease;
    transition: transform 2s ease;
    transition: transform 2s ease, -webkit-transform 2s ease
}

.zoom-image.overlay:after {
    -webkit-transition: opacity 1.5s ease-out;
    transition: opacity 1.5s ease-out
}

.zoom-image:hover.overlay:after {
    opacity: 0
}

.zoom-image:hover img {
    -webkit-transform: scale(1.3) rotate(10deg);
    transform: scale(1.3) rotate(10deg)
}

.zoom-image.image-background:before {
    background-image: inherit;
    background-size: inherit;
    content: "";
    height: 100%;
    position: absolute;
    -webkit-transition: -webkit-transform 2s ease;
    transition: -webkit-transform 2s ease;
    transition: transform 2s ease;
    transition: transform 2s ease, -webkit-transform 2s ease;
    width: 100%
}

.zoom-image.image-background:hover:before {
    -webkit-transform: scale(1.3) rotate(10deg);
    transform: scale(1.3) rotate(10deg)
}

.shapes-container {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.background-shape {
    background-color: #53f;
    border-radius: 120px;
    display: block;
    z-index: -1
}

.background-shape,
.background-shape-main {
    height: 100%;
    width: 100%
}

.handwritten {
    font-family: Caveat, cursive
}

.handwritten.highlight {
    line-height: 1.25em;
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg)
}

.handwritten.highlight:before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAA3CAMAAADDj2FQAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAGYUExURQAAAMXe58Te58Xf6Mbf6MTe58Xg5////8Xf5sXf5sTe5sja7MTf58Tf58TX68fd6MPf6Mbb6cXe5sbf5cXe58Tf5sPh58Te6MTe58Te5v///8Tf5sbe58Xf5sTf5sTd5sXf5qr//8zd7sXe5sTe5sTd6Lba2sXf58Tf58Xe5sTf5sTe58Xf5sPh5sXe58Xf58Tf58Xf5szM/7+//8Xf5tTU1MXe58Tf58Hg6sXe5sXe5sLa5sTe5sTe5sTf5sTf58Ph4cXf58Xf58bi4sXc58Tg5cXf58Tf58Tf5sXf5cTe5sTf58Pg58Te5sXe58Xc58ff5sLd5MXe58Xe5sPe6cbi4sPf5sXe5sXe58bd58Xe5sPf58Tf5sTe58Xe58zl5cXf58bd6MTf5sTf5sTf58Te58Tc5sXe5sXf5sXf58Pe58Xe58Te58fc6sXg6MTf5sXf5sXe58Lg5sXf58Te5sPd58Tf5sXe57/U6cHg58Tf5sTf58Te58Xe58Te5MTf5sXf5sXe5sTf5sXe5sXf5sTe5cTe6MXf59gagUYAAACHdFJOUwB3dllaxEsC+5L+DqFgDRc4JHxwl9IrTtf9AfFVsfpc8gMP3OdkB+Gr/NHW0DPP+INzBQTIBqT5GR+FFX+HcYIRgcMSFltiwMlQ34tjlJYsKSa2xi8JSb5uNpx52/WNCtgtaZC49jTlm+tWzLclQ7OT7iqgfmzajgwhSuBX7yeRqZ/o9GplT5WzxmIAAAFXSURBVBgZfcEDdxwBAIXRbznrjW2btY2ktm07tdv3t3s2bU7SzvTdC2zEatiGtRuvBu8gVvU8VlscK34A61ASq70Ra28aa99+rPokVv0erFQc68F1rOdDWC8msBKTszjjeoZTGi5iTRSwngxi3dNhnHLzdqwdTVhbVIWzPrcGK7V2HU5Cm3FW93XtwtmqLM7O1swJnBodDzBODuoaTloXG3AKGr2Mke9VezfG1Vada2FJVZ5/NTarroU/UnWETEuFbn47ljlKSEy60cOiTg0Rdl5qekhFMJI7S1h/h7qKVLTpNBEePZU+l4Hggk4R4eOY9OFlAP0aC4gw8CknjSaCmV51EuntO0lXztRqboC/lI7cGn9TgtcLGUnDUi0rBNkOVUz2vbp/W4vu5llWVNgUy9IbNsViU5fuPB65qSXfykQIqpPZVRlVTPM/Pe+/fJW+Y8z8/DH7C72mVfoIDlnRAAAAAElFTkSuQmCC);
    content: "";
    height: 55px;
    margin-left: -1.5rem;
    position: absolute;
    width: 31px
}

.display-1 {
    font-size: 5rem !important
}

.display-2 {
    font-size: 4.5rem !important
}

.display-3 {
    font-size: 4rem !important
}

.display-4 {
    font-size: 3.5rem !important
}

.display-5 {
    font-size: 3rem !important
}

.display-6 {
    font-size: 2.5rem !important
}

@media(min-width:576px) {
    .display-sm-1 {
        font-size: 5rem !important
    }
    .display-sm-2 {
        font-size: 4.5rem !important
    }
    .display-sm-3 {
        font-size: 4rem !important
    }
    .display-sm-4 {
        font-size: 3.5rem !important
    }
    .display-sm-5 {
        font-size: 3rem !important
    }
    .display-sm-6 {
        font-size: 2.5rem !important
    }
}

@media(min-width:768px) {
    .display-md-1 {
        font-size: 5rem !important
    }
    .display-md-2 {
        font-size: 4.5rem !important
    }
    .display-md-3 {
        font-size: 4rem !important
    }
    .display-md-4 {
        font-size: 3.5rem !important
    }
    .display-md-5 {
        font-size: 3rem !important
    }
    .display-md-6 {
        font-size: 2.5rem !important
    }
}

@media(min-width:992px) {
    .display-lg-1 {
        font-size: 5rem !important
    }
    .display-lg-2 {
        font-size: 4.5rem !important
    }
    .display-lg-3 {
        font-size: 4rem !important
    }
    .display-lg-4 {
        font-size: 3.5rem !important
    }
    .display-lg-5 {
        font-size: 3rem !important
    }
    .display-lg-6 {
        font-size: 2.5rem !important
    }
}

@media(min-width:1200px) {
    .display-xl-1 {
        font-size: 5rem !important
    }
    .display-xl-2 {
        font-size: 4.5rem !important
    }
    .display-xl-3 {
        font-size: 4rem !important
    }
    .display-xl-4 {
        font-size: 3.5rem !important
    }
    .display-xl-5 {
        font-size: 3rem !important
    }
    .display-xl-6 {
        font-size: 2.5rem !important
    }
}

@media(min-width:1400px) {
    .display-xxl-1 {
        font-size: 5rem !important
    }
    .display-xxl-2 {
        font-size: 4.5rem !important
    }
    .display-xxl-3 {
        font-size: 4rem !important
    }
    .display-xxl-4 {
        font-size: 3.5rem !important
    }
    .display-xxl-5 {
        font-size: 3rem !important
    }
    .display-xxl-6 {
        font-size: 2.5rem !important
    }
}

.h1>a,
.h1>a:hover,
.h2>a,
.h2>a:hover,
.h3>a,
.h3>a:hover,
.h4>a,
.h4>a:hover,
.h5>a,
.h5>a:hover,
.h6>a,
.h6>a:hover,
h1>a,
h1>a:hover,
h2>a,
h2>a:hover,
h3>a,
h3>a:hover,
h4>a,
h4>a:hover,
h5>a,
h5>a:hover,
h6>a,
h6>a:hover {
    color: inherit
}

.no-action {
    pointer-events: none
}

.hover-lift {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out
}

.hover-lift:hover {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px)
}

.hover-shadow {
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.hover-shadow:hover {
    -webkit-box-shadow: -1px 3px 15px 0 rgba(0, 0, 0, .075) !important;
    box-shadow: -1px 3px 15px 0 rgba(0, 0, 0, .075) !important
}

.shadow-box {
    -webkit-box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .1)
}

.speech-bubble {
    background: #53f;
    border-radius: .5em;
    color: #fff;
    padding: .35rem .75rem;
    position: relative
}

.speech-bubble:before {
    border-bottom: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #53f;
    bottom: 0;
    content: "";
    height: 0;
    left: 50%;
    margin-bottom: -10px;
    margin-left: -10px;
    position: absolute;
    width: 0
}

.speech-bubble:after {
    -webkit-animation: pulse .75s linear infinite alternate;
    animation: pulse .75s linear infinite alternate;
    background-color: #53f;
    border: 1px solid #53f;
    border-radius: 50%;
    bottom: -20px;
    content: "";
    height: 6px;
    left: 50%;
    padding: 2px;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 6px
}

@-webkit-keyframes pulse {
    0% {
        -webkit-box-shadow: 0 0 8px 2px #53f;
        box-shadow: 0 0 8px 2px #53f
    }
    to {
        -webkit-box-shadow: 0 0 20px 2px #53f;
        box-shadow: 0 0 20px 2px #53f
    }
}

@keyframes pulse {
    0% {
        -webkit-box-shadow: 0 0 8px 2px #53f;
        box-shadow: 0 0 8px 2px #53f
    }
    to {
        -webkit-box-shadow: 0 0 20px 2px #53f;
        box-shadow: 0 0 20px 2px #53f
    }
}

.text-gradient {
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent
}

.anim {
    position: absolute
}

.floating {
    -webkit-animation: floating 4s ease-in-out infinite;
    animation: floating 4s ease-in-out infinite;
    -webkit-filter: none;
    filter: none
}

@-webkit-keyframes floating {
    0% {
        -webkit-transform: translate(0);
        transform: translate(0)
    }
    65% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px)
    }
    to {
        -webkit-transform: translate(0);
        transform: translate(0)
    }
}

@keyframes floating {
    0% {
        -webkit-transform: translate(0);
        transform: translate(0)
    }
    65% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px)
    }
    to {
        -webkit-transform: translate(0);
        transform: translate(0)
    }
}

.off-left-background {
    background-position: 20px 20px;
    background-size: 60px
}

@media(min-width:768px) {
    .off-left-background {
        background-position: -60px 100%;
        background-size: 50%
    }
    .off-left-background:hover {
        background-position: -30px 100%
    }
}

@media(min-width:992px) {
    .off-left-background {
        background-position: -60px 20px;
        background-size: contain
    }
    .off-left-background:hover {
        background-position: -30px 0
    }
}

.st-nav {
    -webkit-perspective: 2000px;
    perspective: 2000px;
    z-index: 500
}

.st-nav ul {
    margin: 0;
    padding: 0
}

.st-nav li {
    list-style: none
}

.st-nav .st-nav-menu {
    position: relative;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

@media(min-width:992px) {
    .st-nav .st-nav-menu {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.st-nav .st-nav-section.st-nav-primary,
.st-nav .st-nav-section.st-nav-secondary {
    display: none
}

.st-nav .st-nav-section.st-nav-primary {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.st-nav .st-nav-section.st-nav-primary.stick-right {
    margin-left: auto
}

.st-nav .st-nav-section.st-nav-primary.stick-right+.st-nav-secondary {
    margin-left: 1rem
}

.st-nav .st-nav-section.st-nav-secondary {
    margin-left: auto
}

.st-nav .st-nav-section.st-nav-mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.st-nav .dropdown-item {
    border-radius: .5rem;
    opacity: .8;
    padding: .5rem;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.st-nav .dropdown-item:hover {
    background-color: #f1f4f8;
    background-color: var(--dc-secondary-bg);
    opacity: 1
}

.st-nav .st-root-link {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap
}

.st-nav .st-nav-section.st-nav-secondary .st-root-link:last-child {
    padding-right: 20px !important
}

.st-nav .st-nav-section.st-nav-primary .st-root-link {
    font-weight: 400
}

.st-nav .st-has-dropdown:not([href]) {
    cursor: default
}

.st-nav .st-dropdown-root {
    display: none;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 70px;
    -webkit-transform: rotateX(-15deg);
    transform: rotateX(-15deg);
    -webkit-transform-origin: 50% -50px;
    transform-origin: 50% -50px;
    -webkit-transition-duration: .25s;
    transition-duration: .25s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    will-change: transform, opacity;
    z-index: 1000
}

.st-nav.dropdown-active .st-dropdown-root {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: none;
    transform: none
}

.st-nav .st-dropdown-bg {
    background: #f9fbfd;
    background: var(--dc-tertiary-bg);
    border-radius: 4px;
    -webkit-box-shadow: 0 50px 100px rgba(24, 25, 26, .1), 0 15px 35px rgba(24, 25, 26, .15), 0 5px 15px rgba(0, 0, 0, .1);
    box-shadow: 0 50px 100px rgba(24, 25, 26, .1), 0 15px 35px rgba(24, 25, 26, .15), 0 5px 15px rgba(0, 0, 0, .1);
    height: 400px;
    overflow: hidden;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    width: 520px
}

.st-nav .st-alt-bg,
.st-nav .st-dropdown-bg {
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transition-duration: .25s;
    transition-duration: .25s;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    will-change: transform
}

.st-nav .st-alt-bg {
    background: #f1f4f8;
    background: var(--dc-secondary-bg);
    height: 1000px;
    right: 0
}

.st-nav .st-dropdown-arrow {
    background: #f9fbfd;
    background: var(--dc-tertiary-bg);
    border-radius: 4px 0 0 0;
    -webkit-box-shadow: -3px -3px 5px rgba(80, 102, 144, .04);
    box-shadow: -3px -3px 5px rgba(80, 102, 144, .04);
    height: 12px;
    margin: 0 0 0 -6px;
    top: -6px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    width: 12px;
    will-change: transform
}

.st-nav .st-dropdown-arrow,
.st-nav .st-dropdown-container {
    left: 0;
    position: absolute;
    -webkit-transition-duration: .25s;
    transition-duration: .25s
}

.st-nav .st-dropdown-container {
    overflow: hidden;
    top: 0;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition-property: width, height, -webkit-transform;
    transition-property: width, height, -webkit-transform;
    transition-property: transform, width, height;
    transition-property: transform, width, height, -webkit-transform;
    will-change: transform, width, height
}

.st-nav .st-dropdown-section {
    background: #f9fbfd;
    background: var(--dc-tertiary-bg);
    opacity: 0;
    pointer-events: none;
    -webkit-transition-duration: .25s;
    transition-duration: .25s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    will-change: transform, opacity
}

.st-nav .st-dropdown-section.active {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.st-nav .st-dropdown-section.left {
    -webkit-transform: translateX(-150px);
    transform: translateX(-150px)
}

.st-nav .st-dropdown-section.right {
    -webkit-transform: translateX(150px);
    transform: translateX(150px)
}

.st-nav.dropdown-active .st-dropdown-section.active {
    pointer-events: auto
}

.st-nav.no-dropdown-transition .st-alt-bg,
.st-nav.no-dropdown-transition .st-dropdown-arrow,
.st-nav.no-dropdown-transition .st-dropdown-bg,
.st-nav.no-dropdown-transition .st-dropdown-container,
.st-nav.no-dropdown-transition .st-dropdown-section {
    -webkit-transition: none;
    transition: none
}

.st-nav .st-dropdown-content {
    position: absolute
}

.st-nav .st-dropdown-content-group {
    padding: 20px 35px
}

.st-nav .link-title {
    letter-spacing: .025em;
    margin: 0 0 .5rem
}

.st-nav .st-nav-section.st-nav-mobile .st-root-link {
    cursor: pointer;
    position: relative
}

.st-nav .st-popup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-perspective: 2000px;
    perspective: 2000px;
    pointer-events: none
}

.st-nav .st-popup-container {
    border-radius: 4px;
    -webkit-box-shadow: inset 0 0 .5px 1px hsla(0, 0%, 100%, .075), 0 0 0 1px rgba(0, 0, 0, .05), 0 .3px .4px rgba(0, 0, 0, .02), 0 .9px 1.5px rgba(0, 0, 0, .045), 0 3.5px 6px rgba(0, 0, 0, .09);
    box-shadow: inset 0 0 .5px 1px hsla(0, 0%, 100%, .075), 0 0 0 1px rgba(0, 0, 0, .05), 0 .3px .4px rgba(0, 0, 0, .02), 0 .9px 1.5px rgba(0, 0, 0, .045), 0 3.5px 6px rgba(0, 0, 0, .09);
    font-size: 17px;
    line-height: 40px;
    overflow: hidden;
    position: relative;
    white-space: nowrap;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    opacity: 0;
    -webkit-transform: rotate3d(1, 1, 0, -15deg);
    transform: rotate3d(1, 1, 0, -15deg);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transition-duration: .25s;
    transition-duration: .25s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    will-change: transform, opacity
}

.st-nav .st-nav-section.st-nav-mobile.st-popup-active .st-popup-container {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: none;
    transform: none
}

.st-nav .st-popup a {
    display: block
}

.st-nav .st-popup-close-button {
    cursor: pointer;
    font-size: 0;
    height: 51px;
    position: absolute;
    right: 0;
    top: 0;
    width: 51px
}

.st-nav .st-popup-close-button:after,
.st-nav .st-popup-close-button:before {
    background: #53f;
    border-radius: 1px;
    content: "";
    height: 3px;
    left: 14px;
    position: absolute;
    right: 14px;
    top: 24px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: background .1s;
    transition: background .1s
}

.st-nav .st-popup-close-button:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

@media(min-width:992px) {
    .st-nav .st-nav-section.st-nav-primary,
    .st-nav .st-nav-section.st-nav-secondary {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
    .st-nav .st-nav-section.st-nav-mobile {
        display: none
    }
    .st-nav .st-dropdown-root {
        display: block
    }
}

.navbar {
    min-height: 90px;
    -webkit-transition: all .3s ease 0s;
    transition: all .3s ease 0s
}

.navbar.fixed-top+main .header {
    padding-top: 90px
}

.navbar .navbar-toggler {
    -ms-flex-item-align: center;
    align-self: center
}

.navbar .navbar-toggler .icon-bar {
    background-color: hsla(0, 0%, 100%, .7);
    background-color: rgba(var(--dc-navbar-color-rgb), .7);
    display: block;
    height: 2px;
    width: 30px
}

.navbar .navbar-toggler .icon-bar+.icon-bar {
    margin-top: 6px
}

.navbar.navbar-sticky {
    background-color: #f9fbfd;
    background-color: var(--dc-tertiary-bg);
    border-bottom: 1px solid #d9e2ef;
    border-bottom: 1px solid var(--dc-border-color);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .11);
    box-shadow: 0 0 5px rgba(0, 0, 0, .11);
    left: 0;
    min-height: 90px;
    position: fixed !important;
    right: 0;
    top: 0;
    -webkit-transition: all .6s ease-in-out;
    transition: all .6s ease-in-out;
    z-index: 1030
}

.navbar.navbar-sticky .navbar-nav {
    --dc-nav-link-color: rgba(var(--dc-navbar-sticky-color-rgb), 0.7);
    --dc-nav-link-hover-color: rgba(var(--dc-navbar-sticky-color-rgb), 1)
}

.navbar .logo {
    left: 0;
    max-height: 65px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.navbar .link-logo {
    opacity: 1
}

@media(min-width:768px) {
    .navbar.fixed-top {
        background-color: transparent
    }
    .navbar.navbar-sticky {
        background-color: #f9fbfd;
        background-color: var(--dc-tertiary-bg);
        top: 0
    }
    .navbar .nav-link {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important
    }
    .navbar.dark-link .nav-link {
        color: #506690;
        color: var(--dc-body-color)
    }
}

.nav-pills-light .nav-link {
    border: 1px solid transparent;
    color: #506690;
    color: var(--dc-body-color);
    opacity: .7
}

.nav-pills-light .nav-link.active,
.nav-pills-light .nav-link:hover {
    opacity: 1
}

.nav-pills-light .nav-link.active {
    background-color: #f9fbfd;
    background-color: var(--dc-tertiary-bg);
    border: 1px solid #d9e2ef;
    border: 1px solid var(--dc-border-color);
    -webkit-box-shadow: 0 0 64px rgba(249, 251, 253, .5);
    box-shadow: 0 0 64px rgba(249, 251, 253, .5);
    -webkit-box-shadow: 0 0 64px rgba(var(--dc-tertiary-bg-rgb), .5);
    box-shadow: 0 0 64px rgba(var(--dc-tertiary-bg-rgb), .5);
    color: rgba(80, 102, 144, .75);
    color: var(--dc-secondary-color)
}

.nav-pills-outline .nav-link {
    border-radius: 0;
    padding: .5rem;
    position: relative
}

.nav-pills-outline .nav-link:after {
    background-color: #53f;
    bottom: 0;
    content: "";
    height: 2px;
    left: 25%;
    position: absolute;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: transform .3s ease;
    transition: transform .3s ease;
    width: 50%
}

.nav-pills-outline .nav-link.active {
    background-color: #fff;
    color: #53f
}

.nav-pills-outline .nav-link.active:after {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.nav-pills:not(.nav-pills-light) .nav-link.active .h6,
.nav-pills:not(.nav-pills-light) .nav-link.active h6 {
    color: #fff
}

@-webkit-keyframes blink {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes blink {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@-webkit-keyframes jump {
    0% {
        top: 0
    }
    50% {
        top: 50px
    }
    to {
        top: 0
    }
}

@keyframes jump {
    0% {
        top: 0
    }
    50% {
        top: 50px
    }
    to {
        top: 0
    }
}

@-webkit-keyframes clockwise {
    0% {
        -webkit-transform: rotate(0deg) translate(-165px) rotate(0deg);
        transform: rotate(0deg) translate(-165px) rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn) translate(-165px) rotate(-1turn);
        transform: rotate(1turn) translate(-165px) rotate(-1turn)
    }
}

@keyframes clockwise {
    0% {
        -webkit-transform: rotate(0deg) translate(-165px) rotate(0deg);
        transform: rotate(0deg) translate(-165px) rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn) translate(-165px) rotate(-1turn);
        transform: rotate(1turn) translate(-165px) rotate(-1turn)
    }
}

@-webkit-keyframes anti-clockwise {
    0% {
        -webkit-transform: rotate(0deg) translate(165px) rotate(0deg);
        transform: rotate(0deg) translate(165px) rotate(0deg)
    }
    to {
        -webkit-transform: rotate(-1turn) translate(165px) rotate(1turn);
        transform: rotate(-1turn) translate(165px) rotate(1turn)
    }
}

@keyframes anti-clockwise {
    0% {
        -webkit-transform: rotate(0deg) translate(165px) rotate(0deg);
        transform: rotate(0deg) translate(165px) rotate(0deg)
    }
    to {
        -webkit-transform: rotate(-1turn) translate(165px) rotate(1turn);
        transform: rotate(-1turn) translate(165px) rotate(1turn)
    }
}

@-webkit-keyframes rotating {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(-1turn);
        transform: rotate(-1turn)
    }
}

@keyframes rotating {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(-1turn);
        transform: rotate(-1turn)
    }
}

@-webkit-keyframes rotating-clockwise {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes rotating-clockwise {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@-webkit-keyframes rotating-diagonal {
    0% {
        -webkit-transform: translate(-300px, 150px) rotate(0deg);
        transform: translate(-300px, 150px) rotate(0deg)
    }
    to {
        -webkit-transform: translate(300px, -150px) rotate(180deg);
        transform: translate(300px, -150px) rotate(180deg)
    }
}

@keyframes rotating-diagonal {
    0% {
        -webkit-transform: translate(-300px, 150px) rotate(0deg);
        transform: translate(-300px, 150px) rotate(0deg)
    }
    to {
        -webkit-transform: translate(300px, -150px) rotate(180deg);
        transform: translate(300px, -150px) rotate(180deg)
    }
}

.animation {
    position: relative;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.animation--clockwise {
    -webkit-animation: clockwise 30s linear infinite normal;
    animation: clockwise 30s linear infinite normal
}

.animation--anti-clockwise {
    -webkit-animation: anti-clockwise 30s linear infinite normal;
    animation: anti-clockwise 30s linear infinite normal
}

.animation--rotating {
    -webkit-animation: rotating 15s linear infinite normal;
    animation: rotating 15s linear infinite normal
}

.animation--rotating-diagonal {
    -webkit-animation: rotating-diagonal 15s linear infinite alternate;
    animation: rotating-diagonal 15s linear infinite alternate
}

.animation--rotating-clockwise {
    -webkit-animation: rotating-clockwise 15s linear infinite normal;
    animation: rotating-clockwise 15s linear infinite normal
}

@-webkit-keyframes fade-out {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes fade-out {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@-webkit-keyframes bubble-v {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    to {
        -webkit-transform: translateY(-460px);
        transform: translateY(-460px)
    }
}

@keyframes bubble-v {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    to {
        -webkit-transform: translateY(-460px);
        transform: translateY(-460px)
    }
}

@-webkit-keyframes bubble-left-v {
    0% {
        margin-bottom: 0;
        opacity: .1
    }
    20% {
        opacity: 1
    }
    to {
        left: 0;
        margin-bottom: 460px;
        opacity: 1
    }
}

@keyframes bubble-left-v {
    0% {
        margin-bottom: 0;
        opacity: .1
    }
    20% {
        opacity: 1
    }
    to {
        left: 0;
        margin-bottom: 460px;
        opacity: 1
    }
}

@-webkit-keyframes shake-v {
    0% {
        margin-left: 0
    }
    to {
        margin-left: 50px
    }
}

@keyframes shake-v {
    0% {
        margin-left: 0
    }
    to {
        margin-left: 50px
    }
}

@media(min-width:768px) {
    .send-and-receive .off-left-background {
        background-position: -30px 20px
    }
    .send-and-receive .off-left-background:hover {
        background-position: -10px 0
    }
}

.typed-cursor {
    -webkit-animation: blink .7s infinite;
    animation: blink .7s infinite;
    opacity: 1
}

.icon-anime {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    width: 90px
}

.icon-anime .icon {
    margin: 0
}

.icon-anime .shape {
    height: 48px;
    margin-left: -25%;
    padding: 1.5rem 0;
    width: 48px;
    z-index: -1
}

.icon-anime .shape.outlined {
    border-style: solid
}

@media(min-width:768px) {
    .icon-anime {
        margin-left: 0;
        margin-right: 0
    }
}

.mockup,
.mockup-wrapper {
    position: relative
}

.mockup {
    margin: 0 auto;
    max-width: 255px
}

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

.cutout,
.cutout.bottom-right {
    position: relative
}

.cutout.bottom-right:after {
    bottom: 0;
    content: "";
    height: 30px;
    left: 0;
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 30'%3E%3Cpath d='M0 30h100L0 0z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 30'%3E%3Cpath d='M0 30h100L0 0z'/%3E%3C/svg%3E");
    -webkit-mask-position: 50%;
    mask-position: 50%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.cutout.bottom-left {
    position: relative
}

.cutout.bottom-left:after {
    bottom: 0;
    content: "";
    height: 30px;
    left: 0;
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 30'%3E%3Cpath d='M0 30h100V0z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 30'%3E%3Cpath d='M0 30h100V0z'/%3E%3C/svg%3E");
    -webkit-mask-position: 50%;
    mask-position: 50%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.cutout.x2.bottom-right {
    position: relative
}

.cutout.x2.bottom-right:after {
    bottom: 0;
    content: "";
    height: 60px;
    left: 0;
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 60'%3E%3Cpath d='M0 60h100L0 0z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 60'%3E%3Cpath d='M0 60h100L0 0z'/%3E%3C/svg%3E");
    -webkit-mask-position: 50%;
    mask-position: 50%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.cutout.x2.bottom-left {
    position: relative
}

.cutout.x2.bottom-left:after {
    bottom: 0;
    content: "";
    height: 60px;
    left: 0;
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 60'%3E%3Cpath d='M0 60h100V0z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 60'%3E%3Cpath d='M0 60h100V0z'/%3E%3C/svg%3E");
    -webkit-mask-position: 50%;
    mask-position: 50%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 1
}

.cutout:after {
    background-color: #fff;
    background-color: var(--dc-body-bg)
}

.cutout-md {
    position: relative
}

@media(min-width:768px) {
    .cutout-md.bottom-right {
        position: relative
    }
    .cutout-md.bottom-right:after {
        bottom: 0;
        content: "";
        height: 30px;
        left: 0;
        -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 30'%3E%3Cpath d='M0 30h100L0 0z'/%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 30'%3E%3Cpath d='M0 30h100L0 0z'/%3E%3C/svg%3E");
        -webkit-mask-position: 50%;
        mask-position: 50%;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-size: 100%;
        mask-size: 100%;
        position: absolute;
        right: 0;
        width: 100%;
        z-index: 1
    }
    .cutout-md.bottom-left {
        position: relative
    }
    .cutout-md.bottom-left:after {
        bottom: 0;
        content: "";
        height: 30px;
        left: 0;
        -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 30'%3E%3Cpath d='M0 30h100V0z'/%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' preserveAspectRatio='none' viewBox='0 0 100 30'%3E%3Cpath d='M0 30h100V0z'/%3E%3C/svg%3E");
        -webkit-mask-position: 50%;
        mask-position: 50%;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-size: 100%;
        mask-size: 100%;
        position: absolute;
        right: 0;
        width: 100%;
        z-index: 1
    }
}

.wallet {
    margin: 0 auto;
    max-width: 330px;
    position: relative
}

.wallet,
.wallet .card {
    border: 0;
    border-radius: 1.5rem
}

.wallet .card-details {
    border-top-left-radius: 2.25rem;
    border-top-right-radius: 2.25rem
}

.wallet .btn-place-order {
    border-radius: 0 0 1.5rem 1.5rem
}

.smart-wallet .shape {
    position: absolute;
    z-index: 1
}

.smart-wallet .shape.pattern {
    z-index: 0
}

.smart-wallet .shape.pattern-dots {
    background-color: transparent;
    background-image: radial-gradient(#f1f4f8 2px, transparent 0);
    background-image: radial-gradient(var(--dc-secondary-bg) 2px, transparent 2px);
    background-size: 20px 20px;
    bottom: 20rem;
    height: 50%;
    right: 30%;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    width: 250px
}

.accordion-button:not(.collapsed) {
    -webkit-box-shadow: none;
    box-shadow: none;
    font-weight: 700
}

.credit-card {
    overflow: hidden
}

.credit-card .shape {
    position: absolute;
    z-index: 1
}

.credit-card .card-body {
    z-index: 1
}

.credit-card .safe-digit {
    background-color: #abbcd5;
    border-radius: 50%;
    height: .45rem;
    line-height: .45rem;
    margin-right: 3px;
    text-align: center;
    width: .45rem
}

.credit-card .safe-digit:last-child {
    margin-right: 0
}

.credit-card-st1 .shape-1 {
    left: 25%;
    top: 0;
    -webkit-transform: translateY(-65%);
    transform: translateY(-65%)
}

.credit-card-st1 .shape-1 div {
    background: #d9e2ef;
    border-radius: 50%;
    height: 250px;
    opacity: .4;
    width: 350px
}

.credit-card-st1 .shape-2 {
    left: 15%;
    top: 0;
    -webkit-transform: translateY(-70%);
    transform: translateY(-70%)
}

.credit-card-st1 .shape-2 div {
    background: #d9e2ef;
    border-radius: 50%;
    height: 250px;
    margin: 0;
    opacity: .3;
    width: 250px
}

.credit-card-st2 .shape-1 {
    right: 0;
    top: 50%;
    -webkit-transform: translate(-20%, -50%);
    transform: translate(-20%, -50%)
}

.credit-card-st2 .shape-1 div {
    border: 50px solid transparent;
    border-bottom-color: #f1f4f8;
    height: 0;
    opacity: .7;
    position: relative;
    top: -50px;
    width: 0
}

.credit-card-st2 .shape-1 div:after {
    border: 50px solid transparent;
    border-top-color: #f1f4f8;
    content: "";
    height: 0;
    left: -50px;
    position: absolute;
    top: 50px;
    width: 0
}

.credit-card-st2 .shape-2 {
    right: 0;
    top: 50%;
    -webkit-transform: translate(-30%, -50%);
    transform: translate(-30%, -50%)
}

.credit-card-st2 .shape-2 div {
    border: 60px solid transparent;
    border-bottom-color: #f1f4f8;
    height: 0;
    opacity: .5;
    position: relative;
    top: -60px;
    width: 0
}

.credit-card-st2 .shape-2 div:after {
    border: 60px solid transparent;
    border-top-color: #f1f4f8;
    content: "";
    height: 0;
    left: -60px;
    position: absolute;
    top: 60px;
    width: 0
}

.credit-card-st3 .shape-1 {
    background-color: #f1f4f8;
    background-color: var(--dc-secondary-bg);
    height: 50%;
    left: 0;
    opacity: .6;
    right: 0;
    top: 50%
}

.credit-card-st3 .shape-2 {
    left: 0;
    top: 0;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.credit-card-st3 .shape-2 div {
    border: 2px solid #d9e2ef;
    border-radius: 50%;
    height: 250px;
    width: 250px
}

.scroll-to-top {
    bottom: 2rem;
    opacity: 0;
    position: fixed;
    right: 2rem;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: opacity .3s, -webkit-transform .4s cubic-bezier(.68, -.55, .26, 1.5);
    transition: opacity .3s, -webkit-transform .4s cubic-bezier(.68, -.55, .26, 1.5);
    transition: transform .4s cubic-bezier(.68, -.55, .26, 1.5), opacity .3s;
    transition: transform .4s cubic-bezier(.68, -.55, .26, 1.5), opacity .3s, -webkit-transform .4s cubic-bezier(.68, -.55, .26, 1.5);
    visibility: hidden;
    z-index: 9000
}

.scroll-to-top.to-top-visible {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    visibility: visible
}

@media(min-width:768px)and (max-width:1199.98px) {
    .scroll-to-top {
        bottom: 5rem
    }
}

.form[data-response-message-animation],
.form[data-response-message-animation]+.response-message,
form[data-response-message-animation],
form[data-response-message-animation]+.response-message {
    -webkit-transition: opacity .3s ease-out, -webkit-transform .3s ease-in;
    transition: opacity .3s ease-out, -webkit-transform .3s ease-in;
    transition: transform .3s ease-in, opacity .3s ease-out;
    transition: transform .3s ease-in, opacity .3s ease-out, -webkit-transform .3s ease-in
}

.form[data-response-message-animation].submitted+.response-message,
form[data-response-message-animation].submitted+.response-message {
    opacity: 1;
    position: relative;
    z-index: 1
}

.form[data-response-message-animation]+.response-message,
.form[data-response-message-animation].submitted,
form[data-response-message-animation]+.response-message,
form[data-response-message-animation].submitted {
    opacity: 0;
    position: absolute;
    top: 0
}

.form[data-response-message-animation]+.response-message,
form[data-response-message-animation]+.response-message {
    z-index: -1
}

.form[data-response-message-animation=slide-in-up].submitted+.response-message,
form[data-response-message-animation=slide-in-up].submitted+.response-message {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.form[data-response-message-animation=slide-in-up]+.response-message,
.form[data-response-message-animation=slide-in-up].submitted,
form[data-response-message-animation=slide-in-up]+.response-message,
form[data-response-message-animation=slide-in-up].submitted {
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}

.form[data-response-message-animation=slide-in-left].submitted+.response-message,
form[data-response-message-animation=slide-in-left].submitted+.response-message {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.form[data-response-message-animation=slide-in-left]+.response-message,
.form[data-response-message-animation=slide-in-left].submitted,
form[data-response-message-animation=slide-in-left]+.response-message,
form[data-response-message-animation=slide-in-left].submitted {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}

.btn-download {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    min-width: 200px;
    text-align: left;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.btn-download p {
    line-height: 1.45;
    margin-bottom: 0;
    margin-top: 0
}

.btn-download .small {
    display: block;
    margin-top: -2px
}

@media(min-width:768px) {
    .app-landing-header .container {
        padding-bottom: 12rem
    }
}

.app-landing-header .background-shape {
    z-index: 0
}

.app-landing-header .background-shape-main {
    bottom: 0;
    height: 200%;
    position: absolute;
    -webkit-transform: translate(65%, -20%) rotate(-60deg);
    transform: translate(65%, -20%) rotate(-60deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%
}

@media(min-width:768px) {
    .app-landing-header .background-shape-main {
        -webkit-transform: translate(50%) rotate(-60deg);
        transform: translate(50%) rotate(-60deg)
    }
}

@media(min-width:992px) {
    .app-landing-header .background-shape-main {
        -webkit-transform: translate(45%) rotate(-60deg);
        transform: translate(45%) rotate(-60deg)
    }
}

.app-landing-header .background-shape-top {
    left: 50%;
    -webkit-transform: translate(80%, -60%) rotate(-60deg);
    transform: translate(80%, -60%) rotate(-60deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%
}

@media(min-width:1200px) {
    .app-landing-header .iphone-x {
        border-radius: 34px;
        max-width: 318.75px;
        padding: 12.75px
    }
    .app-landing-header .iphone-x .screen img {
        border-radius: 17px
    }
    .app-landing-header .iphone-x .notch {
        border-radius: 17px;
        height: 29.75px;
        width: 177.65px
    }
}

.app-landing-2-header .head-line-2 {
    display: block
}

@media(min-width:768px) {
    .app-landing-2-header .head-line-2 {
        display: inline
    }
}

.app-landing-2-header .background-shape-main {
    background-image: linear-gradient(45deg, #53f 40%, #869ab8);
    border-radius: 100px;
    bottom: 0;
    -webkit-transform: translate(80%, -30%) rotate(-35deg);
    transform: translate(80%, -30%) rotate(-35deg)
}

@media(min-width:768px) {
    .app-landing-2-header .background-shape-main {
        height: 150%;
        -webkit-transform: translate(25%, -25%) skewY(30deg);
        transform: translate(25%, -25%) skewY(30deg)
    }
}

@media(min-width:992px) {
    .app-landing-2-header .background-shape-main {
        -webkit-transform: translate(20%, -30%) skewY(30deg);
        transform: translate(20%, -30%) skewY(30deg)
    }
}

@media(min-width:1200px) {
    .app-landing-2-header .background-shape-main {
        -webkit-transform: translate(30%, -10%) skewY(30deg);
        transform: translate(30%, -10%) skewY(30deg)
    }
}

.app-landing-2-header .animation-shape {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute
}

.app-landing-2-header .animation-shape.shape-triangle {
    -webkit-animation-duration: 12s;
    animation-duration: 12s;
    left: 0;
    top: 80%
}

.app-landing-2-header .animation-shape.shape-triangle div {
    background-color: #53f;
    opacity: .1;
    position: relative;
    text-align: left;
    -webkit-transform: rotate(-60deg) skewX(-30deg) scaleY(.866);
    transform: rotate(-60deg) skewX(-30deg) scaleY(.866)
}

.app-landing-2-header .animation-shape.shape-triangle div:after,
.app-landing-2-header .animation-shape.shape-triangle div:before {
    background-color: inherit;
    content: "";
    position: absolute
}

.app-landing-2-header .animation-shape.shape-triangle div,
.app-landing-2-header .animation-shape.shape-triangle div:after,
.app-landing-2-header .animation-shape.shape-triangle div:before {
    border-top-right-radius: 30%;
    height: 90px;
    width: 90px
}

.app-landing-2-header .animation-shape.shape-triangle div:before {
    -webkit-transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%);
    transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%)
}

.app-landing-2-header .animation-shape.shape-triangle div:after {
    -webkit-transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%);
    transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%)
}

.app-landing-2-header .animation-shape.shape-cross {
    left: 75%;
    top: 20%
}

.app-landing-2-header .animation-shape.shape-cross div {
    background: #fff;
    height: 20px;
    position: relative;
    width: 3px
}

.app-landing-2-header .animation-shape.shape-cross div:after {
    background: #fff;
    content: "";
    height: 3px;
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 20px
}

.app-landing-2-header .static-shape {
    position: absolute
}

.app-landing-2-header .static-shape.shape-circle {
    opacity: .2;
    right: 0;
    top: 0
}

.app-landing-2-header .static-shape.shape-circle-1 {
    -webkit-transform: translate3d(25%, -25%, 0);
    transform: translate3d(25%, -25%, 0)
}

.app-landing-2-header .static-shape.shape-circle-1 div {
    background: hsla(0, 0%, 100%, .5);
    border-radius: 50%;
    height: 500px;
    margin: 0;
    width: 500px
}

.app-landing-2-header .static-shape.shape-circle-2 {
    -webkit-transform: translate3d(25%, -25%, 0);
    transform: translate3d(25%, -25%, 0)
}

.app-landing-2-header .static-shape.shape-circle-2 div {
    background: hsla(0, 0%, 100%, .25);
    border-radius: 50%;
    height: 300px;
    margin: 0;
    width: 300px
}

.app-landing-2-header .static-shape.shape-ring {
    left: 53%;
    top: 30%
}

.app-landing-2-header .static-shape.shape-ring-1 {
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0)
}

.app-landing-2-header .static-shape.shape-ring-1 .animation {
    -webkit-animation-duration: 45s;
    animation-duration: 45s;
    border: 4px solid #fff;
    border-radius: 50%;
    height: 40px;
    width: 40px
}

.app-landing-2-header .static-shape.shape-ring-2 {
    -webkit-transform: translate3d(-15%, -15%, 0);
    transform: translate3d(-15%, -15%, 0)
}

.app-landing-2-header .static-shape.shape-ring-2 .animation {
    -webkit-animation-duration: 60s;
    animation-duration: 60s;
    border: 1px solid #fff;
    border-radius: 50%;
    height: 40px;
    width: 40px
}

.app-landing-2-header .static-shape.shape-ring .animation {
    border-style: dashed
}

.app-landing-2-header .static-shape.pattern-dots-1 {
    background-color: transparent;
    background-image: radial-gradient(rgba(0, 0, 0, .1) 3px, transparent 0);
    background-size: 30px 30px;
    height: 20%;
    left: 0;
    top: 0;
    width: 150px
}

.app-landing-2-header .static-shape.pattern-dots-2 {
    background-color: transparent;
    background-image: radial-gradient(rgba(0, 0, 0, .1) 2px, transparent 0);
    background-size: 20px 20px;
    bottom: 65px;
    height: 40%;
    right: 33%;
    width: 185px
}

.app-landing-2-header .shape {
    position: absolute
}

.app-landing-2-header .shape:first-child {
    height: 140px;
    left: 70%;
    top: 0;
    width: 400px
}

.app-landing-2-header .shape:nth-child(2) {
    height: 100px;
    left: 65%;
    top: 0;
    width: 300px
}

.app-landing-2-header .shape:nth-child(3) {
    height: 200px;
    left: 80%;
    top: 0;
    width: 600px
}

.app-landing-2-header .shape:nth-child(4) {
    height: 150px;
    left: 85%;
    top: 82%;
    width: 150px
}

@media(min-width:768px) {
    .app-landing-2-header .shape:first-child {
        left: 25%
    }
    .app-landing-2-header .shape:nth-child(2) {
        left: 55%
    }
}

@media(min-width:992px) {
    .app-landing-2-header .shape:first-child {
        left: 35%
    }
    .app-landing-2-header .shape:nth-child(2) {
        left: 45%
    }
}

@media(min-width:1200px) {
    .app-landing-2-header .shape:first-child {
        left: 45%
    }
    .app-landing-2-header .shape:nth-child(2) {
        left: 65%
    }
}

.app-landing-2-header .shape[data-aos]:before {
    background-color: rgba(249, 251, 253, .05);
    border-radius: 100px;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: rotate(-55deg);
    transform: rotate(-55deg)
}

.developers-header {
    background: radial-gradient(94% 58.3% at 50.3% 82.6%, #110a33 0, #000 100%)
}

.automate-marketing-header .background-shape {
    opacity: .2;
    z-index: 0
}

.automate-marketing-header .background-shape-main {
    background-color: #53f;
    bottom: 0;
    height: 150%;
    opacity: 1;
    position: absolute;
    -webkit-transform: translate(20%) rotate(-30deg);
    transform: translate(20%) rotate(-30deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    width: 170%
}

.automate-marketing-header .background-shape-main.shadow {
    background-color: rgba(134, 154, 184, .15);
    -webkit-transform: translate(19%, 10px) rotate(-30deg);
    transform: translate(19%, 10px) rotate(-30deg)
}

@media(min-width:768px) {
    .automate-marketing-header .background-shape-main {
        width: 140%
    }
}

@media(min-width:992px) {
    .automate-marketing-header .background-shape-main {
        bottom: -40px;
        width: 120%
    }
}

@media(min-width:1200px) {
    .automate-marketing-header .background-shape-main {
        width: 110%
    }
}

.automate-marketing-header .rounded-stripe {
    background-color: #8abcfe;
    bottom: -40px;
    height: 20%;
    opacity: 1;
    position: absolute;
    -webkit-transform: translate(20%) rotate(-30deg);
    transform: translate(20%) rotate(-30deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    width: 100%
}

.automate-marketing-header .shape-top {
    background-image: linear-gradient(-57deg, #5634d0, #4a61d1);
    -webkit-box-shadow: 0 0 25px 50px rgba(74, 97, 209, .5);
    box-shadow: 0 0 25px 50px rgba(74, 97, 209, .5);
    max-height: 560px;
    top: 0;
    -webkit-transform: rotate(30deg) translate3D(-45%, -45%, 0);
    transform: rotate(30deg) translate3D(-45%, -45%, 0)
}

.automate-marketing-header .main-shape-wrapper {
    width: 90%
}

@media(max-width:767.98px) {
    .automate-marketing-header .main-shape-wrapper {
        left: 50%;
        position: relative;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

@media(min-width:992px) {
    .automate-marketing-header .main-shape-wrapper {
        position: absolute;
        right: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 50%
    }
}

@media(min-width:1200px) {
    .automate-marketing-header .main-shape-wrapper {
        -webkit-transform: translateY(-50%) scale(.75);
        transform: translateY(-50%) scale(.75)
    }
}

@media(min-width:1601px) {
    .automate-marketing-header .main-background {
        -webkit-transform: translate3d(0, -3%, 0);
        transform: translate3d(0, -3%, 0)
    }
}

.automate-marketing-header .bubbles-wrapper {
    position: relative
}

.automate-marketing-header .bubbles-wrapper .icon {
    margin: 0;
    position: absolute;
    will-change: transform, opacity
}

.automate-marketing-header .bubbles-wrapper .bubble:first-child {
    -webkit-animation: floating 3.3333333333s ease-in-out infinite alternate;
    animation: floating 3.3333333333s ease-in-out infinite alternate;
    bottom: 45%;
    left: 2%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:first-child {
        -webkit-animation: bubble-left-v 10s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 10s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(2) {
    -webkit-animation: floating 2.2333333333s ease-in-out infinite alternate;
    animation: floating 2.2333333333s ease-in-out infinite alternate;
    bottom: 40%;
    left: 12%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(2) {
        -webkit-animation: bubble-left-v 6.7s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 6.7s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(3) {
    -webkit-animation: floating 2.9333333333s ease-in-out infinite alternate;
    animation: floating 2.9333333333s ease-in-out infinite alternate;
    bottom: 56%;
    left: 14%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(3) {
        -webkit-animation: bubble-left-v 8.8s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 8.8s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(4) {
    -webkit-animation: floating 2.2666666667s ease-in-out infinite alternate;
    animation: floating 2.2666666667s ease-in-out infinite alternate;
    bottom: 51%;
    left: 20%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(4) {
        -webkit-animation: bubble-left-v 6.8s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 6.8s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(5) {
    -webkit-animation: floating 3.1666666667s ease-in-out infinite alternate;
    animation: floating 3.1666666667s ease-in-out infinite alternate;
    bottom: 65%;
    left: 30%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(5) {
        -webkit-animation: bubble-left-v 9.5s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 9.5s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(6) {
    -webkit-animation: floating 2.9s ease-in-out infinite alternate;
    animation: floating 2.9s ease-in-out infinite alternate;
    bottom: 44%;
    left: 30%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(6) {
        -webkit-animation: bubble-left-v 8.7s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 8.7s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(7) {
    -webkit-animation: floating 2.5s ease-in-out infinite alternate;
    animation: floating 2.5s ease-in-out infinite alternate;
    bottom: 80%;
    left: 40%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(7) {
        -webkit-animation: bubble-left-v 7.5s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 7.5s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(8) {
    -webkit-animation: floating 3.3333333333s ease-in-out infinite alternate;
    animation: floating 3.3333333333s ease-in-out infinite alternate;
    bottom: 55%;
    left: 38%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(8) {
        -webkit-animation: bubble-left-v 10s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 10s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(9) {
    -webkit-animation: floating 2.1333333333s ease-in-out infinite alternate;
    animation: floating 2.1333333333s ease-in-out infinite alternate;
    bottom: 50%;
    left: 1%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(9) {
        -webkit-animation: bubble-left-v 6.4s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 6.4s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(10) {
    -webkit-animation: floating 2.7333333333s ease-in-out infinite alternate;
    animation: floating 2.7333333333s ease-in-out infinite alternate;
    bottom: 55%;
    left: 12%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(10) {
        -webkit-animation: bubble-left-v 8.2s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 8.2s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(11) {
    -webkit-animation: floating 2.1333333333s ease-in-out infinite alternate;
    animation: floating 2.1333333333s ease-in-out infinite alternate;
    bottom: 60%;
    left: 14%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(11) {
        -webkit-animation: bubble-left-v 6.4s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 6.4s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(12) {
    -webkit-animation: floating 2.6s ease-in-out infinite alternate;
    animation: floating 2.6s ease-in-out infinite alternate;
    bottom: 60%;
    left: 18%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(12) {
        -webkit-animation: bubble-left-v 7.8s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 7.8s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(13) {
    -webkit-animation: floating 3.0666666667s ease-in-out infinite alternate;
    animation: floating 3.0666666667s ease-in-out infinite alternate;
    bottom: 70%;
    left: 20%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(13) {
        -webkit-animation: bubble-left-v 9.2s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 9.2s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(14) {
    -webkit-animation: floating 4.0666666667s ease-in-out infinite alternate;
    animation: floating 4.0666666667s ease-in-out infinite alternate;
    bottom: 75%;
    left: 45%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(14) {
        -webkit-animation: bubble-left-v 12.2s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 12.2s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(15) {
    -webkit-animation: floating 3.2666666667s ease-in-out infinite alternate;
    animation: floating 3.2666666667s ease-in-out infinite alternate;
    bottom: 50%;
    left: 50%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(15) {
        -webkit-animation: bubble-left-v 9.8s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 9.8s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

.automate-marketing-header .bubbles-wrapper .bubble:nth-child(16) {
    -webkit-animation: floating 3.5333333333s ease-in-out infinite alternate;
    animation: floating 3.5333333333s ease-in-out infinite alternate;
    bottom: 68%;
    left: 34%
}

@media(min-width:992px) {
    .automate-marketing-header .bubbles-wrapper .bubble:nth-child(16) {
        -webkit-animation: bubble-left-v 10.6s linear infinite, shake-v 2s ease-in-out infinite alternate;
        animation: bubble-left-v 10.6s linear infinite, shake-v 2s ease-in-out infinite alternate;
        bottom: 50%
    }
}

#stripes {
    background: linear-gradient(150deg, #53f 15%, #05d5ff 70%, #a6ffcb 94%);
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: repeat(12, 1fr);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

#stripes :first-child {
    background-color: #53f;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 60%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 60%, 0 100%);
    grid-area: 1/1/span 4/span 2
}

#stripes :nth-child(2) {
    background-color: #4553ff;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 74%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 74%, 0 100%);
    grid-area: 1/3/span 3/span 2;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px)
}

#stripes :nth-child(3) {
    background-color: #4f40ff;
    -webkit-clip-path: polygon(0 0, 100% 0, 99% 5%, 0 70%);
    clip-path: polygon(0 0, 100% 0, 99% 5%, 0 70%);
    grid-area: 1/5/span 2/span 2
}

#stripes :nth-child(4) {
    background-color: #0dcfff;
    -webkit-clip-path: polygon(0 23%, 100% 0, 100% 77%, 0 100%);
    clip-path: polygon(0 23%, 100% 0, 100% 77%, 0 100%);
    grid-area: 3/11/span 3/span 2
}

#stripes :nth-child(5) {
    background-color: #1fa2ff;
    -webkit-clip-path: polygon(0 23%, 100% 0, 100% 80%, 0 100%);
    clip-path: polygon(0 23%, 100% 0, 100% 80%, 0 100%);
    grid-area: 8/1/span 5/span 4;
    -webkit-transform: translateY(10px);
    transform: translateY(10px)
}

.payment-services-header .shape-main {
    bottom: 0;
    left: 0;
    position: absolute !important;
    top: 0;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    width: 100%;
    z-index: -9
}

.payment-services-header .shape-main .bottom-edge {
    background-color: #fff;
    bottom: -20px;
    height: 60px;
    left: 0;
    position: absolute;
    right: 0;
    top: auto;
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
    width: 100%
}

@media(min-width:768px) {
    .payment-services-header .shape-main {
        width: 65%
    }
}

.payment-services-header .figure-box {
    max-width: 500px
}

.payment-services-header .figure-box .screens {
    overflow: hidden;
    position: relative
}

@media(min-width:768px) {
    .payment-services-header .figure-box {
        margin-right: 0;
        -webkit-transform: translate3d(25%, 0, 0);
        transform: translate3d(25%, 0, 0)
    }
}

.payment-services-header .figure-box .position-absolute {
    top: 0
}

.payment-services-header .figure-box.cutout:after {
    z-index: 0
}

.payment-services-header .static-shape {
    position: absolute
}

.payment-services-header .static-shape.pattern-dots {
    background-color: transparent;
    background-image: radial-gradient(rgba(85, 51, 255, .5) 3px, transparent 0);
    background-size: 20px 20px;
    height: 200px;
    left: 10%;
    top: 0;
    width: 75%
}

.payment-services-header .promo-box {
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 1
}

@media(min-width:768px) {
    .payment-services-header .promo-box {
        left: -100px;
        position: absolute;
        width: auto
    }
}

.smart-business-header .background-shape-left,
.smart-business-header .background-shape-right,
.smart-business-header .background-shape-top {
    opacity: .2;
    z-index: 1
}

.smart-business-header .background-shape-top {
    background-image: linear-gradient(-57deg, #9985ff, #53f);
    max-height: 560px;
    top: 0;
    -webkit-transform: rotate(30deg) translate3D(-45%, -45%, 0);
    transform: rotate(30deg) translate3D(-45%, -45%, 0)
}

.smart-business-header .background-shape-right {
    background-image: linear-gradient(-57deg, #9985ff, #53f);
    left: 93%
}

.smart-business-header .background-shape-main {
    background-image: linear-gradient(45deg, #53f 40%, #869ab8);
    border-radius: 100px;
    bottom: 0;
    height: 100%;
    position: absolute;
    -webkit-transform: translate(80%, -30%) rotate(-35deg);
    transform: translate(80%, -30%) rotate(-35deg);
    width: 100%;
    z-index: 1
}

@media(min-width:768px) {
    .smart-business-header .background-shape-main {
        height: 150%;
        -webkit-transform: translate(25%, -50%) skewY(30deg);
        transform: translate(25%, -50%) skewY(30deg)
    }
}

@media(min-width:992px) {
    .smart-business-header .background-shape-main {
        -webkit-transform: translate(20%, -30%) skewY(30deg);
        transform: translate(20%, -30%) skewY(30deg)
    }
}

@media(min-width:1200px) {
    .smart-business-header .background-shape-main {
        -webkit-transform: translate(30%, -12%) skewY(30deg);
        transform: translate(30%, -12%) skewY(30deg)
    }
}

.smart-business-header .hero-wrapper {
    position: relative;
    width: 60%;
    z-index: 2
}

@media(max-width:767.98px) {
    .smart-business-header .hero-wrapper {
        left: 50%;
        position: relative;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

@media(min-width:768px) {
    .smart-business-header .hero-wrapper {
        width: 50%
    }
}

@media(min-width:992px) {
    .smart-business-header .hero-wrapper {
        position: absolute;
        right: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 40%
    }
}

@media(min-width:1200px) {
    .smart-business-header .hero-wrapper {
        -webkit-transform: translateY(-50%) scale(.75);
        transform: translateY(-50%) scale(.75)
    }
}

.smart-business-header .anim {
    max-width: 80px;
    position: absolute;
    width: 15%
}

.smart-business-header .anim.anim-1 {
    -webkit-animation-duration: 3.4s;
    animation-duration: 3.4s;
    right: 5%;
    top: 56%
}

.smart-business-header .anim.anim-2 {
    right: 58%;
    top: 10%
}

.smart-business-header .anim.anim-3 {
    -webkit-animation-duration: 3.8s;
    animation-duration: 3.8s;
    right: 22%;
    top: 33%
}

.integrations-header .container {
    padding-bottom: 600px !important
}

.integrations-header .background-shape-main {
    background-image: linear-gradient(45deg, #f1f4f8 40%, #f9fbfd);
    background-image: linear-gradient(45deg, var(--dc-secondary-bg) 40%, var(--dc-tertiary-bg) 100%);
    border-radius: 100px;
    bottom: 0;
    height: 200%;
    -webkit-transform: translateY(-45%) rotate(-12deg);
    transform: translateY(-45%) rotate(-12deg);
    width: 100%
}

@media(min-width:768px) {
    .integrations-header .background-shape-main {
        -webkit-transform: translateY(-70%) rotate(-12deg);
        transform: translateY(-70%) rotate(-12deg)
    }
}

.integrations-header .bubbles-wrap {
    bottom: 0;
    height: 600px;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    z-index: 2
}

.integrations-header .bubbles-container {
    position: relative
}

.integrations-header .bubble {
    background-image: url(../9853ac6fa30d6d6aa26a.png);
    background-size: 1076px 1076px;
    border-radius: 50%;
    -webkit-box-shadow: 0 15px 35px rgba(0, 0, 0, .1), 0 3px 10px rgba(0, 0, 0, .1);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .1), 0 3px 10px rgba(0, 0, 0, .1);
    height: 152px;
    position: absolute;
    width: 152px
}

.integrations-header .bubble.bubble-1 {
    background-position: 0 0
}

.integrations-header .bubble.bubble-2 {
    background-position: -154px 0
}

.integrations-header .bubble.bubble-3 {
    background-position: -308px 0
}

.integrations-header .bubble.bubble-4 {
    background-position: -462px 0
}

.integrations-header .bubble.bubble-5 {
    background-position: -616px 0
}

.integrations-header .bubble.bubble-6 {
    background-position: -770px 0
}

.integrations-header .bubble.bubble-7 {
    background-position: -924px 0
}

.integrations-header .bubble.bubble-8 {
    background-position: 0 -154px
}

.integrations-header .bubble.bubble-9 {
    background-position: -154px -154px
}

.integrations-header .bubble.bubble-10 {
    background-position: -308px -154px
}

.integrations-header .bubble.bubble-11 {
    background-position: -462px -154px
}

.integrations-header .bubble.bubble-12 {
    background-position: -616px -154px
}

.integrations-header .bubble.bubble-13 {
    background-position: -770px -154px
}

.integrations-header .bubble.bubble-14 {
    background-position: -924px -154px
}

.integrations-header .bubble.bubble-15 {
    background-position: 0 -308px
}

.integrations-header .bubble.bubble-16 {
    background-position: -154px -308px
}

.integrations-header .bubble.bubble-17 {
    background-position: -308px -308px
}

.integrations-header .bubble.bubble-18 {
    background-position: -462px -308px
}

.integrations-header .bubble.bubble-19 {
    background-position: -616px -308px
}

.integrations-header .bubble.bubble-20 {
    background-position: -770px -308px
}

.integrations-header .bubble.bubble-21 {
    background-position: -924px -308px
}

.integrations-header .bubble.bubble-22 {
    background-position: 0 -462px
}

.integrations-header .bubble.bubble-23 {
    background-position: -154px -462px
}

.integrations-header .bubble.bubble-24 {
    background-position: -308px -462px
}

.integrations-header .bubble.bubble-25 {
    background-position: -462px -462px
}

.integrations-header .bubble.bubble-26 {
    background-position: -616px -462px
}

.integrations-header .bubble.bubble-27 {
    background-position: -770px -462px
}

.integrations-header .bubble.bubble-28 {
    background-position: -924px -462px
}

.integrations-header .bubble.bubble-29 {
    background-position: 0 -616px
}

.integrations-header .bubble.bubble-30 {
    background-position: -154px -616px
}

.integrations-header .bubble.bubble-31 {
    background-position: -308px -616px
}

.integrations-header .bubble.bubble-32 {
    background-position: -462px -616px
}

.integrations-header .bubble.bubble-33 {
    background-position: -616px -616px
}

.integrations-header .bubble.bubble-34 {
    background-position: -770px -616px
}

.integrations-header .bubble.bubble-35 {
    background-position: -924px -616px
}

.integrations-header .bubble.bubble-36 {
    background-position: 0 -770px
}

.integrations-header .bubble.bubble-37 {
    background-position: -154px -770px
}

.integrations-header .bubble.bubble-38 {
    background-position: -308px -770px
}

.integrations-header .bubble.bubble-39 {
    background-position: -462px -770px
}

.integrations-header .bubble.bubble-40 {
    background-position: -616px -770px
}

.integrations-header .bubble.bubble-41 {
    background-position: -770px -770px
}

.integrations-header .bubble.bubble-42 {
    background-position: -924px -770px
}

.integrations-header .shape {
    display: none;
    position: absolute;
    z-index: 1
}

@media(min-width:768px) {
    .integrations-header .shape {
        display: block
    }
}

.integrations-header .shape-circle-1 {
    left: 2%;
    top: 5%
}

.integrations-header .shape-circle-1 div {
    background: #ffc041;
    border-radius: 50%;
    height: 20px;
    margin: 0;
    width: 20px
}

.integrations-header .shape-ring-1 {
    left: 0;
    top: 0;
    -webkit-transform: translate(-25%, -25%);
    transform: translate(-25%, -25%)
}

.integrations-header .shape-ring-1 div {
    border: 50px solid #f9fbfd;
    border: 50px solid var(--dc-tertiary-bg);
    border-radius: 50%;
    height: 560px;
    opacity: .15;
    width: 560px
}

.integrations-header .shape-square {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.integrations-header .shape-square-1 {
    right: 0;
    top: 20%
}

.integrations-header .shape-square-1 div {
    border: 10px solid #f9fbfd;
    border: 10px solid var(--dc-tertiary-bg);
    height: 150px;
    width: 150px
}

.integrations-header .shape-square-2 {
    right: 0;
    top: 30%
}

.integrations-header .shape-square-2 div {
    border: 5px solid #f9fbfd;
    border: 5px solid var(--dc-tertiary-bg);
    height: 50px;
    width: 50px
}

.integrations-header .shape-square-3 {
    left: 0;
    top: 5%
}

.integrations-header .shape-square-3 div {
    border: 5px solid #53f;
    height: 50px;
    width: 50px
}

.integrations-header .shape.pattern {
    z-index: 0
}

.integrations-header .shape.pattern-dots {
    background-color: transparent;
    background-image: radial-gradient(#f9fbfd 2px, transparent 0);
    background-image: radial-gradient(var(--dc-tertiary-bg) 2px, transparent 2px);
    background-size: 20px 20px;
    bottom: 20rem;
    height: 155px;
    right: 0;
    -webkit-transform: rotate(-12deg);
    transform: rotate(-12deg);
    width: 50%
}

.advanced-automation-gradient {
    background: linear-gradient(-135deg, #53f 25%, #05d5ff)
}

.advanced-automation-gradient:before {
    background-color: #fff;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 10px hsla(0, 0%, 100%, .5), 0 0 125px 15px hsla(0, 0%, 100%, .5);
    box-shadow: 0 0 0 10px hsla(0, 0%, 100%, .5), 0 0 125px 15px hsla(0, 0%, 100%, .5);
    content: "";
    height: 600px;
    left: 50%;
    position: absolute;
    top: 65%;
    -webkit-transform: translate3d(-50%, 10%, 0);
    transform: translate3d(-50%, 10%, 0);
    width: 150%;
    z-index: 0
}

@media(min-width:576px) {
    .advanced-automation-gradient:before {
        top: 55%
    }
}

@media(min-width:992px) {
    .advanced-automation-gradient:before {
        top: 50%
    }
}

.advanced-system .background-shape-main {
    max-width: 50%;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.anime-background .shape-main {
    bottom: 0;
    position: absolute !important;
    top: 0;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    width: 100%;
    z-index: 0
}

.anime-background .shape-main.start-0 {
    background-image: linear-gradient(45deg, #f1f4f8, #fff);
    background-image: linear-gradient(45deg, var(--dc-secondary-bg) 0, var(--dc-body-bg) 100%);
    -webkit-transform: skew(0deg, 2deg);
    transform: skew(0deg, 2deg)
}

.anime-background .shape-main.end-0 {
    background-image: linear-gradient(-45deg, #f1f4f8, #fff);
    background-image: linear-gradient(-45deg, var(--dc-secondary-bg) 0, var(--dc-body-bg) 100%);
    -webkit-transform: skew(0deg, -2deg);
    transform: skew(0deg, -2deg)
}

@media(min-width:768px) {
    .anime-background .shape-main {
        width: 90%
    }
    .anime-background [class^=container] {
        padding-bottom: 9rem;
        padding-top: 9rem
    }
}

.with-promo .shape {
    position: absolute
}

.with-promo .mockup {
    max-width: 285px
}

.with-promo .promo-box {
    border: none;
    z-index: 2
}

.with-promo .promo-box .circle-icon {
    position: absolute
}

.with-promo .promo-box.bottom-left {
    bottom: 0;
    left: 0
}

.with-promo .promo-box.bottom-left+.shapes-container .shape.pattern {
    z-index: 0
}

.with-promo .promo-box.bottom-left+.shapes-container .shape.pattern-dots {
    background-color: transparent;
    background-image: radial-gradient(#d9e2ef 2px, transparent 0);
    background-size: 15px 15px;
    height: 70%;
    right: 0;
    top: 0;
    -webkit-transform: translate(50%, -30%);
    transform: translate(50%, -30%);
    width: 200px
}

.with-promo .promo-box.bottom-left .circle-icon {
    right: 0;
    top: 0;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%)
}

.with-promo .promo-box.top-right {
    bottom: 0;
    right: 0
}

.with-promo .promo-box.top-right+.shapes-container .shape.pattern {
    z-index: 0
}

.with-promo .promo-box.top-right+.shapes-container .shape.pattern-dots {
    background-color: transparent;
    background-image: radial-gradient(#d9e2ef 2px, transparent 0);
    background-size: 15px 15px;
    height: 70%;
    left: 0;
    top: 0;
    -webkit-transform: translate(-50%, -30%);
    transform: translate(-50%, -30%);
    width: 200px
}

.with-promo .promo-box.top-right .circle-icon {
    left: 0;
    top: 0;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.with-promo .promo-box p {
    margin: 0
}

@media(min-width:768px) {
    .with-promo .promo-box {
        position: absolute
    }
    .with-promo .promo-box.bottom-left {
        -webkit-transform: translate(-10%, 50%);
        transform: translate(-10%, 50%)
    }
    .with-promo .promo-box.top-right {
        -webkit-transform: translate(10%, 50%);
        transform: translate(10%, 50%)
    }
}

@media(min-width:992px) {
    .with-promo .promo-box.bottom-left {
        -webkit-transform: translate(-50%, 50%);
        transform: translate(-50%, 50%)
    }
    .with-promo .promo-box.top-right {
        -webkit-transform: translate(50%, 50%);
        transform: translate(50%, 50%)
    }
}

.with-promo .shapes-container {
    z-index: -1
}

@media(min-width:768px) {
    .get-started .floating-box {
        left: 50%;
        max-width: 592px;
        position: absolute;
        top: 75%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 90%
    }
}

@media(min-width:992px) {
    .get-started .floating-box {
        bottom: 1.5%;
        left: 0;
        top: auto;
        -webkit-transform: none;
        transform: none;
        width: 60%
    }
}

@media(min-width:1200px) {
    .get-started .floating-box {
        width: 50%
    }
}

.get-started .play-video {
    display: none
}

@media(min-width:992px) {
    .get-started .play-video {
        bottom: 14.5%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: 10em;
        position: absolute;
        right: 6.5%;
        width: 10em;
        z-index: 1;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }
}

.get-started .browser {
    display: none
}

@media(min-width:768px) {
    .get-started .browser {
        display: block
    }
}

@media(min-width:992px) {
    .get-started .browser {
        width: 80%
    }
}

.header-includes-carousel .container {
    padding-bottom: 6rem !important;
    padding-top: 12rem !important
}

@media(min-width:992px) {
    .header-includes-carousel .container {
        padding-bottom: 12rem !important
    }
}

.features-carousel .logo {
    max-height: 28px
}

.main {
    overflow-x: hidden
}

.section,
section {
    position: relative
}

.section [class^=container],
section [class^=container] {
    padding-bottom: 45px;
    padding-top: 45px;
    position: relative
}

.section [class^=container].bring-to-front,
section [class^=container].bring-to-front {
    z-index: 9
}

@media(min-width:768px) {
    .section [class^=container],
    section [class^=container] {
        padding-bottom: 90px;
        padding-top: 90px
    }
}

.section .container-wide,
section .container-wide {
    overflow-x: hidden
}

.section .container-wide .row,
section .container-wide .row {
    margin-left: 0 !important;
    margin-right: 0 !important
}

.section.shadow,
section.shadow {
    z-index: 1
}

.section-heading {
    margin-bottom: 60px;
    position: relative
}

.section-heading .h2,
.section-heading h2 {
    font-size: 2.875rem;
    font-weight: 400;
    margin-top: 0
}

.section-heading p {
    font-weight: 300
}

.shape-ring-big .shape-ring {
    border: 100px solid #f1f4f8;
    border: 100px solid var(--dc-secondary-bg);
    border-radius: 50%;
    height: 920px;
    margin-right: -25%;
    max-width: none;
    width: 920px
}

@media(min-width:1200px) {
    .shape-ring-big .shape-ring {
        margin-right: 0
    }
}

.safety-first .shape {
    position: absolute
}

.safety-first .shape-triangle {
    left: 0;
    top: 0;
    -webkit-transform: translate(-60%, -90%) rotate(40deg);
    transform: translate(-60%, -90%) rotate(40deg);
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.safety-first .shape-triangle div {
    background-color: #53f;
    background: linear-gradient(45deg, #53f, #53f);
    position: relative;
    text-align: left;
    -webkit-transform: rotate(-60deg) skewX(-30deg) scaleY(.866);
    transform: rotate(-60deg) skewX(-30deg) scaleY(.866)
}

.safety-first .shape-triangle div:after,
.safety-first .shape-triangle div:before {
    background-color: inherit;
    background: inherit;
    content: "";
    position: absolute
}

.safety-first .shape-triangle div,
.safety-first .shape-triangle div:after,
.safety-first .shape-triangle div:before {
    border-top-right-radius: 30%;
    height: 80px;
    width: 80px
}

.safety-first .shape-triangle div:before {
    -webkit-transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%);
    transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%)
}

.safety-first .shape-triangle div:after {
    -webkit-transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%);
    transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%)
}

@media(min-width:576px) {
    .safety-first .shape-triangle div {
        background-color: #53f;
        background: linear-gradient(45deg, #53f, #53f);
        position: relative;
        text-align: left;
        -webkit-transform: rotate(-60deg) skewX(-30deg) scaleY(.866);
        transform: rotate(-60deg) skewX(-30deg) scaleY(.866)
    }
    .safety-first .shape-triangle div:after,
    .safety-first .shape-triangle div:before {
        background-color: inherit;
        background: inherit;
        content: "";
        position: absolute
    }
    .safety-first .shape-triangle div,
    .safety-first .shape-triangle div:after,
    .safety-first .shape-triangle div:before {
        border-top-right-radius: 30%;
        height: 150px;
        width: 150px
    }
    .safety-first .shape-triangle div:before {
        -webkit-transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%);
        transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%)
    }
    .safety-first .shape-triangle div:after {
        -webkit-transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%);
        transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%)
    }
}

@media(min-width:768px) {
    .safety-first .shape-triangle div {
        background-color: #53f;
        background: linear-gradient(45deg, #53f, #53f);
        position: relative;
        text-align: left;
        -webkit-transform: rotate(-60deg) skewX(-30deg) scaleY(.866);
        transform: rotate(-60deg) skewX(-30deg) scaleY(.866)
    }
    .safety-first .shape-triangle div:after,
    .safety-first .shape-triangle div:before {
        background-color: inherit;
        background: inherit;
        content: "";
        position: absolute
    }
    .safety-first .shape-triangle div,
    .safety-first .shape-triangle div:after,
    .safety-first .shape-triangle div:before {
        border-top-right-radius: 30%;
        height: 250px;
        width: 250px
    }
    .safety-first .shape-triangle div:before {
        -webkit-transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%);
        transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%)
    }
    .safety-first .shape-triangle div:after {
        -webkit-transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%);
        transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%)
    }
}

@media(min-width:576px) {
    .safety-first .shape-triangle {
        -webkit-transform: translate(-50%, -40%) rotate(65deg);
        transform: translate(-50%, -40%) rotate(65deg)
    }
}

@media(min-width:768px) {
    .safety-first .shape-triangle {
        -webkit-transform: translate(50%, -15%) rotate(65deg);
        transform: translate(50%, -15%) rotate(65deg)
    }
}

@media(min-width:992px) {
    .safety-first .shape-triangle {
        left: 5%;
        -webkit-transform: translate(100%, -15%) rotate(65deg);
        transform: translate(100%, -15%) rotate(65deg)
    }
}

.safety-first .shape-circle {
    right: 5%;
    top: 65%
}

.safety-first .shape-circle div {
    background: #f9fbfd;
    background: var(--dc-tertiary-bg);
    border-radius: 50%;
    height: 100px;
    margin: 0;
    width: 100px
}

@media(min-width:768px) {
    .safety-first .shape-circle {
        right: 15%;
        top: 5%
    }
}

.safety-first .shape-ring {
    left: 0;
    top: 25%;
    -webkit-transform: translate3d(10%, -35%, 0);
    transform: translate3d(10%, -35%, 0)
}

.safety-first .shape-ring div {
    border: 75px solid #f1f4f8;
    border-radius: 50%;
    height: 660px;
    opacity: .15;
    width: 660px
}

.safety-first .shape.pattern-dots {
    background-color: transparent;
    background-image: radial-gradient(#f1f4f8 3px, transparent 0);
    background-image: radial-gradient(var(--dc-secondary-bg) 3px, transparent 3px);
    background-size: 30px 30px;
    bottom: 0;
    height: 50%;
    left: 25%;
    width: 200px
}

.screenshots .swiper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 3.58rem 0 6rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.screenshots .swiper .mobile-device {
    left: 0;
    max-width: 240px;
    position: absolute;
    right: 0
}

.screenshots .swiper .mobile-device .screen {
    height: 460px;
    width: 212px
}

.screenshots .swiper .mobile-device.iphone-x .notch {
    z-index: 2
}

.screenshots .swiper .mobile-device.iphone-x:after,
.screenshots .swiper .mobile-device.iphone-x:before {
    z-index: 3
}

.screenshots .swiper .swiper-slide {
    opacity: .6;
    -webkit-transform: scale(.75);
    transform: scale(.75);
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.screenshots .swiper .swiper-slide img {
    border-radius: 13px;
    -webkit-box-shadow: 0 0 8px 5px rgba(0, 0, 0, .015);
    box-shadow: 0 0 8px 5px rgba(0, 0, 0, .015)
}

.screenshots .swiper .swiper-slide-next,
.screenshots .swiper .swiper-slide-prev {
    opacity: .85;
    -webkit-transform: scale(.85);
    transform: scale(.85)
}

.screenshots .swiper .swiper-slide-active {
    border: 1px solid #d9e2ef;
    border-radius: 13px;
    -webkit-box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
    z-index: 100
}

.screenshots .swiper>.swiper-pagination-bullets {
    bottom: 4rem
}

.singl-testimonial .image-background {
    min-height: 390px
}

.singl-testimonial .testimonial-img {
    max-width: 70%
}

.singl-testimonial .testimonial-img.decorated {
    position: relative
}

.singl-testimonial .testimonial-img.decorated:before {
    background-color: #53f;
    border-radius: .375rem;
    content: "";
    height: 50%;
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transform: translate3d(-25%, -25%, 0);
    transform: translate3d(-25%, -25%, 0);
    width: 50%;
    z-index: -1
}

.singl-testimonial .user-review {
    overflow: hidden;
    -webkit-transform: translateY(-20%);
    transform: translateY(-20%)
}

@media(min-width:992px) {
    .singl-testimonial .user-review {
        -webkit-transform: translate(-25%, 25%);
        transform: translate(-25%, 25%)
    }
}

.singl-testimonial .user-review blockquote:before {
    font-size: 6rem;
    opacity: .3;
    -webkit-transform: translate(-70%);
    transform: translate(-70%)
}

@media(min-width:992px) {
    .singl-testimonial .user-review blockquote {
        font-size: 1.25rem
    }
}

.singl-testimonial .user-review .shape-wrapper {
    z-index: -1
}

.singl-testimonial .user-review .svg-review-bottom {
    bottom: 0;
    height: 100%;
    position: absolute;
    -webkit-transform: translateX(-45%);
    transform: translateX(-45%);
    width: 100%;
    z-index: 1
}

.singl-testimonial .user-review .svg-review-bottom.back {
    -webkit-transform: translate(-49%, -1%) scale(1.1);
    transform: translate(-49%, -1%) scale(1.1);
    z-index: 0
}

.singl-testimonial .user-review .svg-review-bottom.left {
    -webkit-transform: rotate(-45deg) translate(-146%, -143%) scale(1.7);
    transform: rotate(-45deg) translate(-146%, -143%) scale(1.7);
    z-index: -1
}

.singl-testimonial .reviews-navigation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 2rem;
    position: absolute;
    right: 0;
    top: 90%;
    z-index: 1
}

.singl-testimonial .reviews-navigation .reviews-nav {
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.singl-testimonial .reviews-navigation .reviews-nav-prev {
    margin-right: 2rem
}

@media(max-width:767.98px) {
    .singl-testimonial .reviews-navigation {
        width: 100%;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media(min-width:992px) {
    .singl-testimonial .reviews-navigation {
        right: 13%;
        top: 10px
    }
}

.signature {
    max-width: 140px
}

.slider-testimonials .swiper-button-prev {
    top: 100%
}

@media(min-width:768px) {
    .slider-testimonials .swiper-button-prev {
        top: 50%
    }
}

.slider-testimonials .swiper-button-next {
    top: 0
}

@media(min-width:768px) {
    .slider-testimonials .swiper-button-next {
        top: 50%
    }
}

.slider-testimonials [class^=col] {
    position: relative
}

.slider-testimonials .image-background {
    border-top-right-radius: 0 !important;
    max-height: 500px
}

@media(min-width:768px) {
    .slider-testimonials .image-background {
        max-height: 600px
    }
}

@media(min-width:1200px) {
    .slider-testimonials .image-background {
        max-height: 520px
    }
}

@media(min-width:1400px) {
    .slider-testimonials .image-background {
        max-height: 500px
    }
}

.slider-testimonials .card-body {
    padding: 4rem 2.5rem
}

.slider-testimonials .divider {
    background-color: var(--dc-card-bg);
    display: none;
    height: 150px;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: rotate(-75deg);
    transform: rotate(-75deg);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    z-index: 1
}

@media(min-width:768px) {
    .slider-testimonials .divider {
        display: block;
        width: 200%
    }
}

@media(min-width:992px) {
    .slider-testimonials .divider {
        width: 150%
    }
}

.discover-create-love-app .bubble {
    max-width: 60%;
    position: absolute;
    z-index: 1
}

.discover-create-love-app .bubble-left {
    top: 18%
}

.discover-create-love-app .bubble-right {
    right: 1.5rem;
    top: 64%
}

@media(min-width:768px) {
    .discover-create-love-app .bubble {
        max-width: 50%
    }
    .discover-create-love-app .bubble-left {
        top: 21%
    }
    .discover-create-love-app .bubble-right {
        right: 3rem
    }
}

.discover-create-love-app .shape {
    position: absolute
}

.discover-create-love-app .shape-circle-1 {
    left: 5%;
    top: 63%
}

.discover-create-love-app .shape-circle-1 div {
    background: #ffc041;
    border-radius: 50%;
    height: 150px;
    margin: 0;
    width: 150px
}

@media(min-width:768px) {
    .discover-create-love-app .shape-circle-1 {
        left: 15%;
        top: 5%
    }
}

.discover-create-love-app .shape-circle-2 {
    left: 60%;
    top: 70%
}

.discover-create-love-app .shape-circle-2 div {
    background: rgba(255, 192, 65, .8);
    border-radius: 50%;
    height: 120px;
    margin: 0;
    width: 120px
}

@media(min-width:768px) {
    .discover-create-love-app .shape-circle-2 {
        left: 22%;
        top: 23%
    }
}

.discover-create-love-app .shape-circle-3 {
    left: 40%;
    top: 78%
}

.discover-create-love-app .shape-circle-3 div {
    background: #ffc041;
    border-radius: 50%;
    height: 120px;
    margin: 0;
    width: 120px
}

.discover-create-love-app .shape-circle-4 {
    left: 25%;
    top: 70%
}

.discover-create-love-app .shape-circle-4 div {
    background: #53f;
    border-radius: 50%;
    height: 50px;
    margin: 0;
    width: 50px
}

.discover-create-love-app .shape-triangle {
    right: 0;
    top: 80%
}

.discover-create-love-app .shape-triangle div {
    -webkit-animation-duration: 50s;
    animation-duration: 50s;
    background-color: #53f;
    background: linear-gradient(45deg, #53f, #53f);
    position: relative;
    text-align: left;
    -webkit-transform: rotate(-60deg) skewX(-30deg) scaleY(.866);
    transform: rotate(-60deg) skewX(-30deg) scaleY(.866)
}

.discover-create-love-app .shape-triangle div:after,
.discover-create-love-app .shape-triangle div:before {
    background-color: inherit;
    background: inherit;
    content: "";
    position: absolute
}

.discover-create-love-app .shape-triangle div,
.discover-create-love-app .shape-triangle div:after,
.discover-create-love-app .shape-triangle div:before {
    border-top-right-radius: 30%;
    height: 95px;
    width: 95px
}

.discover-create-love-app .shape-triangle div:before {
    -webkit-transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%);
    transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%)
}

.discover-create-love-app .shape-triangle div:after {
    -webkit-transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%);
    transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%)
}

.discover-create-love-app .shape.pattern-dots-1 {
    background-color: transparent;
    background-image: radial-gradient(#f1f4f8 2px, transparent 0);
    background-image: radial-gradient(var(--dc-secondary-bg) 2px, transparent 2px);
    background-size: 20px 20px;
    bottom: 0;
    height: 30%;
    left: 20%;
    width: 200px
}

@media(min-width:768px) {
    .discover-create-love-app .shape.pattern-dots-1 {
        bottom: 20%;
        height: 50%
    }
}

.why-us .background-shape-main {
    max-width: 50%
}

.why-us .background-shape-main.end-50 {
    -webkit-transform: rotate(45deg) translate(100%, -100%);
    transform: rotate(45deg) translate(100%, -100%)
}

.why-us .background-shape-main.start-50 {
    -webkit-transform: rotate(45deg) translate(-100%, 100%);
    transform: rotate(45deg) translate(-100%, 100%)
}

.why-icon-list:before {
    border: 1px dashed #c6d3e6;
    bottom: 80px;
    content: "";
    left: 50px;
    position: absolute;
    top: 50px;
    width: 1px;
    z-index: -1
}

.why-icon-list .list-item {
    margin-bottom: 4rem
}

.why-icon-list .list-item:last-child {
    margin-bottom: 0
}

.world-map-testimonials .shapes-container {
    z-index: 1
}

.world-map-testimonials .shape {
    position: absolute
}

.world-map-testimonials .shape-triangle {
    left: 0;
    top: 0;
    -webkit-transform: translate(25%, 200%) rotate(90deg);
    transform: translate(25%, 200%) rotate(90deg)
}

.world-map-testimonials .shape-triangle div {
    background-color: #53f;
    background: linear-gradient(45deg, #53f, #53f);
    position: relative;
    text-align: left;
    -webkit-transform: rotate(-60deg) skewX(-30deg) scaleY(.866);
    transform: rotate(-60deg) skewX(-30deg) scaleY(.866)
}

.world-map-testimonials .shape-triangle div:after,
.world-map-testimonials .shape-triangle div:before {
    background-color: inherit;
    background: inherit;
    content: "";
    position: absolute
}

.world-map-testimonials .shape-triangle div,
.world-map-testimonials .shape-triangle div:after,
.world-map-testimonials .shape-triangle div:before {
    border-top-right-radius: 30%;
    height: 200px;
    width: 200px
}

.world-map-testimonials .shape-triangle div:before {
    -webkit-transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%);
    transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%)
}

.world-map-testimonials .shape-triangle div:after {
    -webkit-transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%);
    transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%)
}

@media(min-width:768px) {
    .world-map-testimonials .shape-triangle {
        -webkit-transform: translate(25%, 25%) rotate(90deg);
        transform: translate(25%, 25%) rotate(90deg)
    }
    .world-map-testimonials .shape-triangle div {
        background-color: #53f;
        background: linear-gradient(45deg, #53f, #53f);
        position: relative;
        text-align: left;
        -webkit-transform: rotate(-60deg) skewX(-30deg) scaleY(.866);
        transform: rotate(-60deg) skewX(-30deg) scaleY(.866)
    }
    .world-map-testimonials .shape-triangle div:after,
    .world-map-testimonials .shape-triangle div:before {
        background-color: inherit;
        background: inherit;
        content: "";
        position: absolute
    }
    .world-map-testimonials .shape-triangle div,
    .world-map-testimonials .shape-triangle div:after,
    .world-map-testimonials .shape-triangle div:before {
        border-top-right-radius: 30%;
        height: 480px;
        width: 480px
    }
    .world-map-testimonials .shape-triangle div:before {
        -webkit-transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%);
        transform: rotate(-135deg) skewX(-45deg) scale(1.414, .707) translateY(-50%)
    }
    .world-map-testimonials .shape-triangle div:after {
        -webkit-transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%);
        transform: rotate(135deg) skewY(-45deg) scale(.707, 1.414) translate(50%)
    }
}

.user-reviews {
    min-height: 450px;
    position: relative
}

.user-reviews .user {
    cursor: pointer;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    width: 48px
}

.user-reviews .user.active {
    -webkit-transform: scale(1.5);
    transform: scale(1.5)
}

.user-reviews .user.active img {
    -webkit-box-shadow: 0 0 5px 10px rgba(24, 25, 26, .05) !important;
    box-shadow: 0 0 5px 10px rgba(24, 25, 26, .05) !important;
    padding: 2px
}

.lightweight-template .learn-more {
    margin-bottom: 18rem
}

.perspective-mockups {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    pointer-events: none;
    position: absolute;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    left: 50%;
    margin-left: 85px;
    -webkit-transform: scale(.5) rotate(12deg) translateX(-50%);
    transform: scale(.5) rotate(12deg) translateX(-50%);
    -webkit-transform-origin: 0 20%;
    transform-origin: 0 20%;
    z-index: 3
}

.perspective-mockups>div {
    margin: 0 50px
}

.perspective-mockups .ipad {
    max-width: 100%
}

.perspective-mockups.hidden-preload {
    visibility: hidden
}

.perspective-mockups .phone-big {
    display: none
}

.perspective-mockups .phone-small {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1;
    width: 225px
}

.perspective-mockups .tablet.landscape {
    margin: 0;
    width: 512px
}

.perspective-mockups .tablet.portrait {
    margin-top: 0;
    width: 450px
}

@media(min-width:576px) {
    .perspective-mockups {
        margin-left: 0
    }
}

@media(min-width:768px) {
    .lightweight-template .learn-more {
        margin-bottom: 0
    }
    .perspective-mockups {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        top: 215px;
        -webkit-transform: rotate(12deg);
        transform: rotate(12deg);
        -webkit-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
        width: 512px
    }
    .perspective-mockups.hidden-preload {
        visibility: visible
    }
    .perspective-mockups .tablet {
        margin: 0 !important;
        max-width: 100%
    }
    .perspective-mockups .tablet.portrait {
        display: none
    }
    .perspective-mockups .tablet.landscape {
        -webkit-transform: translateX(25%);
        transform: translateX(25%);
        width: 512px
    }
    .perspective-mockups .phone-small {
        margin: 0 0 50px 176px
    }
}

@media(min-width:1200px) {
    .perspective-mockups {
        margin-left: -10px;
        top: 100px;
        width: 829px
    }
    .perspective-mockups>div {
        margin: 0 auto
    }
    .perspective-mockups .tablet.landscape {
        -ms-flex-item-align: end;
        align-self: flex-end;
        margin-right: 50px;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    .perspective-mockups .tablet.portrait {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-top: 50px !important;
        width: 450px
    }
    .perspective-mockups .phone-big {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 267px
    }
    .perspective-mockups .phone-small {
        -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
        margin: 50px 50px 0 0;
        order: 0
    }
}

.extend-core .shape-background.shape-left {
    -webkit-box-shadow: 0 0 60px 0 rgba(134, 154, 184, .05);
    box-shadow: 0 0 60px 0 rgba(134, 154, 184, .05);
    left: -320px;
    max-width: 100%
}

.extend-core .icons-wrapper {
    margin-top: 3rem;
    min-height: 460px
}

@media(min-width:768px) {
    .extend-core .icons-wrapper {
        margin-top: 0
    }
}

.extend-core .floating:first-child {
    -webkit-animation-duration: 3.6s;
    animation-duration: 3.6s
}

.extend-core .floating:nth-child(2) {
    -webkit-animation-duration: 3.4s;
    animation-duration: 3.4s
}

.extend-core .floating:nth-child(3) {
    -webkit-animation-duration: 3.8s;
    animation-duration: 3.8s
}

.extend-core .floating:nth-child(4) {
    -webkit-animation-duration: 2.8s;
    animation-duration: 2.8s
}

.extend-core .floating:nth-child(5) {
    -webkit-animation-duration: 4.2s;
    animation-duration: 4.2s
}

.extend-core .floating:nth-child(6) {
    -webkit-animation-duration: 3.2s;
    animation-duration: 3.2s
}

.extend-core .floating:nth-child(7) {
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

.extend-core .floating:nth-child(8) {
    -webkit-animation-duration: 1.8s;
    animation-duration: 1.8s
}

.how-it-works .mockup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.how-it-works .shape {
    position: absolute
}

.how-it-works .shape-circle {
    background: #f1f4f8;
    background: var(--dc-secondary-bg);
    border-radius: 50%;
    height: 50%;
    margin: 0;
    width: 50%
}

.how-it-works .shape-ring {
    right: 0;
    top: 50%
}

.how-it-works .shape-ring div {
    border: 10px solid #f1f4f8;
    border: 10px solid var(--dc-secondary-bg);
    border-radius: 50%;
    height: 300px;
    -webkit-transform: translate3d(50%, 0, 0);
    transform: translate3d(50%, 0, 0);
    width: 300px
}

.how-it-works .img-step {
    max-height: 250px
}

.built-with .shape {
    position: absolute
}

.built-with .shape-circle {
    left: 0;
    top: 0
}

.built-with .shape-circle div {
    background: #53f;
    border-radius: 50%;
    height: 400px;
    margin: 0;
    -webkit-transform: translate(-50%, -10%);
    transform: translate(-50%, -10%);
    width: 400px
}

.built-with .mockup {
    max-width: 100px
}

.latest-projects .project-detail .description {
    bottom: 0;
    left: 0;
    margin: auto;
    opacity: 0;
    position: absolute;
    right: 0;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
    z-index: 1
}

.latest-projects .project-detail:hover .description {
    opacity: .9;
    -webkit-transform: translate(0);
    transform: translate(0)
}

@media(min-width:768px) {
    .external-tools-integration .section-heading {
        margin-bottom: 120px
    }
}

.external-tools-integration .section-heading p.lead {
    width: 70%
}

.external-tools-integration .browser {
    bottom: 0;
    -webkit-transform: translate(40%, -10%) rotate3d(.342, -.94, 0, 22deg) rotate(7deg);
    transform: translate(40%, -10%) rotate3d(.342, -.94, 0, 22deg) rotate(7deg);
    width: 380px
}

@media(min-width:768px) {
    .external-tools-integration .browser {
        bottom: auto;
        width: 780px
    }
}

.external-tools-integration .iphone-x {
    -webkit-transform: translate(-20%, 10%) rotate3d(.5, .866, 0, 16deg) rotate(-7deg);
    transform: translate(-20%, 10%) rotate3d(.5, .866, 0, 16deg) rotate(-7deg)
}

@media(max-width:575.98px) {
    .external-tools-integration .iphone-x {
        margin-left: 0;
        margin-right: 0;
        width: 60%
    }
}

.external-tools-integration .list-item {
    padding-bottom: 1rem;
    padding-top: 1rem
}

.external-tools-integration .icon-shape {
    min-width: 80px
}

.external-tools-integration .shapes-container {
    z-index: 2
}

.external-tools-integration .pattern {
    position: absolute
}

.external-tools-integration .pattern-dots {
    background-color: transparent;
    background-image: radial-gradient(#f1f4f8 2px, transparent 0);
    background-image: radial-gradient(var(--dc-secondary-bg) 2px, transparent 2px);
    background-size: 20px 20px;
    bottom: 7rem;
    height: 155px;
    left: 60%;
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
    width: 50%
}

.pricing p {
    line-height: 1.5em
}

.pricing .pricing-value {
    font-family: Poppins, sans-serif;
    font-family: var(--dc-font-sans-serif);
    font-size: 3.25rem
}

.pricing .pricing-value .price {
    position: relative
}

.pricing .pricing-value .price:after,
.pricing .pricing-value .price:before {
    font-size: .35em;
    font-style: italic;
    font-weight: 300
}

.pricing .pricing-value .price:before {
    content: "$";
    left: -15px;
    position: absolute;
    top: 10px
}

.pricing .pricing-value .price:after {
    content: "/mo";
    position: relative
}

.pricing .pricing-value .price.yearly:after {
    content: "/yr"
}

.odometer-inside {
    display: inline
}

.pricing-element .pricing-table-tabs {
    width: 100%
}

.pricing-element .pricing-table-tabs label {
    overflow: hidden;
    padding: 12px 6px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 33.33%
}

.pricing-element .pricing-details {
    margin-top: 0
}

.pricing-element table {
    margin-bottom: 0;
    margin-top: 0
}

.pricing-element table td,
.pricing-element table th {
    padding: 10px 15px;
    vertical-align: middle !important
}

.pricing-element table th {
    font-weight: 400
}

.pricing-element table td {
    text-align: center
}

.pricing-element table thead th {
    background-color: #f1f4f8;
    background-color: var(--dc-secondary-bg);
    border-top-width: 1px;
    border-top-width: var(--dc-border-width);
    padding-bottom: 20px;
    padding-top: 20px;
    text-align: center
}

.pricing-element table tbody.pricing-details th {
    background-color: transparent
}

.pricing-element table tfoot {
    font-size: .8em
}

.pricing-element table tfoot td {
    border: 0
}

.pricing-element table .pricing-prev {
    float: left
}

.pricing-element table .pricing-next {
    float: right
}

.pricing-element table .visible-cell {
    -webkit-transition: all .3s;
    transition: all .3s
}

.pricing-element .show-annually {
    display: none
}

.pricing-element .yearly-display .show-annually {
    display: block
}

@media(max-width:575.98px) {
    .pricing-element table .expand-mobile td,
    .pricing-element table .expand-mobile th,
    .pricing-element table td[headers*=ph-] {
        display: none
    }
    .pricing-element table tbody th {
        width: 0
    }
}

.visible-cell {
    display: table-cell !important
}

.visible-block,
.visible-cell {
    visibility: visible !important
}

.preview-pane {
    height: 320px;
    padding: 0;
    text-align: center
}

.preview-pane .preview-page {
    height: 100%;
    overflow-y: auto;
    width: 100%
}

.preview-pane .preview-page img {
    display: block;
    margin-top: 0;
    width: 100%
}

.card-demo .card-body {
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .03);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .03);
    z-index: 1
}

.card-demo .is-new {
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%)
}

.count-down {
    padding-bottom: 30px;
    padding-top: 30px
}

.count-down li {
    padding: 0 30px
}

.count-down span {
    display: block;
    font-size: 3.25rem;
    font-weight: 700;
    line-height: 1
}

.count-down p {
    font-weight: 300;
    margin-top: 0
}

@media(min-width:md) {
    .count-down span {
        font-size: 4.5rem
    }
}

.demo-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 64px;
    -webkit-transition: max-width .8s ease-in-out;
    transition: max-width .8s ease-in-out;
    width: 64px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.demo-link .demo-link-text {
    font-size: .85rem;
    font-weight: 400;
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: -webkit-transform .3s ease .2s;
    transition: -webkit-transform .3s ease .2s;
    transition: transform .3s ease .2s;
    transition: transform .3s ease .2s, -webkit-transform .3s ease .2s
}

.demo-link:hover {
    max-width: 192px;
    width: auto
}

.demo-link:hover .demo-link-text {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.demo-blocks .block {
    -webkit-box-shadow: 0 0 .75rem rgba(0, 0, 0, .075);
    box-shadow: 0 0 .75rem rgba(0, 0, 0, .075);
    margin-bottom: 3rem;
    margin-top: 3rem
}

.example-selector {
    -ms-flex-pack: distribute;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-around;
    list-style-type: none
}

.example-selector,
.example-selector>li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.example-selector>li {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    border: 1px solid #d9e2ef;
    border-radius: .25rem;
    cursor: pointer;
    justify-content: center;
    margin: .5em;
    overflow: hidden;
    padding: 2.5em;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.example-selector>li:hover {
    border-color: #53f
}

.cookie-location-message {
    margin-top: 4rem
}

.cookie-location-message ul {
    list-style: none;
    padding: 0
}