
:root {
    --z__default_cr: #fff;
    --z__theme_bg: #e5322d;
    --z__theme_cr: #e5322d;
    --z__theme_br: #e5322d;
    --z__white_bg: #fff;
    --z__white_cr: #fff;
    --z__white_br: #fff;
    --z__primary_cr: #333;
    --z__secondary_cr: #666;
    --z__primary_br: #ced4da;
    --z__primary_bg: #ced4da;
    --z__secondary_bg: #eee;
    --z__top_fixed_bg: #fff;
    --z__theme_svg: #e5322d;
    --z__white_svg: #fff;
    --z__primary_svg: #333;
    --z__secondary_svg: #666;
    --z__secondary_svg_h: #444;
    --z__close_svg: #666;
    --z__close_svg_h: #444;
    --z__anchor_cr: #333;
    --z__anchor_cr_h: #e5322d;
    --top_menu_hover: rgba(64,87,109,.07);
    --btn_cr: #fff;
    --btn_cr_h: #fff;
    --btn_bg_h: #cc0d06;
    --btn_bg_a: #cc0d06;
    --add_more_file_hover: #f9f9f9;
    --btn_log_cr: #333;
    --btn_log_bg: rgba(64,87,109,.07);
    --btn_log_bg_h: rgba(57,76,96,.15);
    --lang_menu_bg_h: rgba(64,87,109,.07);
    --sel_c_cr_bg: #fff;
    --_tooltip_bg: rgba(0, 0, 0, 0.8);
    --_tooltip_cr: #fff;
    --comp_ext_box_cr: #fff;
    --logo_h: #e5322d;
    --split_pdf_custom_h: #f7f7f7;
    --home_join_bg: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgb(255, 8, 8) 50%, rgb(255, 60, 0) 100%);
}

.z__theme_dark {
    --z__theme_bg: #e5322d;
    --z__white_bg: #1d1d1d;
    --z__white_cr: #333;
    --z__white_br: #4a4a4a;
    --z__primary_cr: #d9d9d9;
    --z__secondary_cr: #999999;
    --z__primary_br: #4a4a4a;
    --z__primary_bg: #333;
    --z__secondary_bg: #333;
    --z__top_fixed_bg: #0d0d0d;
    --z__theme_svg: #e5322d;
    --z__white_svg: #fff;
    --z__primary_svg: #d9d9d9;
    --z__secondary_svg: #999999;
    --z__secondary_svg_h: #d9d9d9;
    --z__close_svg: #888;
    --z__close_svg_h: #d9d9d9;
    --z__anchor_cr: #e5322d;
    --z__anchor_cr_h: #ee730a;
    --top_menu_hover: #313131;
    --btn_cr: #d9d9d9;
    --btn_cr_h: #d9d9d9;
    --btn_bg_h: #e5322d;
    --add_more_file_hover: #061b20;
    --btn_log_cr: #d9d9d9;
    --btn_log_bg: #444;
    --btn_log_bg_h: #313131;
    --lang_menu_bg_h: #313131;
    --sel_c_cr_bg: #242424;
    --_tooltip_bg: rgba(0, 0, 0, 0.8);
    --_tooltip_cr: #d9d9d9;
    --comp_ext_box_cr: #d9d9d9;
    --logo_h: #fff
}

body,figure {
    margin: 0
}

.navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse,.pre-scrollable {
    max-height: 340px
}

html {
    font-family: -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, 'Helvetica Neue', Arial, sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
    display: block
}

a {
    background-color: transparent
}

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

img {
    vertical-align: middle
}

button,input,textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

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

.btn,.btn.active,.btn:active,.dropdown-menu > .disabled > a:focus,.dropdown-menu > .disabled > a:hover,.form-control,.navbar-toggle,.open > .dropdown-toggle.btn-danger,.open > .dropdown-toggle.btn-default,.open > .dropdown-toggle.btn-info,.open > .dropdown-toggle.btn-primary,.open > .dropdown-toggle.btn-warning {
    background-image: none
}

.img-thumbnail,body {
    background-color: var(--z__white_bg)
}

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

html {
    font-size: 10px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.42857143;
    color: var(--z__primary_cr)
}

button,input,textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

a {
    color: var(--z__theme_cr);
    text-decoration: none
}

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

ol ol,ol ul,ul ol,ul ul {
    margin-bottom: 0
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.col-xs-offset-12 {
    margin-left: 100%
}

.col-xs-offset-11 {
    margin-left: 91.666%
}

.col-xs-offset-10 {
    margin-left: 83.333%
}

.col-xs-offset-9 {
    margin-left: 75%
}

.col-xs-offset-8 {
    margin-left: 66.666%
}

.col-xs-offset-7 {
    margin-left: 58.333%
}

.col-xs-offset-6 {
    margin-left: 50%
}

.col-xs-offset-5 {
    margin-left: 41.666%
}

.col-xs-offset-4 {
    margin-left: 33.333%
}

.col-xs-offset-3 {
    margin-left: 25%
}

.col-xs-offset-2 {
    margin-left: 16.666%
}

.col-xs-offset-1 {
    margin-left: 8.333%
}

.col-xs-offset-0 {
    margin-left: 0
}

@media (min-width: 768px) {
    .col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9 {
        float:left
    }

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

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

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

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

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

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

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

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

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

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

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

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

    .col-sm-offset-12 {
        margin-left: 100%
    }

    .col-sm-offset-11 {
        margin-left: 91.666%
    }

    .col-sm-offset-10 {
        margin-left: 83.333%
    }

    .col-sm-offset-9 {
        margin-left: 75%
    }

    .col-sm-offset-8 {
        margin-left: 66.666%
    }

    .col-sm-offset-7 {
        margin-left: 58.333%
    }

    .col-sm-offset-6 {
        margin-left: 50%
    }

    .col-sm-offset-5 {
        margin-left: 41.666%
    }

    .col-sm-offset-4 {
        margin-left: 33.333%
    }

    .col-sm-offset-3 {
        margin-left: 25%
    }

    .col-sm-offset-2 {
        margin-left: 16.666%
    }

    .col-sm-offset-1 {
        margin-left: 8.333%
    }

    .col-sm-offset-0 {
        margin-left: 0
    }
}

@media (min-width: 992px) {
    .col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9 {
        float:left
    }

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

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

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

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

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

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

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

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

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

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

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

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

    .col-md-offset-12 {
        margin-left: 100%
    }

    .col-md-offset-11 {
        margin-left: 91.666%
    }

    .col-md-offset-10 {
        margin-left: 83.333%
    }

    .col-md-offset-9 {
        margin-left: 75%
    }

    .col-md-offset-8 {
        margin-left: 66.666%
    }

    .col-md-offset-7 {
        margin-left: 58.333%
    }

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

    .col-md-offset-5 {
        margin-left: 41.666%
    }

    .col-md-offset-4 {
        margin-left: 33.333%
    }

    .col-md-offset-3 {
        margin-left: 25%
    }

    .col-md-offset-2 {
        margin-left: 16.666%
    }

    .col-md-offset-1 {
        margin-left: 8.333%
    }

    .col-md-offset-0 {
        margin-left: 0
    }
}

@media (min-width: 1200px) {
    .col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9 {
        float:left
    }

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

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

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

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

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

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

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

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

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

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

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

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

    .col-lg-offset-12 {
        margin-left: 100%
    }

    .col-lg-offset-11 {
        margin-left: 91.666%
    }

    .col-lg-offset-10 {
        margin-left: 83.333%
    }

    .col-lg-offset-9 {
        margin-left: 75%
    }

    .col-lg-offset-8 {
        margin-left: 66.666%
    }

    .col-lg-offset-7 {
        margin-left: 58.333%
    }

    .col-lg-offset-6 {
        margin-left: 50%
    }

    .col-lg-offset-5 {
        margin-left: 41.666%
    }

    .col-lg-offset-4 {
        margin-left: 33.333%
    }

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

    .col-lg-offset-2 {
        margin-left: 16.666%
    }

    .col-lg-offset-1 {
        margin-left: 8.333%
    }

    .col-lg-offset-0 {
        margin-left: 0
    }
}

.btn-group > .btn-group,.btn-toolbar .btn,.btn-toolbar .btn-group,.btn-toolbar .input-group,.dropdown-menu {
    float: left
}

input[type=checkbox],input[type=radio] {
    margin: 1px\9 0 0;
    line-height: normal
}

.collapsing,.dropdown,.dropup {
    position: relative
}

.btn-group-sm > .btn,.btn-sm {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

.btn-group-xs > .btn,.btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

.fade {
    opacity: 0;
    -webkit-transition: opacity 0.15s linear;
    -o-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear
}

.fade.in {
    opacity: 1
}

.collapse {
    display: none
}

.collapse.in {
    display: block
}

.collapsing {
    height: 0;
    overflow: hidden;
    -webkit-transition-property: height, visibility;
    transition-property: height, visibility;
    -webkit-transition-duration: 0.35s;
    transition-duration: 0.35s;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    text-align: left;
    background-color: var(--z__white_bg);
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    background-clip: padding-box;
    transition: opacity .4s ease,visibility .4s ease;
}

.dropdown-menu-width {
    min-width: 200px
}

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

.dropdown-menu > li > a {
    display: block;
    padding: 3px 20px;
    line-height: 1.42857143;
    white-space: nowrap
}

.dropdown-menu > li > a {
    clear: both;
    font-weight: 400;
    color: var(--z__primary_cr)
}

.dropdown-menu > li > a:focus,.dropdown-menu > li > a:hover {
    text-decoration: none;
    color: #262626;
    background-color: #f5f5f5
}

.open > .dropdown-menu {
    display: block
}

.display-dropdown:hover .dropdown-menu {
    display: block
}

.open.display-dropdown-double > .dropdown-menu {
    display: flex
}

.nav > li,.nav > li > a {
    display: block;
    position: relative
}

.nav {
    margin-bottom: 0;
    padding-left: 0;
    list-style: none
}

.nav > li > a {
    padding: 10px 15px
}

.tab-content > .tab-pane {
    display: none
}

.tab-content > .active {
    display: block
}

.navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 20px;
    border: 1px solid transparent
}

.navbar-collapse {
    overflow-x: visible;
    padding-right: 12px;
    padding-left: 12px;
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
    -webkit-overflow-scrolling: touch
}

.navbar-collapse.in {
    overflow-y: auto
}

@media (min-width: 992px) {
    .navbar {
        border-radius:4px
    }

    .navbar-collapse {
        width: auto;
        border-top: 0;
        box-shadow: none
    }

    .navbar-collapse.collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important
    }

    .navbar-collapse.in {
        overflow-y: visible
    }
}

.navbar-fixed-bottom,.navbar-fixed-top {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030
}

.navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px
}

.z__nav_lef_m {
    flex: 0 0 auto;
    display: flex;
    gap: 12px
}

.navbar-brand {
    margin-left: 20px;
    margin-right: 24px;
}

.navbar-brand a {
    width: 100px;
    height: 36px;
    display: block
}

.navbar-brand a svg {
    fill: var(--z__theme_svg)
}

.navbar-brand a:hover svg {
    fill: var(--logo_h);
    transition: 200ms;
    transition-timing-function: ease-in-out;
}

.navbar-toggle {
    position: relative;
    float: right;
    background-color: transparent
}

.navbar-toggle:focus {
    outline: 0
}

.navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px
}

.navbar-toggle .icon-bar+.icon-bar {
    margin-top: 4px
}

.navbar-nav {
    margin: 7.5px -12px
}

@media (max-width: 991px) {
    .navbar-nav .open .dropdown-menu > li > a:focus,.navbar-nav .open .dropdown-menu > li > a:hover {
        background-image:none
    }
}

