:root {
    --stories-slider-z-shadows: 999;
    --stories-slider-z-pagination: 50;
    --stories-slider-z-navigation: 200;
    --stories-slider-z-user: 300;
    --stories-slider-z-actions: 300;
    --stories-slider-z-content: 100;
    --stories-slider-slide-bg-color: #000;
    --f7-page-bg-color: white;
    --f7-fab-label-font-size:15px;
}
.stories-slider {
    padding-top: 44px;
    padding-bottom: 44px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content:center
}
.page {
    background-color: var(--f7-card-expandable-bg-color);
}
.stories-slider > .swiper > .swiper-wrapper > .swiper-slide:not(.swiper-slide-next, .swiper-slide-prev, .swiper-slide-active) {
    opacity:0
}

.stories-slider > .swiper > .swiper-wrapper > .swiper-slide-next + .swiper-slide {
    opacity:1
}

.stories-slider .swiper {
    height: 100%;
    width:100%
}

.stories-slider .swiper .swiper .swiper-slide {
    -webkit-border-radius: 8px;
    overflow: hidden;
    background-color:var(--stories-slider-slide-bg-color)
}

.stories-slider .swiper .swiper-slide-shadow-left, .stories-slider .swiper .swiper-slide-shadow-right {
    z-index:var(--stories-slider-z-shadows) !important
}

.stories-slider .swiper .swiper-slide-shadow-left {
    background-image:linear-gradient(to left, rgb(0, 0, 0), rgba(0, 0, 0, .5))
}

.stories-slider .swiper .swiper-slide-shadow-right {
    background-image:linear-gradient(to right, rgb(0, 0, 0), rgba(0, 0, 0, .5))
}

.stories-slider.stories-slider-perspective .swiper .swiper, .stories-slider.stories-slider-perspective .swiper-slide-shadow-left, .stories-slider.stories-slider-perspective .swiper-slide-shadow-right {
    transform: translateZ(calc(-1 * var(--swiper-cube-translate-z)));
    transform-origin:0% 0% calc(-1 * var(--swiper-cube-translate-z))
}

.stories-slider-button {
    position: absolute;
    z-index: var(--stories-slider-z-navigation);
    top: 0;
    height: 100%;
    user-select: none;
    -webkit-user-select:none
}

.stories-slider-button:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition-duration:.2s
}

.stories-slider-button:active:before {
    opacity:.25
}

.stories-slider-button-prev {
    left: 0;
    width:30%
}

