body {
    background-color: #272333;
    color: #dedde0
}

.input, .textarea, select {
    background-color: #2c283a;
    border: 1px solid #2c283a;
    color: #fff
}

.input:focus, .textarea:focus, select:focus {
    background-color: #272333;
    border: 1px solid #0d86ff;
    color: #fff
}

.form-control::-moz-placeholder {
    color: hsla(260, 5%, 87%, .5)
}

.form-control::placeholder {
    color: hsla(260, 5%, 87%, .5)
}

input:-webkit-autofill, input:-webkit-autofill:active, input:-webkit-autofill:focus, input:-webkit-autofill:hover {
    -webkit-text-fill-color: #2c283a !important
}

select {
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23fff' d='M2 0 0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .1rem center/10px 16px
}

select option {
    color: #fff
}

.dropdown-menu {
    background-color: #302c40;
    box-shadow: 0 8px 40px rgba(0, 0, 0, .5);
    color: #dedde0
}

.dropdown-menu:before {
    border-bottom: .4rem solid #302c40
}

.dropdown.dropup .dropdown-menu:before {
    border-top: .4rem solid #302c40
}

.tooltip-inner {
    background-color: #302c40;
    box-shadow: 0 16px 48px rgba(0, 0, 0, .25), 0 2px 32px rgba(0, 0, 0, .5)
}

.btn {
    background-color: #0d86ff;
    box-shadow: 0 .5rem 1rem rgba(13, 134, 255, .15), 0 .125rem .25rem rgba(13, 134, 255, .15)
}

.btn:focus {
    box-shadow: 0 1.5rem 2.5rem rgba(13, 134, 255, .1), 0 .5rem 1rem rgba(13, 134, 255, .1)
}

.btn:before {
    box-shadow: 0 .25rem 2rem rgba(13, 134, 255, .25), 0 .25rem 1rem rgba(13, 134, 255, .25);
    content: ""
}

.title {
    color: #f1f2f4
}

a, a:hover {
    color: #0d86ff
}

::-moz-selection {
    background: transparent;
    color: #0d86ff
}

::selection {
    background: transparent;
    color: #0d86ff
}

.box {
    background-color: #302c40
}

.box__second {
    background-color: #2c283a
}

.box-inner {
    padding-top: .7rem
}

.box-inner, .box-inner:after, .box-inner:before {
    background-color: transparent
}

.shadow {
    box-shadow: 0 40px 50px rgba(32, 29, 42, .75) !important
}

.shadow:before {
    box-shadow: 0 40px 50px rgba(32, 29, 42, .75)
}

.avatar--180 {
    filter: drop-shadow(0 24px 24px rgba(32, 29, 42, .7))
}

@media only screen and (max-width: 580px) {
    .hamburger.is-active .line {
        background-color: #0d86ff
    }
}

.nav {
    background: #0d86ff;
    box-shadow: 0 1.5rem 2.5rem rgba(13, 134, 255, .05), 0 .5rem 1rem rgba(13, 134, 255, .05)
}

@media only screen and (max-width: 580px) {
    .nav {
        background-color: #302c40;
        color: #fff
    }
}

.swiper-pagination-bullet-active {
    background: #0d86ff
}

@media only screen and (max-width: 768px) {
    .select {
        background-color: #272333;
        color: #dedde0
    }

    .select ul {
        background-color: #302c40;
        box-shadow: 0 10px 60px rgba(0, 0, 0, .25)
    }

    .select ul li {
        color: #dedde0
    }

    .select ul li:hover {
        background-color: #0d86ff
    }

    .select ul li a {
        color: #dedde0
    }
}

#shareModal .popup {
    background: #272232 !important
}

#shareModal header {
    border-bottom: 1px solid #878787 !important
}

#shareModal header .close {
    background: unset !important
}

.bank .card {
    border: unset !important
}

.qrcode .field input {
    background: transparent;
    color: #dad9dd
}

.form-group input:focus, .form-group input:valid, .form-group select, .form-group textarea:focus, .form-group textarea:valid {
    color: #fff !important
}

.form-group input:valid ~ .control-label {
    color: #fff !important
}