@media (min-width: 992px) {
    .navbar-toggle {
        display:none
    }

    .navbar-nav {
        float: left;
        margin: 0
    }

    .navbar-nav > li {
        float: left
    }

    .navbar-nav > li > a {
        padding-top: 15px;
        padding-bottom: 15px
    }
}

@media (min-width: 768px) {
    .navbar-form .form-control-static,.navbar-form .form-group {
        display:inline-block
    }

    .navbar-form .control-label,.navbar-form .form-group {
        margin-bottom: 0;
        vertical-align: middle
    }
}

@media (max-width: 991px) {
    .navbar-form .form-group {
        margin-bottom:5px
    }

    .navbar-form .form-group:last-child {
        margin-bottom: 0
    }
}

.navbar-nav > li > .dropdown-menu {
    margin-top: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.navbar-default .navbar-nav > li > a,.navbar-default .navbar-text {
    color: #777
}

.navbar-default .navbar-toggle {
    border-color: #ddd
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #888
}

.navbar-default .navbar-collapse,.navbar-default .navbar-form {
    border-color: #e7e7e7
}

@media (max-width: 991px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color:#777
    }

    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus,.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover {
        color: var(--z__primary_cr);
        background-color: transparent
    }
}

.btn-group-vertical > .btn-group:after,.btn-group-vertical > .btn-group:before,.btn-toolbar:after,.btn-toolbar:before,.clearfix:after,.clearfix:before,.container-fluid:after,.container-fluid:before,.container:after,.container:before,.dl-horizontal dd:after,.dl-horizontal dd:before,.form-horizontal .form-group:after,.form-horizontal .form-group:before,.modal-footer:after,.modal-footer:before,.modal-header:after,.modal-header:before,.nav:after,.nav:before,.navbar-collapse:after,.navbar-collapse:before,.navbar-header:after,.navbar-header:before,.navbar:after,.navbar:before,.pager:after,.pager:before,.panel-body:after,.panel-body:before,.row:after,.row:before {
    content: " ";
    display: table
}

.btn-group-vertical > .btn-group:after,.btn-toolbar:after,.clearfix:after,.container-fluid:after,.container:after,.dl-horizontal dd:after,.form-horizontal .form-group:after,.modal-footer:after,.modal-header:after,.nav:after,.navbar-collapse:after,.navbar-header:after,.navbar:after,.pager:after,.panel-body:after,.row:after {
    clear: both
}

.hide {
    display: none !important
}

.navbar-container {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px
}

.navbar-header1 {
    width: 100%;
    display: flex;
    align-items: center
}
</style>
<style>
.main-content,body,html {
    min-height: 100%
}

.nav-list > li .submenu > li > a:hover,.nav-list > li > a,a:active,a:focus {
    text-decoration: none
}

html {
    position: relative
}

body {
    background-color: var(--z__white_bg);
    padding-bottom: 0;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, 'Helvetica Neue', Arial, sans-serif;
    font-size: 16px;
    color: var(--z__primary_cr);
    line-height: 1.5;
    overflow-x: hidden
}

h1,h2,h3,h4,h5,h6 {
    color: var(--z__primary_cr);
    font-family: inherit;
    margin: 0
}

.main-container:before {
    display: block;
    content: "";
    position: absolute;
    z-index: -2;
    width: 100%;
    max-width: inherit;
    bottom: 0;
    top: 0;
    background-color: var(--z__white_bg)
}

.main-content {
    margin-left: 0;
    padding: 0
}

.main-content:after,.main-content:before {
    content: " ";
    display: table
}

.nav-list > li > .submenu > li:before,.nav-list > li > .submenu:before,.nav-list > li:before,.nav-list li.active > a:after,.sidebar .sidebar-toggle:before,.sidebar.menu-min .nav-list > li > .submenu:after,.sidebar:before,li.divider:before {
    content: ""
}

.main-content:after {
    clear: both
}

.sidebar+.main-content {
    /*margin-left:190px*/
}

.page-content {
    background-color: var(--z__white_bg);
    position: relative;
    margin: 0;
    padding: 8px 20px 24px
}

.zon-icon {
    text-align: center
}

h1 {
    font-size: 36px
}

h2 {
    font-size: 32px
}

h3 {
    font-size: 28px
}

h4 {
    font-size: 24px
}

li > ol,li > ul {
    margin-left: 18px
}

.navbar {
    margin: 0;
    padding-left: 0;
    padding-right: 0;
    border-width: 0;
    border-radius: 0;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .25);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .25);
    min-height: 60px;
    background-color: var(--z__top_fixed_bg)
}

.zon-nav {
    height: 100%;
    margin: 0 !important
}

.zon-nav > li {
    line-height: 60px;
    height: 60px;
    padding: 0;
    position: relative;
    float: left
}

.zon-nav > li:first-child {
    /*border-left-width:0*/
}

.zon-nav > li > a {
    background-color: #2E6589;
    color: #444;
    display: block;
    line-height: inherit;
    text-align: center;
    height: 100%;
    width: auto;
    min-width: 50px;
    padding: 0 8px;
    position: relative
}

.zon-nav > li > a > .zon-icon {
    display: inline-block;
    font-size: 16px;
    color: var(--z__white_cr);
    text-align: center;
    width: 20px
}

.zon-nav > li > a:focus,.zon-nav > li > a:hover,.zon-nav > li.open > a {
    background-color: #2c5976;
    color: #444
}

.zon-nav > li.light-blue > a {
    background-color: #62A8D1
}

.zon-nav > li.light-blue > a:focus,.zon-nav > li.light-blue > a:hover,.zon-nav > li.open.light-blue > a {
    background-color: #579ec8
}

.zon-nav > li.transparent > a {
    background-color: transparent
}

.zon-nav > li.open.transparent > a,.zon-nav > li.transparent > a:focus,.zon-nav > li.transparent > a:hover {
    background-color: rgba(64,87,109,.07)
}

.zon-nav > li .dropdown-menu {
    z-index: 1031
}

.zon-nav .nav-user-photo {
    margin: -4px 8px 0 0;
    border-radius: 100%;
    border: 2px solid var(--z__white_br);
    max-width: 40px
}

@media only screen and (max-width: 767px) {
    .user-menu.dropdown-close.dropdown-menu-right {
        right:0 !important
    }
}

@media only screen and (max-width: 480px) {
    .zon-nav > li:nth-last-child(2) > .dropdown-menu.dropdown-menu-right {
        right:-50px
    }
}

@media only screen and (max-width: 479px) {
    .zon-nav > li:nth-last-child(2) > .dropdown-menu.dropdown-menu-right {
        left:-70px;
        right: auto
    }

    .zon-nav > li:nth-last-child(2) > .dropdown-menu.dropdown-menu-right:after,.zon-nav > li:nth-last-child(2) > .dropdown-menu.dropdown-menu-right:before {
        left: 90px;
        right: auto
    }
}

@media only screen and (max-width: 319px) {
    .zon-nav > li:nth-child(1):nth-last-child(2) > .dropdown-menu.dropdown-menu-right {
        left:-60px;
        right: auto
    }

    .zon-nav > li:nth-child(1):nth-last-child(2) > .dropdown-menu.dropdown-menu-right:after,.zon-nav > li:nth-child(1):nth-last-child(2) > .dropdown-menu.dropdown-menu-right:before {
        left: 75px;
        right: auto
    }

    .zon-nav > li > a {
        padding: 0 5px !important
    }
}

.user-menu > li > a > .zon-icon {
    margin-right: 6px;
    font-size: 120%
}

.user-info small {
    display: block
}

@media (max-width: 360px) {
    .navbar.navbar-collapse .navbar-buttons .nav-user-photo {
        margin-right:0
    }

    .navbar.navbar-collapse .navbar-buttons .user-info {
        position: absolute;
        margin-top: 40px;
        margin-left: 1px;
        right: 2px;
        z-index: 1032;
        color: #777;
        font-size: 14px;
        width: 156px;
        max-width: 156px;
        padding-left: 8px;
        padding-right: 8px;
        height: 32px;
        line-height: 26px !important;
        display: none;
        border-bottom: 1px solid #E5E5E5;
        text-align: center;
        vertical-align: none;
        cursor: text
    }

    .navbar.navbar-collapse .navbar-buttons .user-info > small {
        display: inline;
        opacity: 1
    }

    li.open .user-info {
        display: inline-block !important;
        right: 2px
    }
}

@media (min-width: 992px) {
    .user-min .user-menu {
        padding-top:42px !important
    }

    .user-min .nav-user-photo {
        margin-right: 0
    }

    .user-min .user-info {
        position: absolute;
        margin-top: 45px;
        margin-left: 1px;
        z-index: 1032;
        color: #777;
        font-size: 14px;
        width: 156px;
        max-width: 156px;
        padding-left: 8px;
        padding-right: 8px;
        height: 32px;
        line-height: 26px !important;
        display: none;
        border-bottom: 1px solid #E5E5E5;
        text-align: center;
        vertical-align: none;
        cursor: text;
        right: -3px
    }

    .user-min .user-info > small {
        display: inline;
        opacity: 1
    }

    .user-min.open .user-info {
        display: inline-block !important
    }
}

.btn {
    cursor: pointer
}

@media only screen and (max-width: 991px) {
    .navbar.navbar-collapse {
        max-height:none
    }

    .navbar .navbar-collapse,.navbar .navbar-header {
        margin-left: 0 !important;
        margin-right: 0 !important
    }

    .navbar.navbar-collapse .navbar-header {
        min-height: 60px
    }

    .navbar.navbar-collapse .navbar-buttons {
        min-height: 0;
        padding-left: 0;
        padding-right: 0;
        border: 1px solid rgba(255, 255, 255, .4);
        border-width: 1px 0 0;
        width: 100%
    }

    .navbar.navbar-collapse .navbar-buttons.in {
        overflow: visible !important
    }

    .navbar.navbar-collapse .navbar-buttons > .zon-nav {
        display: block;
        float: none !important;
        text-align: center;
        background-color: transparent !important;
        border-width: 0;
        letter-spacing: -3px
    }

    .navbar.navbar-collapse .navbar-buttons > .zon-nav > li {
        display: inline-block;
        float: none !important;
        text-align: left;
        letter-spacing: normal
    }
}

.navbar .navbar-nav > li {
    border-width: 0 1px 0 0
}

.navbar .navbar-nav > li:first-child {
    border-width: 0 1px
}

.navbar .navbar-nav > li > a {
    transition: background-color 0.1s linear,border-color 0.1s linear,color 0.1s linear;
    padding-top: 12px;
    padding-bottom: 11px;
    height: 60px;
    background-color: transparent;
    font-size: 16px;
    color: var(--z__primary_cr);
    text-shadow: 0 1px 0 rgba(0, 0, 0, .25);
    line-height: 60px
}

.navbar .navbar-nav > li > a:focus,.navbar .navbar-nav > li > a:hover {
    background-color: var(--top_menu_hover);
    border-bottom: 1px solid var(--z__theme_br);
}

.navbar .navbar-nav > li > .dropdown-menu > li > a {
    line-height: 2
}

.navbar-nav .dropdown-menu > li > a > .zon-icon {
    display: inline-block;
    width: 20px
}

.navbar-nav > li > .dropdown-menu {
    z-index: 1033
}

@media only screen and (max-width: 991px) {
    .navbar .navbar-nav .dropdown-menu > li > a,.navbar .navbar-nav .dropdown-menu > li > a > .zon-icon {
        color:var(--z__white_cr) !important
    }

    .navbar.navbar-collapse .navbar-menu {
        float: none !important;
        clear: both
    }

    .navbar.navbar-collapse .navbar-menu .dropdown-menu:after,.navbar.navbar-collapse .navbar-menu .dropdown-menu:before {
        display: none !important
    }

    .navbar .navbar-nav {
        margin: 0 -6px
    }

    .navbar .navbar-nav > li,.navbar .navbar-nav > li:first-child {
        border-width: 1px 0 0
    }

    .navbar .navbar-nav .dropdown-menu {
        float: none;
        position: relative;
        background-color: transparent;
        box-shadow: none;
        border-width: 0
    }

    .navbar .navbar-nav .dropdown-menu > li > a:hover {
        background-color: rgba(0, 0, 0, .07) !important
    }
}