.stories-slider-button-prev:before {
    background-image:linear-gradient(to right, #000, rgba(0, 0, 0, 0))
}

.stories-slider-button-next {
    right: 0;
    width:70%
}

.stories-slider-button-next:before {
    background-image:linear-gradient(to left, #000, rgba(0, 0, 0, 0))
}

.stories-slider-pagination {
    position: absolute;
    left: 8px;
    right: 8px;
    top: 8px;
    display: flex;
    justify-content: space-between;
    z-index: var(--stories-slider-z-pagination);
    pointer-events: none;
    transform:translateZ(0)
}

.stories-slider-pagination-bullet {
    width: 100%;
    flex-shrink: 10;
    -webkit-border-radius: 999px;
    height: 2px;
    background: rgba(255, 255, 255, .35);
    position: relative;
    overflow: hidden;
    box-shadow:0 0 1px #00000059
}

.stories-slider-pagination-bullet span {
    position: absolute;
    background: #fff;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-border-radius: 999px;
    transform: translate(-100%);
    transition-timing-function:linear
}

.stories-slider-pagination-bullet-viewed span {
    transform: translate(0);
    transition-duration:0ms !important
}

.stories-slider-pagination-bullet + .stories-slider-pagination-bullet {
    margin-left:2px
}

a.stories-slider-user, .stories-slider-user a {
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    transition-duration:.2s
}

a.stories-slider-user:active, .stories-slider-user a:active {
    opacity:.55
}

.stories-slider-user {
    display: flex;
    align-items: center;
    position: absolute;
    top: 18px;
    left: 12px;
    height: 32px;
    z-index: var(--stories-slider-z-user);
    color: #fff;
    text-decoration: none;
    user-select: none;
    -webkit-user-select:none
}

.stories-slider-user-avatar {
    width: 32px;
    height: 32px;
    -webkit-border-radius: 50%;
    margin-right:12px
}

.stories-slider-user-avatar img {
    width: 100%;
    height: 100%;
    -webkit-border-radius: 50%;
    object-fit: cover;
    object-position:center
}

.stories-slider-user-name {
    font-size: 14px;
    font-weight: 700;
    margin-right: 12px;
    text-shadow:0px 0px 2px rgba(0, 0, 0, .35)
}

.stories-slider-user-date {
    font-size: 14px;
    font-weight: 400;
    opacity: .55;
    text-shadow:0px 0px 2px rgba(0, 0, 0, .35)
}

.stories-slider-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    right: 10px;
    top: 18px;
    height: 32px;
    z-index: var(--stories-slider-z-actions);
    transition-duration: .2s;
    user-select: none;
    -webkit-user-select:none
}

.stories-slider-close-button {
    margin-left: 18px;
    width: 22px;
    height: 22px;
    appearance: none;
    border: none;
    outline: none;
    box-shadow: none;
    display: block;
    position: relative;
    cursor: pointer;
    padding: 0;
    background: transparent;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    user-select: none;
    -webkit-user-select:none
}

.stories-slider-close-button:before, .stories-slider-close-button:after {
    content: "";
    width: 125%;
    height: 2px;
    background: #fff;
    -webkit-border-radius: 999px;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    box-shadow:0 0 1px #00000059
}

.stories-slider-close-button:before {
    transform:translate(-50%, -50%) rotate(45deg)
}

.stories-slider-close-button:after {
    transform:translate(-50%, -50%) rotate(-45deg)
}

.stories-slider-close-button:active {
    opacity:.55
}

.stories-slider-content {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: var(--stories-slider-z-content);
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    -webkit-user-select:none
}

.stories-slider-content > img, .stories-slider-content > video {
    width: 100%;
    height: 100%;
    object-position: center;
    display: block;
    border: none;
    outline: none;
    background: none;
    background-color:transparent
}

.stories-slider-content > img {
    object-fit:cover
}

.stories-slider-content > video {
    object-fit:contain
}

@font-face {
    font-family: swiper-icons;
    src: url(data:application/font-woff;charset=utf-8;base64,\ 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) format("woff");
    font-weight: 400;
    font-style:normal
}

:root {
    --swiper-theme-color: #007aff
}

.swiper, swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
    display:block
}

.swiper-vertical > .swiper-wrapper {
    flex-direction:column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    box-sizing:content-box
}

.swiper-android .swiper-slide, .swiper-wrapper {
    transform:translateZ(0)
}

.swiper-horizontal {
    touch-action:pan-y
}

.swiper-vertical {
    touch-action:pan-x
}

.swiper-slide, swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
    display:block
}

.swiper-slide-invisible-blank {
    visibility:hidden
}

.swiper-autoheight, .swiper-autoheight .swiper-slide {
    height:auto
}

.swiper-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property:transform, height
}

.swiper-backface-hidden .swiper-slide {
    transform: translateZ(0);
    backface-visibility:hidden
}

.swiper-3d.swiper-css-mode .swiper-wrapper {
    perspective:1200px
}

.swiper-3d .swiper-wrapper {
    transform-style:preserve-3d
}

.swiper-3d {
    perspective:1200px
}

.swiper-3d .swiper-slide, .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-cube-shadow {
    transform-style:preserve-3d
}

.swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-slide-shadow-bottom {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index:10
}

.swiper-3d .swiper-slide-shadow {
    background:rgba(0, 0, 0, .15)
}