@media only screen and (max-width: 991px) {
    .navbar-nav+.navbar-form {
        margin-top:0
    }

    .navbar .navbar-collapse,.navbar .navbar-form {
        border-color: rgba(255, 255, 255, .4)
    }

    .navbar .navbar-nav > li:first-child {
        border-top-width: 0
    }
}

@media only screen and (min-width: 480px) and (max-width:767px) {
    .navbar.navbar-collapse .zon-nav > li:nth-last-child(2):nth-child(1) > .dropdown-menu.dropdown-menu-right,.navbar.navbar-collapse .zon-nav > li:nth-last-child(2):nth-child(2) > .dropdown-menu.dropdown-menu-right {
        left:auto;
        right: -60px
    }

    .navbar.navbar-collapse .zon-nav > li:nth-last-child(2):nth-child(1) > .dropdown-menu.dropdown-menu-right:after,.navbar.navbar-collapse .zon-nav > li:nth-last-child(2):nth-child(1) > .dropdown-menu.dropdown-menu-right:before,.navbar.navbar-collapse .zon-nav > li:nth-last-child(2):nth-child(2) > .dropdown-menu.dropdown-menu-right:after,.navbar.navbar-collapse .zon-nav > li:nth-last-child(2):nth-child(2) > .dropdown-menu.dropdown-menu-right:before {
        right: 80px;
        left: auto
    }
}

.navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse,.navbar-static-top .navbar-collapse {
    padding-left: 12px;
    padding-right: 12px
}

.navbar .navbar-toggle {
    border: 1px solid transparent;
    width: 40px;
    height: 40px;
    line-height: 0;
}

.navbar-toggle svg {
    width: 28px;
    height: 28px;
    fill: var(--z__theme_svg)
}

.navbar .navbar-toggle.pull-right {
    margin: 10px 8px 0 0
}

.navbar .navbar-toggle:active {
    top: 1px
}

.navbar .navbar-toggle.navbar-toggle-img {
    width: auto;
    height: auto;
    overflow: hidden;
    padding: 0;
    border-width: 0
}

.navbar .navbar-toggle.navbar-toggle-img > img {
    border-radius: inherit;
    max-height: 35px;
    border-width: 0
}

.navbar .navbar-toggle .icon-bar {
    background-color: var(--z__white_bg);
    border-radius: 0;
    width: 24px;
    margin-left: 7px
}

.sidebar {
    width: 190px;
    float: left;
    position: static;
    padding-left: 0;
    padding-right: 0;
    position: fixed !important;
    height: calc(100vh - 60px) !important;
    overflow-y: scroll !important;
    overflow-x: hidden !important
}

.sidebar:before {
    display: block;
    width: inherit;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: -1;
    background-color: inherit;
    border-style: inherit;
    border-color: inherit;
    border-width: inherit
}

.nav-list {
    margin: 0;
    padding: 0;
    list-style: none
}

.nav-list .nav-header,.nav-list > li,.nav-list > li > a {
    margin: 0
}

.nav-list li > a:focus {
    outline: 0
}

.nav-list > li {
    display: block;
    position: relative;
    float: none;
    padding: 0;
    border-style: solid;
    border-width: 1px 0 0
}

.nav-list > li:last-child {
    border-bottom-width: 1px
}

.nav-list > li > a {
    display: block;
    height: 39px;
    line-height: 17px;
    padding-left: 10px;
    text-shadow: none !important;
    font-size: 15px
}

.nav-list > li > a > .menu-icon {
    display: inline-block;
    min-width: 30px;
    margin-right: 2px;
    vertical-align: sub;
    text-align: center;
    font-size: 18px;
    font-weight: 400
}

.nav-list > li:before {
    display: none;
    position: absolute;
    top: -1px;
    left: 0;
    z-index: 1;
    height: 41px;
    width: 3px;
    max-width: 3px;
    overflow: hidden;
    background-color: var(--z__theme_bg)
}

.nav-list > li:hover:before {
    display: block
}

.nav-list > li a > .arrow {
    display: block;
    width: 14px !important;
    height: 14px;
    line-height: 14px;
    text-shadow: none;
    font-size: 18px;
    position: absolute;
    right: 10px;
    top: 12px;
    padding: 0;
    text-align: center
}

.nav-list > li .submenu {
    display: block;
    list-style: none;
    margin: 0;
    padding: 0;
    line-height: 1.5;
    position: relative
}

.nav-list > li .submenu > li {
    margin-left: 0;
    position: relative
}

.nav-list > li .submenu > li > a {
    display: block;
    position: relative;
    padding: 7px 0 9px 22px;
    margin: 0;
    border-top-width: 1px;
    border-top-style: dotted;
    font-size: 15px
}

.nav-list > li .submenu > li a > .menu-icon {
    display: none;
    font-size: 12px;
    font-weight: 400;
    width: 18px;
    height: auto;
    line-height: 12px;
    text-align: center;
    position: absolute;
    left: 10px;
    top: 11px;
    z-index: 1;
    background-color: inherit
}

.nav-list > li .submenu > li.active > a > .menu-icon,.nav-list > li .submenu > li:hover > a > .menu-icon {
    display: inline-block
}

.nav-list > li > .submenu {
    border-top: 1px solid
}

.nav-list > li > .submenu > li:before {
    display: block;
    width: 7px;
    position: absolute;
    z-index: 1;
    left: 12px;
    top: 17px;
    border: 1px dotted;
    border-width: 1px 0 0
}

.nav-list > li > .submenu:before {
    display: block;
    position: absolute;
    z-index: 1;
    left: 12px;
    top: 0;
    bottom: 0;
    border: 1px dotted;
    border-width: 0 0 0 1px
}

.nav-list > li > .submenu > li:first-child > a {
    border-top-width: 0
}

.nav-list a .badge,.nav-list a .label {
    position: absolute;
    top: 9px;
    right: 10px;
    opacity: 0.88;
    font-size: 12px;
    padding-left: 6px;
    padding-right: 6px
}

.nav-list a .badge .zon-icon,.nav-list a .label .zon-icon {
    vertical-align: middle;
    margin: 0
}

.nav-list a.dropdown-toggle .badge,.nav-list a.dropdown-toggle .label {
    right: 26px
}

.nav-list li:hover > a .badge,.nav-list li:hover > a .label {
    opacity: 1
}

.sidebar.sidebar-fixed {
    position: fixed;
    top: auto;
    float: none !important;
    z-index: 1027
}

.sidebar.sidebar-fixed:before {
    height: 5000px;
    top: auto;
    bottom: auto
}

@media only screen and (max-width: 991px) {
    .responsive.sidebar-fixed {
        left:auto;
        margin-left: auto
    }

    .navbar-fixed-top+.main-container > .responsive {
        position: fixed;
        left: auto;
        margin-left: auto
    }

    .navbar-fixed-top+.main-container > .menu-toggler+.responsive.sidebar-fixed,.sidebar.responsive.sidebar-fixed,.sidebar.sidebar-fixed.responsive-max {
        position: fixed;
        left: auto;
        margin-left: auto
    }
}

.sidebar .sidebar-toggle {
    border-style: solid;
    border-width: 0 0 1px;
    text-align: center;
    padding: 3px 0;
    position: relative
}

.sidebar .sidebar-toggle > .zon-icon {
    padding: 0 5px;
    line-height: 18px;
    cursor: pointer;
    font-size: 14px;
    border-radius: 100%;
    border: 1px solid;
    position: relative
}

.sidebar .sidebar-toggle:before {
    display: block;
    height: 0;
    border-top: 1px solid;
    border-color: inherit;
    position: absolute;
    left: 15px;
    right: 15px;
    top: 13px
}

.nav-list li > .arrow {
    display: none;
    position: absolute;
    top: 8px;
    right: 1px;
    z-index: 1027
}

@media only screen and (max-width: 991px) {
    .sidebar.responsive:before {
        display:none
    }

    .sidebar.responsive {
        -webkit-box-shadow: 2px 1px 2px 0 rgba(0, 0, 0, .15);
        box-shadow: 2px 1px 2px 0 rgba(0, 0, 0, .15);
        z-index: 1027;
        overflow: hidden;
        max-height: 0;
        -moz-transform: translateX(-200px);
        -webkit-transform: translateX(-200px);
        -o-transform: translateX(-200px);
        -ms-transform: translateX(-200px);
        transform: translateX(-200px);
        -webkit-transition: -webkit-transform 0.2s linear 0s, max-height 0s linear 0.2s;
        -moz-transition: -moz-transform 0.2s linear 0s, max-height 0s linear 0.2s;
        -o-transition: -o-transform 0.2s linear 0s, max-height 0s linear 0.2s;
        transition: transform 0.2s linear 0s, max-height 0s linear 0.2s;
        position: relative;
        bottom: auto;
        left: 190px;
        margin-left: -190px
    }
}

@media only screen and (max-width: 991px) {
    .sidebar.responsive.display {
        -moz-transform:none !important;
        -webkit-transform: none !important;
        -o-transform: none !important;
        -ms-transform: none !important;
        transform: none !important;
        overflow: visible;
        max-height: 2000px;
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
        width: 65%;
        display: none
    }

    .sidebar.responsive+.main-content {
        margin-left: 0 !important;
        margin-right: 0 !important
    }

    .responsive.sidebar-fixed {
        position: fixed
    }

    .show {
        display: block !important
    }
}

.main-content-inner {
    position: relative;
    float: left;
    width: 100%
}

.sidebar-scroll .sidebar-toggle {
    border-top: 1px solid
}

.sidebar-scroll .nav-list > li:first-child {
    border-top-width: 0
}

.sidebar-scroll .nav-list > li:last-child {
    border-bottom-width: 0
}

.sidebar .nav-wrap+.zon-scroll {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.footer {
    padding-top: 75px;
    height: 0;
    width: 0
}

.footer .footer-inner {
    text-align: center;
    position: absolute;
    z-index: auto;
    left: 0;
    right: 0;
    bottom: 0
}

.sidebar~.footer .footer-inner {
    left: 190px
}

@media (max-width: 991px) {
    .footer .footer-inner,.sidebar.compact~.footer .footer-inner,.sidebar.menu-min~.footer .footer-inner,.sidebar~.footer .footer-inner {
        left:0
    }

    .sidebar.responsive-min~.footer .footer-inner {
        left: 43px
    }
}

.footer .footer-inner .footer-content {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 4px;
    padding: 8px;
    line-height: 36px;
    border-top: 3px double #E5E5E5
}

.btn-group-sm > .btn,.btn-sm {
    border-width: 4px;
    font-size: 13px;
    padding: 4px 9px;
    line-height: 1.38
}

.btn-group-mini > .btn,.btn-mini {
    padding: 1px 5px;
    border-width: 3px;
    font-size: 12px;
    line-height: 1.5
}

.btn-inverse,.btn-inverse.focus,.btn-inverse:focus {
    background-color: #555 !important;
    border-color: #555
}

.btn > .zon-icon {
    margin-right: 4px
}

.btn > .icon-only.zon-icon {
    margin: 0 !important;
    text-align: center;
    padding: 0
}

.btn-sm > .zon-icon {
    margin-right: 3px
}

.btn-mini > .zon-icon,.btn-minier > .zon-icon,.btn-xs > .zon-icon {
    margin-right: 2px
}

.dropdown-menu {
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
    box-shadow: 0 2px 4px rgba(0, 0, 0, .2)
}

.dropdown-menu {
    border-radius: 0 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .2)
}