.swiper-3d .swiper-slide-shadow-left {
    background-image:linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-right {
    background-image:linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-top {
    background-image:linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-bottom {
    background-image:linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-css-mode > .swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style:none
}

.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
    display:none
}

.swiper-css-mode > .swiper-wrapper > .swiper-slide {
    scroll-snap-align:start start
}

.swiper-horizontal.swiper-css-mode > .swiper-wrapper {
    scroll-snap-type:x mandatory
}

.swiper-vertical.swiper-css-mode > .swiper-wrapper {
    scroll-snap-type:y mandatory
}

.swiper-centered > .swiper-wrapper:before {
    content: "";
    flex-shrink: 0;
    order:9999
}

.swiper-centered > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: center center;
    scroll-snap-stop:always
}

.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
    margin-inline-start:var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-horizontal > .swiper-wrapper:before {
    height: 100%;
    min-height: 1px;
    width:var(--swiper-centered-offset-after)
}

.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
    margin-block-start:var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-vertical > .swiper-wrapper:before {
    width: 100%;
    min-width: 1px;
    height:var(--swiper-centered-offset-after)
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    -webkit-border-radius: 50%;
    border-top-color:transparent
}

.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader, swiper-container:not(.swiper-watch-progress) .swiper-lazy-preloader, .swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
    animation:swiper-preloader-spin 1s infinite linear
}
.top-profile-swiper{
    padding-left: 10px !important;
    padding-right: 10px !important;
}
.swiper-lazy-preloader-white {
    --swiper-preloader-color: #fff
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color: #000
}

@keyframes swiper-preloader-spin {
    0% {
        transform:rotate(0)
    }

    to {
        transform:rotate(360deg)
    }
}

.swiper-cube {
    overflow:visible
}

.swiper-cube .swiper-slide {
    pointer-events: none;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height:100%
}

.swiper-cube .swiper-slide .swiper-slide {
    pointer-events:none
}

.swiper-cube.swiper-rtl .swiper-slide {
    transform-origin:100% 0
}

.swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-active .swiper-slide-active {
    pointer-events:auto
}

.swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-next, .swiper-cube .swiper-slide-prev, .swiper-cube .swiper-slide-next + .swiper-slide {
    pointer-events: auto;
    visibility:visible
}

.swiper-cube .swiper-slide-shadow-top, .swiper-cube .swiper-slide-shadow-bottom, .swiper-cube .swiper-slide-shadow-left, .swiper-cube .swiper-slide-shadow-right {
    z-index: 0;
    backface-visibility:hidden
}

.swiper-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 100%;
    opacity: .6;
    z-index:0
}

.swiper-cube .swiper-cube-shadow:before {
    content: "";
    background: #000;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    -webkit-filter: blur(50px);
    filter:blur(50px)
}

* {
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color:rgba(0, 0, 0, 0)
}

.main-app {
    overflow: auto;
    height:100%
}

.main-title {
    padding:24px 12px 12px
}

.main-stories {
    display: flex;
    align-items: center;
    padding: 12px;
    padding-left:0px;
    padding-right: 0px;
    overflow: auto;
    scrollbar-width: none;
}
.open-profile{

}

.main-stories::-webkit-scrollbar {
    display: none;
    opacity:0
}

.main-stories a + a {
    margin-left:12px
}

.main-stories a {
    text-decoration: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition-duration: .3s;
    transition-property:opacity
}

.main-stories a:active {
    opacity: .55;
    transition-duration:50ms
}



.main-stories-name {
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    margin-top:10px;
    color: var(--f7-card-header-text-color);
}

.main-post-header {
    display: flex;
    align-items: center;
    padding:8px;
    padding-right:0px;
}

.main-post-header-actions {
    appearance: none;
    padding: 0;
    border: none;
    outline: 0;
    position: relative;
    box-shadow: none;
    -webkit-border-radius: 0;
    background: none;
    margin: 0 0 0 auto;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition-duration: .3s;
    transition-property:opacity;
    width: auto;
}

.main-post-header-actions:active {
    opacity: .55;
    transition-duration:50ms
}

.main-post-header-actions span {
    width: 3px;
    height: 3px;
    background: black;
    -webkit-border-radius:50%
}