.dropdown-menu > li > a {
    font-size: 15px;
    padding-left: 11px;
    padding-right: 11px;
    padding-bottom: 4px;
    margin-bottom: 1px;
    margin-top: 1px
}

.dropdown-menu > li > a:active,.dropdown-menu > li > a:focus,.dropdown-menu > li.active > a,.dropdown-menu > li.active:hover > a,.dropdown-menu > li:hover > a {
    background-color: rgba(64,87,109,.07)
}

.dropdown-light-blue > li > a:active,.dropdown-light-blue > li > a:focus,.dropdown-light-blue > li.active > a,.dropdown-light-blue > li.active:hover > a,.dropdown-light-blue > li:hover > a {
    background: #e1f0fc;
    color: #456
}

.dropdown-menu.dropdown-close {
    top: 92%;
    left: -5px
}

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

.dropdown-menu.dropdown-caret:after,.dropdown-menu.dropdown-caret:before {
    content: "";
    display: inline-block;
    position: absolute
}

.dropdown-menu.dropdown-caret:before {
    border-bottom: 0px solid rgba(0, 0, 0, .2);
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    left: 9px;
    top: -6px
}

.dropdown-menu.dropdown-caret:after {
    border-bottom: 0px solid var(--z__white_br);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    left: 10px;
    top: -5px
}

.dropdown-menu.dropdown-caret-right.dropdown-caret:before,.dropdown-menu.dropdown-menu-right.dropdown-caret:before {
    left: auto;
    right: 9px
}

.dropdown-menu.dropdown-caret-right.dropdown-caret:after,.dropdown-menu.dropdown-menu-right.dropdown-caret:after {
    left: auto;
    right: 10px
}

.dropdown-navbar {
    padding: 0;
    width: 240px;
    -webkit-box-shadow: 0 2px 4px rgba(30, 30, 100, .25);
    box-shadow: 0 2px 4px rgba(30, 30, 100, .25);
    border-color: #BCD4E5
}

.dropdown-navbar > li {
    padding: 0 8px;
    background-color: var(--z__white_bg)
}

.dropdown-navbar > li > a {
    padding: 10px 2px;
    margin: 0;
    border-top: 1px solid;
    font-size: 12px;
    line-height: 16px;
    color: #555 !important;
    background-color: transparent !important;
    white-space: normal;
    border-top-color: #E4ECF3
}

.dropdown-navbar > li > a .progress {
    margin-bottom: 0;
    margin-top: 4px
}

.dropdown-navbar > li.dropdown-footer > a {
    color: #4F99C6 !important;
    text-align: center;
    font-size: 13px
}

.dropdown-navbar > li:hover {
    background-color: #F4F9FC
}

.dropdown-navbar > .dropdown-content {
    padding: 0
}

.dropdown-navbar > .dropdown-content .dropdown-navbar {
    list-style: none;
    margin: 0;
    padding: 0 !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    width: auto;
    display: block;
    float: none;
    border-width: 0;
    position: static;
    z-index: auto
}

.dropdown-navbar .nav-tabs {
    border-width: 0;
    box-shadow: none;
    background-color: #F9F9F9 !important;
    top: auto;
    width: 100%
}

.dropdown-navbar .nav-tabs > li {
    display: table-cell;
    width: 1%;
    float: none !important
}

.dropdown-navbar .nav-tabs > li > a {
    margin: 0 0 0 1px !important;
    text-align: center;
    box-shadow: none !important;
    background-color: #F9F9F9 !important;
    border-width: 0 !important;
    border-bottom: 2px solid #BECAD1 !important
}

.dropdown-navbar .nav-tabs > li:first-child > a {
    margin-left: 0 !important
}

.dropdown-navbar .nav-tabs > li.active > a {
    border-bottom: 2px solid #79B0CE !important;
    color: #5085AF !important;
    background-color: #ECF2F7 !important
}

.dropdown-navbar .tab-content {
    padding: 0 !important;
    border-color: var(--z__white_br) !important
}

.dropdown-navbar .tab-content .dropdown-menu {
    display: block;
    position: static;
    margin: 0 !important;
    padding-top: 2px;
    border-color: var(--z__white_br) !important;
    box-shadow: none !important;
    width: 100%
}

.nav-tabs,.nav-tabs > li:first-child > a {
    margin-left: 0
}

.tab-content {
    border: 1px solid #C5D0DC;
    padding: 16px 12px;
    position: relative
}

.nav-tabs {
    border-color: #C5D0DC;
    margin-bottom: 0 !important;
    position: relative;
    top: 1px
}

.nav-tabs > li > a {
    padding: 7px 12px 8px
}

.nav-tabs > li > a,.nav-tabs > li > a:focus {
    border-radius: 0 !important;
    border-color: #C5D0DC;
    background-color: #F9F9F9;
    color: #999;
    margin-right: -1px;
    line-height: 18px;
    position: relative
}

.nav-tabs > li.active > a,.nav-tabs > li.active > a:focus,.nav-tabs > li.active > a:hover {
    color: #576373;
    border-color: #C5D0DC #C5D0DC transparent;
    border-top: 2px solid #4C8FBD;
    background-color: var(--z__white_bg);
    z-index: 1;
    line-height: 18px;
    margin-top: -1px;
    box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, .15)
}

.nav-tabs > li > a .badge {
    padding: 1px 5px;
    line-height: 15px;
    opacity: 0.75;
    vertical-align: initial
}

.nav-tabs > li.active > a .badge,.nav-tabs > li.active > a .zon-icon {
    opacity: 1
}

.infobox-dark > .infobox-icon > .zon-icon:before,.tooltip.in {
    opacity: 1;
    filter: alpha(opacity=100)
}

.btn-scroll-up {
    border-width: 0;
    position: fixed;
    right: 2px;
    z-index: 99;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    opacity: 0;
    filter: alpha(opacity=0);
    bottom: -24px;
    visibility: hidden
}

.page-content > .row .col-lg-12,.page-content > .row .col-md-12,.page-content > .row .col-sm-12,.page-content > .row .col-xs-12 {
    max-width: 100%
}

.navbar-fixed-top+.main-container {
    padding-top: 60px
}

@media (max-width: 479px) {
    .navbar-fixed-top+.main-container {
        padding-top:60px
    }

    .navbar-fixed-top.navbar-collapse+.main-container {
        padding-top: 60px
    }
}

.no-skin .sidebar {
    background-color: var(--z__white_bg);
    border-style: solid;
    border-color: var(--z__primary_br);
    border-width: 0 1px 0 0
}

.no-skin .nav-list > li {
    border-color: var(--z__primary_br)
}

.no-skin .nav-list > li > a {
    background-color: #F8F8F8;
    color: #595959
}

.no-skin .nav-list > li:hover > a {
    background-color: var(--z__white_bg);
    color: var(--z__theme_cr)
}

.no-skin .nav-list > li .submenu {
    background-color: var(--z__white_bg);
    border-color: #E5E5E5
}

.no-skin .nav-list > li .submenu > li > a {
    border-top-color: #E4E4E4;
    background-color: var(--z__white_bg);
    color: #616161
}

.no-skin .nav-list > li .submenu > li > a:hover {
    color: var(--z__theme_cr);
    background-color: #e1f0fc
}

.no-skin .nav-list > li > .submenu > li:before,.no-skin .nav-list > li > .submenu:before {
    border-color: var(--z__theme_br)
}

.no-skin .sidebar-toggle {
    background-color: #F3F3F3;
    border-color: #E0E0E0
}

.no-skin .sidebar-toggle > .zon-icon {
    border-color: #BBB;
    color: #AAA;
    background-color: var(--z__white_bg)
}

@media only screen and (max-width: 991px) {
    body {
        overflow-x:hidden
    }

    .no-skin .sidebar {
        border-width: 0 1px 1px 0;
        border-top-color: #d6d6d6
    }
}

.no-skin .sidebar-scroll .sidebar-toggle {
    border-top-color: #ddd
}

.all-center {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important
}

.multiple-menu li {
    list-style: none
}

.multiple-menu {
    margin: 0 !important;
    padding: 0 !important
}

.multiple-menu li div {
    color: var(--z__primary_cr);
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    padding: 8px 16px
}

@media (min-width: 992px) {
    .multiple-menu-ul {
        display:none;
        width: auto;
        height: auto;
        justify-content: center;
        padding: 15px 20px
    }

    .multiple-menu-li {
    }

    .multiple-menu li a {
        font-size: 15px;
        display: block;
        padding: 12px 8px;
        color: var(--z__primary_cr);
        margin-bottom: 1px;
        margin-top: 1px;
        border-radius: 4px;
        display: flex;
        align-items: center
    }

    .multiple-menu li a:hover {
        background-color: var(--top_menu_hover)
    }

    .display-dropdown:hover .multiple-menu-ul {
        display: flex;
        justify-content: center
    }

    .more-conversion-menu {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start
    }

    .more-converter-menu {
        width: 762px;
        flex-wrap: wrap;
        justify-content: flex-start
    }
}

@media only screen and (max-width: 991px) {
    .display-dropdown:hover > .multiple-menu-ul {
        display:block
    }

    .multiple-menu-li {
        width: 100%
    }

    .multiple-menu li a {
        font-size: 15px;
        display: block;
        padding: 3px 20px;
        color: var(--z__primary_cr);
        padding-left: 11px;
        padding-right: 11px;
        padding-bottom: 4px;
        margin-bottom: 1px;
        margin-top: 1px;
        line-height: 2;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }

    .multiple-menu li a:hover {
        background-color: var(--top_menu_hover)
    }
}