.main-post-header-actions span + span {
    margin-left:3px
}
.main-post-avatar {
    width: 68px;
    height: 68px;
    -webkit-border-radius: 50%;
    margin-right: 8px;
    padding: 3px;
    box-sizing: border-box;
    position: relative;
    cursor: pointer;

    transition-property: opacity;
    transition-duration: .2s;
}
.main-post-avatar:active {
    opacity: .55;
    transition-duration:0
}
.main-post-avatar:before {
    content: "";
    left: 1px;
    top: 1px;
    right: 1px;
    bottom: 1px;
    position: absolute;
    -webkit-border-radius: 50%;
    z-index:0
}
.main-post-avatar img {
    width: 100%;
    height: 100%;
    -webkit-border-radius: 50%;
    object-fit: cover;
    object-position: center;
    position: relative;
    z-index:1
}
.exit-main-post-name {
    font-size: 14px;
    font-weight: 600;
    position: absolute;
    color: var(--f7-card-header-text-color);
    z-index: 1;
    width: 100%;
    text-align: right;
    margin-top: 63px;
    -webkit-border-radius: 5px;
    margin-left: -100%;
}
.main-post-title{
    white-space: nowrap;
    overflow: hidden;
    color: white;
    font-size: 17px;
/*    padding-left: 83px;
    margin-top: -43px;
    padding-bottom: 10px;*/
    pointer-events: none;
}
.main-post-username{
    font-family: "San Francisco Bold";
    opacity: 1;
    margin-top: -3px;
    font-weight: bold;
    color: lightcoral;
    font-size: 13px;
}
.post-displayname{
    font-family: "San Francisco Bold";
    font-size: 20px;
}
.main-post-image .swiper{
    -webkit-border-radius:15px;
}
 .main-post-username span{
    border-top: 1px solid var(--f7-theme-color);
}
.main-post-name{
    font-size: var(--f7-card-expandable-header-font-size);
    opacity: 1;
    font-weight: 500;
    margin-top: -20px;
    white-space: nowrap;
}
.tc{
    color:var(--f7-theme-color) !important;
}
.main-post-date {
    font-family: "San Francisco";
    margin-top: 39px;
    opacity: .8;
    font-weight: 100;
    padding-right: 0px;
    white-space: pre-wrap;
    word-wrap: break-word;
    font-weight: bold;
    color: lightcoral;
    font-size: 11px;
}



.main-post-name span{
    /*border-top: 1px solid var(--f7-theme-color);*/
}
/*.card{
    background-color: #ffffff0a
}
 */

.main-post-actions{
    font-size: 12px;
    opacity: .5;
    font-weight: 500;
    opacity: 0;
}
.main-post-image {
    overflow: hidden;
}

.main-post-image img {
    width: 100%;
    object-fit: cover;
    object-position:center
}

.main-post-footer {
    padding:16px;
    padding-bottom: 0px;
}
.main-post-footer-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom:16px
}
.main-post-footer-actions-left, .main-post-footer-actions-right {
    display: flex;
    align-items:center
}

.card-expandable .card-header {
    font-size: var(--f7-card-expandable-header-font-size);
    font-weight: normal;
}


.card-content-padding{
    /*padding:0px !important;*/
}
.main-post-footer-actions button {
    appearance: none;
    border: none;
    outline: 0;
    position: relative;
    box-shadow: none;
    -webkit-border-radius: 0;
    background: none;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition-duration: .3s;
    transition-property: opacity;
    padding: 0;
    margin:0
}

.main-post-footer-actions button:active {
    opacity: .55;
    transition-duration:50ms
}

.main-post-footer-actions button img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    object-position:center
}

.main-post-footer-actions button + button {
    margin-left:16px
}

.main-post-likes {
    font-size: 14px;
    font-weight:600
}

.main-post-content {
    font-size: 14px;
    margin-top: 4px;
    line-height:1.25
}

.main-post-content-name {
    font-weight:600
}

.main-post-content-text {
    opacity:.85
}
.main-post{
    margin-left: 0px;
    margin-right: 0px;
}
.stories-slider {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    transform: scale(0);
    transform: translateZ(0) scale(.5);
    opacity: 0;
    background:#000
}