@media only screen and (min-width: 1200px) {
    .more-conversion-menu li {
        flex:0 0 16.6667%;
        max-width: 236px
    }

    .multiple-menu-li {
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .more-conversion-menu li {
        flex:0 0 33.3333%
    }

    .multiple-menu-li {
        margin-bottom: 24px
    }
}

.top_menu__m {
}

.top_menu__m svg {
    width: 18px;
    height: 18px;
    fill: var(--z__primary_svg)
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    border: 2px solid transparent;
    white-space: nowrap;
    background-image: none!important;
    text-decoration: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: background-color 0.15s,border-color 0.15s,opacity 0.15s;
    -o-transition: background-color 0.15s,border-color 0.15s,opacity 0.15s;
    transition: background-color 0.15s,border-color 0.15s,opacity 0.15s;
    position: relative;
    line-height: 1.22857143;
    outline: 0;
    width: auto;
    max-width: 100%;
    min-width: 80px;
    padding: 0
}

._btn {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    padding: 0 8px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.btn > ._btn {
    margin: auto;
    transition: opacity 0.15s ease-in-out
}

.z__btn_oe {
    border: 1px solid var(--z__theme_br);
    font-size: 16px;
    background-color: transparent
}

.z__btn_oe:hover {
    background-color: var(--btn_bg_h);
    color: var(--btn_cr_h)
}

.z__btn_fl {
    background-color: var(--z__theme_bg);
    color: var(--btn_cr);
    font-size: 16px
}

.z__btn_fl:hover {
    background-color: var(--btn_bg_h)
}

.z__btn_fl:active,.z__btn_oe:active {
    background-color: var(--btn_bg_a)
}

.z__btn_dd {
    background-color: #696969;
    color: var(--z__white_cr);
    cursor: no-drop
}

.z__btn_dd:hover {
    background-color: #595959
}

.z__btn_lk {
    min-width: unset;
    background: none;
    color: #337ab7;
    box-shadow: none
}

.z__btn_lk:hover {
    text-decoration: underline
}

.z__btn_in {
    min-width: unset;
    background: transparent
}

.z__btn_in:active,.z__btn_in:hover {
    background: transparent
}

.z__btn_s1 {
    height: 40px;
    padding: 0 6px
}

.z__btn_s2 {
    height: 50px;
    padding: 0 6px
}

.z__btn_s3 {
    height: 60px;
    padding: 0 6px
}

.z__btn_s4 {
    height: 48px;
    padding: 0 6px;
    min-width: 160px
}

.z__btn_sw1 {
    box-shadow: rgba(50, 50, 93, 0.25) 0 2px 5px -1px, rgba(0, 0, 0, 0.3) 0 1px 3px -1px
}

.btn_svg_sw1 {
    filter: drop-shadow(0px 2px 3px rgba(0, 0, 0, 0.4))
}

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

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

.z__nav_cen_m {
    flex: 1
}

.z__nav_rig_m {
    flex: 0 0 auto
}

.z__nav_rig_cr {
    grid-column-gap: 16px
}

.z__theme_main {
}

.z__theme_cr {
}

.z__theme_btn {
    width: 40px!important;
    height: 40px!important;
    border-radius: 4px
}

.z__theme_btn:hover {
    background-color: var(--top_menu_hover)!important
}

.z__theme_btn:focus {
    outline: none
}

.z__theme_btn svg {
    width: 20px;
    height: 20px;
    fill: var(--z__primary_svg)
}

.z__help_main {
    display: block
}

.z__help_cr a {
    transition: background-color 0.1s linear,border-color 0.1s linear,color 0.1s linear;
    width: 40px;
    height: 40px;
    min-width: unset;
    position: relative;
    text-align: center;
    color: var(--z__primary_cr);
    padding: 0 6px;
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px
}

.z__help_cr a:hover {
    background-color: var(--top_menu_hover)
}

.z__help_cr a svg {
    width: 24px;
    height: 24px;
    fill: var(--z__primary_cr)
}

.z__reg_main {
    display: block
}

.user_reg__cr {
    grid-column-gap: 16px;
    grid-template-columns: 1fr 1fr;
    display: grid
}

.user_reg__cr1 {
    display: none
}

.z__login_btn,.z__signup_btn {
    transition: background-color 0.1s linear,border-color 0.1s linear,color 0.1s linear;
    background-color: var(--btn_log_bg);
    color: var(--btn_log_cr);
    justify-content: center;
    height: 40px;
    padding: 0 6px;
    outline: none;
    align-items: center;
    border: 2px solid transparent;
    border-radius: 4px;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-flex;
    max-width: 100%;
    min-width: 80px;
    font-weight: 600;
    margin: 0;
    font-size: 15px
}

.z__signup_btn {
    background-color: var(--z__theme_bg);
    color: var(--btn_cr)
}

.z__login_btn:hover {
    background-color: var(--btn_log_bg_h)
}

.z__signup_btn:hover {
    background-color: var(--btn_bg_h)
}

.z__signup_btn:active {
    background-color: var(--btn_bg_a)
}

@media only screen and (max-width: 767px) {
    .user_reg__cr {
        display:none
    }

    .user_reg__cr1 {
        display: block
    }
}

.z__user_main {
    position: relative
}

.user_pro__btn {
    width: 40px;
    height: 40px;
    background-color: #f1f1f1;
    border-radius: 50%;
    border: none
}

.user_pro__btn:active,.user_pro__btn:focus,.user_pro__btn:hover {
    background-color: var(--z__primary_bg)
}

.user_pro_btn__pr {
    height: 40px;
    width: 40px;
    border-radius: 50%;
    padding: 2px;
    margin: 0;
    background-size: 40px 40px;
    border: 0;
    pointer-events: none
}

.user_pro__m {
    display: none;
    position: absolute;
    background-color: var(--z__white_bg);
    border-radius: 4px;
    z-index: 1000;
    right: 0;
    top: calc(100% + 6px);
    box-shadow: 0 0 3px rgba(121,135,178,.12),0 6px 24px rgba(10,34,107,.08)
}

.user_pro__cr {
    width: 296px;
    display: flex;
    flex-direction: column
}

.user_profile__m {
    height: 96px;
    display: block;
    position: relative;
    border-bottom: 1px solid var(--z__primary_br)
}

.user_profile__cr {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    padding: 16px 24px
}

.user_icon__cr {
}

.user_name__cr {
    flex-grow: 1;
    margin-left: 12px;
    margin-right: 12px;
    overflow: hidden;
    text-align: start
}

.user_email__row,.user_name__row {
    display: block;
    max-width: 100%
}

.user_name__row {
    font-weight: 600
}

.user_email__row {
    font-size: 14px
}

.user_icon__m {
    border: 4px solid var(--z__primary_br);
    margin: auto;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    position: relative;
    overflow: hidden
}

.user_icon__pr {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover
}

.user_icon__big {
    width: 64px;
    height: 64px
}

.user_menu__m {
    padding-top: 8px;
    padding-bottom: 8px
}

.user_menu__m li,.user_menu__m ul {
    border: 0;
    list-style: none;
    margin: 0;
    padding: 0
}

.user_menu__row {
    width: 100%;
    height: 40px;
    padding: 6px 12px;
    text-align: start;
    transition: background-color 0.1s linear,border-color 0.1s linear,color 0.1s linear;
    outline: none;
    font-weight: 400;
    display: flex;
    flex-direction: row;
    -webkit-box-align: center;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    color: var(--z__primary_cr);
    background-color: var(--z__white_bg);
    font-size: 16px;
    cursor: pointer
}

.user_menu__row:hover {
    background-color: var(--top_menu_hover)
}

.user_menu__icon svg {
    width: 24px;
    height: 24px;
    fill: var(--z__primary_cr)
}

.user_menu__text {
    padding: 0 8px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

@media only screen and (max-width: 991px) {
    .z__nav_lef_m {
        flex:1
    }
}

@media only screen and (max-width: 767px) {
    .navbar-container {
        padding-left:12px;
        padding-right: 12px
    }

    .z__nav_lef_m {
        gap: 8px
    }

    .navbar-brand {
        margin-left: 10px;
        margin-right: 12px
    }
}

@media only screen and (max-width: 399px) {
    .z__theme_main {
        display:none
    }
}

@media only screen and (max-width: 349px) {
    .z__help_main {
        display:none
    }
}

.z_search_m {
}

.z_search_i {
}

.z_search_cr {
}

.z_seabox {
    display: flex;
    flex-direction: row;
    border: 1px solid var(--z__primary_br);
    background-color: var(--z__white_bg);
    border-radius: 4px;
    position: relative;
    height: 40px
}

.z_seabox1 {
    padding: 8px
}

.z_seacrinput {
    border: none;
    background: none;
    outline: none;
    padding: 10px 0;
    font-size: 15px;
    width: 100%;
    min-width: 100%;
    color: #555
}

.z_seabox3 {
    padding: 8px
}

.multiple-menu-li {
    padding: 0 12px 24px 0
}

.multiple-menu li a svg {
    width: 24px;
    height: 24px;
    fill: var(--z__theme_svg);
    margin: 0 8px
}

.footer_m {
    width: 100%;
    border-top: 1px solid var(--z__primary_br);
    font-size: 15px;
    line-height: 22px
}

.footer_i {
    margin: 0 auto
}

.footer_cr {
    display: flex;
    flex-direction: row;
    margin-bottom: 48px
}

.footer_column {
    border-top: none;
    flex-basis: 0;
    flex-grow: 1;
    margin: 0
}

.footer_column_h {
    display: flex;
    justify-content: space-between;
    padding: 48px 0 0
}

.footer_column_h svg {
    height: 35px;
    width: 100px;
    fill: var(--z__theme_svg)
}

.footer_column_h svg:hover {
    fill: var(--logo_h);
    transition: 200ms;
    transition-timing-function: ease-in-out;
}

.footer_column_h h4 {
    font-size: 18px;
    font-weight: 600;
}

.footer_column_ul {
    margin: 16px 0;
    padding-bottom: 0;
    padding-right: 16px;
    list-style: none;
    padding: 0 0 8px
}

.footer_column_li:not(:last-child) {
    margin-bottom: 8px
}

.footer_column_li p {
    color: var(--z__anchor_cr);
    font-weight: 400;
    margin: 0
}

.footer_column_li p a {
    transition: color 0.2s;
    color: inherit
}

.footer_column_li p a:hover {
    color: var(--z__anchor_cr_h);
}

.footer_cr1 {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 24px 0;
    flex-direction: row;
    border-top: 1px solid var(--z__primary_br)
}

.footer_column1 {
    flex-basis: 0;
    flex-grow: 1;
    margin: 0
}

.footer_column1_lang {
    grid-gap: 8px;
    grid-auto-flow: column;
    justify-content: flex-start;
    white-space: nowrap
}

.lang__main {
    position: relative
}

.btn_language {
    min-width: 120px;
    height: 40px;
    border: 1px solid;
    border-color: var(--z__primary_br);
    border-radius: 4px;
    font-weight: 400;
    padding: 0 6px;
    gap: 8px
}

.btn_language:active,.btn_language:focus,.btn_language:hover {
    border-color: var(--z__theme_br)
}

.btn_language .language_icon {
    width: 24px;
    height: 24px;
    fill: var(--z__primary_svg)
}

.btn_language .dropdown_icon {
    width: 18px;
    height: 18px;
    fill: var(--z__primary_svg)
}

.lang__m {
    display: none;
    position: absolute;
    background-color: var(--z__white_bg);
    z-index: 1000;
    left: 0;
    bottom: calc(100% + 6px);
    box-shadow: 0 0 3px rgba(121,135,178,.12),0 6px 24px rgba(10,34,107,.08)
}

.lang__cr {
    max-height: 500px;
    overflow-y: scroll;
    min-width: 160px;
    padding: 4px 0;
    margin: 0;
    list-style: none;
    text-align: left;
    border-radius: 4px;
    border: 1px solid var(--z__primary_br);
    background-color: var(--z__white_bg)
}

.lang__cr li a {
    font-size: 15px;
    margin-bottom: 1px;
    margin-top: 1px;
    font-weight: 400;
    display: block;
    padding: 4px 12px;
    white-space: nowrap;
    color: var(--z__primary_cr)
}

.lang__cr li a:hover {
    background-color: var(--lang_menu_bg_h)
}

.footer_column1_rights {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-grow: 3
}

.footer_column1_rights p {
    margin: 0 0 8px
}

.footer_column1_social {
    display: flex;
    justify-content: flex-end
}

.footer_column1_social a {
    height: 24px;
    width: 24px
}

.footer_column1_social a:not(:last-child) {
    margin-right: 8px
}

.footer_column1_social span {
    align-items: center;
    box-sizing: border-box;
    display: inline-flex;
    height: 24px;
    width: 24px
}

@media only screen and (max-width: 991px) {
    .footer_cr {
        flex-direction:column
    }

    .footer_cr1 {
        flex-direction: column
    }

    .footer_column1_rights {
        order: 3;
        flex-direction: column-reverse
    }

    .footer_margin_row {
        margin-top: 16px
    }
}

.tooltip {
    --_tooltip_Bg: var(--_tooltip_bg);
    --_tooltip_Br_Rs: 4px;
    --_tooltip_pa: 8px 8px;
    --_tooltip_wi: auto;
    --_tooltip_wi_min: 100%;
    --_tooltip_wi_max: 164px;
    --_tooltip_arr_wi: 12px;
    position: relative;
    isolation: isolate;
    cursor: pointer;
    z-index: 999
}

.tooltip::after,.tooltip::before {
    position: absolute;
    top: 0;
    left: 50%;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s linear
}

.tooltip::before {
    content: attr(data-tooltip);
    padding: var(--_tooltip_pa);
    width: var(--_tooltip_wi);
    min-width: var(--_tooltip_wi_min);
    max-width: var(--_tooltip_wi_max);
    color: var(--_tooltip_cr);
    text-align: center;
    font-size: 80%;
    text-transform: none;
    background-color: var(--_tooltip_Bg);
    border-radius: var(--_tooltip_Br_Rs);
    transform: translate(-50%, calc(-100% + var(--_tooltip_arr_wi) * -1))
}

.tooltip::after {
    content: "";
    width: var(--_tooltip_arr_wi);
    aspect-ratio: 1;
    background-color: var(--_tooltip_Bg);
    -webkit-clip-path: polygon(44% 100%, 0 44%, 100% 44%);
    clip-path: polygon(44% 100%, 0 44%, 100% 44%);
    transform: translate(-50%, calc(-100% + var(--_tooltip_arr_wi) / 2 * -1))
}

.tooltip:hover::after,.tooltip:hover::before {
    opacity: 1;
    visibility: visible
}

.tooltip--right::after,.tooltip--right::before {
    left: auto;
    right: 0;
    top: 50%
}

.tooltip--right::before {
    transform: translate(calc(100% + var(--_tooltip_arr_wi)), -50%)
}

.tooltip--right::after {
    -webkit-clip-path: polygon(50% 100%, 0 50%, 50% 0);
    clip-path: polygon(50% 100%, 0 50%, 50% 0);
    transform: translate(calc(100% + var(--_tooltip_arr_wi) / 2), -50%)
}

.tooltip--bottom::after,.tooltip--bottom::before {
    top: auto;
    bottom: 0
}

.tooltip--bottom::before {
    transform: translate(-50%, calc(100% + var(--_tooltip_arr_wi)))
}

.tooltip--bottom::after {
    -webkit-clip-path: polygon(100% 54%, 0 54%, 54% 0);
    clip-path: polygon(100% 54%, 0 54%, 54% 0);
    transform: translate(-50%, calc(100% + var(--_tooltip_arr_wi) / 2))
}

.tooltip--left::after,.tooltip--left::before {
    top: 50%;
    left: 0
}

.tooltip--left::before {
    transform: translate(calc(-100% + var(--_tooltip_arr_wi) * -1), -50%)
}

.tooltip--left::after {
    -webkit-clip-path: polygon(100% 50%, 50% 0, 50% 100%);
    clip-path: polygon(100% 50%, 50% 0, 50% 100%);
    transform: translate(calc(-100% + var(--_tooltip_arr_wi) / 2 * -1), -50%)
}

.noti_m {
    color: var(--z__white_cr);
    background-color: var(--z__theme_bg);
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 9999;
    min-height: 32px;
    font-size: 15px;
    display: flex;
    justify-content: center;
    align-items: center
}

.noti_i {
}

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

.btn_top_notification {
    background-color: transparent;
    font-weight: 500!important
}

.btn_top_notification:hover {
    text-decoration: underline!important
}

.z__hide {
    display: none!important
}

.transparent {
    background: transparent
}

.z__mt5 {
    margin-top: 5px
}

.z__mt10 {
    margin-top: 10px
}

.z__mt15 {
    margin-top: 15px
}

.z__mt20 {
    margin-top: 20px
}

.z__mt25 {
    margin-top: 25px
}

.z__mr5 {
    margin-right: 5px
}

.z__mr10 {
    margin-right: 10px
}

.z__mr15 {
    margin-right: 15px
}

.z__mr20 {
    margin-right: 20px
}

.z__mr25 {
    margin-right: 25px
}

.z__mb5 {
    margin-bottom: 5px
}

.z__mb10 {
    margin-bottom: 10px
}

.z__mb15 {
    margin-bottom: 15px
}

.z__mb20 {
    margin-bottom: 20px
}

.z__mb25 {
    margin-bottom: 25px
}

.z__ml5 {
    margin-left: 5px
}

.z__ml10 {
    margin-left: 10px
}

.z__ml15 {
    margin-left: 15px
}

.z__ml20 {
    margin-left: 20px
}

.z__ml25 {
    margin-left: 25px
}

.z__pa2 {
    padding: 2px
}

.z__pa4 {
    padding: 4px
}

.z__pt2 {
    padding-top: 2px
}

.z__br_rs0 {
    border-radius: 0!important
}

.z__br_rs4 {
    border-radius: 4px
}

.cookie_m {
    position: fixed;
    bottom: 30px;
    left: 30px;
    background-color: var(--z__white_bg);
    padding: 20px 30px;
    border-radius: 8px;
    box-shadow: rgba(0, 0, 0, 0.24) 0 3px 8px
}

.cookie_i {
}

.cookie_cr {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 180px;
    max-width: 320px
}

.cookie_cr1 {
}

.cookie_cr1 .div1 {
    font-size: 16px
}

.cookie_cr1 .div2 {
    font-size: 14px
}

.cookie_cr1 .div2 a:hover {
    text-decoration: underline
}

.cookie_cr1 .div3 {
    display: flex;
    justify-content: flex-end
}

.cookie_clo_cr {
    position: absolute;
    top: 6px;
    right: 10px
}

.btn_coo_clo svg {
    width: 20px;
    height: 20px;
    fill: var(--z__close_svg)
}

.btn_coo_clo:hover svg {
    fill: var(--z__close_svg_h)
}

@keyframes btn-bouncedelay {
    0%,80%,to {
        transform: scale(0)
    }

    40% {
        transform: scale(1)
    }
}

.z__btn_spinner {
    height: 24px;
    max-width: 50px;
    display: flex;
    align-items: center;
    justify-content: center
}

.z__btn_spinner > div {
    width: 12px;
    height: 12px;
    background-color: #fff;
    border-radius: 100%;
    display: inline-block;
    animation: btn-bouncedelay 1.4s infinite ease-in-out both;
    animation-delay: 0s
}

.z__btn_spinner .z__btn_bounce1 {
    animation-delay: -.32s
}

.z__btn_spinner .z__btn_bounce2 {
    animation-delay: -.16s
}

.pageprogress {
    position: absolute;
    width: 70%;
    height: 2px;
    top: 0;
    left: 0;
    background-color: var(--z__theme_bg);
    pointer-events: none;
    transition: width 0.4s ease-out 0s
}
</style>
<style>
.popup_m {
    position: fixed;
    display: flex;
    flex-direction: column;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1030
}

.popup_background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(9, 30, 66, 0.54) none repeat scroll 0 0
}

.popup_i {
}

.popup_cr {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.popup_cr1 {
    position: absolute;
    right: 8px;
    top: 6px
}

.popup_cr_clo_cr {
}

.btn_popup_close {
    max-height: 32px;
    max-width: 32px;
    min-height: 32px;
    min-width: 32px;
    transition: background-color 0.1s linear,border-color 0.1s linear,color 0.1s linear;
    border-radius: 50%
}

.btn_popup_close svg {
    height: 24px;
    width: 24px;
    fill: var(--z__close_svg)
}

.btn_popup_close:hover svg {
    fill: var(--z__close_svg_h)
}

.d_m {
    width: 100%;
    max-width: 100%;
    background-color: var(--z__white_bg);
    text-align: center;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 0 0 1px rgba(9, 30, 66, 0.08), 0 2px 1px rgba(9, 30, 66, 0.08), 0 0 20px -6px rgba(9, 30, 66, 0.31)
}

.d_i {
}

.d_cr {
    display: flex;
    flex-direction: row;
    gap: 8px;
    min-width: 640px
}

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

.d_cr2 {
    flex: 3
}

.d_cr1_m {
}

.d_cr1_cr {
}

.d_cr1_hr {
}

.d_cr1_by {
    font-size: 16px;
    margin: 8px 0
}

.d_cr2_m {
    text-align: left
}

.d_cr2_cr {
}

.d_cr2_hr {
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 12px
}

.d_cr2_by {
    font-size: 16px
}

@media (max-width: 767px) {
    .d_m {
        max-height:580px;
        overflow-y: scroll
    }

    .d_cr {
        min-width: 384px;
        flex-direction: column-reverse
    }
}

@media (max-width: 499px) {
    .d_cr {
        min-width:284px
    }
}

@media (max-width: 399px) {
    .d_cr {
        min-width:220px
    }
}

@media (max-width: 349px) {
    .d_m {
        padding:20px
    }

    .d_cr {
        min-width: 180px
    }
}
</style>
<style>
.snackbar_m {
    visibility: hidden;
    max-width: 300px;
    min-width: 300px;
    margin-left: -150px;
    background-color: var(--z__white_bg);
    color: var(--z__primary_cr);
    padding: 20px 16px;
    position: fixed;
    left: 50%;
    bottom: 30px;
    box-shadow: 0 0 3px rgba(121,135,178,.12),0 6px 24px rgba(10,34,107,.08);
    box-shadow: rgba(0, 0, 0, 0.24) 0 3px 8px;
    border: 1px solid var(--z__primary_br);
    z-index: 1005;
    border-radius: 8px
}

.snackbar_m.show {
    visibility: visible;
    -webkit-animation: fadein 0.5s,fadeout 0.5s 2.5s;
    animation: fadein 0.5s,fadeout 0.5s 2.5s
}

.snackbar_cr {
    display: flex;
    justify-content: center;
    gap: 12px;
    font-size: 16px
}

.snackbar_cr .snackbar_icon {
    padding: 2px 0
}

.snackbar_message {
}

.snackbar_h {
    font-weight: 500
}

.snackbar_des {
}

@-webkit-keyframes fadein {
    from {
        bottom: 0;
        opacity: 0
    }

    to {
        bottom: 30px;
        opacity: 1
    }
}

@keyframes fadein {
    from {
        bottom: 0;
        opacity: 0
    }

    to {
        bottom: 30px;
        opacity: 1
    }
}

@-webkit-keyframes fadeout {
    from {
        bottom: 30px;
        opacity: 1
    }

    to {
        bottom: 0;
        opacity: 0
    }
}

@keyframes fadeout {
    from {
        bottom: 30px;
        opacity: 1
    }

    to {
        bottom: 0;
        opacity: 0
    }
}

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

input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

.top_main {
    margin: 0 auto 40px
}

.top_inner {
}

.top_cr {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 24px;
    margin-left: 190px
}

.wo_m {
    flex: 3;
    width: 100%
}

.wo_i {
}

.heading_m {
    text-align: center;
    margin: 0 0 10px
}

.heading_i {
}

.top_g_ads_m {
    text-align: center
}

top_g_ads_i {
}

.wo_cr {
}

.rig_ads_m {
    width: 100%;
    flex: 1;
    display: flex;
    justify-content: center;
    margin-top: 12px;
}

.gads_bottom_m {
    margin-top: 20px;
    text-align: center
}

.gads_bottom_i {
    display: flex;
    justify-content: space-between;
    gap: 12px
}

.top_cr1 {
    position: sticky;
    bottom: 0
}

@media (max-width: 1049px) {
    .top_cr {
        margin-left:0
    }
}

@media (max-width: 850px) {
    .top_cr {
        flex-direction:column
    }

    .rig_ads_m {
        width: auto
    }

    .wo_cr_ads {
        display: none
    }
}

.top_g_ads_m,.rig_ads_m,.wo_cr_ads {
    display:
}

.sel_c_m {
    margin: 0 auto;
}

.sel_c_i {
}

.sel_c_cr {
    box-shadow: rgba(50, 50, 93, 0.25) 0 6px 12px -2px, rgba(0, 0, 0, 0.3) 0 3px 7px -3px;
    box-shadow: 0 0 3px rgba(121,135,178,.12),0 6px 24px rgba(10,34,107,.08);
    border: 0px solid var(--z__primary_br);
    padding: 16px;
    background-color: var(--sel_c_cr_bg);
}

.sel_c_cr1 {
    border: 2px solid #999;
    border-style: dashed;
    background-color: #c2ecee;
    background-color: var(--z__white_bg);
    min-height: 260px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    row-gap: 24px;
    cursor: pointer
}

.big_select_btn {
    height: 84px;
    width: auto;
    min-width: 340px;
    font-size: 28px;
    border-radius: 8px;
    color: var(--btn_cr);
    background-color: var(--z__theme_bg);
    box-shadow: rgba(50, 50, 93, 0.25) 0 6px 12px -2px, rgba(0, 0, 0, 0.3) 0 3px 7px -3px
}

.big_select_btn:hover {
    color: var(--btn_cr_h);
    background-color: var(--btn_bg_h)
}

.drop_file_cr {
    text-align: center;
    color: var(--z__secondary_cr)
}

@media (max-width: 619px) {
    .big_select_btn {
        max-width:220px
    }
}

@media (max-width: 419px) {
    .big_select_btn {
        min-width:220px;
        max-width: 220px
    }
}

.secure_m {
    display: flex;
    justify-content: center;
    align-items: center;
    grid-gap: 6px
}

.secure_icon {
    display: inline-flex;
    align-items: center
}

.secure_icon svg {
    width: 18px;
    height: 18px;
    fill: var(--z__secondary_svg)
}

.secure_txt {
    font-size: 15px;
    color: var(--z__secondary_cr)
}

.rating_m {
    margin-top: 20px;
    margin-bottom: 84px;
    text-align: center
}

.rating_i {
}

.rating_cr {
}

.rating_cr1 {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row
}

.rating_cr1 .rating_text {
    font-size: 16px;
    font-weight: 600
}

.rating_cr1 .rating_stars {
}

.rating_cr1 .rating_count {
    font-size: 16px
}

.ratebox {
    border: 0 solid;
    float: left;
    height: 46px;
    padding: 0 10px
}

.ratebox:not(:checked) > input {
    position: absolute;
    top: -9999px;
    display: none
}

.ratebox:not(:checked) > label {
    float: right;
    width: 30px;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    font-size: 30px;
    color: #ccc
}

.ratebox:not(:checked) > label:before {
    content: '★ '
}

.ratebox > input:checked ~ label {
    color: #ffc700
}

.ratebox:not(:checked) > label:hover,.ratebox:not(:checked) > label:hover ~ label {
    color: #deb217
}

.ratebox > input:checked + label:hover,.ratebox > input:checked + label:hover ~ label,.ratebox > input:checked ~ label:hover,.ratebox > input:checked ~ label:hover ~ label,.ratebox > label:hover ~ input:checked ~ label {
    color: #c59b08
}

.rating_cr2 {
}

.rating_cr2_m {
    max-width: 300px;
    margin: 0 auto
}

.rating_cr2_m .div1 {
}

.rating_cr2_m .div1 textarea {
    width: 100%;
    color: #555;
    border: 1px solid var(--z__primary_br);
    font-size: 15px;
    line-height: 1.42857143;
    padding: 6px 8px;
    border-radius: 4px;
    resize: vertical
}

.rating_cr2_m .div2 {
    display: flex
}

.rating_cr2_m .div2 button {
    height: 32px;
    font-size: 16px;
    font-weight: 500
}

.rating_cr3 {
}

.rating_cr3_m {
    max-width: 300px;
    margin: 0 auto
}

.rating_cr3_m .div1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px
}

@media (max-width: 767px) {
    .rating_cr1 {
        flex-direction:column
    }
}

.s_main {
    margin-bottom: 60px
}

.s_inner {
    max-width: 1288px;
    margin: 0 auto;
    width: 100%
}

.s_cr {
}

.s_cr_h {
    margin-bottom: 32px;
    text-align: center
}

.s_cr_h h2 {
}

.s_cr_ul {
    list-style: none;
    margin: 0 0 32px;
    padding: 0
}

.s_cr_li {
    flex: 1 1 0;
    margin-bottom: 32px
}

.s_cr_div {
    display: flex;
    flex-direction: column
}

.s_cr_div1 {
    flex: 1 1 0
}

.s_cr_div1_h {
    text-align: center
}

.s_cr_div1_h svg {
    width: 64px;
    height: 64px;
    fill: var(--z__theme_svg)
}

.s_cr_div1_h h3 {
    font-size: 24px
}

.s_cr_div1_b p {
    font-size: 16px;
    text-align: center
}

@media (min-width: 768px) {
    .s_cr_h {
        margin-bottom:64px;
        text-align: center
    }

    .s_cr_ul {
        display: flex;
        justify-content: center;
        margin-bottom: 0
    }

    .s_cr_li {
        margin-bottom: 0;
        max-width: 344px;
        min-width: 128px;
        padding: 0 32px
    }

    .s_cr_div1 {
        margin-bottom: 24px
    }

    .s_cr_div1_h {
        margin-bottom: 24px
    }

    .s_cr_div1_b {
        text-align: center
    }
}

.how_m {
    margin-bottom: 60px;
    background-color: rgba(64,87,109,.07);
    border: 1px solid #f7f8fc;
    border-radius: 16px;
    background-color: var(--z__white_bg);
    border: 1px solid var(--z__primary_br);
}

.how_i {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    padding: 60px 10px
}

.how_cr {
    color: var(--z__primary_cr)
}

.how_cr_i svg {
    height: 100px;
    width: 100px;
    fill: var(--z__theme_svg)
}

.how_cr_h {
}

.how_cr h2 {
    padding-left: 20px;
    font-size: 28px;
    font-weight: 600;
}

.how_cr ol {
    font-size: 16px;
    font-weight: 400
}

.how_cr ol li {
    padding: 6px 0
}

@media (max-width: 991px) {
    .how_i {
        flex-direction:column;
        gap: 40px
    }
}

.para_m {
    margin-bottom: 36px
}

.para_i {
}

.para_cr {
}

.para_cr h2 {
    font-size: 24px;
    font-weight: 600
}

.horizontal_line {
    border-top: 1px solid var(--z__primary_br);
    height: 1px;
    margin-bottom: 40px;
}

.btn_back,.btn_delete {
}

.btn_back svg,.btn_delete svg {
    width: 36px;
    height: 36px;
    fill: var(--z__theme_svg)
}

.btn_add_file__m svg,.btn_delete_file__m svg {
    width: 54px;
    height: 54px;
    fill: var(--z__theme_svg)
}

.btn_delete_file__d svg {
    width: 48px;
    height: 48px;
    fill: var(--z__theme_svg)
}

.btn_add_file__m svg:hover,.btn_back svg:hover,.btn_delete svg:hover,.btn_delete_file__d svg:hover,.btn_delete_file__m svg:hover {
    fill: var(--btn_bg_h)
}

.btn_back_dis svg {
    fill: #696969
}

.btn_back_dis:hover {
    cursor: no-drop
}

.quota_m {
    margin-bottom: 10px
}

.quota_cr {
    height: 300px;
    border: 1px solid var(--z__primary_br);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 12px
}

.quota_div1 {
    margin-bottom: 12px
}

.quota_div2 {
    font-size: 24px;
    font-weight: 500;
    color: var(--z__primary_cr)
}

.quota_div3 {
    color: #444
}

.quota_div4 {
    margin-top: 12px
}

.quota_retry_btn {
    width: 120px;
    height: 40px;
    font-weight: 500
}

.toa_m {
    position: fixed;
    top: 100px;
    right: 30px;
    border-radius: 4px;
    background-color: var(--z__white_bg);
    padding: 20px 24px;
    overflow: hidden;
    transform: translateX(calc(100% + 30px));
    transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.35);
    box-shadow: 0 0 3px rgba(121,135,178,.12),0 6px 24px rgba(10,34,107,.08)
}

.toa_m.active {
    transform: translateX(0%)
}

.toa_i {
}

.toa_cr {
    width: 280px
}

.toa_clo_cr {
    position: absolute;
    top: 6px;
    right: 10px
}

.btn_toa_clo svg {
    width: 20px;
    height: 20px;
    fill: var(--z__close_svg)
}

.btn_toa_clo:hover svg {
    fill: var(--z__close_svg_h)
}

.tos__cr_m {
    display: flex;
    align-items: center
}

.toa__icon_cr {
    display: flex;
    align-items: center
}

.toa__icon_cr svg {
    width: 40px;
    height: 40px
}

.toa__message_cr {
    display: flex;
    flex-direction: column;
    margin: 0 12px
}

.toa__message_cr .heading {
    font-weight: 600
}

.toa__message_cr .description {
    font-size: 15px
}

.toa__progress_m {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4px;
    width: 100%;
    background: #ddd
}

.toa__progress_m:before {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    height: 100%;
    width: 100%;
    background-color: var(--z__theme_bg)
}

.toa__progress_m.active:before {
    animation: toa__progress_m 5s linear forwards
}

@keyframes toa__progress_m {
    100% {
        right: 100%
    }
}

.LoadingSpinner > div {
    background-color: var(--z__theme_bg)
}

.upload__m {
    position: fixed;
    display: flex;
    flex-direction: column;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1030
}

.upload__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.72) none repeat scroll 0 0;
    pointer-events: none
}