@media (min-width: 415px),(min-height: 897px) {
    .stories-slider {
        background:rgb(41, 40, 49)
    }
}

.stories-slider > .swiper {
    z-index: 2;
    max-width: 414px;
    max-height:896px
}

.stories-slider:not(.stories-slider-in) {
    pointer-events:none
}

.stories-slider:not(.stories-slider-in) * {
    pointer-events:none !important
}

.stories-slider-in {
    animation: stories-slider-in .4s forwards;
    pointer-events: auto;
    transform: translateZ(0) scale(1);
    opacity:1
}

.stories-slider-out {
    pointer-events: none;
    animation:stories-slider-out .4s forwards !important
}

@keyframes stories-slider-in {
    0% {
        transform: translateZ(0) scale(.5);
        opacity:0
    }

    50% {
        transform: translateZ(0) scale(1.05);
        opacity:1
    }

    to {
        transform: translateZ(0) scale(1);
        opacity:1
    }
}

@keyframes stories-slider-out {
    0% {
        transform: translateZ(0) scale(1);
        opacity:1
    }

    50% {
        transform: translateZ(0) scale(.5);
        opacity:0
    }

    to {
        transform: translateZ(0) scale(.5);
        opacity: 0
    }
}
/*
.card:after{
    content: '';
    position: absolute;
    background-color: var(--f7-card-header-border-color);
    display: block;
    z-index: 15;
    top: auto;
    right: auto;
    bottom: 0;
    left: 0;
    height: 1px;
    width: 100%;
    transform-origin: 50% 100%;
    transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
}
 */
.photo-browser-slide img {
    width: 100%;
    height: 100%;
}
.photo-browser-slide video {
    width: 100%;
    height: 100%;
}
.link .photo-browser-prev{
    margin-bottom: 50px;
}

.card-content{
    width:100% !important;
    padding-top:25px
}
.card{
    margin-bottom: 25px !important;
    -webkit-border-radius: 13px;
    border-radius:0 !important;
}
.post-toolbar{
    margin-top:-58px;
}


/*

.panel-left .content-block,
.panel-left .content-block-title {
    color: #dddddd;
}
.panel-left .list-block ul {
    background: none;
}
.panel-left .list-block ul,
.panel-left .list-block .item-inner {
    border-color: rgba(255, 255, 255, 0.1);
}
.panel-left .list-block a {
    color: inherit;
}
.panel-left .list-block a:active {
    background: #000;
}
.panel-right .content-block,
.panel-right .content-block-title,
.panel-right .list-panel-title {
    color: #dddddd;
}
.panel-right .navbar {
    background: #000;
    border-bottom: 1px solid #333;
}
.panel-right .navbar .center {
    color: #007aff;
}
.panel-right .navbar a.link {
    color: #fff;
}
.panel-right .page {
    background: #222;
}
.panel-right .list-block ul {
    background: none;
}
.panel-right .list-block ul,
.panel-right .list-block .item-inner {
    border-color: rgba(255, 255, 255, 0.1);
}
.panel-right .list-block a {
    color: inherit;
}
.panel-right .list-block a:active {
    background: #000;
}

 */