.upload__cr {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60%
}

.upload_m {
    width: 100%;
    max-width: 100%;
    min-height: 40vh;
    background-color: var(--z__white_bg);
    text-align: center;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 0 0 1px rgba(9, 30, 66, 0.08), 0 2px 1px rgba(9, 30, 66, 0.08), 0 0 20px -6px rgba(9, 30, 66, 0.31)
}

.upload_cr {
    display: flex;
    flex-direction: column;
    align-items: center;
    grid-gap: 36px;
}

.upload_div1 {
    display: flex;
    flex-direction: column;
    grid-gap: 12px;
}

.upload_title {
    font-size: 28px;
    font-weight: 600;
}

.upload_filename {
}

.upload_per {
    display: flex;
    flex-direction: column
}

.upload_per .div1 {
    font-size: 48px;
    font-weight: 600
}

.upload_per .div2 {
    font-size: 24px;
    font-weight: 500
}

@media (max-width: 767px) {
    .upload__cr {
        width:88%
    }
}

.faq_m {
    margin-bottom: 84px
}

.faq_i {
}

.faq_cr {
    margin: 0 auto;
    padding: 40px;
    width: 80%
}

.faq_cr h2 {
    font-size: 28px
}

.accordion .accordion-item {
    border-bottom: 1px solid var(--z__primary_br)
}