.popover {
    width: 280px;
}
.ks-grid div[class*="col-"] {
    background: #fff;
    text-align: center;
    color: #000;
    border: 1px solid #ddd;
    padding: 5px;
}
.ks-grid .row {
    margin-bottom: 15px;
}
.ks-grid .row:last-child {
    margin-bottom: 0;
}
.ks-preloaders {
    text-align: center;
}
.ks-preloader-big {
    width: 42px;
    height: 42px;
}
.page[data-page="messages"] .page-content {
    padding-bottom: 44px;
}
.page[data-page="messages"] .toolbar {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}
.page[data-page="messages"] .ks-messages-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #c8c8cd;
    background: #fff;
    -webkit-border-radius: 5px;
    box-shadow: none;
    display: block;
    padding: 0px 8px 0px;
    margin: 0;
    width: 100%;
    height: 28px;
    color: #000;
    font-size: 17px;
    margin-right: 15px;
    font-family: inherit;
}
.page[data-page="messages"] .ks-send-message {
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-shrink: 0;
    flex-shrink: 0;
}
.statusbar-overlay {
    background: #000;
}
.statusbar-overlay.with-panel-left {
    background: #222;
}
.statusbar-overlay.with-panel-right {
    background: #000;
}
.page[data-page="tabbar"] .toolbar,
.page[data-page="tabbar-labels"] .toolbar {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}
.page[data-page="tabbar"] .page-content,
.page[data-page="tabbar-labels"] .page-content {
    padding-bottom: 44px;
}
i.ks-tabbar-icon-1 {
    width: 30px;
    height: 30px;
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30' fill='%23929292'><g><circle cx='15.2' cy='8.8' r='1.5'/><polygon points='16.7,12.3 16.7,11.7 16.7,11.3 13.7,11.3 13.7,12.3 14.7,12.3 14.7,20.3 13.7,20.3 13.7,21.3 17.7,21.3 17.7,20.3 16.7,20.3'/><path d='M15.2,2.3C8.3,2.3,2.7,7.9,2.7,14.8s5.6,12.5,12.5,12.5c6.9,0,12.5-5.6,12.5-12.5S22.1,2.3,15.2,2.3z M15.2,26.3 c-6.3,0-11.5-5.2-11.5-11.5S8.8,3.3,15.2,3.3s11.5,5.2,11.5,11.5S21.5,26.3,15.2,26.3z'/></g></svg>");
}
.active i.ks-tabbar-icon-1 {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 30 30' fill='%23007aff'><path d='M15,2.6C8.1,2.6,2.5,8.2,2.5,15.1C2.5,22,8.1,27.6,15,27.6S27.5,22,27.5,15.1C27.5,8.2,21.9,2.6,15,2.6z M15,7.6 c0.8,0,1.5,0.7,1.5,1.5c0,0.8-0.7,1.5-1.5,1.5c-0.8,0-1.5-0.7-1.5-1.5C13.5,8.3,14.2,7.6,15,7.6z M17.5,21.6h-4v-1h1v-8h-1v-1h3V12 v0.6v8h1V21.6z'/></svg>");
}
i.ks-tabbar-icon-2 {
    width: 25px;
    height: 30px;
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 25 17' fill='%23929292'><path d='M19.5,0h-14L0,6v11h25V6L19.5,0z M5.9,1h13.2l4.5,5H16c0,1.9-1.6,3.4-3.5,3.4C10.6,9.4,9,7.9,9,6H1.4L5.9,1z M24,16H1V7h7.1 c0.5,1.9,2.3,3.4,4.4,3.4s3.9-1.5,4.4-3.4H24V16z'/></svg>");
}
.active i.ks-tabbar-icon-2 {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 25 17' fill='%23007aff'><path d='M19.5,0h-14L0,6v11h25V6L19.5,0z M5.9,1h13.2l4.5,5H16c0,1.9-1.6,3.4-3.5,3.4C10.6,9.4,9,7.9,9,6H1.3L5.9,1z'/></svg>");
}
i.ks-tabbar-icon-3 {
    width: 30px;
    height: 30px;
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 30 19' fill='%23929292'><path d='M16.8,1c3.7,0,6.8,3,6.8,6.8l0,0.1c0,0,0,0.1,0,0.1l0,1l1,0C27,9,29,11,29,13.5c0,2.5-2,4.5-4.5,4.5H6c-2.8,0-5-2.2-5-5 c0-2.1,1.4-4,3.4-4.7L5,8.1l0.1-0.6C5.3,6,6.5,5,8,5c0.4,0,0.9,0.1,1.3,0.3l0.9,0.5l0.4-0.9C11.8,2.5,14.2,1,16.8,1 M16.8,0 c-3.1,0-5.7,1.8-7,4.4C9.2,4.2,8.6,4,8,4C6,4,4.4,5.4,4.1,7.3C1.7,8.1,0,10.4,0,13c0,3.3,2.7,6,6,6h18.5v0c3,0,5.5-2.5,5.5-5.5 c0-3-2.5-5.5-5.5-5.5c0-0.1,0-0.2,0-0.2C24.5,3.5,21.1,0,16.8,0L16.8,0z'/></svg>");
}
.active i.ks-tabbar-icon-3 {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 30 19' fill='%23007aff'><path d='M24.5,8c0-0.1,0-0.2,0-0.2C24.5,3.5,21,0,16.8,0c-3.1,0-5.7,1.8-7,4.4C9.2,4.2,8.6,4,8,4C6,4,4.4,5.4,4,7.3 C1.7,8.1,0,10.4,0,13c0,3.3,2.7,6,6,6h18.5v0c3,0,5.5-2.5,5.5-5.5C30,10.5,27.5,8,24.5,8z'/></svg>");
}
i.ks-tabbar-icon-4 {
    width: 25px;
    height: 30px;
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 25 19' fill='%23929292'><g><path d='M23,3h-4.1l-2.4-2.4c0,0,0,0,0,0l0,0C16.1,0.2,15.6,0,15,0h-5C9.5,0,8.9,0.3,8.6,0.6l0,0L6.2,3H2C0.9,3,0,3.9,0,5v12 c0,1.1,0.9,2,2,2h21c1.1,0,2-0.9,2-2V5C25,3.9,24.1,3,23,3z M24,17c0,0.6-0.4,1-1,1H2c-0.6,0-1-0.4-1-1V5c0-0.6,0.4-1,1-1h4.2h0.4 l0.3-0.3l1.2-1.2l0,0.1l1.1-1.2C9.5,1.1,9.8,1,10,1h5c0.3,0,0.5,0.1,0.7,0.3l2.4,2.4L18.4,4h0.4H23c0.6,0,1,0.4,1,1V17z'/><path d='M12.5,4C8.9,4,6,6.9,6,10.5c0,3.6,2.9,6.5,6.5,6.5c3.6,0,6.5-2.9,6.5-6.5C19,6.9,16.1,4,12.5,4z M12.5,16 c-3,0-5.5-2.5-5.5-5.5C7,7.5,9.5,5,12.5,5S18,7.5,18,10.5C18,13.5,15.5,16,12.5,16z'/><path d='M12.5,6C10,6,8,8,8,10.5C8,13,10,15,12.5,15s4.5-2,4.5-4.5C17,8,15,6,12.5,6z M12.5,14C10.6,14,9,12.4,9,10.5 C9,8.6,10.6,7,12.5,7S16,8.6,16,10.5C16,12.4,14.4,14,12.5,14z'/></g></svg>");
}
.active i.ks-tabbar-icon-4 {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 25 19' fill='%23007aff'><g><path d='M23,3h-4.1l-2.4-2.4c0,0,0,0,0,0l0,0C16.1,0.2,15.6,0,15.1,0h-5C9.5,0,9,0.3,8.6,0.6l0,0L6.2,3H2C0.9,3,0,3.9,0,5v12 c0,1.1,0.9,2,2,2h21c1.1,0,2-0.9,2-2V5C25,3.9,24.1,3,23,3z M12.5,16c-3,0-5.5-2.5-5.5-5.5C7,7.5,9.5,5,12.5,5c3,0,5.5,2.5,5.5,5.5 C18,13.5,15.5,16,12.5,16z'/><circle cx='12.5' cy='10.5' r='4.5'/></g></svg>");
}
.transaction-date{
    font-size: 14px;vertical-align: middle;
}
.amount{
    width: auto;
    height: 6px;
    padding: 8px;
    font-size: 14px;
    font-weight: bold;
    -webkit-border-radius: 2px;
    line-height: 5px;
    border: 1px solid #8080808f;
    text-align: center;
    float: right;
    background-color: var(--f7-card-expandable-bg-color);
}
.expiredate{
    font-size: 10px !important;
}
textarea, input{
    background-color: #ffffff05 !important;
}
.data-table{
    border-radius:var(--f7-block-inset-border-radius) !important;
}