.accordion .accordion-item button[aria-expanded=true] {
    border-bottom: 1px solid var(--z__primary_br)
}

.accordion button {
    position: relative;
    display: block;
    text-align: left;
    width: 100%;
    padding: 16px 22px 16px 0;
    color: var(--z__primary_cr);
    font-size: 16px;
    font-weight: 400;
    border: none;
    background: none;
    outline: none
}

.accordion button:focus::after,.accordion button:hover::after {
    cursor: pointer;
    color: #03b5d2;
    border: 1px solid #03b5d2
}

.accordion button .accordion-title {
    font-weight: 500;
    font-size: 18px;
    padding: 0
}

.accordion button .accordion-title:focus,.accordion button .accordion-title:hover {
    cursor: pointer;
    color: var(--z__theme_cr)!important
}

.accordion button .icon {
    display: inline-block;
    position: absolute;
    top: 20px;
    right: 0;
    width: 22px;
    height: 22px;
    border: 0 solid;
    border-radius: 22px
}

.accordion button .icon::before {
    display: block;
    position: absolute;
    content: "";
    top: 9px;
    left: 5px;
    width: 10px;
    height: 2px;
    background: currentColor
}

.accordion button .icon::after {
    display: block;
    position: absolute;
    content: "";
    top: 5px;
    left: 9px;
    width: 2px;
    height: 10px;
    background: currentColor
}

.accordion button[aria-expanded=true] {
    color: var(--z__theme_cr)
}

.accordion button[aria-expanded=true] .icon::after {
    width: 0
}

.accordion button[aria-expanded=true] + .accordion-content {
    opacity: 1;
    max-height: 200px;
    transition: all 200ms linear;
    will-change: opacity, max-height
}

.accordion .accordion-content {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity 200ms linear, max-height 200ms linear;
    will-change: opacity, max-height
}

.accordion .accordion-content p {
    font-weight: 400;
    font-size: 16px
}

@media only screen and (max-width: 991px) {
    .faq_cr {
        width:100%
    }
}

@media only screen and (max-width: 767px) {
    .faq_cr {
        padding:12px
    }
}

.cust_m {
    background-color: var(--z__white_bg);
    border: 1px solid var(--z__primary_br);
    margin-bottom: 12px
}

.cust_i {
}

.cust_cr {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    gap: 12px;
    padding: 8px
}

.cust__cr1 {
}

.cust__cr2 {
    display: flex;
    align-items: center
}

.gif-preivew-main {
    border: 1px solid var(--z__primary_br);
    background-color: var(--z__white_bg);
    margin-bottom: 12px;
}

.gif-preivew-area-main {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
    background-color: var(--z__white_bg);
    padding: 10px 0
}

.gif-setting-main {
    border: 1px solid var(--z__primary_br);
    border-radius: 8px;
    margin: 10px
}

.gif-setting-row {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 0;
    border: 0 solid
}

.gif-setting1 {
    border: 0 solid;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 5px 0
}

.setting-element-1 {
    width: 70px;
    padding: 0 10px;
}

.setting-element-2 {
    padding-left: 10px
}

.setting-element-3 {
    padding: 2px;
    width: 30px;
    color: var(--z__secondary_cr)
}

.setting-element-4 {
    padding: 0 10px
}

.setting-row-text {
    width: 60px;
    text-align: center;
    height: 40px;
}

@media (max-width: 420px) {
    .gif-setting-row {
        display:block;
        min-width: 260px
    }

    .gif-setting1 {
        display: block
    }

    .setting-element-1,.setting-element-2,.setting-element-3 {
        display: inline-flex
    }

    .setting-element-4 {
        display: flex;
        justify-content: center;
        margin-top: 20px
    }
}

.fil_pre_m {
    min-height: 300px;
    height: auto;
    border: 1px solid var(--z__primary_br);
    border-bottom: none;
    text-align: center;
}

.fil_pre_i {
}

.fil_pre_cr {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 10px 0
}

@media (min-width: 768px) {
    .sti_m {
        background-color:var(--z__white_bg);
        border: 2px solid var(--z__primary_br);
        position: sticky;
        bottom: 0;
        padding: 12px;
        z-index: 1001
    }

    .sti_i {
    }

    .sti_cr {
    }

    .sti_cr1 {
        display: none
    }

    .sti_cr2 {
        display: flex;
        justify-content: space-between;
        align-items: center
    }
}

@media (max-width: 767px) {
    .fil_pre_m {
        border-bottom:1px solid var(--z__primary_br)
    }

    .sti_m {
        z-index: 1001;
        border: none
    }

    .sti_cr1 {
        display: block;
        bottom: 90px;
        right: 16px;
        position: fixed;
        z-index: 1000
    }

    ._sti_cr1 {
        display: flex;
        flex-direction: column
    }

    .sti_cr2 {
        bottom: 25px;
        right: 16px;
        position: fixed;
        z-index: 1000
    }

    .sti_cr2 ._hide {
        display: none
    }
}

.card_m {
    width: 210px;
    height: 280px;
    position: relative;
    margin: 6px;
    border: 1px solid var(--z__white_br);
    background-color: var(--z__white_bg);
    color: var(--z__primary_cr);
    border-radius: 4px;
    box-shadow: 0 0 3px rgba(121,135,178,.12),0 6px 24px rgba(10,34,107,.08);
    text-align: center
}

.card_m:hover {
    background-color: var(--z__white_bg);
    transition: 0.4s
}

.card_cr {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%
}

.cc1 {
    position: absolute;
    top: 4px;
    right: 6px;
    left: 6px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 6px
}

.cc1 svg {
    pointer-events: none
}

.cc1_cr {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    gap: 6px
}

.cc1_fi__si {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    width: 86px
}

.__com_fn {
    width: 40px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    text-align: left;
    font-size: 14px
}

.__com_fs {
    font-size: 14px;
    width: 82px
}

.card__btn {
    min-width: unset;
    width: 28px;
    height: 28px;
    background-color: var(--z__white_bg);
    border-radius: 100%;
    padding: 2px;
    box-shadow: 0 1px 2px 0 rgba(115,115,115,.6)
}

.card__btn svg {
    width: 20px;
    height: 20px;
    fill: var(--z__primary_svg)
}

.card__btn:hover {
    background-color: var(--z__theme_bg)
}

.card__btn:hover svg {
    fill: #fff
}

.cc2 {
    width: 90%;
    height: 65%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.__com2 {
    position: absolute;
    top: 44px;
    height: 60%
}

.cc2_fi__sp > div {
    background-color: var(--z__theme_bg)
}

.cc2_fi__va {
}

.cc2_loading {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px
}

.cc2__loa_per {
    font-size: 30px;
    font-weight: 600
}

.cc2_fi__cr {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

.cc2_fi__pr {
    max-width: 100%;
    max-height: 100%;
    box-shadow: rgba(0, 0, 0, 0.24) 0 3px 8px
}

.__img_pdf2 {
    border: 1px solid var(--z__primary_br);
    width: 128px;
    height: 180px;
    display: flex;
    justify-content: center;
    align-items: center
}

.cc3 {
    position: absolute;
    bottom: 6px;
    width: 100%
}

.__com_ns {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 5px
}

.__com_con {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px
}

.cc3_fi__do button {
    width: 80%;
    height: 30px;
    font-size: 14px;
    background-color: var(--z__theme_bg);
    color: var(--btn_cr);
    border-radius: 4px
}

.cc3_fi__do button:hover {
    background-color: var(--btn_bg_h)
}

.cc3_fi__do button:active {
    background-color: var(--btn_bg_a)
}

.cc3_fi__na {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-size: 15px;
    padding: 4px 6px;
    width: 90%;
    margin: 0 auto
}

.cc3_pa__nu {
    font-size: 16px
}

.cc2_pa__cr {
    width: 100%
}

.cc2_pa__en {
    margin-top: 12px;
    margin-bottom: 12px
}

.cc2_pa__en input {
    width: 80%;
    height: 36px;
    border: 1px solid var(--z__primary_br);
    border-radius: 4px;
    font-size: 15px;
    text-align: center;
    outline: 0;
    padding: 0 6px;
    margin-bottom: 10px
}

.cc2_pa__en button {
    width: 60%;
    background-color: var(--z__theme_bg);
    color: var(--z__white_cr);
    padding: 6px 8px;
    font-size: 15px;
    cursor: pointer;
    border: none;
    border-radius: 4px;
    outline: 0
}

.cc1__flex_end {
    justify-content: flex-end
}

@media (max-width: 991px) {
    .card_m {
        width:240px;
        height: 320px
    }

    .__com_fn {
        width: 50px;
        font-size: 16px
    }

    .cc1_fi__si {
        font-size: 16px;
        width: 92px
    }

    .cc2_pa__en input {
        font-size: 16px
    }

    .cc2_pa__en button {
        font-size: 16px
    }

    .cc3 {
        bottom: 12px
    }

    .__com_con,.__com_ns {
        font-size: 16px;
        margin-bottom: 8px
    }

    .cc3_fi__do button {
        height: 32px;
        font-size: 16px
    }

    .cc3_fi__na,.cc3_pa__nu {
        font-size: 16px
    }
}

.z__btn_spinner_40 {
    height: 40px;
    max-width: 80px
}

.z__btn_spinner > .div1 {
    width: 24px;
    height: 24px;
    background-color: var(--z__theme_bg)
}

.load_m {
    margin-bottom: 40px
}

.load_i {
}

.load_cr {
}

.load_cr .load_main {
    height: 380px;
    text-align: center;
    color: var(--z__primary_cr);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px
}

.load_main .load_icon {
}

.load_main .load_heading {
    font-size: 32px
}

.load_main .load_text {
}

.fin_m {
    text-align: center;
    margin-bottom: 60px
}

.fin_i {
}

.fin_cr {
}

.fin_cr1 {
    font-size: 24px;
    margin: 0 0 30px 0;
    font-weight: 500
}

.fin_cr2 {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    gap: 12px;
    position: relative
}

.btn_download_big {
    min-width: 320px;
    height: 72px;
    font-size: 22px
}

@media (max-width: 479px) {
    .fin_m {
        margin-bottom: 72px;
    }

    .btn_download_big {
        width: 70%!important;
        min-width: 70%!important
    }

    .btn_back {
        position: absolute;
        top: 90px;
        left: 15%
    }

    .btn_delete {
        position: absolute;
        top: 90px;
        right: 15%
    }
}

.out_pre_m {
    margin-bottom: 24px;
    padding: 8px 0;
    border: 0 solid var(--z__primary_br);
    text-align: center
}

.out_pre_cr {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 10px 0
}

.final_scr_pre_cr {
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

.image-preview-container {
    width: 250px;
    height: 180px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border: 1px solid var(--z__primary_br)
}

.image-preview-display {
    max-width: 100%;
    max-height: 100%
}

.rating_fin_m {
    position: fixed;
    bottom: 30px;
    right: 30px;
    background-color: var(--z__white_bg);
    padding: 20px 30px;
    border-radius: 8px;
    box-shadow: rgba(0, 0, 0, 0.24) 0 3px 8px;
    z-index: 1001
}

.rating_fin_i {
}

.rating_fin_cr {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 180px;
    min-width: 320px
}

.rating_fin_cr1 {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column
}

.rating_now_text {
    font-size: 16px;
    font-weight: 600
}

.rating_stars {
}

.rating_count {
    font-size: 16px
}

.rating_fin_cr2 {
    width: 100%
}

.rating_feedback_m {
}

.rating_feedback_m .div1 {
    margin: 10px 0
}

.rating_feedback_m .div1 textarea {
    width: 100%;
    height: 100px;
    color: #555;
    border: 1px solid var(--z__primary_br);
    font-size: 15px;
    line-height: 1.42857143;
    padding: 6px 8px;
    border-radius: 4px;
    resize: vertical
}

.rating_feedback_m .div2 {
    display: flex
}

.rating_feedback_m .div2 button {
    height: 32px;
    font-size: 16px;
    font-weight: 500
}

.rating_fin_cr3 {
}

.rating_thank_m {
}

.rating_thank_m .div1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px
}

.rating_clo_cr {
    position: absolute;
    top: 6px;
    right: 10px
}

.btn_rat_clo svg {
    width: 20px;
    height: 20px;
    fill: var(--z__close_svg)
}

.btn_rat_clo:hover svg {
    fill: var(--z__close_svg_h)
}

@media (max-width: 419px) {
    .rating_fin_cr {
        min-width: 240px;
    }
}

@media (max-width: 349px) {
    .rating_fin_cr {
        min-width: 200px;
    }
}

.do_sh_m {
    background-color: var(--z__white_bg);
    padding: 40px 32px;
    max-width: 780px;
    margin: 0 auto;
    box-shadow: 0 0 3px rgba(121,135,178,.12),0 6px 24px rgba(10,34,107,.08);
    border-radius: 8px
}

.do_sh_i {
}

.do_sh_cr {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 32px
}

.do_sh_first {
    display: flex;
    flex-direction: column;
    gap: 12px;
    text-align: center;
    background-color: var(--z__secondary_bg);
    padding: 12px;
    border-radius: 8px;
    flex: 2
}

.do_sh_second {
    border: 1px solid var(--z__primary_br);
    border-radius: 8px;
    padding: 12px;
    flex: 2;
    display: flex;
    justify-content: center;
    align-items: center
}

.do_text_cr {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px
}

.sh_text_cr {
    color: var(--z__secondary_cr);
    padding: 0 12px
}

.do_text_cr h4,.sh_text_cr h4 {
    font-size: 20px
}

.sh_text_cr span {
    font-size: 16px
}

.sh_icon_cr {
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px
}

.sh_icon_cr:hover {
    cursor: pointer
}

@media (max-width: 767px) {
    .do_sh_cr {
        flex-direction:column
    }
}
