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

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, textarea, select, button {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font: inherit;
    vertical-align: baseline;
    font-family: 'Vazir', Tahoma, sans-serif;

}

html {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

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

ol, ul {
    list-style: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

blockquote, q {
    quotes: none
}

blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none
}

a {
    text-decoration: none
}

figure {
    margin: 0
}

button, [role="button"], input[type="submit"] {
    cursor: pointer
}

input[type="text"], textarea {
    -moz-appearance: none;
    -webkit-appearance: none
}

button {
    background-color: transparent;
    box-shadow: none
}

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText
}

.container {
    position: relative;
    margin: 0 auto
}

.row {
    position: relative;
    font-size: 0;
    margin: 0 -15px -30px
}

.row--flex {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.row--0 {
    margin: 0
}

.row--10 {
    margin: 0 -10px -20px
}

@media only screen and (max-width: 500px) {
    .row--10-xs {
        margin: 0 -5px -10px
    }
}

.row--10-15 {
    margin: 0 -10px -15px
}

.row--10-30 {
    margin: 0 -10px -30px
}

@media only screen and (max-width: 500px) {
    .row--10-30 {
        margin-bottom: -15px
    }
}

.row--10-50 {
    margin: 0 -10px -50px
}

@media only screen and (max-width: 500px) {
    .row--10-50 {
        margin-bottom: -15px
    }
}

.row--15-80 {
    margin: 0 -15px -80px
}

@media only screen and (max-width: 500px) {
    .row--15-80 {
        margin-bottom: -15px
    }
}

.row--35 {
    margin: 0 -35px -30px
}

.row--30 {
    margin: 0 -30px -30px
}

.row--20-0 {
    margin: 0 -20px 0
}

.row--lowwidth {
    max-width: 66.375rem;
    margin: 0 auto
}

[class*="col-"] {
    display: inline-block;
    vertical-align: top;
    position: relative;
    font-size: 1rem;
    padding: 0 15px;
    margin-bottom: 30px
}

@media only screen and (max-width: 500px) {
    [class*="col-"] {
        margin-bottom: 15px
    }
}

.row--0 > [class*="col-"] {
    padding: 0;
    margin: 0
}

.row--10 > [class*="col-"] {
    padding: 0 10px;
    margin-bottom: 20px
}

@media only screen and (max-width: 500px) {
    .row--10-xs > [class*="col-"] {
        padding: 0 5px;
        margin-bottom: 10px
    }
}

.row--10-15 > [class*="col-"] {
    padding: 0 10px;
    margin-bottom: 15px
}

.row--10-30 > [class*="col-"] {
    padding: 0 10px;
    margin-bottom: 30px
}

@media only screen and (max-width: 500px) {
    .row--10-30 > [class*="col-"] {
        margin-bottom: 15px
    }
}

.row--10-50 > [class*="col-"] {
    padding: 0 10px;
    margin-bottom: 50px
}

@media only screen and (max-width: 500px) {
    .row--10-50 > [class*="col-"] {
        margin-bottom: 15px
    }
}

.row--15-80 > [class*="col-"] {
    padding: 0 15px;
    margin-bottom: 80px
}

@media only screen and (max-width: 500px) {
    .row--15-80 > [class*="col-"] {
        margin-bottom: 15px
    }
}

.row--20-0 > [class*="col-"] {
    padding: 0 20px;
    margin-bottom: 0
}

.row--35 > [class*="col-"] {
    padding: 0 35px;
    margin-bottom: 30px
}

@media only screen and (max-width: 500px) {
    .row--35 > [class*="col-"] {
        margin-bottom: 15px
    }
}

.row--30 > [class*="col-"] {
    padding: 0 30px;
    margin-bottom: 30px
}

@media only screen and (max-width: 500px) {
    .row--30 > [class*="col-"] {
        margin-bottom: 15px
    }
}

.row--stretch > [class*="col-"] {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch
}

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

.col-xs-pull-1 {
    right: 4.16667%
}

.col-xs-push-1 {
    left: 4.16667%
}

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

.col-xs-pull-2 {
    right: 8.33333%
}

.col-xs-push-2 {
    left: 8.33333%
}

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

.col-xs-pull-3 {
    right: 12.5%
}

.col-xs-push-3 {
    left: 12.5%
}

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

.col-xs-pull-4 {
    right: 16.66667%
}

.col-xs-push-4 {
    left: 16.66667%
}

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

.col-xs-pull-5 {
    right: 20.83333%
}

.col-xs-push-5 {
    left: 20.83333%
}

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

.col-xs-pull-6 {
    right: 25%
}

.col-xs-push-6 {
    left: 25%
}

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

.col-xs-pull-7 {
    right: 29.16667%
}

.col-xs-push-7 {
    left: 29.16667%
}

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

.col-xs-pull-8 {
    right: 33.33333%
}

.col-xs-push-8 {
    left: 33.33333%
}

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

.col-xs-pull-9 {
    right: 37.5%
}

.col-xs-push-9 {
    left: 37.5%
}

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

.col-xs-pull-10 {
    right: 41.66667%
}

.col-xs-push-10 {
    left: 41.66667%
}

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

.col-xs-pull-11 {
    right: 45.83333%
}

.col-xs-push-11 {
    left: 45.83333%
}

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

.col-xs-pull-12 {
    right: 50%
}

.col-xs-push-12 {
    left: 50%
}

.col-xs-13 {
    width: 54.16667%
}

.col-xs-pull-13 {
    right: 54.16667%
}

.col-xs-push-13 {
    left: 54.16667%
}

.col-xs-14 {
    width: 58.33333%
}

.col-xs-pull-14 {
    right: 58.33333%
}

.col-xs-push-14 {
    left: 58.33333%
}

.col-xs-15 {
    width: 62.5%
}

.col-xs-pull-15 {
    right: 62.5%
}

.col-xs-push-15 {
    left: 62.5%
}

.col-xs-16 {
    width: 66.66667%
}

.col-xs-pull-16 {
    right: 66.66667%
}

.col-xs-push-16 {
    left: 66.66667%
}

.col-xs-17 {
    width: 70.83333%
}

.col-xs-pull-17 {
    right: 70.83333%
}

.col-xs-push-17 {
    left: 70.83333%
}

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

.col-xs-pull-18 {
    right: 75%
}

.col-xs-push-18 {
    left: 75%
}

.col-xs-19 {
    width: 79.16667%
}

.col-xs-pull-19 {
    right: 79.16667%
}

.col-xs-push-19 {
    left: 79.16667%
}

.col-xs-20 {
    width: 83.33333%
}

.col-xs-pull-20 {
    right: 83.33333%
}

.col-xs-push-20 {
    left: 83.33333%
}

.col-xs-21 {
    width: 87.5%
}

.col-xs-pull-21 {
    right: 87.5%
}

.col-xs-push-21 {
    left: 87.5%
}

.col-xs-22 {
    width: 91.66667%
}

.col-xs-pull-22 {
    right: 91.66667%
}

.col-xs-push-22 {
    left: 91.66667%
}

.col-xs-23 {
    width: 95.83333%
}

.col-xs-pull-23 {
    right: 95.83333%
}

.col-xs-push-23 {
    left: 95.83333%
}

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

.col-xs-pull-24 {
    right: 100%
}

.col-xs-push-24 {
    left: 100%
}

.col-xs-pull-0 {
    right: auto
}

.col-xs-push-0 {
    left: auto
}

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

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

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

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

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

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

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

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

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

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

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

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

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

.col-xs-offset-13 {
    margin-left: 54.16667%
}

.col-xs-offset-14 {
    margin-left: 58.33333%
}

.col-xs-offset-15 {
    margin-left: 62.5%
}

.col-xs-offset-16 {
    margin-left: 66.66667%
}

.col-xs-offset-17 {
    margin-left: 70.83333%
}

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

.col-xs-offset-19 {
    margin-left: 79.16667%
}

.col-xs-offset-20 {
    margin-left: 83.33333%
}

.col-xs-offset-21 {
    margin-left: 87.5%
}

.col-xs-offset-22 {
    margin-left: 91.66667%
}

.col-xs-offset-23 {
    margin-left: 95.83333%
}

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

@media only screen and (min-width: 501px) {
    .col-sm-1 {
        width: 4.16667%
    }

    .col-sm-pull-1 {
        right: 4.16667%
    }

    .col-sm-push-1 {
        left: 4.16667%
    }

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

    .col-sm-pull-2 {
        right: 8.33333%
    }

    .col-sm-push-2 {
        left: 8.33333%
    }

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

    .col-sm-pull-3 {
        right: 12.5%
    }

    .col-sm-push-3 {
        left: 12.5%
    }

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

    .col-sm-pull-4 {
        right: 16.66667%
    }

    .col-sm-push-4 {
        left: 16.66667%
    }

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

    .col-sm-pull-5 {
        right: 20.83333%
    }

    .col-sm-push-5 {
        left: 20.83333%
    }

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

    .col-sm-pull-6 {
        right: 25%
    }

    .col-sm-push-6 {
        left: 25%
    }

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

    .col-sm-pull-7 {
        right: 29.16667%
    }

    .col-sm-push-7 {
        left: 29.16667%
    }

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

    .col-sm-pull-8 {
        right: 33.33333%
    }

    .col-sm-push-8 {
        left: 33.33333%
    }

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

    .col-sm-pull-9 {
        right: 37.5%
    }

    .col-sm-push-9 {
        left: 37.5%
    }

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

    .col-sm-pull-10 {
        right: 41.66667%
    }

    .col-sm-push-10 {
        left: 41.66667%
    }

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

    .col-sm-pull-11 {
        right: 45.83333%
    }

    .col-sm-push-11 {
        left: 45.83333%
    }

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

    .col-sm-pull-12 {
        right: 50%
    }

    .col-sm-push-12 {
        left: 50%
    }

    .col-sm-13 {
        width: 54.16667%
    }

    .col-sm-pull-13 {
        right: 54.16667%
    }

    .col-sm-push-13 {
        left: 54.16667%
    }

    .col-sm-14 {
        width: 58.33333%
    }

    .col-sm-pull-14 {
        right: 58.33333%
    }

    .col-sm-push-14 {
        left: 58.33333%
    }

    .col-sm-15 {
        width: 62.5%
    }

    .col-sm-pull-15 {
        right: 62.5%
    }

    .col-sm-push-15 {
        left: 62.5%
    }

    .col-sm-16 {
        width: 66.66667%
    }

    .col-sm-pull-16 {
        right: 66.66667%
    }

    .col-sm-push-16 {
        left: 66.66667%
    }

    .col-sm-17 {
        width: 70.83333%
    }

    .col-sm-pull-17 {
        right: 70.83333%
    }

    .col-sm-push-17 {
        left: 70.83333%
    }

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

    .col-sm-pull-18 {
        right: 75%
    }

    .col-sm-push-18 {
        left: 75%
    }

    .col-sm-19 {
        width: 79.16667%
    }

    .col-sm-pull-19 {
        right: 79.16667%
    }

    .col-sm-push-19 {
        left: 79.16667%
    }

    .col-sm-20 {
        width: 83.33333%
    }

    .col-sm-pull-20 {
        right: 83.33333%
    }

    .col-sm-push-20 {
        left: 83.33333%
    }

    .col-sm-21 {
        width: 87.5%
    }

    .col-sm-pull-21 {
        right: 87.5%
    }

    .col-sm-push-21 {
        left: 87.5%
    }

    .col-sm-22 {
        width: 91.66667%
    }

    .col-sm-pull-22 {
        right: 91.66667%
    }

    .col-sm-push-22 {
        left: 91.66667%
    }

    .col-sm-23 {
        width: 95.83333%
    }

    .col-sm-pull-23 {
        right: 95.83333%
    }

    .col-sm-push-23 {
        left: 95.83333%
    }

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

    .col-sm-pull-24 {
        right: 100%
    }

    .col-sm-push-24 {
        left: 100%
    }

    .col-sm-pull-0 {
        right: auto
    }

    .col-sm-push-0 {
        left: auto
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

    .col-sm-offset-13 {
        margin-left: 54.16667%
    }

    .col-sm-offset-14 {
        margin-left: 58.33333%
    }

    .col-sm-offset-15 {
        margin-left: 62.5%
    }

    .col-sm-offset-16 {
        margin-left: 66.66667%
    }

    .col-sm-offset-17 {
        margin-left: 70.83333%
    }

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

    .col-sm-offset-19 {
        margin-left: 79.16667%
    }

    .col-sm-offset-20 {
        margin-left: 83.33333%
    }

    .col-sm-offset-21 {
        margin-left: 87.5%
    }

    .col-sm-offset-22 {
        margin-left: 91.66667%
    }

    .col-sm-offset-23 {
        margin-left: 95.83333%
    }

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

@media only screen and (min-width: 801px) {
    .col-md-1 {
        width: 4.16667%
    }

    .col-md-pull-1 {
        right: 4.16667%
    }

    .col-md-push-1 {
        left: 4.16667%
    }

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

    .col-md-pull-2 {
        right: 8.33333%
    }

    .col-md-push-2 {
        left: 8.33333%
    }

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

    .col-md-pull-3 {
        right: 12.5%
    }

    .col-md-push-3 {
        left: 12.5%
    }

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

    .col-md-pull-4 {
        right: 16.66667%
    }

    .col-md-push-4 {
        left: 16.66667%
    }

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

    .col-md-pull-5 {
        right: 20.83333%
    }

    .col-md-push-5 {
        left: 20.83333%
    }

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

    .col-md-pull-6 {
        right: 25%
    }

    .col-md-push-6 {
        left: 25%
    }

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

    .col-md-pull-7 {
        right: 29.16667%
    }

    .col-md-push-7 {
        left: 29.16667%
    }

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

    .col-md-pull-8 {
        right: 33.33333%
    }

    .col-md-push-8 {
        left: 33.33333%
    }

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

    .col-md-pull-9 {
        right: 37.5%
    }

    .col-md-push-9 {
        left: 37.5%
    }

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

    .col-md-pull-10 {
        right: 41.66667%
    }

    .col-md-push-10 {
        left: 41.66667%
    }

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

    .col-md-pull-11 {
        right: 45.83333%
    }

    .col-md-push-11 {
        left: 45.83333%
    }

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

    .col-md-pull-12 {
        right: 50%
    }

    .col-md-push-12 {
        left: 50%
    }

    .col-md-13 {
        width: 54.16667%
    }

    .col-md-pull-13 {
        right: 54.16667%
    }

    .col-md-push-13 {
        left: 54.16667%
    }

    .col-md-14 {
        width: 58.33333%
    }

    .col-md-pull-14 {
        right: 58.33333%
    }

    .col-md-push-14 {
        left: 58.33333%
    }

    .col-md-15 {
        width: 62.5%
    }

    .col-md-pull-15 {
        right: 62.5%
    }

    .col-md-push-15 {
        left: 62.5%
    }

    .col-md-16 {
        width: 66.66667%
    }

    .col-md-pull-16 {
        right: 66.66667%
    }

    .col-md-push-16 {
        left: 66.66667%
    }

    .col-md-17 {
        width: 70.83333%
    }

    .col-md-pull-17 {
        right: 70.83333%
    }

    .col-md-push-17 {
        left: 70.83333%
    }

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

    .col-md-pull-18 {
        right: 75%
    }

    .col-md-push-18 {
        left: 75%
    }

    .col-md-19 {
        width: 79.16667%
    }

    .col-md-pull-19 {
        right: 79.16667%
    }

    .col-md-push-19 {
        left: 79.16667%
    }

    .col-md-20 {
        width: 83.33333%
    }

    .col-md-pull-20 {
        right: 83.33333%
    }

    .col-md-push-20 {
        left: 83.33333%
    }

    .col-md-21 {
        width: 87.5%
    }

    .col-md-pull-21 {
        right: 87.5%
    }

    .col-md-push-21 {
        left: 87.5%
    }

    .col-md-22 {
        width: 91.66667%
    }

    .col-md-pull-22 {
        right: 91.66667%
    }

    .col-md-push-22 {
        left: 91.66667%
    }

    .col-md-23 {
        width: 95.83333%
    }

    .col-md-pull-23 {
        right: 95.83333%
    }

    .col-md-push-23 {
        left: 95.83333%
    }

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

    .col-md-pull-24 {
        right: 100%
    }

    .col-md-push-24 {
        left: 100%
    }

    .col-md-pull-0 {
        right: auto
    }

    .col-md-push-0 {
        left: auto
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

    .col-md-offset-13 {
        margin-left: 54.16667%
    }

    .col-md-offset-14 {
        margin-left: 58.33333%
    }

    .col-md-offset-15 {
        margin-left: 62.5%
    }

    .col-md-offset-16 {
        margin-left: 66.66667%
    }

    .col-md-offset-17 {
        margin-left: 70.83333%
    }

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

    .col-md-offset-19 {
        margin-left: 79.16667%
    }

    .col-md-offset-20 {
        margin-left: 83.33333%
    }

    .col-md-offset-21 {
        margin-left: 87.5%
    }

    .col-md-offset-22 {
        margin-left: 91.66667%
    }

    .col-md-offset-23 {
        margin-left: 95.83333%
    }

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

@media only screen and (min-width: 1051px) {
    .col-lg-1 {
        width: 4.16667%
    }

    .col-lg-pull-1 {
        right: 4.16667%
    }

    .col-lg-push-1 {
        left: 4.16667%
    }

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

    .col-lg-pull-2 {
        right: 8.33333%
    }

    .col-lg-push-2 {
        left: 8.33333%
    }

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

    .col-lg-pull-3 {
        right: 12.5%
    }

    .col-lg-push-3 {
        left: 12.5%
    }

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

    .col-lg-pull-4 {
        right: 16.66667%
    }

    .col-lg-push-4 {
        left: 16.66667%
    }

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

    .col-lg-pull-5 {
        right: 20.83333%
    }

    .col-lg-push-5 {
        left: 20.83333%
    }

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

    .col-lg-pull-6 {
        right: 25%
    }

    .col-lg-push-6 {
        left: 25%
    }

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

    .col-lg-pull-7 {
        right: 29.16667%
    }

    .col-lg-push-7 {
        left: 29.16667%
    }

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

    .col-lg-pull-8 {
        right: 33.33333%
    }

    .col-lg-push-8 {
        left: 33.33333%
    }

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

    .col-lg-pull-9 {
        right: 37.5%
    }

    .col-lg-push-9 {
        left: 37.5%
    }

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

    .col-lg-pull-10 {
        right: 41.66667%
    }

    .col-lg-push-10 {
        left: 41.66667%
    }

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

    .col-lg-pull-11 {
        right: 45.83333%
    }

    .col-lg-push-11 {
        left: 45.83333%
    }

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

    .col-lg-pull-12 {
        right: 50%
    }

    .col-lg-push-12 {
        left: 50%
    }

    .col-lg-13 {
        width: 54.16667%
    }

    .col-lg-pull-13 {
        right: 54.16667%
    }

    .col-lg-push-13 {
        left: 54.16667%
    }

    .col-lg-14 {
        width: 58.33333%
    }

    .col-lg-pull-14 {
        right: 58.33333%
    }

    .col-lg-push-14 {
        left: 58.33333%
    }

    .col-lg-15 {
        width: 62.5%
    }

    .col-lg-pull-15 {
        right: 62.5%
    }

    .col-lg-push-15 {
        left: 62.5%
    }

    .col-lg-16 {
        width: 66.66667%
    }

    .col-lg-pull-16 {
        right: 66.66667%
    }

    .col-lg-push-16 {
        left: 66.66667%
    }

    .col-lg-17 {
        width: 70.83333%
    }

    .col-lg-pull-17 {
        right: 70.83333%
    }

    .col-lg-push-17 {
        left: 70.83333%
    }

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

    .col-lg-pull-18 {
        right: 75%
    }

    .col-lg-push-18 {
        left: 75%
    }

    .col-lg-19 {
        width: 79.16667%
    }

    .col-lg-pull-19 {
        right: 79.16667%
    }

    .col-lg-push-19 {
        left: 79.16667%
    }

    .col-lg-20 {
        width: 83.33333%
    }

    .col-lg-pull-20 {
        right: 83.33333%
    }

    .col-lg-push-20 {
        left: 83.33333%
    }

    .col-lg-21 {
        width: 87.5%
    }

    .col-lg-pull-21 {
        right: 87.5%
    }

    .col-lg-push-21 {
        left: 87.5%
    }

    .col-lg-22 {
        width: 91.66667%
    }

    .col-lg-pull-22 {
        right: 91.66667%
    }

    .col-lg-push-22 {
        left: 91.66667%
    }

    .col-lg-23 {
        width: 95.83333%
    }

    .col-lg-pull-23 {
        right: 95.83333%
    }

    .col-lg-push-23 {
        left: 95.83333%
    }

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

    .col-lg-pull-24 {
        right: 100%
    }

    .col-lg-push-24 {
        left: 100%
    }

    .col-lg-pull-0 {
        right: auto
    }

    .col-lg-push-0 {
        left: auto
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

    .col-lg-offset-13 {
        margin-left: 54.16667%
    }

    .col-lg-offset-14 {
        margin-left: 58.33333%
    }

    .col-lg-offset-15 {
        margin-left: 62.5%
    }

    .col-lg-offset-16 {
        margin-left: 66.66667%
    }

    .col-lg-offset-17 {
        margin-left: 70.83333%
    }

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

    .col-lg-offset-19 {
        margin-left: 79.16667%
    }

    .col-lg-offset-20 {
        margin-left: 83.33333%
    }

    .col-lg-offset-21 {
        margin-left: 87.5%
    }

    .col-lg-offset-22 {
        margin-left: 91.66667%
    }

    .col-lg-offset-23 {
        margin-left: 95.83333%
    }

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

@media only screen and (min-width: 1401px) {
    .col-xlg-1 {
        width: 4.16667%
    }

    .col-xlg-pull-1 {
        right: 4.16667%
    }

    .col-xlg-push-1 {
        left: 4.16667%
    }

    .col-xlg-2 {
        width: 8.33333%
    }

    .col-xlg-pull-2 {
        right: 8.33333%
    }

    .col-xlg-push-2 {
        left: 8.33333%
    }

    .col-xlg-3 {
        width: 12.5%
    }

    .col-xlg-pull-3 {
        right: 12.5%
    }

    .col-xlg-push-3 {
        left: 12.5%
    }

    .col-xlg-4 {
        width: 16.66667%
    }

    .col-xlg-pull-4 {
        right: 16.66667%
    }

    .col-xlg-push-4 {
        left: 16.66667%
    }

    .col-xlg-5 {
        width: 20.83333%
    }

    .col-xlg-pull-5 {
        right: 20.83333%
    }

    .col-xlg-push-5 {
        left: 20.83333%
    }

    .col-xlg-6 {
        width: 25%
    }

    .col-xlg-pull-6 {
        right: 25%
    }

    .col-xlg-push-6 {
        left: 25%
    }

    .col-xlg-7 {
        width: 29.16667%
    }

    .col-xlg-pull-7 {
        right: 29.16667%
    }

    .col-xlg-push-7 {
        left: 29.16667%
    }

    .col-xlg-8 {
        width: 33.33333%
    }

    .col-xlg-pull-8 {
        right: 33.33333%
    }

    .col-xlg-push-8 {
        left: 33.33333%
    }

    .col-xlg-9 {
        width: 37.5%
    }

    .col-xlg-pull-9 {
        right: 37.5%
    }

    .col-xlg-push-9 {
        left: 37.5%
    }

    .col-xlg-10 {
        width: 41.66667%
    }

    .col-xlg-pull-10 {
        right: 41.66667%
    }

    .col-xlg-push-10 {
        left: 41.66667%
    }

    .col-xlg-11 {
        width: 45.83333%
    }

    .col-xlg-pull-11 {
        right: 45.83333%
    }

    .col-xlg-push-11 {
        left: 45.83333%
    }

    .col-xlg-12 {
        width: 50%
    }

    .col-xlg-pull-12 {
        right: 50%
    }

    .col-xlg-push-12 {
        left: 50%
    }

    .col-xlg-13 {
        width: 54.16667%
    }

    .col-xlg-pull-13 {
        right: 54.16667%
    }

    .col-xlg-push-13 {
        left: 54.16667%
    }

    .col-xlg-14 {
        width: 58.33333%
    }

    .col-xlg-pull-14 {
        right: 58.33333%
    }

    .col-xlg-push-14 {
        left: 58.33333%
    }

    .col-xlg-15 {
        width: 62.5%
    }

    .col-xlg-pull-15 {
        right: 62.5%
    }

    .col-xlg-push-15 {
        left: 62.5%
    }

    .col-xlg-16 {
        width: 66.66667%
    }

    .col-xlg-pull-16 {
        right: 66.66667%
    }

    .col-xlg-push-16 {
        left: 66.66667%
    }

    .col-xlg-17 {
        width: 70.83333%
    }

    .col-xlg-pull-17 {
        right: 70.83333%
    }

    .col-xlg-push-17 {
        left: 70.83333%
    }

    .col-xlg-18 {
        width: 75%
    }

    .col-xlg-pull-18 {
        right: 75%
    }

    .col-xlg-push-18 {
        left: 75%
    }

    .col-xlg-19 {
        width: 79.16667%
    }

    .col-xlg-pull-19 {
        right: 79.16667%
    }

    .col-xlg-push-19 {
        left: 79.16667%
    }

    .col-xlg-20 {
        width: 83.33333%
    }

    .col-xlg-pull-20 {
        right: 83.33333%
    }

    .col-xlg-push-20 {
        left: 83.33333%
    }

    .col-xlg-21 {
        width: 87.5%
    }

    .col-xlg-pull-21 {
        right: 87.5%
    }

    .col-xlg-push-21 {
        left: 87.5%
    }

    .col-xlg-22 {
        width: 91.66667%
    }

    .col-xlg-pull-22 {
        right: 91.66667%
    }

    .col-xlg-push-22 {
        left: 91.66667%
    }

    .col-xlg-23 {
        width: 95.83333%
    }

    .col-xlg-pull-23 {
        right: 95.83333%
    }

    .col-xlg-push-23 {
        left: 95.83333%
    }

    .col-xlg-24 {
        width: 100%
    }

    .col-xlg-pull-24 {
        right: 100%
    }

    .col-xlg-push-24 {
        left: 100%
    }

    .col-xlg-pull-0 {
        right: auto
    }

    .col-xlg-push-0 {
        left: auto
    }

    .col-xlg-offset-0 {
        margin-left: 0%
    }

    .col-xlg-offset-1 {
        margin-left: 4.16667%
    }

    .col-xlg-offset-2 {
        margin-left: 8.33333%
    }

    .col-xlg-offset-3 {
        margin-left: 12.5%
    }

    .col-xlg-offset-4 {
        margin-left: 16.66667%
    }

    .col-xlg-offset-5 {
        margin-left: 20.83333%
    }

    .col-xlg-offset-6 {
        margin-left: 25%
    }

    .col-xlg-offset-7 {
        margin-left: 29.16667%
    }

    .col-xlg-offset-8 {
        margin-left: 33.33333%
    }

    .col-xlg-offset-9 {
        margin-left: 37.5%
    }

    .col-xlg-offset-10 {
        margin-left: 41.66667%
    }

    .col-xlg-offset-11 {
        margin-left: 45.83333%
    }

    .col-xlg-offset-12 {
        margin-left: 50%
    }

    .col-xlg-offset-13 {
        margin-left: 54.16667%
    }

    .col-xlg-offset-14 {
        margin-left: 58.33333%
    }

    .col-xlg-offset-15 {
        margin-left: 62.5%
    }

    .col-xlg-offset-16 {
        margin-left: 66.66667%
    }

    .col-xlg-offset-17 {
        margin-left: 70.83333%
    }

    .col-xlg-offset-18 {
        margin-left: 75%
    }

    .col-xlg-offset-19 {
        margin-left: 79.16667%
    }

    .col-xlg-offset-20 {
        margin-left: 83.33333%
    }

    .col-xlg-offset-21 {
        margin-left: 87.5%
    }

    .col-xlg-offset-22 {
        margin-left: 91.66667%
    }

    .col-xlg-offset-23 {
        margin-left: 95.83333%
    }

    .col-xlg-offset-24 {
        margin-left: 100%
    }
}

@media only screen and (min-width: 501px) {
    .visible-xs {
        display: none !important
    }
}

@media only screen and (min-width: 801px) {
    .visible-sm {
        display: none !important
    }
}

@media only screen and (min-width: 1051px) {
    .visible-md {
        display: none !important
    }
}

@media only screen and (min-width: 1401px) {
    .visible-lg {
        display: none !important
    }
}

@media only screen and (max-width: 500px) {
    .hidden-xs {
        display: none !important
    }
}

@media only screen and (max-width: 800px) {
    .hidden-sm {
        display: none !important
    }
}

@media only screen and (max-width: 1050px) {
    .hidden-md {
        display: none !important
    }
}

@media only screen and (max-width: 1400px) {
    .hidden-lg {
        display: none !important
    }
}

.section-bg, .rangeslider, .intro-image, .card-a__preview, .card-a__slider .swiper-slide, .card-b__img, .card-video__preview, .jumbotron-bg, .blog-post__img span, .gallery-item a, .card-festival__img, .card-post__bg, .card-post__avatar, .card-aparat__cover, .spin-slider__main, .branch-img span, .mlb-userinfo::before, .mlb-userinfo::after, .mlb-media, .mlp-cart::after, .mlp-cart::before, .compare-resize li, .compare-main li, .twitter-slide__avatar, .insta-slide__avatar i, .insta-slide__img i, .blog-introimg, .blog-writerimage, .blog-bannerimg, .blog-sliderimage, .blog-videoimage, .instaqoute-img span, .instaqoute-avatar, .support-bg, .faq-bg {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover
}

.gallery-play, .gallery-play svg, .card-post__play, .blog-videoplay {
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto
}

.intro--support .intro-nav .card-f__desc span, .card-agent__info svg, .card-post__info svg, .card-aparat__info svg, .card-properties b, .card-properties span, .branch-contact svg, .timelineslider-info b, .timelineslider-info span, .cat-slider__item svg, .social-banner__title span, .insta-slide__avatar i, .instaqoute-btn svg, .help-input .btn svg, .help-finalbtn .btn svg {
    display: inline-block;
    vertical-align: middle
}

.cart-bg, .list-filters__product button::before, .list-filters__product a::before, .loading-box {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
}

.container, .row, .checkbox, .radiobtn, .data-table, .spin-slider__arrow, .blog-content {
    zoom: 1
}

.container::after, .row::after, .checkbox::after, .radiobtn::after, .data-table::after, .spin-slider__arrow::after, .blog-content::after, .container before, .row before, .checkbox before, .radiobtn before, .data-table before, .spin-slider__arrow before, .blog-content before {
    content: "";
    display: table
}

.container::after, .row::after, .checkbox::after, .radiobtn::after, .data-table::after, .spin-slider__arrow::after, .blog-content::after {
    clear: both
}

.menu-item__main::after, .checkbox input, .radiobtn input {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
}

.header-nav > li > a::after, .header-nav > li > span::after, .header-nav > li > a::before, .header-nav > li > span::before, .footer-social a, .card-f--border:not(:last-of-type)::after, .sort-btn, .sort-btn svg, .tag, .tag svg, .gallery-play, .card-festival--past, .pagination-p__list a:hover, .pagination-p__prev, .pagination-p__next {
    transition: all .1s linear
}

.bg-grd-blue, .btn {
    background: #0078c8;
    background: linear-gradient(45deg, #0078c8 0%, #0032a0 100%)
}

.bg-grd-blue-green, .s-title {
    background: #0078c8;
    background: linear-gradient(-90deg, #0078c8 0%, #78be1e 100%)
}

.bg-grd-green {
    background: #55be5a;
    background: linear-gradient(135deg, #55be5a 0%, #1abeba 100%)
}

.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.hide {
    display: none !important
}

.show {
    display: block !important
}

.ltr {
    direction: ltr
}

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

.text-center {
    text-align: center
}

.text-right {
    text-align: right !important
}

.pull-left {
    float: left
}

.pull-right {
    float: right
}

.white {
    color: #fff !important
}

.white-7 {
    color: rgba(255, 255, 255, 0.7) !important
}

.gray-f7 {
    color: #F7f7f7 !important
}

.bg-black {
    background-color: #000 !important
}

.bg-f7 {
    background-color: #F7f7f7 !important
}

.bg-f4 {
    background-color: #F4F2F2 !important
}

.bg-e {
    background-color: #E6E6E6 !important
}

.bg-f0 {
    background-color: #F0F3F4 !important
}

.bg-blue-light {
    background-color: rgba(174, 215, 224, 0.11) !important
}

.bg-gray3 {
    background-color: #373737 !important
}

.bg-gray4 {
    background-color: #464646 !important
}

.bg-e {
    background-color: #E6E6E6 !important
}

[class*='max-'] {
    margin-left: auto;
    margin-right: auto
}

.max-xs1 {
    max-width: 39.375rem !important
}

.max-xs2 {
    max-width: 34.375rem !important
}

.max-md {
    max-width: 74.375rem !important
}

.max-md2 {
    max-width: 68.125rem !important
}

.max-md3 {
    max-width: 60rem !important
}

[data-full-vh] {
    height: 100vh
}

.pad-0 {
    padding-top: 0rem !important;
    padding-bottom: 0rem !important
}

.pad-xlg {
    padding-top: 15.625rem !important;
    padding-bottom: 15.625rem !important
}

@media only screen and (max-width: 800px) {
    .pad-xlg {
        padding-top: 12.5rem !important;
        padding-bottom: 12.5rem !important
    }
}

@media only screen and (max-width: 800px) {
    .pad-xlg {
        padding-top: 10rem !important;
        padding-bottom: 10rem !important
    }
}

@media only screen and (max-width: 500px) {
    .pad-xlg {
        padding-top: 6.25rem !important;
        padding-bottom: 6.25rem !important
    }
}

.pad-lg {
    padding-top: 8.4375rem !important;
    padding-bottom: 8.4375rem !important
}

@media only screen and (max-width: 800px) {
    .pad-lg {
        padding-top: 6.25rem !important;
        padding-bottom: 6.25rem !important
    }
}

@media only screen and (max-width: 500px) {
    .pad-lg {
        padding-top: 4.375rem !important;
        padding-bottom: 4.375rem !important
    }
}

.pad-md {
    padding-top: 6.875rem !important;
    padding-bottom: 6.875rem !important
}

@media only screen and (max-width: 800px) {
    .pad-md {
        padding-top: 5.625rem !important;
        padding-bottom: 5.625rem !important
    }
}

@media only screen and (max-width: 500px) {
    .pad-md {
        padding-top: 4.375rem !important;
        padding-bottom: 4.375rem !important
    }
}

.pad-md2 {
    padding-top: 5.625rem !important;
    padding-bottom: 5.625rem !important
}

@media only screen and (max-width: 800px) {
    .pad-md2 {
        padding-top: 4.375rem !important;
        padding-bottom: 4.375rem !important
    }
}

@media only screen and (max-width: 500px) {
    .pad-md2 {
        padding-top: 3.125rem !important;
        padding-bottom: 3.125rem !important
    }
}

.pb-10 {
    padding-bottom: .625rem !important
}

.pt-10 {
    padding-top: .625rem !important
}

.ptb-10 {
    padding-top: .625rem !important;
    padding-bottom: .625rem !important
}

.pr-10 {
    padding-right: .625rem !important
}

.pl-10 {
    padding-left: .625rem !important
}

.p-10 {
    padding: .625rem !important
}

.pb-20 {
    padding-bottom: 1.25rem !important
}

.pt-20 {
    padding-top: 1.25rem !important
}

.ptb-20 {
    padding-top: 1.25rem !important;
    padding-bottom: 1.25rem !important
}

.pr-20 {
    padding-right: 1.25rem !important
}

.pl-20 {
    padding-left: 1.25rem !important
}

.p-20 {
    padding: 1.25rem !important
}

.pb-30 {
    padding-bottom: 1.875rem !important
}

.pt-30 {
    padding-top: 1.875rem !important
}

.ptb-30 {
    padding-top: 1.875rem !important;
    padding-bottom: 1.875rem !important
}

.pr-30 {
    padding-right: 1.875rem !important
}

.pl-30 {
    padding-left: 1.875rem !important
}

.p-30 {
    padding: 1.875rem !important
}

.pb-40 {
    padding-bottom: 2.5rem !important
}

.pt-40 {
    padding-top: 2.5rem !important
}

.ptb-40 {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important
}

.pr-40 {
    padding-right: 2.5rem !important
}

.pl-40 {
    padding-left: 2.5rem !important
}

.p-40 {
    padding: 2.5rem !important
}

.pb-50 {
    padding-bottom: 3.125rem !important
}

.pt-50 {
    padding-top: 3.125rem !important
}

.ptb-50 {
    padding-top: 3.125rem !important;
    padding-bottom: 3.125rem !important
}

.pr-50 {
    padding-right: 3.125rem !important
}

.pl-50 {
    padding-left: 3.125rem !important
}

.p-50 {
    padding: 3.125rem !important
}

.pb-70 {
    padding-bottom: 4.375rem !important
}

.pt-70 {
    padding-top: 4.375rem !important
}

.ptb-70 {
    padding-top: 4.375rem !important;
    padding-bottom: 4.375rem !important
}

.pr-70 {
    padding-right: 4.375rem !important
}

.pl-70 {
    padding-left: 4.375rem !important
}

.p-70 {
    padding: 4.375rem !important
}

.mb-10 {
    margin-bottom: .625rem !important
}

.mt-10 {
    margin-top: .625rem !important
}

.mtb-10 {
    margin-top: .625rem !important;
    margin-bottom: .625rem !important
}

.mr-10 {
    margin-right: .625rem !important
}

.ml-10 {
    margin-left: .625rem !important
}

.m-10 {
    margin: .625rem !important
}

.mb-20 {
    margin-bottom: 1.25rem !important
}

.mt-20 {
    margin-top: 1.25rem !important
}

.mtb-20 {
    margin-top: 1.25rem !important;
    margin-bottom: 1.25rem !important
}

.mr-20 {
    margin-right: 1.25rem !important
}

.ml-20 {
    margin-left: 1.25rem !important
}

.m-20 {
    margin: 1.25rem !important
}

.mb-30 {
    margin-bottom: 1.875rem !important
}

.mt-30 {
    margin-top: 1.875rem !important
}

.mtb-30 {
    margin-top: 1.875rem !important;
    margin-bottom: 1.875rem !important
}

.mr-30 {
    margin-right: 1.875rem !important
}

.ml-30 {
    margin-left: 1.875rem !important
}

.m-30 {
    margin: 1.875rem !important
}

.mb-40 {
    margin-bottom: 2.5rem !important
}

.mt-40 {
    margin-top: 2.5rem !important
}

.mtb-40 {
    margin-top: 2.5rem !important;
    margin-bottom: 2.5rem !important
}

.mr-40 {
    margin-right: 2.5rem !important
}

.ml-40 {
    margin-left: 2.5rem !important
}

.m-40 {
    margin: 2.5rem !important
}

.mb-60 {
    margin-bottom: 3.75rem !important
}

.mt-60 {
    margin-top: 3.75rem !important
}

.mtb-60 {
    margin-top: 3.75rem !important;
    margin-bottom: 3.75rem !important
}

.mr-60 {
    margin-right: 3.75rem !important
}

.ml-60 {
    margin-left: 3.75rem !important
}

.m-60 {
    margin: 3.75rem !important
}

.mb-70 {
    margin-bottom: 4.375rem !important
}

.mt-70 {
    margin-top: 4.375rem !important
}

.mtb-70 {
    margin-top: 4.375rem !important;
    margin-bottom: 4.375rem !important
}

.mr-70 {
    margin-right: 4.375rem !important
}

.ml-70 {
    margin-left: 4.375rem !important
}

.m-70 {
    margin: 4.375rem !important
}

@font-face {
    font-family: IRANSansBold;
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/IRANSansWeb_Bold.eot");
    src: url("../fonts/IRANSansWeb_Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/IRANSansWeb_Bold.woff2") format("woff2"), url("../fonts/IRANSansWeb_Bold.woff") format("woff"), url("../fonts/IRANSansWeb_Bold.ttf") format("truetype")
}

@font-face {
    font-family: IRANSansMedium;
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/IRANSansWeb_Medium.eot");
    src: url("../fonts/IRANSansWeb_Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/IRANSansWeb_Medium.woff2") format("woff2"), url("../fonts/IRANSansWeb_Medium.woff") format("woff"), url("../fonts/IRANSansWeb_Medium.ttf") format("truetype")
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/IRANSansWeb.eot");
    src: url("../fonts/IRANSansWeb.eot?#iefix") format("embedded-opentype"), url("../fonts/IRANSansWeb.woff2") format("woff2"), url("../fonts/IRANSansWeb.woff") format("woff"), url("../fonts/IRANSansWeb.ttf") format("truetype")
}

@font-face {
    font-family: IRANSansLight;
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/IRANSansWeb_Light.eot");
    src: url("../fonts/IRANSansWeb_Light.eot?#iefix") format("embedded-opentype"), url("../fonts/IRANSansWeb_Light.woff2") format("woff2"), url("../fonts/IRANSansWeb_Light.woff") format("woff"), url("../fonts/IRANSansWeb_Light.ttf") format("truetype")
}

@font-face {
    font-family: IRANSansFaNum;
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/IRANSansWeb(FaNum).eot");
    src: url("../fonts/IRANSansWeb(FaNum).eot?#iefix") format("embedded-opentype"), url("../fonts/IRANSansWeb(FaNum).woff2") format("woff2"), url("../fonts/IRANSansWeb(FaNum).woff") format("woff"), url("../fonts/IRANSansWeb(FaNum).ttf") format("truetype")
}

@font-face {
    font-family: IRANSansFaNumMedium;
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/IRANSansWeb(FaNum)_Medium.eot");
    src: url("../fonts/IRANSansWeb(FaNum)_Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/IRANSansWeb(FaNum)_Medium.woff2") format("woff2"), url("../fonts/IRANSansWeb(FaNum)_Medium.woff") format("woff"), url("../fonts/IRANSansWeb(FaNum)_Medium.ttf") format("truetype")
}

.intro-desc i, .cart-item__subtitle span, .pagination-p__list a.active:link, .pagination-p__list a.active:visited, .mlp__title, .mlp__code var, .mlp__order--doing span, .social-banner__title span, .twitter-slide__name, .blog-text h1, .blog-text h2, .blog-text h3, .blog-text h4, .blog-text h5, .blog-text h6, .blog-text ul b, .blog-tags, .blog-advertisement .s-subtitle, .blog-resources, .blog-slidertitle, .pi-modal__model span:first-child {
    font-family: IRANSansBold, IRANSans, tahoma, arial
}

.h1, .intro .s-title, .card-b__title, .blog-introtitle h1, .h2, .s-title, .card-video__title, .page-productlist .intro-desc p, .help-title, .page-job .intro__title, .h3, .section-title, .intro-desc p, .newsletter-title, .card-a__title, .card-properties b, .page-job .section-resume__title, .h4, .page-header__title, .page-header__search input, .card-video__subtitle, .agency-title, .card-post--insta .card-post__title, .overview .card-f__title, .values .card-f__title, .timeline-title, .social-banner__title span, .social-banner__desc, .blog-bannertext, .blog-slidertitle, .page-job-list .intro__title, .support-card__title, .payment-title, .h5, .intro--product .s-subtitle, .intro--about .s-subtitle, .intro--productlist .s-subtitle, .intro--support .s-subtitle, .table-title, .login-title, .overview-quotetext, .customers-title, .header-nav > li > a, .header-nav > li > span, .footer-title, .intro-nav .card-f p, .intro--product .intro-nav .card-f b, .newsletter-form input, .search-catg__title, .search-main input, .cart-header__title, .cart-header__desc, .cart-item__title, .cart-item__current-price span, .cart-invoice__last-price var, .cart-payable__price var, .cart .btn-group .btn, .btn, .post h1, .post h2, .post h3, .post h4, .post h5, .post h6, .card-f__title, .card-f--vertical .card-f__title, .card-agent__title, .card-v__title, .filters-title, .filters-footer .btn, .filters-show span, .card-product__model, .card-product__energy span, .card-product__price-original span:first-child, .card-product__price--unavailable .card-product__price-original span:first-child, .tag, .blog-post__title, .blog-post__hover, .card-services__title, .card-post__title, .card-post--text .card-post__title, .card-post--insta .card-post__content, .card-post__text, .card-aparat__title, .list-filters__product button.active, .list-filters__product a.active, .branch-title, .pagination-p__filter span:not(:first-child), .mlb-steps button, .mlb-timer button, .mlp__code span, .mlp-cart__header span, .aparat-logo, .blog-sliderimage i, .pi-modal__subtitle, .pi-modal__price .pi-modal__price-value span:first-child, .pi-modal__product-price .pi-modal__price-value span:first-child, .pi-modal__btn .btn, .card-customers__title, .instaqoute--novideo .instaqoute-btn, .job-modal__title, .job-modal__apply .btn, .mlj-main__title, .help-input input, .help-input textarea, .support-faq__title, .faq-card__header, .page-job .description .card-f__title, .page-job .section-position .features .card-f__title, .page-job .section-position .btn--lg-position, .page-job .section-resume .btn-resume, .job-search .search-box__field .input input {
    font-family: IRANSansMedium, IRANSans, tahoma, arial
}

body, .page-header__search input, .cart-item__prices del span, .cart-prices__tax > span, .cart-prices__tax .tax-price var, .checkbox input:checked + i + span, .radiobtn input:checked + i + span, .select-text, .card-video__subtitle--lowsize, .card-product__price-original span:last-child, .card-product__price-discount span:first-child, .branch-content, .pagination-p__list a:link, .pagination-p__list a:visited, .custom-file__upload span, .custom-file__done span, .pf-modal__section div:nth-child(1), .pf-modal__section div:nth-child(2), .overview-quotetext, .overview .card-f__desc, .blog-tags a, .blog-bannertext, .blog-resources a, .pi-modal__title, .pi-modal__select-color > span, .pi-modal__price span:first-child, .pi-modal__product-price span:first-child, .page-productlist .intro-desc button, .page-agents .info-window::after, .page-retailers .info-window::after, .page-chains .info-window::after, .job-card__title, .job-card__apply .btn, .job-modal__tag span, .mlj-result p, .mlj-add span, .mlj-title, .help-title {
    font-family: IRANSansFaNum, IRANSans, tahoma, arial
}

.intro-desc span, .intro--product .intro-nav .card-f p, .intro .s-subtitle, .intro--product .s-subtitle span, .intro--about .s-subtitle span, .intro--productlist .s-subtitle span, .intro--support .s-subtitle span, .newsletter-text, .cart-item__subtitle, .cart-item__prices del, .cart-item__current-price, .cart-invoice__title .title-sum span, .cart-invoice__last-price span, .cart-prices__tax .tax-price span, .cart-prices__off .off-price span, .cart-payable__price span, .s-subtitle, .checkbox span, .radiobtn span, .page-job-list .filters-group .checkbox span, .page-job-list .filters-group .radiobtn span, .form-label, .select-label, .card-a__body, .card-b__content p, .card-f__desc, .card-agent__title span, .card-v__desc, .card-video__subtitle, .card-video__text--lowweight, .sort-info > span, .card-product__desc, .card-product__price-discount span:last-child, .card-product__price--unavailable .card-product__price-original span:last-child, .card-product__price-unavailable, .card-product--vertical .card-product__price-original span:last-child, .card-product--vertical .card-product__price--unavailable .card-product__price-original span:last-child, .jumbotron-footer .post, .agency-desc, .agency-content, .card-services__desc, .table-title, .table-col, .card-post--text .card-post__content, .card-post__name, .list-filters__clear span, .card-search__desc, .spin-slider__title, .card-category__text, .pagination-p__filter span:first-child, .mlb-userinfo li span, .mlb-timer > div span, .mlp__tracking-code span, .mlp__bank-code span, .custom-file__label > span, .visualization-content, .waterusage-text, .waterusage-info, .temperature-content, .overview-quotename span, .social-banner__title, .blog-advertext, .pi-modal__model span:last-child, .pi-modal__features > ul > li, .pi-modal__price .pi-modal__price-value span:last-child, .pi-modal__product-price .pi-modal__price-value span:last-child, .pi-modal__discount .pi-modal__price-value span:nth-child(2), .pi-modal__festival-discount .pi-modal__price-value span:nth-child(2), .card-customers__text, .customers-text, .instaqoute-job, .instaqoute-name, .instaqoute-text, .page-job-list .filters-group li > span, .job-card__desc, .job-modal__content p, .job-modal__content ul, .mlj-main__tag span, .help-input textarea, .help-subtitle, .help-captchatext, .faq-card__body, .page-job .intro__subtitle, .page-job .section-cooperation .card-video__text, .page-job .section-resume__desc, .job-search .search-box__field label, .job-search .search-box__field .input input::placeholder {
    font-family: IRANSansLight, IRANSans, tahoma, arial
}

.fa-num, .header-tel a span, .footer-copy span, .filters-group .checkbox input:checked + i + span, .filters-group .radiobtn input:checked + i + span, .filters-group .checkbox span, .filters-group .radiobtn span, .card-agent__tel, .sort-info, .filters-group li, .tag span, .blog-post__date, .card-post__info, .card-post__date, .card-aparat__info, .data-table .dataTables_paginate, .branch-contact, .pagination, .mlb-timer [data-mlb-timer], .inputnum input, .timelineslider-slide, .twitter-slide__info, .blog-writer, .pi-modal__features-title span, .pi-modal__features > ul > li span, .help-input input.tel, .help-status, .help-error, .help-errorpersian {
    font-family: IRANSansFaNum, IRANSans, tahoma, arial
}

.fa-num-md, .header-tel a, .intro--support .intro-nav .card-f__desc, .card-aparat__group, .card-aparat-details, .card-properties b, .waterusage-info i, .temperature-counter span, .timelineslider-info b, .blog-text ul i, .customers-text a {
    font-family: IRANSansFaNumMedium, IRANSans, tahoma, arial
}

.h1, .intro .s-title, .card-b__title, .blog-introtitle h1 {
    font-size: 2.25rem
}

@media only screen and (max-width: 1050px) {
    .h1, .intro .s-title, .card-b__title, .blog-introtitle h1 {
        font-size: 2rem
    }
}

@media only screen and (max-width: 800px) {
    .h1, .intro .s-title, .card-b__title, .blog-introtitle h1 {
        font-size: 1.75rem
    }
}

@media only screen and (max-width: 500px) {
    .h1, .intro .s-title, .card-b__title, .blog-introtitle h1 {
        font-size: 1.5rem
    }
}

.h2, .s-title, .card-video__title, .page-productlist .intro-desc p, .help-title, .page-job .intro__title {
    font-size: 2rem
}

@media only screen and (max-width: 1050px) {
    .h2, .s-title, .card-video__title, .page-productlist .intro-desc p, .help-title, .page-job .intro__title {
        font-size: 1.75rem
    }
}

@media only screen and (max-width: 800px) {
    .h2, .s-title, .card-video__title, .page-productlist .intro-desc p, .help-title, .page-job .intro__title {
        font-size: 1.5rem
    }
}

@media only screen and (max-width: 500px) {
    .h2, .s-title, .card-video__title, .page-productlist .intro-desc p, .help-title, .page-job .intro__title {
        font-size: 1.25rem
    }
}

.h3, .section-title, .intro-desc p, .newsletter-title, .card-a__title, .card-properties b, .page-job .section-resume__title {
    font-size: 1.875rem
}

@media only screen and (max-width: 1050px) {
    .h3, .section-title, .intro-desc p, .newsletter-title, .card-a__title, .card-properties b, .page-job .section-resume__title {
        font-size: 1.625rem
    }
}

@media only screen and (max-width: 800px) {
    .h3, .section-title, .intro-desc p, .newsletter-title, .card-a__title, .card-properties b, .page-job .section-resume__title {
        font-size: 1.375rem
    }
}

@media only screen and (max-width: 500px) {
    .h3, .section-title, .intro-desc p, .newsletter-title, .card-a__title, .card-properties b, .page-job .section-resume__title {
        font-size: 1.25rem
    }
}

.h4, .page-header__title, .page-header__search input, .card-video__subtitle, .agency-title, .card-post--insta .card-post__title, .overview .card-f__title, .values .card-f__title, .timeline-title, .social-banner__title span, .social-banner__desc, .blog-bannertext, .blog-slidertitle, .page-job-list .intro__title, .support-card__title, .payment-title {
    font-size: 1.5rem
}

@media only screen and (max-width: 1050px) {
    .h4, .page-header__title, .page-header__search input, .card-video__subtitle, .agency-title, .card-post--insta .card-post__title, .overview .card-f__title, .values .card-f__title, .timeline-title, .social-banner__title span, .social-banner__desc, .blog-bannertext, .blog-slidertitle, .page-job-list .intro__title, .support-card__title, .payment-title {
        font-size: 1.375rem
    }
}

@media only screen and (max-width: 800px) {
    .h4, .page-header__title, .page-header__search input, .card-video__subtitle, .agency-title, .card-post--insta .card-post__title, .overview .card-f__title, .values .card-f__title, .timeline-title, .social-banner__title span, .social-banner__desc, .blog-bannertext, .blog-slidertitle, .page-job-list .intro__title, .support-card__title, .payment-title {
        font-size: 1.25rem
    }
}

@media only screen and (max-width: 500px) {
    .h4, .page-header__title, .page-header__search input, .card-video__subtitle, .agency-title, .card-post--insta .card-post__title, .overview .card-f__title, .values .card-f__title, .timeline-title, .social-banner__title span, .social-banner__desc, .blog-bannertext, .blog-slidertitle, .page-job-list .intro__title, .support-card__title, .payment-title {
        font-size: 1.125rem
    }
}

.h5, .intro--product .s-subtitle, .intro--about .s-subtitle, .intro--productlist .s-subtitle, .intro--support .s-subtitle, .table-title, .login-title, .overview-quotetext, .customers-title {
    font-size: 1.375rem
}

@media only screen and (max-width: 1050px) {
    .h5, .intro--product .s-subtitle, .intro--about .s-subtitle, .intro--productlist .s-subtitle, .intro--support .s-subtitle, .table-title, .login-title, .overview-quotetext, .customers-title {
        font-size: 1.25rem
    }
}

@media only screen and (max-width: 800px) {
    .h5, .intro--product .s-subtitle, .intro--about .s-subtitle, .intro--productlist .s-subtitle, .intro--support .s-subtitle, .table-title, .login-title, .overview-quotetext, .customers-title {
        font-size: 1.125rem
    }
}

.h6, .card-a__subtitle, .card-product__header, .page-productlist .s-title, .job-card__title, .page-job .section-position .features .card-f__title, .payment-subtitle {
    font-size: 1.125rem
}

html {
    font-size: 16px
}

@media only screen and (max-width: 1367px) {
    html {
        font-size: 15px
    }
}

@media only screen and (max-width: 500px) {
    html {
        font-size: 14px
    }
}

@media only screen and (min-width: 2501px) {
    html {
        font-size: 18px
    }
}

body {
    font-size: 1rem;
    line-height: 1.7
}

body.menu-open, body.pi-modal-open, body.mlb-open, body.mlj-open, body.help-open, body.filter-open, body.cart-open, body.overflow-hidden {
    overflow-y: hidden
}

@media only screen and (min-width: 1051px) {
    .is-desktop body.menu-open, .is-desktop body.pi-modal-open, .is-desktop body.mlb-open, .is-desktop body.mlj-open, .is-desktop body.help-open, .is-desktop body.filter-open, .is-desktop body.cart-open, .is-desktop body.overflow-hidden {
        padding-right: 17px
    }
}

body::after {
    content: '';
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100vw;
    background: rgba(0, 0, 0, 0.5);
    z-index: 98;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s linear
}

@media only screen and (min-width: 1051px) {
    body::after {
        display: none
    }
}

body.filter-open::after, body.menu-open::after, body.overflow-hidden::after {
    opacity: 1;
    pointer-events: auto
}

body.menu-open::after {
    z-index: 99
}

.page {
    position: relative;
    padding-top: 5.3125rem;
    overflow-x: hidden;
    min-height: 100vh
}

@media only screen and (max-width: 800px) {
    .page {
        padding-top: 4.0625rem
    }
}

@media only screen and (max-width: 500px) {
    .page {
        padding-top: 4.0625rem
    }
}

html.rtl .page {
    direction: rtl;
    text-align: right
}

html.ltr .page {
    direction: ltr;
    text-align: left
}

.h-500 {
    height: 500px
}

.no-padding-x {
    padding-left: 0;
    padding-right: 0
}

.overflow-hidden {
    overflow: hidden
}

.d-none {
    display: none !important
}

@media only screen and (max-width: 600px) {
    .snowa-hidden-phone {
        display: none !important
    }
}

@media only screen and (max-width: 1050px) {
    .woot--bubble-holder .woot-widget-bubble.woot-elements--right.snowa-style {
        right: unset;
        left: 20px
    }
}

.woot--bubble-holder .woot-widget-bubble.woot-elements--right.snowa-style {
    bottom: 20px
}

@media only screen and (min-width: 600px) and (max-width: 992px) {
    .snowa-hidden-tablet {
        display: none !important
    }
}

@media only screen and (min-width: 993px) {
    .snowa-hidden-desktop {
        display: none !important
    }
}

@media only screen and (min-width: 1200px) {
    .snowa-hidden-desktop {
        display: none !important
    }
}

.section {
    overflow: hidden;
    position: relative
}

@media only screen and (max-width: 600px) {
    .section--gallery {
        padding-top: 300px
    }
}

.section-wrap {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 5rem;
    padding-bottom: 5rem;
    max-width: 74.375rem;
    margin: 0 auto;
    background-size: cover;
    background-repeat: no-repeat
}

@media only screen and (max-width: 800px) {
    .section-wrap {
        padding-top: 4.0625rem;
        padding-bottom: 4.0625rem
    }
}

@media only screen and (max-width: 500px) {
    .section-wrap {
        padding-top: 3.125rem;
        padding-bottom: 3.125rem
    }
}

.section-wrap--posr {
    position: relative
}

.section-wrap--lowpadtop {
    padding-top: 1.875rem
}

.intro--search .section-wrap {
    padding-bottom: 1.25rem
}

.section-header {
    text-align: center;
    margin-bottom: 4.0625rem
}

@media only screen and (max-width: 800px) {
    .section-header {
        margin-bottom: 3.125rem
    }
}

@media only screen and (max-width: 500px) {
    .section-header {
        margin-bottom: 1.875rem
    }
}

.intro--search .section-header {
    margin-bottom: 3.125rem
}

@media only screen and (max-width: 800px) {
    .intro--search .section-header {
        margin-bottom: 2.1875rem
    }
}

@media only screen and (max-width: 500px) {
    .intro--search .section-header {
        margin-bottom: 1.25rem
    }
}

.section-title, .section-subtitle {
    color: #666
}

.section-header--light .section-title, .section-header--light .section-subtitle {
    color: #fff
}

.section-subtitle {
    margin-top: .625rem;
    font-size: 1.125rem
}

@media only screen and (max-width: 500px) {
    .section-subtitle {
        font-size: 1rem;
        margin-top: .3125rem
    }
}

.section-subtitle--light {
    color: rgba(255, 255, 255, 0.8)
}

.section-body {
    position: relative;
    z-index: 2
}

.section-footer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 4.375rem
}

@media only screen and (max-width: 800px) {
    .section-footer {
        margin-top: 3.4375rem
    }
}

@media only screen and (max-width: 500px) {
    .section-footer {
        margin-top: 1.875rem
    }
}

.section-footer--column {
    -ms-flex-direction: column;
    flex-direction: column
}

.section-footer .btn:not(:first-child) {
    margin-right: .625rem
}

@media only screen and (max-width: 500px) {
    .section-footer .btn {
        margin-bottom: .625rem
    }
}

.section-bg {
    position: absolute;
    top: 0
}

@media only screen and (max-width: 1050px) {
    .section-bg {
        opacity: .5
    }
}

.section-bg--ref {
    right: 0;
    width: 27.625rem;
    height: 24.0625rem;
    -ms-transform: translate(25%, -30%);
    transform: translate(25%, -30%)
}

.section-bg--va {
    left: 0;
    width: 19.0625rem;
    height: 13.6875rem;
    -ms-transform: translate(-25%, 20%);
    transform: translate(-25%, 20%)
}

.section-bg--oven {
    right: 0;
    width: 31.1875rem;
    height: 18.375rem;
    -ms-transform: translate(30%, -15%);
    transform: translate(30%, -15%)
}

.section-bg--wm {
    left: 0;
    width: 39.625rem;
    height: 27.0625rem;
    -ms-transform: translate(-30%, 10%);
    transform: translate(-30%, 10%)
}

.section-bg--dw {
    right: 0;
    width: 37.5rem;
    height: 25rem;
    -ms-transform: translate(30%, -30%);
    transform: translate(30%, -30%)
}

.section-bg--mw {
    left: 0;
    width: 37.8125rem;
    height: 16.4375rem;
    -ms-transform: translate(-27%, 25%);
    transform: translate(-27%, 25%)
}

.section-loading {
    height: 25rem
}

.nice-select {
    position: relative;
    background-color: #fff;
    border: 1px solid #D6D6D6;
    cursor: pointer;
    height: 3rem;
    line-height: 3rem;
    transition: all 0.2s ease-in-out;
    border-radius: .3125rem;
    padding: 0 .9375rem 0 2.1875rem;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap
}

.nice-select:active, .nice-select.open, .nice-select:focus {
    border-color: #0078c8
}

.nice-select::after {
    content: '';
    position: absolute;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    height: .75rem;
    width: .75rem;
    pointer-events: none;
    left: .9375rem;
    top: 50%;
    margin-top: -.5rem;
    -ms-transform-origin: 66% 66%;
    transform-origin: 66% 66%;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: all 0.15s ease-in-out
}

.nice-select.open {
    border-radius: .3125rem .3125rem 0 0;
    border-bottom-color: transparent
}

.nice-select.open::after {
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg)
}

.nice-select.open .list {
    opacity: 1;
    pointer-events: auto;
    -ms-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0)
}

.nice-select.disabled {
    border-color: #ededed;
    color: #999;
    pointer-events: none
}

.nice-select.disabled:after {
    border-color: #fff
}

.nice-select .current {
    color: #766b6b;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
    display: inline-block
}

.factor .nice-select.open .current {
    color: #0078c8
}

.nice-select .list {
    position: absolute;
    width: calc(100% + 2px);
    top: 100%;
    left: -1px;
    background-color: #fff;
    border-width: 0 1px 1px 1px;
    border-color: #0078c8;
    border-style: solid;
    border-radius: 0 0 .3125rem .3125rem;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    -ms-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -ms-transform: scale(0.75) translateY(-21px);
    transform: scale(0.75) translateY(-21px);
    transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
    z-index: 9;
    overflow-y: auto;
    max-height: 420px
}

.nice-select .list:hover .option:not(:hover) {
    background-color: transparent !important
}

.nice-select .option {
    cursor: pointer;
    font-weight: 400;
    line-height: 40px;
    list-style: none;
    min-height: 40px;
    outline: none;
    padding: 0 .9375rem;
    transition: all 0.2s;
    margin-top: 0 !important;
    color: #5c5959
}

.nice-select .is-link .option {
    padding: 0
}

.nice-select .is-link .option a {
    padding: 0 .9375rem
}

.nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus {
    background: rgba(120, 190, 30, 0.14);
    background: linear-gradient(45deg, rgba(120, 190, 30, 0.14) 0%, rgba(30, 161, 241, 0.14) 100%)
}

.nice-select .option.disabled {
    background-color: transparent;
    color: #999;
    cursor: default
}

.nice-select .option::before {
    display: none
}

.nice-select .label {
    position: absolute;
    right: 0;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: 0 .9375rem;
    color: #999
}

.nice-select:focus .label {
    color: #0078c8
}

.no-csspointerevents .nice-select .list {
    display: none
}

.no-csspointerevents .nice-select.open .list {
    display: block
}

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

.swiper-container-no-flexbox .swiper-slide {
    float: left
}

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

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -ms-flexbox;
    display: flex;
    transition-property: transform;
    box-sizing: content-box
}

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

.swiper-container-multirow > .swiper-wrapper {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-free-mode > .swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto
}

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

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

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

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

.swiper-container-3d {
    perspective: 1200px
}

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

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

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

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

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

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

.swiper-container-wp8-horizontal, .swiper-container-wp8-horizontal > .swiper-wrapper {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.swiper-container-wp8-vertical, .swiper-container-wp8-vertical > .swiper-wrapper {
    -ms-touch-action: pan-x;
    touch-action: pan-x
}

.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 27px;
    height: 44px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    background-size: 27px 44px;
    background-position: center;
    background-repeat: no-repeat
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
    left: 10px;
    right: auto
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
    right: 10px;
    left: auto
}

.swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
}

.swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
}

.swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")
}

.swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")
}

.swiper-button-lock {
    display: none
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: .3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -ms-transform: scale(0.33);
    transform: scale(0.33);
    position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    -ms-transform: scale(1);
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    -ms-transform: scale(1);
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    -ms-transform: scale(0.66);
    transform: scale(0.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    -ms-transform: scale(0.33);
    transform: scale(0.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    -ms-transform: scale(0.66);
    transform: scale(0.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    -ms-transform: scale(0.33);
    transform: scale(0.33)
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: .2
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #007aff
}

.swiper-container-vertical > .swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0, -50%, 0)
}

.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 6px 0;
    display: block
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 8px
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    transition: .2s top, .2s -webkit-transform;
    transition: .2s transform, .2s top;
    transition: .2s transform, .2s top, .2s -webkit-transform
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 4px
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: .2s left, .2s -webkit-transform;
    transition: .2s transform, .2s left;
    transition: .2s transform, .2s left, .2s -webkit-transform
}

.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: .2s right, .2s -webkit-transform;
    transition: .2s transform, .2s right;
    transition: .2s transform, .2s right, .2s -webkit-transform
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, 0.25);
    position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: #007aff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -ms-transform: scale(0);
    transform: scale(0);
    -ms-transform-origin: left top;
    transform-origin: left top
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    -ms-transform-origin: right top;
    transform-origin: right top
}

.swiper-container-horizontal > .swiper-pagination-progressbar, .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-container-vertical > .swiper-pagination-progressbar {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-white .swiper-pagination-bullet-active {
    background: #fff
}

.swiper-pagination-progressbar.swiper-pagination-white {
    background: rgba(255, 255, 255, 0.25)
}

.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {
    background: #fff
}

.swiper-pagination-black .swiper-pagination-bullet-active {
    background: #000
}

.swiper-pagination-progressbar.swiper-pagination-black {
    background: rgba(0, 0, 0, 0.25)
}

.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {
    background: #000
}

.swiper-pagination-lock {
    display: none
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, 0.1)
}

.swiper-container-horizontal > .swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%
}

.swiper-container-vertical > .swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    left: 0;
    top: 0
}

.swiper-scrollbar-cursor-drag {
    cursor: move
}

.swiper-scrollbar-lock {
    display: none
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain
}

.swiper-slide-zoomed {
    cursor: move
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    -ms-transform-origin: 50%;
    transform-origin: 50%;
    animation: swiper-preloader-spin 1s steps(12, end) infinite
}

.swiper-lazy-preloader:after {
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-position: 50%;
    background-size: 100%;
    background-repeat: no-repeat
}

.swiper-lazy-preloader-white:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
}

@keyframes swiper-preloader-spin {
    100% {
        transform: rotate(360deg)
    }
}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity
}

.swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none
}

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

.swiper-container-cube {
    overflow: visible
}

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

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

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

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

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

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

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .6;
    filter: blur(50px);
    z-index: 0
}

.swiper-container-flip {
    overflow: visible
}

.swiper-container-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1
}

.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none
}

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

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

.swiper-container-coverflow .swiper-wrapper {
    -ms-perspective: 1200px
}

.swiper-pagination-bullet {
    width: .4375rem;
    height: .4375rem;
    display: inline-block;
    border-radius: 1px;
    background: #fff;
    opacity: .5;
    transition: .2s width ease-in-out
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 3px
}

.swiper-pagination-bullet-active {
    opacity: 1;
    width: 3rem
}

.swiper-button-prev, .swiper-button-next {
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 2px;
    background: #fff;
    background-image: none !important;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);
    margin: 0;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.swiper-button-prev svg, .swiper-button-next svg {
    position: relative;
    width: .75rem;
    height: 1.125rem;
    fill: #b3b3b3;
    z-index: 2
}

.fpslider {
    position: absolute !important;
    right: 0;
    left: 0;
    top: 0;
    padding: 0 15px
}

@media only screen and (min-width: 801px) {
    .fpslider {
        display: none;
        overflow: hidden
    }
}

.fpslider.active {
    display: block
}

@media only screen and (min-width: 801px) {
    .fpslider__content {
        transition: all 0.3s;
        width: 100%;
        z-index: 2
    }
}

.fpslider__content-item {
    position: absolute;
    top: 0;
    width: 100%;
    text-align: center
}

.fpslider__content-item.active {
    z-index: 1
}

.fpslider__nav {
    position: relative;
    margin-top: 40px;
    width: 100%;
    text-align: center;
    z-index: 3
}

.fpslider__bullet {
    display: inline-block;
    font-size: 0
}

.fpslider__bullet span {
    vertical-align: middle;
    margin: 0 3px;
    cursor: pointer;
    width: .4375rem;
    height: .4375rem;
    display: inline-block;
    border-radius: 1px;
    background: #fff;
    opacity: .5;
    transition: .2s width ease-in-out
}

.fpslider__bullet span.active {
    opacity: 1;
    width: 3rem
}

body.compensate-for-scrollbar {
    overflow: hidden
}

.fancybox-active {
    height: auto
}

.fancybox-is-hidden {
    left: -9999px;
    margin: 0;
    position: absolute !important;
    top: -9999px;
    visibility: hidden
}

.fancybox-container {
    -webkit-backface-visibility: hidden;
    height: 100%;
    left: 0;
    outline: none;
    position: fixed;
    -webkit-tap-highlight-color: transparent;
    top: 0;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    transform: translateZ(0);
    width: 100%;
    z-index: 99992
}

.fancybox-container * {
    box-sizing: border-box
}

.fancybox-outer, .fancybox-inner, .fancybox-bg, .fancybox-stage {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.fancybox-outer {
    -webkit-overflow-scrolling: touch;
    overflow-y: auto
}

.fancybox-bg {
    background: #1e1e1e;
    opacity: 0;
    transition-duration: inherit;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(0.47, 0, 0.74, 0.71)
}

.fancybox-is-open .fancybox-bg {
    opacity: .9;
    transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1)
}

.fancybox-infobar, .fancybox-toolbar, .fancybox-caption, .fancybox-navigation .fancybox-button {
    direction: ltr;
    opacity: 0;
    position: absolute;
    transition: opacity .25s ease, visibility 0s ease .25s;
    visibility: hidden;
    z-index: 99997
}

.fancybox-show-infobar .fancybox-infobar, .fancybox-show-toolbar .fancybox-toolbar, .fancybox-show-caption .fancybox-caption, .fancybox-show-nav .fancybox-navigation .fancybox-button {
    opacity: 1;
    transition: opacity .25s ease 0s, visibility 0s ease 0s;
    visibility: visible
}

.fancybox-infobar {
    color: #ccc;
    font-size: 13px;
    -webkit-font-smoothing: subpixel-antialiased;
    height: 44px;
    left: 0;
    line-height: 44px;
    min-width: 44px;
    mix-blend-mode: difference;
    padding: 0 10px;
    pointer-events: none;
    top: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.fancybox-toolbar {
    right: 0;
    top: 0
}

.fancybox-stage {
    direction: ltr;
    overflow: visible;
    transform: translateZ(0);
    z-index: 99994
}

.fancybox-is-open .fancybox-stage {
    overflow: hidden
}

.fancybox-slide {
    -webkit-backface-visibility: hidden;
    display: none;
    height: 100%;
    left: 0;
    outline: none;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: absolute;
    text-align: center;
    top: 0;
    transition-property: transform, opacity;
    white-space: normal;
    width: 100%;
    z-index: 99994
}

.fancybox-slide::before {
    content: '';
    display: inline-block;
    font-size: 0;
    height: 100%;
    vertical-align: middle;
    width: 0
}

.fancybox-is-sliding .fancybox-slide, .fancybox-slide--previous, .fancybox-slide--current, .fancybox-slide--next {
    display: block
}

.fancybox-slide--image {
    overflow: hidden;
    padding: 44px 0
}

.fancybox-slide--image::before {
    display: none
}

.fancybox-slide--html {
    padding: 6px
}

.fancybox-content {
    background: #fff;
    display: inline-block;
    margin: 0;
    max-width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: relative;
    text-align: left;
    vertical-align: middle
}

.fancybox-slide--image .fancybox-content {
    animation-timing-function: cubic-bezier(0.5, 0, 0.14, 1);
    -webkit-backface-visibility: hidden;
    background: transparent;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    left: 0;
    max-width: none;
    overflow: visible;
    padding: 0;
    position: absolute;
    top: 0;
    -ms-transform-origin: top left;
    transform-origin: top left;
    transition-property: transform, opacity;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 99995
}

.fancybox-can-zoomOut .fancybox-content {
    cursor: zoom-out
}

.fancybox-can-zoomIn .fancybox-content {
    cursor: zoom-in
}

.fancybox-can-swipe .fancybox-content, .fancybox-can-pan .fancybox-content {
    cursor: grab
}

.fancybox-is-grabbing .fancybox-content {
    cursor: grabbing
}

.fancybox-container [data-selectable='true'] {
    cursor: text
}

.fancybox-image, .fancybox-spaceball {
    background: transparent;
    border: 0;
    height: 100%;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none;
    padding: 0;
    position: absolute;
    top: 0;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 100%
}

.fancybox-spaceball {
    z-index: 1
}

.fancybox-slide--video .fancybox-content, .fancybox-slide--map .fancybox-content, .fancybox-slide--pdf .fancybox-content, .fancybox-slide--iframe .fancybox-content {
    height: 100%;
    overflow: visible;
    padding: 0;
    width: 100%
}

.fancybox-slide--video .fancybox-content {
    background: #000
}

.fancybox-slide--map .fancybox-content {
    background: #e5e3df
}

.fancybox-slide--iframe .fancybox-content {
    background: #fff
}

.fancybox-video, .fancybox-iframe {
    background: transparent;
    border: 0;
    display: block;
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    width: 100%
}

.fancybox-iframe {
    left: 0;
    position: absolute;
    top: 0
}

.fancybox-error {
    background: #fff;
    cursor: default;
    max-width: 400px;
    padding: 40px;
    width: 100%
}

.fancybox-error p {
    color: #444;
    font-size: 16px;
    line-height: 20px;
    margin: 0;
    padding: 0
}

.fancybox-button {
    background: rgba(30, 30, 30, 0.6);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
    display: inline-block;
    height: 44px;
    margin: 0;
    padding: 10px;
    position: relative;
    transition: color .2s;
    vertical-align: top;
    visibility: inherit;
    width: 44px
}

.fancybox-button, .fancybox-button:visited, .fancybox-button:link {
    color: #ccc
}

.fancybox-button:hover {
    color: #fff
}

.fancybox-button:focus {
    outline: none
}

.fancybox-button.fancybox-focus {
    outline: 1px dotted
}

.fancybox-button[disabled], .fancybox-button[disabled]:hover {
    color: #888;
    cursor: default;
    outline: none
}

.fancybox-button div {
    height: 100%
}

.fancybox-button svg {
    display: block;
    height: 100%;
    overflow: visible;
    position: relative;
    width: 100%
}

.fancybox-button svg path {
    fill: currentColor;
    stroke-width: 0
}

.fancybox-button--play svg:nth-child(2), .fancybox-button--fsenter svg:nth-child(2) {
    display: none
}

.fancybox-button--pause svg:nth-child(1), .fancybox-button--fsexit svg:nth-child(1) {
    display: none
}

.fancybox-progress {
    background: #ff5268;
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -ms-transform-origin: 0;
    transform-origin: 0;
    transition-property: transform;
    transition-timing-function: linear;
    z-index: 99998
}

.fancybox-close-small {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #ccc;
    cursor: pointer;
    opacity: .8;
    padding: 8px;
    position: absolute;
    right: -12px;
    top: -44px;
    z-index: 401
}

.fancybox-close-small:hover {
    color: #fff;
    opacity: 1
}

.fancybox-slide--html .fancybox-close-small {
    color: currentColor;
    padding: 10px;
    right: 0;
    top: 0
}

.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
    overflow: hidden
}

.fancybox-is-scaling .fancybox-close-small, .fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small {
    display: none
}

.fancybox-navigation .fancybox-button {
    background-clip: content-box;
    height: 100px;
    opacity: 0;
    position: absolute;
    top: calc(50% - 50px);
    width: 70px
}

.fancybox-navigation .fancybox-button div {
    padding: 7px
}

.fancybox-navigation .fancybox-button--arrow_left {
    left: 0;
    padding: 31px 26px 31px 6px
}

.fancybox-navigation .fancybox-button--arrow_right {
    padding: 31px 6px 31px 26px;
    right: 0
}

.fancybox-caption {
    bottom: 0;
    color: #eee;
    font-size: 14px;
    font-weight: 400;
    left: 0;
    line-height: 1.5;
    padding: 25px 44px 25px 44px;
    right: 0;
    text-align: center;
    z-index: 99996
}

.fancybox-caption::before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAD6CAQAAADKSeXYAAAAYklEQVQoz42RwQ3AMAgDjfcfup8WoRykfBAK5mQHKSz5rbXJPis1hjiV3CIqgG0hLZPkVkA4p4x5oR1bVeDrdCLrW2Q0D5bcwY3TGMHbdw3mPRuOtaspYP1w//G1OIcW148H0DMCqI/3mMMAAAAASUVORK5CYII=);
    background-repeat: repeat-x;
    background-size: contain;
    bottom: 0;
    content: '';
    display: block;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: -44px;
    z-index: -1
}

.fancybox-caption a, .fancybox-caption a:link, .fancybox-caption a:visited {
    color: #ccc;
    text-decoration: none
}

.fancybox-caption a:hover {
    color: #fff;
    text-decoration: underline
}

.fancybox-loading {
    animation: fancybox-rotate 1s linear infinite;
    background: transparent;
    border: 4px solid #888;
    border-bottom-color: #fff;
    border-radius: 50%;
    height: 50px;
    left: 50%;
    margin: -25px 0 0 -25px;
    opacity: .7;
    padding: 0;
    position: absolute;
    top: 50%;
    width: 50px;
    z-index: 99999
}

@keyframes fancybox-rotate {
    100% {
        transform: rotate(360deg)
    }
}

.fancybox-animated {
    transition-timing-function: cubic-bezier(0, 0, 0.25, 1)
}

.fancybox-fx-slide.fancybox-slide--previous {
    opacity: 0;
    transform: translate3d(-100%, 0, 0)
}

.fancybox-fx-slide.fancybox-slide--next {
    opacity: 0;
    transform: translate3d(100%, 0, 0)
}

.fancybox-fx-slide.fancybox-slide--current {
    opacity: 1;
    transform: translate3d(0, 0, 0)
}

.fancybox-fx-fade.fancybox-slide--previous, .fancybox-fx-fade.fancybox-slide--next {
    opacity: 0;
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
}

.fancybox-fx-fade.fancybox-slide--current {
    opacity: 1
}

.fancybox-fx-zoom-in-out.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(1.5, 1.5, 1.5)
}

.fancybox-fx-zoom-in-out.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(0.5, 0.5, 0.5)
}

.fancybox-fx-zoom-in-out.fancybox-slide--current {
    opacity: 1;
    transform: scale3d(1, 1, 1)
}

.fancybox-fx-rotate.fancybox-slide--previous {
    opacity: 0;
    -ms-transform: rotate(-360deg);
    transform: rotate(-360deg)
}

.fancybox-fx-rotate.fancybox-slide--next {
    opacity: 0;
    -ms-transform: rotate(360deg);
    transform: rotate(360deg)
}

.fancybox-fx-rotate.fancybox-slide--current {
    opacity: 1;
    -ms-transform: rotate(0deg);
    transform: rotate(0deg)
}

.fancybox-fx-circular.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0)
}

.fancybox-fx-circular.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(100%, 0, 0)
}

.fancybox-fx-circular.fancybox-slide--current {
    opacity: 1;
    transform: scale3d(1, 1, 1) translate3d(0, 0, 0)
}

.fancybox-fx-tube.fancybox-slide--previous {
    transform: translate3d(-100%, 0, 0) scale(0.1) skew(-10deg)
}

.fancybox-fx-tube.fancybox-slide--next {
    transform: translate3d(100%, 0, 0) scale(0.1) skew(10deg)
}

.fancybox-fx-tube.fancybox-slide--current {
    transform: translate3d(0, 0, 0) scale(1)
}

@media all and (max-height: 576px) {
    .fancybox-caption {
        padding: 12px
    }

    .fancybox-slide {
        padding-left: 6px;
        padding-right: 6px
    }

    .fancybox-slide--image {
        padding: 6px 0
    }

    .fancybox-close-small {
        right: -6px
    }

    .fancybox-slide--image .fancybox-close-small {
        background: #4e4e4e;
        color: #f2f4f6;
        height: 36px;
        opacity: 1;
        padding: 6px;
        right: 0;
        top: 0;
        width: 36px
    }
}

.fancybox-share {
    background: #f4f4f4;
    border-radius: 3px;
    max-width: 90%;
    padding: 30px;
    text-align: center
}

.fancybox-share h1 {
    color: #222;
    font-size: 35px;
    font-weight: 700;
    margin: 0 0 20px 0
}

.fancybox-share p {
    margin: 0;
    padding: 0
}

.fancybox-share__button {
    border: 0;
    border-radius: 3px;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    line-height: 40px;
    margin: 0 5px 10px 5px;
    min-width: 130px;
    padding: 0 15px;
    text-decoration: none;
    transition: all .2s;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap
}

.fancybox-share__button:visited, .fancybox-share__button:link {
    color: #fff
}

.fancybox-share__button:hover {
    text-decoration: none
}

.fancybox-share__button--fb {
    background: #3b5998
}

.fancybox-share__button--fb:hover {
    background: #344e86
}

.fancybox-share__button--pt {
    background: #bd081d
}

.fancybox-share__button--pt:hover {
    background: #aa0719
}

.fancybox-share__button--tw {
    background: #1da1f2
}

.fancybox-share__button--tw:hover {
    background: #0d95e8
}

.fancybox-share__button svg {
    height: 25px;
    margin-right: 7px;
    position: relative;
    top: -1px;
    vertical-align: middle;
    width: 25px
}

.fancybox-share__button svg path {
    fill: #fff
}

.fancybox-share__input {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #d7d7d7;
    border-radius: 0;
    color: #5d5b5b;
    font-size: 14px;
    margin: 10px 0 0 0;
    outline: none;
    padding: 10px 15px;
    width: 100%
}

.fancybox-thumbs {
    background: #ddd;
    bottom: 0;
    display: none;
    margin: 0;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    padding: 2px 2px 4px 2px;
    position: absolute;
    right: 0;
    -webkit-tap-highlight-color: transparent;
    top: 0;
    width: 212px;
    z-index: 99995
}

.fancybox-thumbs-x {
    overflow-x: auto;
    overflow-y: hidden
}

.fancybox-show-thumbs .fancybox-thumbs {
    display: block
}

.fancybox-show-thumbs .fancybox-inner {
    right: 212px
}

.fancybox-thumbs__list {
    font-size: 0;
    height: 100%;
    list-style: none;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    position: absolute;
    position: relative;
    white-space: nowrap;
    width: 100%
}

.fancybox-thumbs-x .fancybox-thumbs__list {
    overflow: hidden
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar {
    width: 7px
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3)
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb {
    background: #2a2a2a;
    border-radius: 10px
}

.fancybox-thumbs__list a {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: rgba(0, 0, 0, 0.1);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    float: left;
    height: 75px;
    margin: 2px;
    max-height: calc(100% - 8px);
    max-width: calc(50% - 4px);
    outline: none;
    overflow: hidden;
    padding: 0;
    position: relative;
    -webkit-tap-highlight-color: transparent;
    width: 100px
}

.fancybox-thumbs__list a::before {
    border: 6px solid #ff5268;
    bottom: 0;
    content: '';
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 99991
}

.fancybox-thumbs__list a:focus::before {
    opacity: .5
}

.fancybox-thumbs__list a.fancybox-thumbs-active::before {
    opacity: 1
}

@media all and (max-width: 576px) {
    .fancybox-thumbs {
        width: 110px
    }

    .fancybox-show-thumbs .fancybox-inner {
        right: 110px
    }

    .fancybox-thumbs__list a {
        max-width: calc(100% - 10px)
    }
}

.fancybox-bg {
    height: 100vh
}

/*!
 * justifiedGallery - v3.7.0
 * http://miromannino.github.io/Justified-Gallery/
 * Copyright (c) 2018 Miro Mannino
 * Licensed under the MIT license.
 */
.justified-gallery {
    width: 100%;
    position: relative;
    overflow: hidden
}

.justified-gallery > a, .justified-gallery > div, .justified-gallery > figure {
    position: absolute;
    display: inline-block;
    overflow: hidden;
    filter: "alpha(opacity=10)";
    opacity: 0.1;
    margin: 0;
    padding: 0
}

.justified-gallery > a > img, .justified-gallery > div > img, .justified-gallery > figure > img, .justified-gallery > a > a > img, .justified-gallery > div > a > img, .justified-gallery > figure > a > img {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 0;
    padding: 0;
    border: none;
    filter: "alpha(opacity=0)";
    opacity: 0
}

.justified-gallery > a > .caption, .justified-gallery > div > .caption, .justified-gallery > figure > .caption {
    display: none;
    position: absolute;
    bottom: 0;
    padding: 5px;
    background-color: #000000;
    left: 0;
    right: 0;
    margin: 0;
    color: white;
    font-size: 12px;
    font-weight: 300;
    font-family: sans-serif
}

.justified-gallery > a > .caption.caption-visible, .justified-gallery > div > .caption.caption-visible, .justified-gallery > figure > .caption.caption-visible {
    display: initial;
    filter: "alpha(opacity=70)";
    opacity: 0.7;
    transition: opacity 500ms ease-in
}

.justified-gallery > .entry-visible {
    filter: "alpha(opacity=100)";
    opacity: 1;
    background: none
}

.justified-gallery > .entry-visible > img, .justified-gallery > .entry-visible > a > img {
    filter: "alpha(opacity=100)";
    opacity: 1;
    transition: opacity 500ms ease-in
}

.justified-gallery > .jg-filtered {
    display: none
}

.justified-gallery > .spinner {
    position: absolute;
    bottom: 0;
    margin-left: -24px;
    padding: 10px 0 10px 0;
    left: 50%;
    filter: "alpha(opacity=100)";
    opacity: 1;
    overflow: initial
}

.justified-gallery > .spinner > span {
    display: inline-block;
    filter: "alpha(opacity=0)";
    opacity: 0;
    width: 8px;
    height: 8px;
    margin: 0 4px 0 4px;
    background-color: #000;
    border-radius: 6px
}

table.dataTable {
    width: 100%;
    margin: 0 auto;
    clear: both;
    border-collapse: separate;
    border-spacing: 0
}

table.dataTable thead th, table.dataTable tfoot th {
    font-weight: bold
}

table.dataTable thead th, table.dataTable thead td {
    padding: 10px 18px;
    border-bottom: 1px solid #111
}

table.dataTable thead th:active, table.dataTable thead th.nice-select.open, table.dataTable thead td:active, table.dataTable thead td.nice-select.open {
    outline: none
}

table.dataTable tfoot th, table.dataTable tfoot td {
    padding: 10px 18px 6px 18px;
    border-top: 1px solid #111
}

table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc, table.dataTable thead .sorting_asc_disabled, table.dataTable thead .sorting_desc_disabled {
    cursor: pointer;
    *cursor: hand;
    background-repeat: no-repeat;
    background-position: center right
}

table.dataTable thead .sorting {
    background-image: url("DataTables-1.10.18/images/sort_both.png")
}

table.dataTable thead .sorting_asc {
    background-image: url("DataTables-1.10.18/images/sort_asc.png")
}

table.dataTable thead .sorting_desc {
    background-image: url("DataTables-1.10.18/images/sort_desc.png")
}

table.dataTable thead .sorting_asc_disabled {
    background-image: url("DataTables-1.10.18/images/sort_asc_disabled.png")
}

table.dataTable thead .sorting_desc_disabled {
    background-image: url("DataTables-1.10.18/images/sort_desc_disabled.png")
}

table.dataTable tbody tr {
    background-color: #ffffff
}

table.dataTable tbody tr.selected {
    background-color: #B0BED9
}

table.dataTable tbody th, table.dataTable tbody td {
    padding: 8px 10px
}

table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
    border-top: 1px solid #ddd
}

table.dataTable.row-border tbody tr:first-child th, table.dataTable.row-border tbody tr:first-child td, table.dataTable.display tbody tr:first-child th, table.dataTable.display tbody tr:first-child td {
    border-top: none
}

table.dataTable.cell-border tbody th, table.dataTable.cell-border tbody td {
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd
}

table.dataTable.cell-border tbody tr th:first-child, table.dataTable.cell-border tbody tr td:first-child {
    border-left: 1px solid #ddd
}

table.dataTable.cell-border tbody tr:first-child th, table.dataTable.cell-border tbody tr:first-child td {
    border-top: none
}

table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
    background-color: #f9f9f9
}

table.dataTable.stripe tbody tr.odd.selected, table.dataTable.display tbody tr.odd.selected {
    background-color: #acbad4
}

table.dataTable.hover tbody tr:hover, table.dataTable.display tbody tr:hover {
    background-color: #f6f6f6
}

table.dataTable.hover tbody tr:hover.selected, table.dataTable.display tbody tr:hover.selected {
    background-color: #aab7d1
}

table.dataTable.order-column tbody tr > .sorting_1, table.dataTable.order-column tbody tr > .sorting_2, table.dataTable.order-column tbody tr > .sorting_3, table.dataTable.display tbody tr > .sorting_1, table.dataTable.display tbody tr > .sorting_2, table.dataTable.display tbody tr > .sorting_3 {
    background-color: #fafafa
}

table.dataTable.order-column tbody tr.selected > .sorting_1, table.dataTable.order-column tbody tr.selected > .sorting_2, table.dataTable.order-column tbody tr.selected > .sorting_3, table.dataTable.display tbody tr.selected > .sorting_1, table.dataTable.display tbody tr.selected > .sorting_2, table.dataTable.display tbody tr.selected > .sorting_3 {
    background-color: #acbad5
}

table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
    background-color: #f1f1f1
}

table.dataTable.display tbody tr.odd > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd > .sorting_2 {
    background-color: #f3f3f3
}

table.dataTable.display tbody tr.odd > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd > .sorting_3 {
    background-color: whitesmoke
}

table.dataTable.display tbody tr.odd.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_1 {
    background-color: #a6b4cd
}

table.dataTable.display tbody tr.odd.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_2 {
    background-color: #a8b5cf
}

table.dataTable.display tbody tr.odd.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_3 {
    background-color: #a9b7d1
}

table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
    background-color: #fafafa
}

table.dataTable.display tbody tr.even > .sorting_2, table.dataTable.order-column.stripe tbody tr.even > .sorting_2 {
    background-color: #fcfcfc
}

table.dataTable.display tbody tr.even > .sorting_3, table.dataTable.order-column.stripe tbody tr.even > .sorting_3 {
    background-color: #fefefe
}

table.dataTable.display tbody tr.even.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_1 {
    background-color: #acbad5
}

table.dataTable.display tbody tr.even.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_2 {
    background-color: #aebcd6
}

table.dataTable.display tbody tr.even.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_3 {
    background-color: #afbdd8
}

table.dataTable.display tbody tr:hover > .sorting_1, table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {
    background-color: #eaeaea
}

table.dataTable.display tbody tr:hover > .sorting_2, table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {
    background-color: #ececec
}

table.dataTable.display tbody tr:hover > .sorting_3, table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {
    background-color: #efefef
}

table.dataTable.display tbody tr:hover.selected > .sorting_1, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {
    background-color: #a2aec7
}

table.dataTable.display tbody tr:hover.selected > .sorting_2, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {
    background-color: #a3b0c9
}

table.dataTable.display tbody tr:hover.selected > .sorting_3, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {
    background-color: #a5b2cb
}

table.dataTable.no-footer {
    border-bottom: 1px solid #111
}

table.dataTable.nowrap th, table.dataTable.nowrap td {
    white-space: nowrap
}

table.dataTable.compact thead th, table.dataTable.compact thead td {
    padding: 4px 17px 4px 4px
}

table.dataTable.compact tfoot th, table.dataTable.compact tfoot td {
    padding: 4px
}

table.dataTable.compact tbody th, table.dataTable.compact tbody td {
    padding: 4px
}

table.dataTable th.dt-left, table.dataTable td.dt-left {
    text-align: left
}

table.dataTable th.dt-center, table.dataTable td.dt-center, table.dataTable td.dataTables_empty {
    text-align: center
}

table.dataTable th.dt-right, table.dataTable td.dt-right {
    text-align: right
}

table.dataTable th.dt-justify, table.dataTable td.dt-justify {
    text-align: justify
}

table.dataTable th.dt-nowrap, table.dataTable td.dt-nowrap {
    white-space: nowrap
}

table.dataTable thead th.dt-head-left, table.dataTable thead td.dt-head-left, table.dataTable tfoot th.dt-head-left, table.dataTable tfoot td.dt-head-left {
    text-align: left
}

table.dataTable thead th.dt-head-center, table.dataTable thead td.dt-head-center, table.dataTable tfoot th.dt-head-center, table.dataTable tfoot td.dt-head-center {
    text-align: center
}

table.dataTable thead th.dt-head-right, table.dataTable thead td.dt-head-right, table.dataTable tfoot th.dt-head-right, table.dataTable tfoot td.dt-head-right {
    text-align: right
}

table.dataTable thead th.dt-head-justify, table.dataTable thead td.dt-head-justify, table.dataTable tfoot th.dt-head-justify, table.dataTable tfoot td.dt-head-justify {
    text-align: justify
}

table.dataTable thead th.dt-head-nowrap, table.dataTable thead td.dt-head-nowrap, table.dataTable tfoot th.dt-head-nowrap, table.dataTable tfoot td.dt-head-nowrap {
    white-space: nowrap
}

table.dataTable tbody th.dt-body-left, table.dataTable tbody td.dt-body-left {
    text-align: left
}

table.dataTable tbody th.dt-body-center, table.dataTable tbody td.dt-body-center {
    text-align: center
}

table.dataTable tbody th.dt-body-right, table.dataTable tbody td.dt-body-right {
    text-align: right
}

table.dataTable tbody th.dt-body-justify, table.dataTable tbody td.dt-body-justify {
    text-align: justify
}

table.dataTable tbody th.dt-body-nowrap, table.dataTable tbody td.dt-body-nowrap {
    white-space: nowrap
}

table.dataTable, table.dataTable th, table.dataTable td {
    box-sizing: content-box
}

.dataTables_wrapper {
    position: relative;
    clear: both;
    *zoom: 1;
    zoom: 1
}

.dataTables_wrapper .dataTables_length {
    float: left
}

.dataTables_wrapper .dataTables_filter {
    float: right;
    text-align: right
}

.dataTables_wrapper .dataTables_filter input {
    margin-left: 0.5em
}

.dataTables_wrapper .dataTables_info {
    clear: both;
    float: left;
    padding-top: 0.755em
}

.dataTables_wrapper .dataTables_paginate {
    float: right;
    text-align: right;
    padding-top: 0.25em
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    box-sizing: border-box;
    display: inline-block;
    min-width: 1.5em;
    padding: 0.5em 1em;
    margin-left: 2px;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    *cursor: hand;
    color: #333;
    border: 1px solid transparent;
    border-radius: 2px
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #333;
    border: 1px solid #979797;
    background-color: white;
    background: linear-gradient(to bottom, white 0%, #dcdcdc 100%)
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled.nice-select.open {
    cursor: default;
    color: #666;
    border: 1px solid transparent;
    background: transparent;
    box-shadow: none
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: white;
    border: 1px solid #111;
    background-color: #585858;
    background: linear-gradient(to bottom, #585858 0%, #111 100%)
}

.dataTables_wrapper .dataTables_paginate .ellipsis {
    padding: 0 1em
}

.dataTables_wrapper .dataTables_processing {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 40px;
    margin-left: -50%;
    margin-top: -25px;
    padding-top: 20px;
    text-align: center;
    font-size: 1.2em;
    background-color: white;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%)
}

.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate {
    color: #333
}

.dataTables_wrapper .dataTables_scroll {
    clear: both
}

.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
    *margin-top: -1px;
    -webkit-overflow-scrolling: touch
}

.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td {
    vertical-align: middle
}

.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th > div.dataTables_sizing, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td > div.dataTables_sizing, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th > div.dataTables_sizing, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td > div.dataTables_sizing {
    height: 0;
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important
}

.dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: 1px solid #111
}

.dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable, .dataTables_wrapper.no-footer div.dataTables_scrollBody > table {
    border-bottom: none
}

.dataTables_wrapper:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0
}

@media screen and (max-width: 767px) {
    .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_paginate {
        float: none;
        text-align: center
    }

    .dataTables_wrapper .dataTables_paginate {
        margin-top: 0.5em
    }
}

@media screen and (max-width: 640px) {
    .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter {
        float: none;
        text-align: center
    }

    .dataTables_wrapper .dataTables_filter {
        margin-top: 0.5em
    }
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.child, table.dataTable.dtr-inline.collapsed > tbody > tr > th.child, table.dataTable.dtr-inline.collapsed > tbody > tr > td.dataTables_empty {
    cursor: default !important
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.child:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th.child:before, table.dataTable.dtr-inline.collapsed > tbody > tr > td.dataTables_empty:before {
    display: none !important
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child, table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child {
    position: relative;
    padding-left: 30px;
    cursor: pointer
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child:before {
    top: 9px;
    left: 4px;
    height: 14px;
    width: 14px;
    display: block;
    position: absolute;
    color: white;
    border: 2px solid white;
    border-radius: 14px;
    box-shadow: 0 0 3px #444;
    box-sizing: content-box;
    text-align: center;
    text-indent: 0 !important;
    font-family: 'Courier New', Courier, monospace;
    line-height: 14px;
    content: '+';
    background-color: #31b131
}

table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
    content: '-';
    background-color: #d33333
}

table.dataTable.dtr-inline.collapsed.compact > tbody > tr > td:first-child, table.dataTable.dtr-inline.collapsed.compact > tbody > tr > th:first-child {
    padding-left: 27px
}

table.dataTable.dtr-inline.collapsed.compact > tbody > tr > td:first-child:before, table.dataTable.dtr-inline.collapsed.compact > tbody > tr > th:first-child:before {
    top: 5px;
    left: 4px;
    height: 14px;
    width: 14px;
    border-radius: 14px;
    line-height: 14px;
    text-indent: 3px
}

table.dataTable.dtr-column > tbody > tr > td.control, table.dataTable.dtr-column > tbody > tr > th.control {
    position: relative;
    cursor: pointer
}

table.dataTable.dtr-column > tbody > tr > td.control:before, table.dataTable.dtr-column > tbody > tr > th.control:before {
    top: 50%;
    left: 50%;
    height: 16px;
    width: 16px;
    margin-top: -10px;
    margin-left: -10px;
    display: block;
    position: absolute;
    color: white;
    border: 2px solid white;
    border-radius: 14px;
    box-shadow: 0 0 3px #444;
    box-sizing: content-box;
    text-align: center;
    text-indent: 0 !important;
    font-family: 'Courier New', Courier, monospace;
    line-height: 14px;
    content: '+';
    background-color: #31b131
}

table.dataTable.dtr-column > tbody > tr.parent td.control:before, table.dataTable.dtr-column > tbody > tr.parent th.control:before {
    content: '-';
    background-color: #d33333
}

table.dataTable > tbody > tr.child {
    padding: 0.5em 1em
}

table.dataTable > tbody > tr.child:hover {
    background: transparent !important
}

table.dataTable > tbody > tr.child ul.dtr-details {
    display: inline-block;
    list-style-type: none;
    margin: 0;
    padding: 0
}

table.dataTable > tbody > tr.child ul.dtr-details > li {
    border-bottom: 1px solid #efefef;
    padding: 0.5em 0
}

table.dataTable > tbody > tr.child ul.dtr-details > li:first-child {
    padding-top: 0
}

table.dataTable > tbody > tr.child ul.dtr-details > li:last-child {
    border-bottom: none
}

table.dataTable > tbody > tr.child span.dtr-title {
    display: inline-block;
    min-width: 75px;
    font-weight: bold
}

div.dtr-modal {
    position: fixed;
    box-sizing: border-box;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 100;
    padding: 10em 1em
}

div.dtr-modal div.dtr-modal-display {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 50%;
    height: 50%;
    overflow: auto;
    margin: auto;
    z-index: 102;
    overflow: auto;
    background-color: #f5f5f7;
    border: 1px solid black;
    border-radius: 0.5em;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6)
}

div.dtr-modal div.dtr-modal-content {
    position: relative;
    padding: 1em
}

div.dtr-modal div.dtr-modal-close {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 22px;
    height: 22px;
    border: 1px solid #eaeaea;
    background-color: #f9f9f9;
    text-align: center;
    border-radius: 3px;
    cursor: pointer;
    z-index: 12
}

div.dtr-modal div.dtr-modal-close:hover {
    background-color: #eaeaea
}

div.dtr-modal div.dtr-modal-background {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 101;
    background: rgba(0, 0, 0, 0.6)
}

@media screen and (max-width: 767px) {
    div.dtr-modal div.dtr-modal-display {
        width: 95%
    }
}

.leaflet-container {
    background: #fff;
    font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif;
    color: #404040;
    color: rgba(0, 0, 0, 0.75);
    -ms-touch-action: none
}

.leaflet-container *, .leaflet-container :after, .leaflet-container :before {
    box-sizing: border-box
}

.leaflet-container h1, .leaflet-container h2, .leaflet-container h3, .leaflet-container h4, .leaflet-container h5, .leaflet-container h6, .leaflet-container p {
    font-size: 15px;
    line-height: 20px;
    margin: 0 0 10px
}

.leaflet-container .marker-description img {
    margin-bottom: 10px
}

.leaflet-container a {
    color: #3887BE;
    font-weight: 400;
    text-decoration: none
}

.leaflet-container a:hover, .leaflet-container.dark a {
    color: #63b6e5
}

.leaflet-container.dark a:hover {
    color: #8fcaec
}

.leaflet-container .mapbox-button, .leaflet-container.dark .mapbox-button {
    background-color: #3887be;
    display: inline-block;
    height: 40px;
    line-height: 40px;
    text-decoration: none;
    color: #fff;
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis
}

.leaflet-container .mapbox-button:hover, .leaflet-container.dark .mapbox-button:hover {
    color: #fff;
    background-color: #3bb2d0
}

.leaflet-image-layer, .leaflet-layer, .leaflet-map-pane canvas, .leaflet-map-pane svg, .leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-pane, .leaflet-tile, .leaflet-tile-container, .leaflet-zoom-box {
    position: absolute;
    left: 0;
    top: 0
}

.leaflet-container {
    overflow: hidden
}

.leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-tile {
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none
}

.leaflet-safari .leaflet-tile {
    image-rendering: -webkit-optimize-contrast
}

.leaflet-safari .leaflet-tile-container {
    width: 1600px;
    height: 1600px;
    -webkit-transform-origin: 0 0
}

.leaflet-marker-icon, .leaflet-marker-shadow {
    display: block
}

.leaflet-container .leaflet-marker-pane img, .leaflet-container .leaflet-overlay-pane svg, .leaflet-container .leaflet-tile-pane img, .leaflet-container img.leaflet-image-layer {
    max-width: none !important
}

.leaflet-container.leaflet-touch-zoom {
    -ms-touch-action: pan-x pan-y;
    touch-action: pan-x pan-y
}

.leaflet-container.leaflet-touch-drag {
    -ms-touch-action: pinch-zoom
}

.leaflet-container.leaflet-touch-drag.leaflet-touch-drag {
    -ms-touch-action: none;
    touch-action: none
}

.leaflet-tile {
    filter: inherit;
    visibility: hidden
}

.leaflet-tile-loaded {
    visibility: inherit
}

.leaflet-zoom-box {
    width: 0;
    height: 0;
    z-index: 800
}

.leaflet-map-pane canvas {
    z-index: 1
}

.leaflet-map-pane svg, .leaflet-tile-pane {
    z-index: 2
}

.leaflet-overlay-pane {
    z-index: 4
}

.leaflet-shadow-pane {
    z-index: 5
}

.leaflet-marker-pane {
    z-index: 6
}

.leaflet-tooltip-pane {
    z-index: 7
}

.leaflet-popup-pane {
    z-index: 8
}

.leaflet-control {
    position: relative;
    z-index: 800;
    pointer-events: visiblePainted;
    pointer-events: auto
}

.leaflet-bottom, .leaflet-top {
    position: absolute;
    z-index: 1000;
    pointer-events: none
}

.leaflet-top {
    top: 0
}

.leaflet-right {
    right: 0
}

.leaflet-bottom {
    bottom: 0
}

.leaflet-left {
    left: 0
}

.leaflet-control {
    float: left;
    clear: both
}

.leaflet-right .leaflet-control {
    float: right
}

.leaflet-top .leaflet-control {
    margin-top: 10px
}

.leaflet-bottom .leaflet-control {
    margin-bottom: 10px
}

.leaflet-left .leaflet-control {
    margin-left: 10px
}

.leaflet-right .leaflet-control {
    margin-right: 10px
}

.leaflet-fade-anim .leaflet-tile {
    will-change: opacity
}

.leaflet-fade-anim .leaflet-popup {
    opacity: 0;
    transition: opacity .2s linear
}

.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
    opacity: 1
}

.leaflet-zoom-animated {
    -ms-transform-origin: 0 0;
    transform-origin: 0 0
}

.leaflet-zoom-anim .leaflet-zoom-animated {
    will-change: transform;
    transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1)
}

.leaflet-pan-anim .leaflet-tile, .leaflet-zoom-anim .leaflet-tile {
    transition: none
}

.leaflet-zoom-anim .leaflet-zoom-hide {
    visibility: hidden
}

.leaflet-interactive {
    cursor: pointer
}

.leaflet-grab {
    cursor: -moz-grab
}

.leaflet-crosshair, .leaflet-crosshair .leaflet-interactive {
    cursor: crosshair
}

.leaflet-control, .leaflet-popup-pane {
    cursor: auto
}

.leaflet-dragging .leaflet-grab, .leaflet-dragging .leaflet-grab .leaflet-interactive, .leaflet-dragging .leaflet-marker-draggable {
    cursor: move;
    cursor: -moz-grabbing
}

.leaflet-image-layer, .leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-pane > svg path, .leaflet-tile-container {
    pointer-events: none
}

.leaflet-image-layer.leaflet-interactive, .leaflet-marker-icon.leaflet-interactive, .leaflet-pane > svg path.leaflet-interactive {
    pointer-events: visiblePainted;
    pointer-events: auto
}

.leaflet-container {
    outline: 0
}

.leaflet-zoom-box {
    background: #fff;
    border: 2px dotted #202020;
    opacity: .5
}

.leaflet-bar, .leaflet-control-layers {
    background-color: #fff;
    border: 1px solid #999;
    border-color: rgba(0, 0, 0, 0.4);
    border-radius: 3px;
    box-shadow: none
}

.leaflet-bar a, .leaflet-bar a:hover {
    color: #404040;
    color: rgba(0, 0, 0, 0.75);
    border-bottom: 1px solid #ddd;
    border-bottom-color: rgba(0, 0, 0, 0.1)
}

.leaflet-bar a:last-child {
    border-bottom: 0
}

.leaflet-bar a:active, .leaflet-bar a.nice-select.open, .leaflet-bar a:hover {
    background-color: #f8f8f8;
    cursor: pointer
}

.leaflet-bar a:hover:first-child {
    border-radius: 3px 3px 0 0
}

.leaflet-bar a:hover:last-child {
    border-radius: 0 0 3px 3px
}

.leaflet-bar a:hover:only-of-type {
    border-radius: 3px
}

.leaflet-bar .leaflet-disabled {
    cursor: default;
    opacity: .75
}

.leaflet-control-zoom-in, .leaflet-control-zoom-out {
    display: block;
    content: '';
    text-align: center;
    font-size: 18px;
    line-height: 26px
}

.leaflet-control-layers .leaflet-control-layers-list, .leaflet-control-layers-expanded .leaflet-control-layers-toggle {
    display: none
}

.leaflet-control-layers-expanded .leaflet-control-layers-list {
    display: block;
    position: relative
}

.leaflet-control-layers-expanded {
    background: #fff;
    padding: 6px 10px 6px 6px;
    color: #404040;
    color: rgba(0, 0, 0, 0.75)
}

.leaflet-control-layers-selector {
    margin-top: 2px;
    position: relative;
    top: 1px
}

.leaflet-control-layers label {
    display: block
}

.leaflet-control-layers-separator {
    height: 0;
    border-top: 1px solid #ddd;
    border-top-color: rgba(0, 0, 0, 0.1);
    margin: 5px -10px 5px -6px
}

.leaflet-container .leaflet-control-attribution {
    background-color: rgba(255, 255, 255, 0.5);
    margin: 0;
    box-shadow: none
}

.leaflet-container .leaflet-control-attribution a, .leaflet-container .map-info-container a {
    color: #404040
}

.leaflet-control-attribution a:hover, .map-info-container a:hover {
    color: inherit;
    text-decoration: underline
}

.leaflet-control-attribution, .leaflet-control-scale-line {
    padding: 0 5px
}

.leaflet-left .leaflet-control-scale {
    margin-left: 5px
}

.leaflet-bottom .leaflet-control-scale {
    margin-bottom: 5px
}

.leaflet-container .mapbox-improve-map {
    font-weight: 700
}

.leaflet-control-scale-line {
    background-color: rgba(255, 255, 255, 0.5);
    border: 1px solid #999;
    border-color: rgba(0, 0, 0, 0.4);
    border-top: 0;
    padding: 2px 5px 1px;
    white-space: nowrap;
    overflow: hidden
}

.leaflet-control-scale-line:last-child {
    border-top: 2px solid #ddd;
    border-top-color: rgba(0, 0, 0, 0.1);
    border-bottom: 0;
    margin-top: -2px
}

.leaflet-container .leaflet-control-attribution.leaflet-compact-attribution {
    margin: 10px;
    background: #fff;
    border-radius: 3px 13px 13px 3px;
    padding: 3px 31px 3px 3px;
    visibility: hidden
}

.leaflet-control-attribution.leaflet-compact-attribution:hover {
    visibility: visible
}

.leaflet-control-attribution.leaflet-compact-attribution:after {
    content: '';
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.5);
    background-position: 0 -78px;
    border-radius: 50%;
    position: absolute;
    display: inline-block;
    width: 26px;
    height: 26px;
    vertical-align: middle;
    bottom: 0;
    z-index: 1;
    visibility: visible;
    cursor: pointer
}

.leaflet-control-attribution.leaflet-compact-attribution:hover:after {
    background-color: #fff
}

.leaflet-right .leaflet-control-attribution.leaflet-compact-attribution:after {
    right: 0
}

.leaflet-left .leaflet-control-attribution.leaflet-compact-attribution:after {
    left: 0
}

.leaflet-touch .leaflet-bar, .leaflet-touch .leaflet-control-layers {
    border: 2px solid rgba(0, 0, 0, 0.2);
    background-clip: padding-box
}

.leaflet-popup {
    position: absolute;
    text-align: center;
    pointer-events: none
}

.leaflet-popup-content-wrapper {
    padding: 1px;
    text-align: left;
    pointer-events: all
}

.leaflet-popup-content {
    padding: 10px 10px 15px;
    margin: 0;
    line-height: inherit
}

.leaflet-popup-close-button + .leaflet-popup-content-wrapper .leaflet-popup-content {
    padding-top: 15px
}

.leaflet-popup-tip-container {
    width: 20px;
    height: 20px;
    margin: 0 auto;
    position: relative
}

.leaflet-popup-tip {
    width: 0;
    height: 0;
    margin: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #fff;
    box-shadow: none
}

.leaflet-popup-close-button {
    text-indent: -999em;
    position: absolute;
    top: 0;
    right: 0;
    pointer-events: all
}

.leaflet-popup-close-button:hover {
    background-color: #f8f8f8
}

.leaflet-popup-scrolled {
    overflow: auto;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd
}

.leaflet-div-icon {
    background: #fff;
    border: 1px solid #999;
    border-color: rgba(0, 0, 0, 0.4)
}

.leaflet-editing-icon {
    border-radius: 3px
}

.leaflet-tooltip {
    position: absolute;
    padding: 5px;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 3px;
    white-space: nowrap;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none
}

.leaflet-tooltip.leaflet-clickable {
    cursor: pointer;
    pointer-events: auto
}

.leaflet-tooltip-bottom:before, .leaflet-tooltip-left:before, .leaflet-tooltip-right:before, .leaflet-tooltip-top:before {
    content: '';
    position: absolute;
    pointer-events: none;
    border: 5px solid transparent;
    background: 0 0
}

.leaflet-tooltip-bottom {
    margin-top: 5px
}

.leaflet-tooltip-top {
    margin-top: -5px
}

.leaflet-tooltip-bottom:before, .leaflet-tooltip-top:before {
    left: 50%;
    margin-left: -5px
}

.leaflet-tooltip-top:before {
    bottom: 0;
    margin-bottom: -10px;
    border-top-color: #fff
}

.leaflet-tooltip-bottom:before {
    top: 0;
    margin-top: -15px;
    margin-left: -5px;
    border-bottom-color: #fff
}

.leaflet-tooltip-left {
    margin-left: -5px
}

.leaflet-tooltip-right {
    margin-left: 5px
}

.leaflet-tooltip-left:before, .leaflet-tooltip-right:before {
    top: 50%;
    margin-top: -5px
}

.leaflet-tooltip-left:before {
    right: 0;
    margin-right: -10px;
    border-left-color: #fff
}

.leaflet-tooltip-right:before {
    left: 0;
    margin-left: -10px;
    border-right-color: #fff
}

.leaflet-bar a, .leaflet-control-layers-toggle, .leaflet-popup-close-button, .map-tooltip.closable .close, .mapbox-button-icon:before, .mapbox-icon {
    content: '';
    display: inline-block;
    width: 26px;
    height: 26px;
    vertical-align: middle;
    background-repeat: no-repeat
}

.leaflet-bar a {
    display: block
}

.leaflet-container.dark .map-tooltip .close, .leaflet-control-attribution:after, .leaflet-control-layers-toggle, .leaflet-control-zoom-in, .leaflet-control-zoom-out, .leaflet-popup-close-button, .map-tooltip .close, .mapbox-icon {
    opacity: .75;
    background-image: linear-gradient(transparent, transparent);
    background-repeat: no-repeat;
    background-size: 26px 260px
}

.leaflet-container.dark .leaflet-control-attribution:after, .leaflet-container.dark .leaflet-control-layers-toggle, .leaflet-container.dark .leaflet-control-zoom-in, .leaflet-container.dark .leaflet-control-zoom-out, .leaflet-container.dark .mapbox-icon, .mapbox-button-icon:before {
    opacity: 1;
    background-image: linear-gradient(transparent, transparent);
    background-size: 26px 260px
}

.leaflet-bar .leaflet-control-zoom-in {
    background-position: 0 0
}

.leaflet-bar .leaflet-control-zoom-out {
    background-position: 0 -26px
}

.leaflet-popup-close-button, .map-tooltip.closable .close {
    background-position: -3px -55px;
    width: 20px;
    height: 20px;
    border-radius: 0 3px 0 0
}

.mapbox-icon-info {
    background-position: 0 -78px
}

.leaflet-control-layers-toggle {
    background-position: 0 -104px
}

.mapbox-icon.mapbox-icon-share, .mapbox-icon.mapbox-icon-share:before {
    background-position: 0 -130px
}

.mapbox-icon.mapbox-icon-geocoder, .mapbox-icon.mapbox-icon-geocoder:before {
    background-position: 0 -156px
}

.mapbox-icon-facebook, .mapbox-icon-facebook:before {
    background-position: 0 -182px
}

.mapbox-icon-twitter, .mapbox-icon-twitter:before {
    background-position: 0 -208px
}

.mapbox-icon-pinterest, .mapbox-icon-pinterest:before {
    background-position: 0 -234px
}

.leaflet-popup-content-wrapper, .map-legends, .map-tooltip {
    background: #fff;
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1)
}

.map-legends, .map-tooltip {
    max-width: 300px
}

.map-legends .map-legend {
    padding: 10px
}

.map-tooltip {
    z-index: 999999;
    padding: 10px;
    min-width: 180px;
    max-height: 400px;
    overflow: auto;
    opacity: 1;
    transition: opacity 150ms
}

.map-tooltip .close {
    text-indent: -999em;
    overflow: hidden;
    display: none
}

.map-tooltip.closable .close {
    position: absolute;
    top: 0;
    right: 0;
    border-radius: 3px
}

.map-tooltip.closable .close:active, .map-tooltip.closable .close.nice-select.open {
    background-color: #f8f8f8
}

.leaflet-control-interaction {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 300px
}

.leaflet-popup-content .marker-title {
    font-weight: 700
}

.leaflet-control .mapbox-button {
    background-color: #fff;
    border: 1px solid #ddd;
    border-color: rgba(0, 0, 0, 0.1);
    padding: 5px 10px;
    border-radius: 3px
}

.mapbox-modal > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow-y: auto
}

.mapbox-modal.active > div {
    z-index: 99999;
    transition: all .2s, z-index 0 0
}

.mapbox-modal .mapbox-modal-mask {
    background: rgba(0, 0, 0, 0.5);
    opacity: 0
}

.mapbox-modal.active .mapbox-modal-mask {
    opacity: 1
}

.mapbox-modal .mapbox-modal-content {
    -ms-transform: translateY(-100%);
    transform: translateY(-100%)
}

.mapbox-modal.active .mapbox-modal-content {
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.mapbox-modal-body {
    position: relative;
    background: #fff;
    padding: 20px;
    z-index: 1000;
    width: 50%;
    margin: 20px 0 20px 25%
}

.mapbox-share-buttons {
    margin: 0 0 20px
}

.mapbox-share-buttons a {
    width: 33.3333%;
    border-left: 1px solid #fff;
    text-align: center;
    border-radius: 0
}

.mapbox-share-buttons a:last-child {
    border-radius: 0 3px 3px 0
}

.mapbox-share-buttons a:first-child {
    border: 0;
    border-radius: 3px 0 0 3px
}

.mapbox-modal input {
    width: 100%;
    height: 40px;
    padding: 10px;
    border: 1px solid #ddd;
    border-color: rgba(0, 0, 0, 0.1);
    color: rgba(0, 0, 0, 0.5)
}

.mapbox-modal label {
    display: block;
    margin-top: 5px
}

.leaflet-control-mapbox-geocoder {
    position: relative
}

.leaflet-control-mapbox-geocoder.searching {
    opacity: .75
}

.leaflet-control-mapbox-geocoder .leaflet-control-mapbox-geocoder-wrap {
    background: #fff;
    position: absolute;
    border: 1px solid #999;
    border-color: rgba(0, 0, 0, 0.4);
    overflow: hidden;
    left: 26px;
    height: 28px;
    width: 0;
    top: -1px;
    border-radius: 0 3px 3px 0;
    opacity: 0;
    transition: opacity 100ms
}

.leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-wrap {
    width: 180px;
    opacity: 1
}

.leaflet-bar .leaflet-control-mapbox-geocoder-toggle, .leaflet-bar .leaflet-control-mapbox-geocoder-toggle:hover {
    border-bottom: 0
}

.leaflet-control-mapbox-geocoder-toggle {
    border-radius: 3px
}

.leaflet-control-mapbox-geocoder.active, .leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-toggle {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.leaflet-control-mapbox-geocoder .leaflet-control-mapbox-geocoder-form input {
    background: 0 0;
    border: 0;
    width: 180px;
    padding: 0 0 0 10px;
    height: 26px;
    outline: 0
}

.leaflet-control-mapbox-geocoder-results {
    width: 180px;
    position: absolute;
    left: 26px;
    top: 25px;
    border-radius: 0 0 3px 3px
}

.leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-results {
    background: #fff;
    border: 1px solid #999;
    border-color: rgba(0, 0, 0, 0.4)
}

.leaflet-control-mapbox-geocoder-results a, .leaflet-control-mapbox-geocoder-results span {
    padding: 0 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 26px;
    text-align: left;
    overflow: hidden
}

.leaflet-container.dark .leaflet-control .leaflet-control-mapbox-geocoder-results a:hover, .leaflet-control-mapbox-geocoder-results a:hover {
    background: #f8f8f8;
    opacity: 1
}

.leaflet-right .leaflet-control-mapbox-geocoder-results, .leaflet-right .leaflet-control-mapbox-geocoder-wrap {
    left: auto;
    right: 26px
}

.leaflet-right .leaflet-control-mapbox-geocoder-wrap {
    border-radius: 3px 0 0 3px
}

.leaflet-right .leaflet-control-mapbox-geocoder.active, .leaflet-right .leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-toggle {
    border-radius: 0 3px 3px 0
}

.leaflet-bottom .leaflet-control-mapbox-geocoder-results {
    top: auto;
    bottom: 25px;
    border-radius: 3px 3px 0 0
}

.mapbox-logo.mapbox-logo-true {
    margin: 0 0 5px 5px
}

.mapbox-logo-true:before {
    content: '';
    display: inline-block;
    width: 85px;
    height: 21px;
    vertical-align: middle
}

.mapbox-logo.mapbox-logo-true {
    background-repeat: no-repeat;
    background-size: 85px 21px;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgODAuNDcgMjAuMDIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDgwLjQ3IDIwLjAyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe29wYWNpdHk6MC42O2ZpbGw6I0ZGRkZGRjtlbmFibGUtYmFja2dyb3VuZDpuZXcgICAgO30uc3Qxe29wYWNpdHk6MC42O2VuYWJsZS1iYWNrZ3JvdW5kOm5ldyAgICA7fTwvc3R5bGU+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTTc5LjI5LDEzLjYxYzAsMC4xMS0wLjA5LDAuMi0wLjIsMC4yaC0xLjUzYy0wLjEyLDAtMC4yMy0wLjA2LTAuMjktMC4xNmwtMS4zNy0yLjI4bC0xLjM3LDIuMjhjLTAuMDYsMC4xLTAuMTcsMC4xNi0wLjI5LDAuMTZoLTEuNTNjLTAuMDQsMC0wLjA4LTAuMDEtMC4xMS0wLjAzYy0wLjA5LTAuMDYtMC4xMi0wLjE4LTAuMDYtMC4yN2MwLDAsMCwwLDAsMGwyLjMxLTMuNWwtMi4yOC0zLjQ3Yy0wLjAyLTAuMDMtMC4wMy0wLjA3LTAuMDMtMC4xMWMwLTAuMTEsMC4wOS0wLjIsMC4yLTAuMmgxLjUzYzAuMTIsMCwwLjIzLDAuMDYsMC4yOSwwLjE2bDEuMzQsMi4yNWwxLjMzLTIuMjRjMC4wNi0wLjEsMC4xNy0wLjE2LDAuMjktMC4xNmgxLjUzYzAuMDQsMCwwLjA4LDAuMDEsMC4xMSwwLjAzYzAuMDksMC4wNiwwLjEyLDAuMTgsMC4wNiwwLjI3YzAsMCwwLDAsMCwwTDc2Ljk2LDEwbDIuMzEsMy41Qzc5LjI4LDEzLjUzLDc5LjI5LDEzLjU3LDc5LjI5LDEzLjYxeiIvPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik02My4wOSw5LjE2Yy0wLjM3LTEuNzktMS44Ny0zLjEyLTMuNjYtMy4xMmMtMC45OCwwLTEuOTMsMC40LTIuNiwxLjEyVjMuMzdjMC0wLjEyLTAuMS0wLjIyLTAuMjItMC4yMmgtMS4zM2MtMC4xMiwwLTAuMjIsMC4xLTAuMjIsMC4yMnYxMC4yMWMwLDAuMTIsMC4xLDAuMjIsMC4yMiwwLjIyaDEuMzNjMC4xMiwwLDAuMjItMC4xLDAuMjItMC4yMnYtMC43YzAuNjgsMC43MSwxLjYyLDEuMTIsMi42LDEuMTJjMS43OSwwLDMuMjktMS4zNCwzLjY2LTMuMTNDNjMuMjEsMTAuMyw2My4yMSw5LjcyLDYzLjA5LDkuMTZMNjMuMDksOS4xNnogTTU5LjEyLDEyLjQxYy0xLjI2LDAtMi4yOC0xLjA2LTIuMy0yLjM2VjkuOTljMC4wMi0xLjMxLDEuMDQtMi4zNiwyLjMtMi4zNnMyLjMsMS4wNywyLjMsMi4zOVM2MC4zOSwxMi40MSw1OS4xMiwxMi40MXoiLz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNNjguMjYsNi4wNGMtMS44OS0wLjAxLTMuNTQsMS4yOS0zLjk2LDMuMTNjLTAuMTIsMC41Ni0wLjEyLDEuMTMsMCwxLjY5YzAuNDIsMS44NSwyLjA3LDMuMTYsMy45NywzLjE0YzIuMjQsMCw0LjA2LTEuNzgsNC4wNi0zLjk5UzcwLjUxLDYuMDQsNjguMjYsNi4wNHogTTY4LjI0LDEyLjQyYy0xLjI3LDAtMi4zLTEuMDctMi4zLTIuMzlzMS4wMy0yLjQsMi4zLTIuNHMyLjMsMS4wNywyLjMsMi4zOVM2OS41MSwxMi40MSw2OC4yNCwxMi40Mkw2OC4yNCwxMi40MnoiLz48cGF0aCBjbGFzcz0ic3QxIiBkPSJNNTkuMTIsNy42M2MtMS4yNiwwLTIuMjgsMS4wNi0yLjMsMi4zNnYwLjA2YzAuMDIsMS4zMSwxLjA0LDIuMzYsMi4zLDIuMzZzMi4zLTEuMDcsMi4zLTIuMzlTNjAuMzksNy42Myw1OS4xMiw3LjYzeiBNNTkuMTIsMTEuMjNjLTAuNiwwLTEuMDktMC41My0xLjExLTEuMTlWMTBjMC4wMS0wLjY2LDAuNTEtMS4xOSwxLjExLTEuMTlzMS4xMSwwLjU0LDEuMTEsMS4yMVM1OS43NCwxMS4yMyw1OS4xMiwxMS4yM3oiLz48cGF0aCBjbGFzcz0ic3QxIiBkPSJNNjguMjQsNy42M2MtMS4yNywwLTIuMywxLjA3LTIuMywyLjM5czEuMDMsMi4zOSwyLjMsMi4zOXMyLjMtMS4wNywyLjMtMi4zOVM2OS41MSw3LjYzLDY4LjI0LDcuNjN6IE02OC4yNCwxMS4yM2MtMC42MSwwLTEuMTEtMC41NC0xLjExLTEuMjFzMC41LTEuMiwxLjExLTEuMnMxLjExLDAuNTQsMS4xMSwxLjIxUzY4Ljg1LDExLjIzLDY4LjI0LDExLjIzeiIvPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00My41Niw2LjI0aC0xLjMzYy0wLjEyLDAtMC4yMiwwLjEtMC4yMiwwLjIydjAuN2MtMC42OC0wLjcxLTEuNjItMS4xMi0yLjYtMS4xMmMtMi4wNywwLTMuNzUsMS43OC0zLjc1LDMuOTlzMS42OSwzLjk5LDMuNzUsMy45OWMwLjk5LDAsMS45My0wLjQxLDIuNi0xLjEzdjAuN2MwLDAuMTIsMC4xLDAuMjIsMC4yMiwwLjIyaDEuMzNjMC4xMiwwLDAuMjItMC4xLDAuMjItMC4yMlY2LjQ0YzAtMC4xMS0wLjA5LTAuMjEtMC4yMS0wLjIxQzQzLjU3LDYuMjQsNDMuNTcsNi4yNCw0My41Niw2LjI0eiBNNDIuMDIsMTAuMDVjLTAuMDEsMS4zMS0xLjA0LDIuMzYtMi4zLDIuMzZzLTIuMy0xLjA3LTIuMy0yLjM5czEuMDMtMi40LDIuMjktMi40YzEuMjcsMCwyLjI4LDEuMDYsMi4zLDIuMzZMNDIuMDIsMTAuMDV6Ii8+PHBhdGggY2xhc3M9InN0MSIgZD0iTTM5LjcyLDcuNjNjLTEuMjcsMC0yLjMsMS4wNy0yLjMsMi4zOXMxLjAzLDIuMzksMi4zLDIuMzlzMi4yOC0xLjA2LDIuMy0yLjM2VjkuOTlDNDIsOC42OCw0MC45OCw3LjYzLDM5LjcyLDcuNjN6IE0zOC42MiwxMC4wMmMwLTAuNjcsMC41LTEuMjEsMS4xMS0xLjIxYzAuNjEsMCwxLjA5LDAuNTMsMS4xMSwxLjE5djAuMDRjLTAuMDEsMC42NS0wLjUsMS4xOC0xLjExLDEuMThTMzguNjIsMTAuNjgsMzguNjIsMTAuMDJ6Ii8+PHBhdGggY2xhc3M9InN0MCIgZD0iTTQ5LjkxLDYuMDRjLTAuOTgsMC0xLjkzLDAuNC0yLjYsMS4xMlY2LjQ1YzAtMC4xMi0wLjEtMC4yMi0wLjIyLTAuMjJoLTEuMzNjLTAuMTIsMC0wLjIyLDAuMS0wLjIyLDAuMjJ2MTAuMjFjMCwwLjEyLDAuMSwwLjIyLDAuMjIsMC4yMmgxLjMzYzAuMTIsMCwwLjIyLTAuMSwwLjIyLTAuMjJ2LTMuNzhjMC42OCwwLjcxLDEuNjIsMS4xMiwyLjYxLDEuMTJjMi4wNywwLDMuNzUtMS43OCwzLjc1LTMuOTlTNTEuOTgsNi4wNCw0OS45MSw2LjA0eiBNNDkuNiwxMi40MmMtMS4yNiwwLTIuMjgtMS4wNi0yLjMtMi4zNlY5Ljk5YzAuMDItMS4zMSwxLjA0LTIuMzcsMi4yOS0yLjM3YzEuMjYsMCwyLjMsMS4wNywyLjMsMi4zOVM1MC44NiwxMi40MSw0OS42LDEyLjQyTDQ5LjYsMTIuNDJ6Ii8+PHBhdGggY2xhc3M9InN0MSIgZD0iTTQ5LjYsNy42M2MtMS4yNiwwLTIuMjgsMS4wNi0yLjMsMi4zNnYwLjA2YzAuMDIsMS4zMSwxLjA0LDIuMzYsMi4zLDIuMzZzMi4zLTEuMDcsMi4zLTIuMzlTNTAuODYsNy42Myw0OS42LDcuNjN6IE00OS42LDExLjIzYy0wLjYsMC0xLjA5LTAuNTMtMS4xMS0xLjE5VjEwQzQ4LjUsOS4zNCw0OSw4LjgxLDQ5LjYsOC44MWMwLjYsMCwxLjExLDAuNTUsMS4xMSwxLjIxUzUwLjIxLDExLjIzLDQ5LjYsMTEuMjN6Ii8+PHBhdGggY2xhc3M9InN0MCIgZD0iTTM0LjM2LDEzLjU5YzAsMC4xMi0wLjEsMC4yMi0wLjIyLDAuMjJoLTEuMzRjLTAuMTIsMC0wLjIyLTAuMS0wLjIyLTAuMjJWOS4yNGMwLTAuOTMtMC43LTEuNjMtMS41NC0xLjYzYy0wLjc2LDAtMS4zOSwwLjY3LTEuNTEsMS41NGwwLjAxLDQuNDRjMCwwLjEyLTAuMSwwLjIyLTAuMjIsMC4yMmgtMS4zNGMtMC4xMiwwLTAuMjItMC4xLTAuMjItMC4yMlY5LjI0YzAtMC45My0wLjctMS42My0xLjU0LTEuNjNjLTAuODEsMC0xLjQ3LDAuNzUtMS41MiwxLjcxdjQuMjdjMCwwLjEyLTAuMSwwLjIyLTAuMjIsMC4yMmgtMS4zM2MtMC4xMiwwLTAuMjItMC4xLTAuMjItMC4yMlY2LjQ0YzAuMDEtMC4xMiwwLjEtMC4yMSwwLjIyLTAuMjFoMS4zM2MwLjEyLDAsMC4yMSwwLjEsMC4yMiwwLjIxdjAuNjNjMC40OC0wLjY1LDEuMjQtMS4wNCwyLjA2LTEuMDVoMC4wM2MxLjA0LDAsMS45OSwwLjU3LDIuNDgsMS40OGMwLjQzLTAuOSwxLjMzLTEuNDgsMi4zMi0xLjQ5YzEuNTQsMCwyLjc5LDEuMTksMi43NiwyLjY1TDM0LjM2LDEzLjU5eiIvPjxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik04MC4zMiwxMi45N2wtMC4wNy0wLjEyTDc4LjM4LDEwbDEuODUtMi44MWMwLjQyLTAuNjQsMC4yNS0xLjQ5LTAuMzktMS45MmMtMC4wMS0wLjAxLTAuMDItMC4wMS0wLjAzLTAuMDJjLTAuMjItMC4xNC0wLjQ4LTAuMjEtMC43NC0wLjIxaC0xLjUzYy0wLjUzLDAtMS4wMywwLjI4LTEuMywwLjc0bC0wLjMyLDAuNTNsLTAuMzItMC41M2MtMC4yOC0wLjQ2LTAuNzctMC43NC0xLjMxLTAuNzRoLTEuNTNjLTAuNTcsMC0xLjA4LDAuMzUtMS4yOSwwLjg4Yy0yLjA5LTEuNTgtNS4wMy0xLjQtNi45MSwwLjQzYy0wLjMzLDAuMzItMC42MiwwLjY5LTAuODUsMS4wOWMtMC44NS0xLjU1LTIuNDUtMi42LTQuMjgtMi42Yy0wLjQ4LDAtMC45NiwwLjA3LTEuNDEsMC4yMlYzLjM3YzAtMC43OC0wLjYzLTEuNDEtMS40LTEuNDFoLTEuMzNjLTAuNzcsMC0xLjQsMC42My0xLjQsMS40djMuNTdjLTAuOS0xLjMtMi4zOC0yLjA4LTMuOTctMi4wOWMtMC43LDAtMS4zOSwwLjE1LTIuMDIsMC40NWMtMC4yMy0wLjE2LTAuNTEtMC4yNS0wLjgtMC4yNWgtMS4zM2MtMC40MywwLTAuODMsMC4yLTEuMSwwLjUzYy0wLjAyLTAuMDMtMC4wNC0wLjA1LTAuMDctMC4wOGMtMC4yNy0wLjI5LTAuNjUtMC40NS0xLjA0LTAuNDVoLTEuMzJjLTAuMjksMC0wLjU3LDAuMDktMC44LDAuMjVDNDAuOCw1LDQwLjEyLDQuODUsMzkuNDIsNC44NWMtMS43NCwwLTMuMjcsMC45NS00LjE2LDIuMzhjLTAuMTktMC40NC0wLjQ2LTAuODUtMC43OS0xLjE5Yy0wLjc2LTAuNzctMS44LTEuMTktMi44OC0xLjE5aC0wLjAxYy0wLjg1LDAuMDEtMS42NywwLjMxLTIuMzQsMC44NGMtMC43LTAuNTQtMS41Ni0wLjg0LTIuNDUtMC44NGgtMC4wM2MtMC4yOCwwLTAuNTUsMC4wMy0wLjgyLDAuMWMtMC4yNywwLjA2LTAuNTMsMC4xNS0wLjc4LDAuMjdjLTAuMi0wLjExLTAuNDMtMC4xNy0wLjY3LTAuMTdoLTEuMzNjLTAuNzgsMC0xLjQsMC42My0xLjQsMS40djcuMTRjMCwwLjc4LDAuNjMsMS40LDEuNCwxLjRoMS4zM2MwLjc4LDAsMS40MS0wLjYzLDEuNDEtMS40MWMwLDAsMCwwLDAsMFY5LjM1YzAuMDMtMC4zNCwwLjIyLTAuNTYsMC4zNC0wLjU2YzAuMTcsMCwwLjM2LDAuMTcsMC4zNiwwLjQ1djQuMzVjMCwwLjc4LDAuNjMsMS40LDEuNCwxLjRoMS4zNGMwLjc4LDAsMS40LTAuNjMsMS40LTEuNGwtMC4wMS00LjM1YzAuMDYtMC4zLDAuMjQtMC40NSwwLjMzLTAuNDVjMC4xNywwLDAuMzYsMC4xNywwLjM2LDAuNDV2NC4zNWMwLDAuNzgsMC42MywxLjQsMS40LDEuNGgxLjM0YzAuNzgsMCwxLjQtMC42MywxLjQtMS40di0wLjM2YzAuOTEsMS4yMywyLjM0LDEuOTYsMy44NywxLjk2YzAuNywwLDEuMzktMC4xNSwyLjAyLTAuNDVjMC4yMywwLjE2LDAuNTEsMC4yNSwwLjgsMC4yNWgxLjMyYzAuMjksMCwwLjU3LTAuMDksMC44LTAuMjV2MS45MWMwLDAuNzgsMC42MywxLjQsMS40LDEuNGgxLjMzYzAuNzgsMCwxLjQtMC42MywxLjQtMS40di0xLjY5YzAuNDYsMC4xNCwwLjk0LDAuMjIsMS40MiwwLjIxYzEuNjIsMCwzLjA3LTAuODMsMy45Ny0yLjF2MC41YzAsMC43OCwwLjYzLDEuNCwxLjQsMS40aDEuMzNjMC4yOSwwLDAuNTctMC4wOSwwLjgtMC4yNWMwLjYzLDAuMywxLjMyLDAuNDUsMi4wMiwwLjQ1YzEuODMsMCwzLjQzLTEuMDUsNC4yOC0yLjZjMS40NywyLjUyLDQuNzEsMy4zNiw3LjIyLDEuODljMC4xNy0wLjEsMC4zNC0wLjIxLDAuNS0wLjM0YzAuMjEsMC41MiwwLjcyLDAuODcsMS4yOSwwLjg2aDEuNTNjMC41MywwLDEuMDMtMC4yOCwxLjMtMC43NGwwLjM1LTAuNThsMC4zNSwwLjU4YzAuMjgsMC40NiwwLjc3LDAuNzQsMS4zMSwwLjc0aDEuNTJjMC43NywwLDEuMzktMC42MywxLjM4LTEuMzlDODAuNDcsMTMuMzgsODAuNDIsMTMuMTcsODAuMzIsMTIuOTdMODAuMzIsMTIuOTd6IE0zNC4xNSwxMy44MWgtMS4zNGMtMC4xMiwwLTAuMjItMC4xLTAuMjItMC4yMlY5LjI0YzAtMC45My0wLjctMS42My0xLjU0LTEuNjNjLTAuNzYsMC0xLjM5LDAuNjctMS41MSwxLjU0bDAuMDEsNC40NGMwLDAuMTItMC4xLDAuMjItMC4yMiwwLjIyaC0xLjM0Yy0wLjEyLDAtMC4yMi0wLjEtMC4yMi0wLjIyVjkuMjRjMC0wLjkzLTAuNy0xLjYzLTEuNTQtMS42M2MtMC44MSwwLTEuNDcsMC43NS0xLjUyLDEuNzF2NC4yN2MwLDAuMTItMC4xLDAuMjItMC4yMiwwLjIyaC0xLjMzYy0wLjEyLDAtMC4yMi0wLjEtMC4yMi0wLjIyVjYuNDRjMC4wMS0wLjEyLDAuMS0wLjIxLDAuMjItMC4yMWgxLjMzYzAuMTIsMCwwLjIxLDAuMSwwLjIyLDAuMjF2MC42M2MwLjQ4LTAuNjUsMS4yNC0xLjA0LDIuMDYtMS4wNWgwLjAzYzEuMDQsMCwxLjk5LDAuNTcsMi40OCwxLjQ4YzAuNDMtMC45LDEuMzMtMS40OCwyLjMyLTEuNDljMS41NCwwLDIuNzksMS4xOSwyLjc2LDIuNjVsMC4wMSw0LjkxQzM0LjM3LDEzLjcsMzQuMjcsMTMuOCwzNC4xNSwxMy44MUMzNC4xNSwxMy44MSwzNC4xNSwxMy44MSwzNC4xNSwxMy44MXogTTQzLjc4LDEzLjU5YzAsMC4xMi0wLjEsMC4yMi0wLjIyLDAuMjJoLTEuMzNjLTAuMTIsMC0wLjIyLTAuMS0wLjIyLTAuMjJ2LTAuNzFDNDEuMzQsMTMuNiw0MC40LDE0LDM5LjQyLDE0Yy0yLjA3LDAtMy43NS0xLjc4LTMuNzUtMy45OXMxLjY5LTMuOTksMy43NS0zLjk5YzAuOTgsMCwxLjkyLDAuNDEsMi42LDEuMTJ2LTAuN2MwLTAuMTIsMC4xLTAuMjIsMC4yMi0wLjIyaDEuMzNjMC4xMS0wLjAxLDAuMjEsMC4wOCwwLjIyLDAuMmMwLDAuMDEsMCwwLjAxLDAsMC4wMlYxMy41OXogTTQ5LjkxLDE0Yy0wLjk4LDAtMS45Mi0wLjQxLTIuNi0xLjEydjMuNzhjMCwwLjEyLTAuMSwwLjIyLTAuMjIsMC4yMmgtMS4zM2MtMC4xMiwwLTAuMjItMC4xLTAuMjItMC4yMlY2LjQ1YzAtMC4xMiwwLjEtMC4yMSwwLjIyLTAuMjFoMS4zM2MwLjEyLDAsMC4yMiwwLjEsMC4yMiwwLjIydjAuN2MwLjY4LTAuNzIsMS42Mi0xLjEyLDIuNi0xLjEyYzIuMDcsMCwzLjc1LDEuNzcsMy43NSwzLjk4UzUxLjk4LDE0LDQ5LjkxLDE0eiBNNjMuMDksMTAuODdDNjIuNzIsMTIuNjUsNjEuMjIsMTQsNTkuNDMsMTRjLTAuOTgsMC0xLjkyLTAuNDEtMi42LTEuMTJ2MC43YzAsMC4xMi0wLjEsMC4yMi0wLjIyLDAuMjJoLTEuMzNjLTAuMTIsMC0wLjIyLTAuMS0wLjIyLTAuMjJWMy4zN2MwLTAuMTIsMC4xLTAuMjIsMC4yMi0wLjIyaDEuMzNjMC4xMiwwLDAuMjIsMC4xLDAuMjIsMC4yMnYzLjc4YzAuNjgtMC43MSwxLjYyLTEuMTIsMi42LTEuMTFjMS43OSwwLDMuMjksMS4zMywzLjY2LDMuMTJDNjMuMjEsOS43Myw2My4yMSwxMC4zMSw2My4wOSwxMC44N0w2My4wOSwxMC44N0w2My4wOSwxMC44N3ogTTY4LjI2LDE0LjAxYy0xLjksMC4wMS0zLjU1LTEuMjktMy45Ny0zLjE0Yy0wLjEyLTAuNTYtMC4xMi0xLjEzLDAtMS42OWMwLjQyLTEuODUsMi4wNy0zLjE1LDMuOTctMy4xNGMyLjI1LDAsNC4wNiwxLjc4LDQuMDYsMy45OVM3MC41LDE0LjAxLDY4LjI2LDE0LjAxTDY4LjI2LDE0LjAxeiBNNzkuMDksMTMuODFoLTEuNTNjLTAuMTIsMC0wLjIzLTAuMDYtMC4yOS0wLjE2bC0xLjM3LTIuMjhsLTEuMzcsMi4yOGMtMC4wNiwwLjEtMC4xNywwLjE2LTAuMjksMC4xNmgtMS41M2MtMC4wNCwwLTAuMDgtMC4wMS0wLjExLTAuMDNjLTAuMDktMC4wNi0wLjEyLTAuMTgtMC4wNi0wLjI3YzAsMCwwLDAsMCwwbDIuMzEtMy41bC0yLjI4LTMuNDdjLTAuMDItMC4wMy0wLjAzLTAuMDctMC4wMy0wLjExYzAtMC4xMSwwLjA5LTAuMiwwLjItMC4yaDEuNTNjMC4xMiwwLDAuMjMsMC4wNiwwLjI5LDAuMTZsMS4zNCwyLjI1bDEuMzQtMi4yNWMwLjA2LTAuMSwwLjE3LTAuMTYsMC4yOS0wLjE2aDEuNTNjMC4wNCwwLDAuMDgsMC4wMSwwLjExLDAuMDNjMC4wOSwwLjA2LDAuMTIsMC4xOCwwLjA2LDAuMjdjMCwwLDAsMCwwLDBMNzYuOTYsMTBsMi4zMSwzLjVjMC4wMiwwLjAzLDAuMDMsMC4wNywwLjAzLDAuMTFDNzkuMjksMTMuNzIsNzkuMiwxMy44MSw3OS4wOSwxMy44MUM3OS4wOSwxMy44MSw3OS4wOSwxMy44MSw3OS4wOSwxMy44MUw3OS4wOSwxMy44MXoiLz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTAsMS4yMWMtNC44NywwLTguODEsMy45NS04LjgxLDguODFzMy45NSw4LjgxLDguODEsOC44MXM4LjgxLTMuOTUsOC44MS04LjgxQzE4LjgxLDUuMTUsMTQuODcsMS4yMSwxMCwxLjIxeiBNMTQuMTgsMTIuMTljLTEuODQsMS44NC00LjU1LDIuMi02LjM4LDIuMmMtMC42NywwLTEuMzQtMC4wNS0yLTAuMTVjMCwwLTAuOTctNS4zNywyLjA0LTguMzljMC43OS0wLjc5LDEuODYtMS4yMiwyLjk4LTEuMjJjMS4yMSwwLDIuMzcsMC40OSwzLjIzLDEuMzVDMTUuOCw3LjczLDE1Ljg1LDEwLjUsMTQuMTgsMTIuMTl6Ii8+PHBhdGggY2xhc3M9InN0MSIgZD0iTTEwLDAuMDJjLTUuNTIsMC0xMCw0LjQ4LTEwLDEwczQuNDgsMTAsMTAsMTBzMTAtNC40OCwxMC0xMEMxOS45OSw0LjUsMTUuNTIsMC4wMiwxMCwwLjAyeiBNMTAsMTguODNjLTQuODcsMC04LjgxLTMuOTUtOC44MS04LjgxUzUuMTMsMS4yLDEwLDEuMnM4LjgxLDMuOTUsOC44MSw4LjgxQzE4LjgxLDE0Ljg5LDE0Ljg3LDE4LjgzLDEwLDE4LjgzeiIvPjxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0xNC4wNCw1Ljk4Yy0xLjc1LTEuNzUtNC41My0xLjgxLTYuMi0wLjE0QzQuODMsOC44Niw1LjgsMTQuMjMsNS44LDE0LjIzczUuMzcsMC45Nyw4LjM5LTIuMDRDMTUuODUsMTAuNSwxNS44LDcuNzMsMTQuMDQsNS45OHogTTExLjg4LDkuODdsLTAuODcsMS43OGwtMC44Ni0xLjc4TDguMzgsOS4wMWwxLjc3LTAuODZsMC44Ni0xLjc4bDAuODcsMS43OGwxLjc3LDAuODZMMTEuODgsOS44N3oiLz48cG9seWdvbiBjbGFzcz0ic3QwIiBwb2ludHM9IjEzLjY1LDkuMDEgMTEuODgsOS44NyAxMS4wMSwxMS42NSAxMC4xNSw5Ljg3IDguMzgsOS4wMSAxMC4xNSw4LjE1IDExLjAxLDYuMzcgMTEuODgsOC4xNSAiLz48L2c+PC9zdmc+)
}

.leaflet-container.dark .leaflet-bar {
    background-color: #404040;
    border-color: #202020;
    border-color: rgba(0, 0, 0, 0.75)
}

.leaflet-container.dark .leaflet-bar a {
    color: #404040;
    border-color: rgba(0, 0, 0, 0.5)
}

.leaflet-container.dark .leaflet-bar a:active, .leaflet-container.dark .leaflet-bar a.nice-select.open, .leaflet-container.dark .leaflet-bar a:hover {
    background-color: #505050
}

.leaflet-container.dark .leaflet-control-attribution, .leaflet-container.dark .leaflet-control-attribution:after, .leaflet-container.dark .map-info-container, .leaflet-container.dark .mapbox-info-toggle {
    background-color: rgba(0, 0, 0, 0.5);
    color: #f8f8f8
}

.leaflet-container.dark .leaflet-control-attribution a, .leaflet-container.dark .leaflet-control-attribution a:hover, .leaflet-container.dark .map-info-container a, .leaflet-container.dark .map-info-container a:hover {
    color: #fff
}

.leaflet-container.dark .leaflet-control-attribution:hover:after {
    background-color: #000
}

.leaflet-container.dark .leaflet-control-layers-list span {
    color: #f8f8f8
}

.leaflet-container.dark .leaflet-control-layers-separator {
    border-top-color: rgba(255, 255, 255, 0.1)
}

.leaflet-container.dark .leaflet-bar a.leaflet-disabled, .leaflet-container.dark .leaflet-control .mapbox-button.disabled {
    background-color: #252525;
    color: #404040
}

.leaflet-container.dark .leaflet-control-mapbox-geocoder > div {
    border-color: #202020;
    border-color: rgba(0, 0, 0, 0.75)
}

.leaflet-container.dark .leaflet-control .leaflet-control-mapbox-geocoder-results a {
    border-color: #ddd #202020;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.75)
}

.leaflet-container.dark .leaflet-control .leaflet-control-mapbox-geocoder-results span {
    border-color: #202020;
    border-color: rgba(0, 0, 0, 0.75)
}

@media only screen and (max-width: 800px) {
    .mapbox-modal-body {
        width: 83.3333%;
        margin-left: 8.3333%
    }
}

@media only screen and (max-width: 640px) {
    .mapbox-modal-body {
        width: 100%;
        height: 100%;
        margin: 0
    }
}

@media print {
    .mapbox-improve-map {
        display: none
    }
}

.leaflet-vml-shape {
    width: 1px;
    height: 1px
}

.lvml {
    behavior: url(#default#VML);
    display: inline-block;
    position: absolute
}

.leaflet-container img.leaflet-tile {
    max-width: none !important
}

.leaflet-container img.leaflet-marker-icon {
    max-width: none
}

.leaflet-container img.leaflet-image-layer {
    max-width: 15000px !important
}

.leaflet-overlay-pane svg {
    -moz-user-select: none
}

.leaflet-oldie .mapbox-modal .mapbox-modal-content {
    display: none
}

.leaflet-oldie .mapbox-modal.active .mapbox-modal-content {
    display: block
}

.map-tooltip {
    width: 280 px\8
}

.leaflet-oldie .leaflet-container.dark .map-tooltip .close, .leaflet-oldie .leaflet-control-layers-toggle, .leaflet-oldie .leaflet-control-zoom-in, .leaflet-oldie .leaflet-control-zoom-out, .leaflet-oldie .leaflet-popup-close-button, .leaflet-oldie .map-tooltip .close, .leaflet-oldie .mapbox-icon {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAEECAYAAAA24SSRAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAXnSURBVHic7ZxfiFVFGMB/33pRUQsKto002DY3McJ6yBYkESQxpYTypaB66KEXYRWLYOlhr9RTRGWRUkk9RyEU+Y9ClECJVTKlPybWBilqkYuWrqBOD/NdPV7PmTPn3NPtat/AcO6ZP9/vfN/Mmfl2Zs6Kc452hK62UAxkIANdEURkVERGC9crOjKIiANwzkmRep1lOjWXa2ijaU7jaGWgKsL110a1EnV+LQMqbLqyobO6t4EMZCADGchABrqmQUlPNSWOVgaqIpi7ZSADGchABjKQga49kIjURaQem14apGE4KVR/D0fXds5FRaAOOL1e+h1dP7ZgE6wQxDnXvs7QWaZLE1wUVmRNdY1zrp6wRF0kfqHYnHwDGchABjJQIETNRyIyFVgBzAPmavIIsAt4xzn3d66QiNl1PnCYy05JczwMzG9pKlfIhQCkES/kwUKQqRma9GpM02xqGXdrBdCXZm2NzaFP66SGUGeYl5E+WqJO0HRHSG+PXtJN54AjVbhbjQcbBSjiakH4hR0p+hChOiHQrhKg7Drt6t7//Qtb9RAU5XtXMaiak28gAxnIQO0Gicg0EXlMRDaIyFGNGzRtWhQpMA/1A6uAL4BzZM9H57TMKqC/8HyUPFhZJLiMI4sh0/UDK4FtwHig3LiWWal1UkPsDDsFWAgsBZZo8hZgM7DdOXcmV0igjQ4Ba4HFwORAuclaZi1wqNU2OgNsVw22aNoS1XAhMCXx4OkubOBJZwKDwFbgLNm97qyWGQRmtuoFWRsV0ujabCPzVA1kIAMZqBNAIjIgImPNRxUzK+SsmtRJn4Pqmj8AjCXzsmTlaTSck/8zcDRX/QiNMp8S6Ab2a5nvG5plyioDaoLs1/sBYKwyUBokkTdQJeiVZgi6UR+UVQI0QWHdoXKFvKDYz7RiynXctk7LPlmeRmsKyAqWNQfSQAYykIGuS5CI1ERkSET2ishpvQ6JSLE93ByfoQbsRHeNgfe4vOO8E6iF6hdxToZU6OqGUIWv1vShqkB7VYNaU3pN0/fGgvLa6C5gk3PufJO5zwObgDuraqM8jbZWpdEnwG3AYKOX6XVQ07+sSqNQr3P4QxS9LXeGBGxIzTiGXwR8QSHRsCj7ZjxAbxFYaVAKbMe/BkrAduRpZJ6qgQxkoP8DKDRY1sk/s5W6YFhoUG3nFnZeOIJfxLgXWB7zBFmmyzPT44my9zXSC098OZCTwCQttzOZVzVoX1a5LHmdtYyWDM29yjknItKF3xSelFWvKo1mhCClQLo1sC95T8T/ebr+xrqOABVZT82tY56qgQxkIAN1CkhEulsGiUi3iCzKyJsjIpuBYyLyo4isFpHXReTuTFLAr1sOnAeeT8nbzNW+3rfAM2UcyAcSQj4FngR68Ot0F1NA24CuMqBu4PMUgYdS0hzwYqlFJ+AeNV3s30aLSoEUtjEScoHE3nkZ0Ay1fR7o3ZCcGNAEYHcO5A/g5pZACpsMPEf6UexTwCN5MvI6w2zgaeBt4HQK5BsC57ubY+jPll/wHzn1Ayc07QD+u6MR4GPn3LlA/SuCOZAGMpCBDFRhiF50EpFl+PP49wOzgIPAHmCLc+6zXAERE18P+b7DRqAnJCfvfF0P/mTgLZr0l97vB27CL3HO0rwTwBzn3PHCGiU0uQisA6bhzT0T/T4ZeAr4s6FZmal8WcI0LwETgdfwHzY1XKz3teyjibLLioLWa8UDeG/oZbxD+QHwdULwg1r+K71fXxQ0ohXfAgS/Mvyh5i1MgNZp2qt6P5ImL/QezdbrSeAG4EbVJJkH8LteJ+p1FikhBPpNr3Odc6fUNHdo2oJEucbX8Y2zDQeLgr7T62IReRb4AX9mGGC6Xo8Bu0VkOvCQpu1JlRZoo6Vc/WL2ad4C4A28CWvAR5TtdU0dwqH/ewHvHi8HbgUexh+euDRCFH6PVOh0/FKzw3um4M8zpA1DxwkMQzFjXR9+d/9N1WI8BZI71kU56Aq8HXgC+Ak/5o3gX+rUNmmO5nsbqP2gfwCyvJzPNoKXiAAAAABJRU5ErkJggg==)
}

.leaflet-oldie .leaflet-container.dark .leaflet-control-layers-toggle, .leaflet-oldie .leaflet-container.dark .leaflet-control-zoom-in, .leaflet-oldie .leaflet-container.dark .leaflet-control-zoom-out, .leaflet-oldie .leaflet-container.dark .mapbox-icon, .leaflet-oldie .mapbox-button-icon:before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAEECAYAAAA24SSRAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAXYSURBVHic7ZxfiFVFHMc/a4uKWtDDtqJGZprYgwX5ByTdkkLbSgghCiKih14EBYtg6aEr9RRREKRUUs9hGEVtChKaYMkq2VqWmnUX2tKiNDNZY/Xbw/wue7x7zsw559626zY/GM6df7/P+c3MPfO7M3NumyTGQiaMCSWCIiiC6qVqoZC0lXgy1Cq0FanUck1XxVmSNL8WrzYT1LCMvz5qL1FnoAyoTNOVkpYb3hEUQREUQREUQRF0RYOqjHim9aHaTFDDEt2tCIqgCIqgCIqgCLoiQRULedNLgwCeq1NasbR8IilvqMhJpe5zrvpFQElYIYiksRsMLdd0aYoLwYqsqW5i9KjLLdHJj6AIiqAIiiCP5J2PpgLrgGXAYkvrA/YBrwF/BTXkmB2XSzqhbDlhZRqaypdLuuiB1ORiCOaDTM2wZLaFNMumZunzDYZ1wJy01ubyPfOazLE6qeIbDMsy0qsl6ngtWpyRfqOFInVKbWFXS9TxWtRXQl9mHR9oXwlQdp2xGt4t8YVt6iMor+/d8EM1OvkRFEERFEH/AWga8CCwFfjJwlZLm5ZHge/pPQ+4z8IKYGJGub+BT4GPLBwvCio7f6QeWfQ13TxgA7ATGPKUG7IyG6xOOj3nxDcFWAl0A/da2sdAL/AJcD6kwAc6bop6gT1kWzUZ6LKb6CbDqrx9dB535704S8BZ1o2zdEpSZ1HQ3MRddtmdp8kQzuKa9d8VBSUl9lEh0Pjro6ZKy00TERRBERRBLQZaCpxh9FHFUqBKiiJZ+n5gFfBHnrsKgUKb7t/j/PCwBNZwapKW1yGp3/KPSDrjKVsalIT0W3ypwZoGSoPU8pY2E/RCCqSiwJ55GdBVBusIlCu0Xpf3Na1guZbb1mnYJwtZtKmALm/Z6EBGUARFUASNV1A70AMcBP60aw9F93ADPkO7pD3mDwxKesOusvT2QP3czkmPKd2YUNpucVl+LlBo4jsITAduAIbrmnMAOAncnqflQn10M26JebgufdjSb8oDyQM6hlv3ru/4dkv/vFmgd4EZwPoErN3iM4BdeUGNjDpJqsrtmzc86mqwHkkH5X4t7JD0tEFyw3INzYwwuwisEVA9bPe/CarBdocsip5qBEVQBP3fQRWyX4jOCpUsZS2xhR2SQdwixq3A2lDhMkcTa7Ie2G6fwzfsmax8clrSJCu3py4vVV/ZphsALtjnFXkqtNwyWlLqR1Ub7obPA5OyKjXLolk+SFmQgEN18eD/PLXEI2j8gYqspwbrRE81giIogiKohUAdzQB1APdk5C3Ends6CXwLbAReBm7J1OZxINdKGpb0VEpeb4pT+aWkx8os0SxJKHlf0iOSOiXNkHQpBbRT0oQyoA5JH6YoPJ6SJknPeHR5+6gTWJ2SPjej/BceXV7QV8AHvsoJucTlvt5o8ZkraZa1fUheD+gJfo9+Bq4JlPkNt4Xgl9CdSJos6UlJF1IsOSvp/hw6vL8mFgCLgCXA44w+730IeIiM89314gP9ACzHHXD9xdIO49476gO2MfJjLCjRgYygCIqgCGqiFFl0WoM7j78ImA8cBQ7gzuaHp/wck1anpO2BqXy7lSu9I9YJ9APXWfycxfuBa4HbzDpwc9ZC4FQZi2qWXJK0WdI0ue3SuRp5P/lRSb8nLCvsQK5JNM2zkiZKeknSkKVdlPSmlX0gUXZNUdAWq3hY7tzj83K++FuS9icU32Hl91p8S1FQn1V8VVKb3Mrw25a3MgHabGkvWrwvTZ/ve7TArqeBq3H+3f66PIBf7VrzkuaTIj7Qj3ZdDJwF9jLy5wJdiXK1t+NrZxuOFgV9bddVwBPAN8ARS5tp15PAZxa/29IOpGrz9FG3Rsscy+uS9IqkBXLD/Z1GRl1yQEjuHANy7vFaSdMlrZa0K1Gm1PcISTMlDZiSbZa2I8VSSTolz2Mo9PQeBO7CvTE1iDtRc2dKuffwPX4CfVQfrpf0sKRjks5Zs27J6pP6EH3vCBp70D8db2VXFPfIagAAAABJRU5ErkJggg==)
}

.leaflet-oldie .mapbox-logo-true {
    background-image: none
}

.leaflet-cluster-anim .leaflet-marker-icon, .leaflet-cluster-anim .leaflet-marker-shadow {
    transition: transform 0.3s ease-out, opacity 0.3s ease-in
}

.leaflet-cluster-spider-leg {
    transition: stroke-dashoffset 0.3s ease-out, stroke-opacity 0.3s ease-in
}

.marker-cluster-small {
    background-color: rgba(181, 226, 140, 0.6)
}

.marker-cluster-small div {
    background-color: rgba(110, 204, 57, 0.6)
}

.marker-cluster-medium {
    background-color: rgba(241, 211, 87, 0.6)
}

.marker-cluster-medium div {
    background-color: rgba(240, 194, 12, 0.6)
}

.marker-cluster-large {
    background-color: rgba(253, 156, 115, 0.6)
}

.marker-cluster-large div {
    background-color: rgba(241, 128, 23, 0.6)
}

.leaflet-oldie .marker-cluster-small {
    background-color: #b5e28c
}

.leaflet-oldie .marker-cluster-small div {
    background-color: #6ecc39
}

.leaflet-oldie .marker-cluster-medium {
    background-color: #f1d357
}

.leaflet-oldie .marker-cluster-medium div {
    background-color: #f0c20c
}

.leaflet-oldie .marker-cluster-large {
    background-color: #fd9c73
}

.leaflet-oldie .marker-cluster-large div {
    background-color: #f18017
}

.marker-cluster {
    background-clip: padding-box;
    border-radius: 20px
}

.marker-cluster div {
    width: 30px;
    height: 30px;
    margin-left: 5px;
    margin-top: 5px;
    text-align: center;
    border-radius: 15px;
    font: 12px "Helvetica Neue", Arial, Helvetica, sans-serif
}

.marker-cluster span {
    line-height: 30px
}

.leaflet-top, .leaflet-left {
    z-index: 1
}

.leaflet-bar a, .leaflet-control-layers-toggle, .leaflet-popup-close-button, .map-tooltip.closable .close, .mapbox-button-icon:before, .mapbox-icon {
    content: '';
    display: block;
    width: 2.1875rem;
    height: 2.1875rem;
    vertical-align: middle;
    background-repeat: no-repeat
}

.leaflet-control-zoom-in, .leaflet-control-zoom-out {
    display: block;
    content: '';
    text-align: center;
    font-size: 20px;
    line-height: 2.1875rem
}

.leaflet-touch .leaflet-bar, .leaflet-touch .leaflet-control-layers {
    border: 2px solid rgba(0, 120, 200, 0.2);
    background-clip: padding-box
}

.rangeslider {
    position: relative;
    background-size: auto 50%;
    direction: ltr
}

.rangeslider--horizontal {
    height: 100%;
    width: 100%;
    border-radius: 100%
}

.rangeslider--vertical {
    width: 100%;
    height: 100%;
    min-height: 150px;
    max-height: 100%
}

.rangeslider--disabled {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    opacity: 0.4
}

.rangeslider__fill {
    display: block;
    position: absolute;
    border-radius: 1.125rem 0 0 1.125rem
}

.rangeslider--horizontal .rangeslider__fill {
    top: 0;
    height: 100%
}

.rangeslider--vertical .rangeslider__fill {
    bottom: 0;
    width: 100%
}

.rangeslider__handle {
    cursor: pointer;
    display: inline-block;
    height: 38px;
    width: 38px;
    position: absolute;
    background-color: #fff;
    border-radius: 38px;
    box-sizing: border-box;
    transition: background 0.2s ease-in-out, border 0.2s ease-in-out, transform 0.2s ease-in-out
}

.rangeslider__handle span {
    display: block;
    width: 1.0625rem;
    height: 3px;
    border-radius: 3px;
    background: #E6E6E6;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.rangeslider__handle::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    display: block;
    width: .625rem;
    height: 3px;
    border-radius: 3px;
    background: #E6E6E6;
    top: calc(50% - 7px)
}

.rangeslider__handle::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    display: block;
    width: .625rem;
    height: 3px;
    border-radius: 3px;
    background: #E6E6E6;
    top: calc(50% + 7px)
}

.rangeslider__handle:active, .rangeslider__handle.nice-select.open {
    background-color: #f2f2f2
}

.rangeslider--active .rangeslider__handle {
    background-color: #f2f2f2;
    -ms-transform: translateY(-50%) scale(1.05) !important;
    transform: translateY(-50%) scale(1.05) !important
}

.rangeslider--vertical.rangeslider--active .rangeslider__handle {
    background-color: #f2f2f2;
    -ms-transform: translateX(-50%) scale(1.05) !important;
    transform: translateX(-50%) scale(1.05) !important
}

.rangeslider--horizontal .rangeslider__handle {
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    touch-action: pan-y;
    -ms-touch-action: pan-y
}

.rangeslider--vertical .rangeslider__handle {
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    touch-action: pan-x;
    -ms-touch-action: pan-x
}

.scroll-wrapper {
    overflow: hidden !important;
    padding: 0 !important;
    position: relative
}

.scroll-wrapper > .scroll-content {
    border: none !important;
    box-sizing: content-box !important;
    height: auto;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none !important;
    overflow: scroll !important;
    padding: 0;
    position: relative !important;
    top: 0;
    width: auto !important
}

.scroll-wrapper > .scroll-content::-webkit-scrollbar {
    height: 0;
    width: 0
}

.scroll-element {
    display: none
}

.scroll-element, .scroll-element div {
    box-sizing: content-box
}

.scroll-element.scroll-x.scroll-scrollx_visible, .scroll-element.scroll-y.scroll-scrolly_visible {
    display: block
}

.scroll-element .scroll-bar, .scroll-element .scroll-arrow {
    cursor: default
}

.scroll-textarea {
    border: 1px solid #cccccc;
    border-top-color: #999999
}

.scroll-textarea > .scroll-content {
    overflow: hidden !important
}

.scroll-textarea > .scroll-content > textarea {
    border: none !important;
    box-sizing: border-box;
    height: 100% !important;
    margin: 0;
    max-height: none !important;
    max-width: none !important;
    overflow: scroll !important;
    outline: none;
    padding: 2px;
    position: relative !important;
    top: 0;
    width: 100% !important
}

.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {
    height: 0;
    width: 0
}

.scrollbar-inner > .scroll-element, .scrollbar-inner > .scroll-element div {
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10
}

.scrollbar-inner > .scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%
}

.scrollbar-inner > .scroll-element.scroll-x {
    bottom: 2px;
    height: 8px;
    left: 0;
    width: 100%
}

.scrollbar-inner > .scroll-element.scroll-y {
    height: 100%;
    right: 2px;
    top: 0;
    width: 8px
}

.scrollbar-inner > .scroll-element .scroll-element_outer {
    overflow: hidden
}

.scrollbar-inner > .scroll-element .scroll-element_outer, .scrollbar-inner > .scroll-element .scroll-element_track, .scrollbar-inner > .scroll-element .scroll-bar {
    border-radius: 8px;
    min-height: 25px
}

.scrollbar-inner > .scroll-element .scroll-element_track, .scrollbar-inner > .scroll-element .scroll-bar {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40);
    opacity: 0.4
}

.scrollbar-inner > .scroll-element .scroll-element_track {
    background-color: #e0e0e0
}

.scrollbar-inner > .scroll-element .scroll-bar {
    background-color: #c2c2c2
}

.scrollbar-inner > .scroll-element:hover .scroll-bar {
    background-color: #919191
}

.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar {
    background-color: #919191
}

.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
    left: -12px
}

.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
    top: -12px
}

.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -12px
}

.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -12px
}

.pace {
    pointer-events: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.pace-inactive {
    display: none
}

.pace .pace-progress {
    background: #0078c8;
    position: fixed;
    z-index: 2000;
    top: 0;
    right: 100%;
    width: 100%;
    height: 2px;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1)
}

.jq-toast-wrap {
    display: block;
    position: fixed;
    width: 250px;
    pointer-events: none !important;
    margin: 0;
    padding: 0;
    letter-spacing: normal;
    z-index: 9000 !important
}

.jq-toast-wrap * {
    margin: 0;
    padding: 0
}

.jq-toast-wrap.bottom-left {
    bottom: 20px;
    left: 20px
}

.jq-toast-wrap.bottom-right {
    bottom: 20px;
    right: 40px
}

.jq-toast-wrap.top-left {
    top: 20px;
    left: 20px
}

.jq-toast-wrap.top-right {
    top: 20px;
    right: 40px
}

.jq-toast-single {
    display: block;
    width: 100%;
    padding: 10px;
    margin: 0px 0px 5px;
    border-radius: 4px;
    font-size: 12px;
    font-family: arial, sans-serif;
    line-height: 17px;
    position: relative;
    pointer-events: all !important;
    background-color: #444444;
    color: white
}

.jq-toast-single h2 {
    font-family: arial, sans-serif;
    font-size: 14px;
    margin: 0px 0px 7px;
    background: none;
    color: inherit;
    line-height: inherit;
    letter-spacing: normal
}

.jq-toast-single a {
    color: #eee;
    text-decoration: none;
    font-weight: bold;
    border-bottom: 1px solid white;
    padding-bottom: 3px;
    font-size: 12px
}

.jq-toast-single ul {
    margin: 0px 0px 0px 15px;
    background: none;
    padding: 0px
}

.jq-toast-single ul li {
    list-style-type: disc !important;
    line-height: 17px;
    background: none;
    margin: 0;
    padding: 0;
    letter-spacing: normal
}

.close-jq-toast-single {
    position: absolute;
    top: 3px;
    right: 7px;
    font-size: 14px;
    cursor: pointer
}

.jq-toast-loader {
    display: block;
    position: absolute;
    top: -2px;
    height: 5px;
    width: 0%;
    left: 0;
    border-radius: 5px;
    background: red
}

.jq-toast-loaded {
    width: 100%
}

.jq-has-icon {
    padding: 10px 10px 10px 50px;
    background-repeat: no-repeat;
    background-position: 10px
}

.jq-icon-info {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=");
    background-color: #31708f;
    color: #d9edf7;
    border-color: #bce8f1
}

.jq-icon-warning {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=");
    background-color: #8a6d3b;
    color: #fcf8e3;
    border-color: #faebcc
}

.jq-icon-error {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=");
    background-color: #a94442;
    color: #f2dede;
    border-color: #ebccd1
}

.jq-icon-success {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==");
    color: #dff0d8;
    background-color: #3c763d;
    border-color: #d6e9c6
}

@media only screen and (max-width: 500px) {
    .jq-toast-wrap.top-right {
        right: 20px
    }
}

.jq-toast-wrap {
    width: 16.25rem
}

.jq-toast-single {
    font-family: inherit !important;
    text-align: right !important;
    direction: rtl !important;
    background-color: #fff !important;
    color: gray;
    box-shadow: 0 1px 11px rgba(0, 0, 0, 0.17)
}

.jq-toast-loader {
    position: absolute;
    right: 12px;
    top: 10px;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    border-width: 2px;
    border-style: solid;
    background-color: #fff !important
}

.jq-toast-single.jq-icon-error .jq-toast-loader {
    border-color: #ff5c62
}

.jq-toast-single.jq-icon-error .jq-toast-loader::before, .jq-toast-single.jq-icon-error .jq-toast-loader::after {
    content: "";
    position: absolute;
    width: 12px;
    height: 2px;
    top: 50%;
    left: 50%;
    margin-left: -6px;
    margin-top: -1px;
    background-color: #ff5c62
}

.jq-toast-single.jq-icon-error .jq-toast-loader::before {
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.jq-toast-single.jq-icon-error .jq-toast-loader::after {
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.jq-toast-single.jq-icon-success .jq-toast-loader {
    border-color: #5ec37d
}

.jq-toast-single.jq-icon-success .jq-toast-loader::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 6px;
    border-width: 0 0 2px 2px;
    border-style: solid;
    border-color: #5ec37d;
    -ms-transform: translate(-50%, -66%) rotate(-54deg);
    transform: translate(-50%, -66%) rotate(-54deg)
}

.close-jq-toast-single {
    font-size: 22px;
    right: auto;
    left: 12px;
    top: 12px;
    color: #acacac
}

.close-jq-toast-single:hover {
    color: #808080
}

.jq-has-icon {
    padding: 13px 50px 13px 10px;
    background-position: 94% center
}

.jq-toast-heading {
    font-size: 13px;
    color: #4d4d4d;
    font-family: inherit !important;
    padding-left: 20px
}

.ss-wrapper {
    overflow: hidden;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
    float: left
}

.ss-content {
    height: 100%;
    padding: 0 0 0 0;
    position: relative;
    overflow: auto;
    overflow-x: hidden;
    box-sizing: border-box
}

.is-desktop:not(.is-ios) .ss-content {
    width: calc(100% + 17px)
}

.ss-content.rtl {
    width: calc(100% + 17px);
    right: auto
}

.ss-scroll {
    position: relative;
    background: rgba(0, 0, 0, 0.1);
    width: 9px;
    border-radius: 4px;
    top: 0;
    z-index: 2;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.25s linear
}

.ss-hidden {
    display: none
}

.ss-container:hover .ss-scroll, .ss-container:active .ss-scroll, .ss-container.nice-select.open .ss-scroll {
    opacity: 1
}

.ss-grabbed {
    -o-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none
}

.header {
    padding-top: 8px;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 5.3125rem;
    background-color: #fff;
    z-index: 200;
    box-shadow: 0 1px 7px rgba(0, 0, 0, 0.07)
}

.header .header-wrap > .header-container > ul > li.haschild.open > div > ul > li.haschild.open > ul > li > ul {
    display: block !important
}

.header .header-wrap > .header-container > ul > li.haschild.open > div > ul > li.haschild.open {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: unset !important;
    align-items: unset !important;
    position: absolute;
    top: 0;
    right: 0;
    background: #fff;
    z-index: 16;
    width: 100%
}

@media only screen and (max-width: 800px) {
    .header {
        padding-top: 4px;
        height: 4.0625rem
    }
}

.header--fixed {
    position: fixed;
    -ms-transform: translateY(-100%);
    transform: translateY(-100%)
}

.menu-open .header--fixed {
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.header--trans {
    transition: transform 0.3s ease-in-out, box-shadow 0.3s linear
}

.header--show {
    -ms-transform: translateY(0);
    transform: translateY(0);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1)
}

.header .color-bar {
    z-index: 5
}

.header-wrap {
    max-width: 74.375rem;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%;
    z-index: 5
}

@media only screen and (max-width: 1050px) {
    .header-wrap {
        box-shadow: 0 1px 7px rgba(0, 0, 0, 0.1)
    }
}
/* جلوگیری از نمایش زمینه سفید لوگو هنگام اسکرول */
.header,
.header-wrap,
.header-logo {
    background-color: transparent !important;
    box-shadow: none !important;
}


.header-logo {
    position: relative;
    z-index: 2;
    width: 250px;
    height: 150px
}

@media only screen and (max-width: 800px) {
    .header-logo {
        width: 125px;
        height: 32px
    }
}

@media only screen and (max-width: 500px) {
    .header-logo {
        width: 92px;
        height: 24px
    }
}

.header-logo img, .header-logo h1, .header-logo a {
    width: auto;
    height: 100%;
    display: block
}

@media only screen and (min-width: 1051px) {
    .header-container {
        height: 100%;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

@media only screen and (max-width: 1050px) {
    .header-container {
        position: fixed;
        top: 5.3125rem;
        right: 0;
        width: 100%;
        z-index: -1;
        background: #fff;
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
        transition: transform .2s ease-in-out;
        box-shadow: 0 1px 7px rgba(0, 0, 0, 0.1)
    }

    .resizing .header-container {
        transition: none
    }

    .menu-open .header-container {
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
}

@media only screen and (max-width: 800px) {
    .header-container {
        top: 4.0625rem
    }
}

@media only screen and (max-width: 500px) {
    .header-container {
        top: 4.0625rem
    }
}

.header-nav {
    font-size: 0
}

@media only screen and (min-width: 1051px) {
    .header-nav {
        -ms-flex: auto;
        flex: auto;
        height: 100%;
        width: 100%;
        text-align: center;
        position: absolute;
        left: 0;
        top: 0
    }
}

@media only screen and (max-width: 1050px) {
    .header-nav {
        overflow-x: hidden;
        overflow-y: auto;
        padding: 15px 0;
        height: calc(100vh - 10.625rem);
        direction: ltr
    }
}

@media only screen and (max-width: 800px) {
    .header-nav {
        height: calc(100vh - 9.375rem)
    }
}

@media only screen and (max-width: 500px) {
    .header-nav {
        height: calc(100vh - 230px)
    }
}

.header-nav > li {
    font-size: 1rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (min-width: 1051px) {
    .header-nav > li {
        display: inline-block;
        height: 100%
    }
}

@media only screen and (max-width: 1050px) {
    .header-nav > li {
        position: relative;
        direction: rtl
    }

    .header-nav > li.open {
        position: absolute;
        top: 0;
        right: 0;
        background: #fff;
        width: 100%;
        z-index: 8;
        padding-top: 1.1rem
    }
}

.header-nav > li::after {
    content: '';
    display: block
}

@media only screen and (max-width: 1050px) {
    .header-nav > li.haschild::after {
        height: 10px;
        width: 10px;
        border-left: 2px solid #707070;
        border-bottom: 2px solid #707070;
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        -ms-transform-origin: center center;
        transform-origin: center center;
        transition: transform .15s ease-in-out
    }
}

.header-nav > li.haschild.open::after {
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.header-nav > li > a, .header-nav > li > span {
    font-size: 1rem;
    position: relative;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    padding: 0 .3125rem;
    color: #766b6b;
    cursor: pointer
}

@media only screen and (max-width: 1200px) {
    .header-nav > li > a, .header-nav > li > span {
        font-size: .9375rem
    }
}

@media only screen and (max-width: 1050px) {
    .header-nav > li > a, .header-nav > li > span {
        display: inline-block;
        height: 60px;
        line-height: 60px;
        font-size: 16px;
        padding: 0 25px
    }
}

.header-nav > li > a::after, .header-nav > li > span::after {
    content: '';
    width: 0;
    height: 0;
    border-left: .625rem solid transparent;
    border-right: .625rem solid transparent;
    border-bottom: .625rem solid #0032a0;
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0
}

@media only screen and (max-width: 1050px) {
    .header-nav > li > a::after, .header-nav > li > span::after {
        display: none
    }
}

.header-nav > li.haschild:hover > a::after, .header-nav > li.haschild:hover > span::after {
    opacity: 1
}

.header-nav > li > a::before, .header-nav > li > span::before {
    content: '';
    width: 100%;
    height: .3125rem;
    background: #78be1e;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0
}

@media only screen and (max-width: 1050px) {
    .header-nav > li > a::before, .header-nav > li > span::before {
        display: none
    }
}

.header-nav > li.active > a::before, .header-nav > li.active > span::before {
    opacity: 1
}

.header-nav > li.active:hover > a::before, .header-nav > li.active:hover > span::before {
    opacity: 0
}

.header-nav > li:not(.haschild):hover > a::before, .header-nav > li:not(.haschild):hover > span::before {
    opacity: 1
}

@media only screen and (min-width: 1051px) {
    .header-nav > li > a, .header-nav > li > span {
        padding: 0 .9375rem
    }
}

@media only screen and (max-width: 1200px) {
    .header-nav > li > a, .header-nav > li > span {
        padding: 0 .625rem
    }
}

@media only screen and (max-width: 1050px) {
    .header-nav > li > a, .header-nav > li > span {
        padding: 0 25px
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu {
        position: absolute;
        left: 0;
        right: 0;
        top: 99%;
        background: #0078c8;
        background: linear-gradient(45deg, #0078c8 0%, #0032a0 100%);
        background: #fff;
        padding: 2.1875rem 0 1.875rem;
        opacity: 0;
        pointer-events: none;
        transition: opacity .2s linear;
        box-shadow: 0 10px 15px rgba(0, 0, 0, 0.15) !important
    }

    .resizing .header-submenu {
        transition: none
    }

    .header-nav > li:hover > .header-submenu {
        opacity: 1;
        pointer-events: auto
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu ul {
        display: none
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul {
        max-width: 74.375rem;
        margin: 0 auto;
        padding: 0;
        text-align: center;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul {
        position: absolute;
        left: 0;
        top: 2rem;
        z-index: 9;
        width: 100%;
        height: 67vh;
        background: #fff
    }
}

.header-submenu > ul > li {
    position: relative
}

@media only screen and (min-width: 1201px) {
    .header-submenu > ul > li {
        min-width: 140px
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li {
        display: inline-block;
        width: calc(100% / 9)
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li {
        padding: 0 25px 0 15px;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        gap: 1rem
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li:not(:last-of-type) {
        margin-bottom: 0
    }
}

.header-submenu > ul > li.haschild::after {
    content: '';
    height: 10px;
    width: 10px;
    border-left: 2px solid #ccc;
    border-bottom: 2px solid #ccc;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -ms-transform-origin: center center;
    transform-origin: center center;
    transition: transform .15s ease-in-out;
    display: none
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li.haschild::after {
        display: block
    }
}

.header-submenu > ul > li:first-of-type::after {
    top: 33px
}

.header-submenu > ul > li.haschild.open::after {
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.header-submenu > ul > li img {
    position: relative;
    display: block;
    height: 2.5625rem;
    margin: 0 auto;
    z-index: 2;
    transition: opacity .2s linear;
    margin-bottom: .625rem
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li img {
        display: none
    }
}

.header-submenu > ul > li.haschild:hover img {
    opacity: 0
}

.header-submenu > ul > li img:nth-of-type(2) {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0
}

.header-submenu > ul > li.haschild:hover img:nth-of-type(2) {
    opacity: 1
}

.header-submenu > ul > li > a {
    display: inline-block;
    position: relative
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li > a {
        z-index: 1;
        font-size: .875rem
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li > a {
        display: inline-block;
        font-size: 16px
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li a {
        color: #333
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li span {
        position: relative;
        display: block;
        color: #fff;
        z-index: 2;
        transition: color .2s linear
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li.haschild:hover span {
        color: #373737
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul {
        position: absolute;
        top: -.9375rem;
        left: 0;
        background: #fff;
        padding: 5.4375rem 0 0;
        text-align: center;
        width: 100%;
        border-radius: .25rem;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
        opacity: 0;
        pointer-events: none;
        -ms-transform: translateY(10px);
        transform: translateY(10px);
        transition: opacity .2s linear, transform .2s ease-in-out
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li:hover ul {
        opacity: 1;
        pointer-events: auto;
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li ul li {
        padding: 0
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li ul li:not(:last-of-type) {
        margin-bottom: 1rem
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul a {
        display: block;
        font-size: .8125rem;
        color: #999;
        padding: .625rem;
        transition: color .15s linear
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li ul a {
        display: inline-block
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul a:hover {
        color: #666
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul li:first-of-type > a {
        padding-top: 1.875rem
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li ul li:first-of-type > a {
        margin-top: 0
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul li:last-of-type > a {
        padding-bottom: 1.875rem
    }
}

@media only screen and (max-width: 1050px) {
    .header-submenu > ul > li ul li:last-of-type > a {
        margin-bottom: 0
    }
}

.header-info {
    position: relative;
    z-index: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 1050px) {
    .header-info {
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-order: 2;
        order: 2;
        z-index: 200;
        padding: 0 25px;
        height: 12.4rem;
        border-top: 1px solid #E6E6E6;
        transition: transform .2s ease-in-out
    }

    .menu-open .header-info {
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
}

@media only screen and (min-width: 501px) {
    .header-info {
        height: 5.3125rem
    }
}

@media only screen and (min-width: 1051px) {
    .header-info {
        height: auto
    }
}

@media only screen and (max-width: 1050px) {
    .header-info .header-info {
        padding-left: 0
    }
}

@media only screen and (max-width: 1050px) {
    .header-info .profile_menu_button {
        position: absolute;
        right: 230px
    }
}

@media only screen and (max-width: 1050px) {
    .header-info .btn {
        -ms-flex-order: 1;
        order: 1;
        min-width: 130px
    }
}

.header-search, .header-cart {
    position: relative;
    width: 2rem;
    height: 2rem;
    fill: #373737
}

.header-search:active, .header-search.nice-select.open, .header-cart:active, .header-cart.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.header-search svg, .header-cart svg {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    pointer-events: none
}

@media only screen and (max-width: 1050px) {
    .header-info .header-search, .header-info .header-cart {
        display: none
    }
}

@media only screen and (max-width: 1050px) {
    .header-search {
        margin-left: .75rem
    }
}

.search-open .header-btns .header-search {
    fill: #0078c8
}

@media only screen and (max-width: 1050px) {
    .header-cart {
        margin-left: .75rem
    }
}

.header-cart svg {
    width: 1.25rem;
    height: 1.625rem
}

.header-cart::after {
    position: absolute;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #f22b2b;
    border: 3px solid #ffffff;
    bottom: -.0625rem;
    right: -.0625rem
}

.header-cart--notif::after {
    content: ""
}

.header-divider {
    width: 2px;
    height: 1.25rem;
    border-radius: 2px;
    margin: 0 .3125rem
}

@media only screen and (max-width: 1050px) {
    .header-divider {
        display: none
    }
}

.header-tel {
    direction: ltr;
    line-height: 1
}

@media only screen and (min-width: 1051px) {
    .header-tel {
        margin-left: 1.25rem
    }
}

.header-tel a {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.375rem;
    color: #2b2929
}

.header-tel a span {
    display: inline-block;
    color: #bfb8af;
    font-size: 1rem;
    margin-right: .3125rem
}

.header-btns {
    display: none;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 1050px) {
    .header-btns {
        display: -ms-flexbox;
        display: flex
    }
}

.header-navbtn {
    position: relative;
    width: 28px;
    height: 28px
}

@media only screen and (max-width: 1050px) {
    .header-navbtn {
        display: -ms-inline-flexbox;
        display: inline-flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.header-navbtn::before, .header-navbtn::after {
    content: ""
}

.header-navbtn::before, .header-navbtn::after, .header-navbtn i {
    position: absolute;
    width: 100%;
    height: 3px;
    border-radius: 3px;
    left: 0;
    top: 50%;
    margin-top: -1.5px;
    background-color: #0078c8;
    -ms-transform-origin: center;
    transform-origin: center;
    transition: all 0.2s ease-in-out
}

.header-navbtn::before {
    -ms-transform: translateY(-9px);
    transform: translateY(-9px)
}

.menu-open .header-navbtn::before {
    top: 50%;
    -ms-transform: translateY(0) rotate(-45deg);
    transform: translateY(0) rotate(-45deg)
}

.header-navbtn::after {
    -ms-transform: translateY(9px);
    transform: translateY(9px)
}

.menu-open .header-navbtn::after {
    bottom: 50%;
    -ms-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg)
}

.menu-open .header-navbtn i {
    opacity: 0
}

@media only screen and (min-width: 1051px) {
    .header-submenu {
        background: #fff
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li span {
        color: #333
    }
}

.header-submenu > ul > li > a {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    min-height: 41px
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li {
        width: calc(100% / 6)
    }
}

.header-nav > li > a::after, .header-nav > li > span::after {
    border-color: transparent
}

#header > div.header-wrap img:nth-child(2) {
    opacity: 1;
    position: static
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul {
        position: static;
        top: 0;
        left: 0;
        background: transparent;
        padding: 1rem 0;
        box-shadow: none;
        opacity: 1;
        text-align: right;
        border-top: 1px solid #eee;
        border-radius: 0
    }

    .header-submenu > ul > li:hover ul {
        -ms-transform: translateY(0.656rem);
        transform: translateY(0.656rem)
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul li:first-of-type > a {
        padding-top: 0
    }

    .header-submenu > ul {
        max-width: 1160px
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu {
        box-shadow: none;
        border-top: 1px solid #eee;
        padding: .5rem
    }
}

#header > div.header-wrap > div.header-container > ul > li > div > ul > li > ul > li > a {
    font-weight: bold;
    color: #666
}

#header > div.header-wrap > div.header-container > ul > li > div > ul > li > ul > li > ul {
    border: none;
    padding: 0;
    margin-right: .7rem
}

#header > div.header-wrap > div.header-container > ul > li > div > ul > li > ul > li > ul a {
    padding: 0
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul li:last-of-type > a {
        padding-bottom: 0
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul a {
        padding-top: 0
    }
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li ul {
        -ms-transform: none;
        transform: none
    }
}

.header-submenu > ul > li.haschild:hover img {
    opacity: 1 !important
}

#header > div.header-wrap > div.header-container > ul > li > div > ul > li > ul > li > ul {
    text-indent: 20px;
    padding-bottom: 1rem;
    margin: 0
}

@media only screen and (min-width: 1051px) {
    .header-submenu > ul > li:hover ul {
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

@media only screen and (max-width: 800px) {
    #header > div.header-wrap > div.header-container > ul > li > div > ul > li > ul > li > ul {
        text-indent: 10px;
        padding-top: 10px
    }
}

.header-submenu > ul > li img {
    margin-left: 0;
    margin-right: 0
}

.header-wrap > .header-container > ul > li.haschild.open > div > ul > li.haschild.open > ul {
    position: absolute;
    top: 3rem;
    right: 0;
    width: 100%;
    height: 67vh;
    background: #fff;
    z-index: 11;
    padding-right: 1rem;
    padding-top: 1rem
}

.header-submenu > ul > li.haschild::after {
    border-color: #333 !important
}

.header-submenu > ul > li.haschild.open::after {
    position: absolute;
    right: 7px;
    top: 17px !important
}

.header-submenu > ul > li.haschild.open::after {
    -ms-transform: rotate(225deg);
    transform: rotate(225deg)
}

.footer {
    position: relative;
    padding-top: 8px;
    border-top: 1px solid #e8e8e8
}

@media only screen and (max-width: 800px) {
    .footer {
        padding-top: 4px
    }
}

.footer-wrap {
    max-width: 74.375rem;
    margin: 0 auto;
    padding: 3.75rem 10px
}

.footer-list {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 1.25rem
}

@media only screen and (min-width: 1051px) {
    .footer-list {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

@media only screen and (min-width: 801px) {
    .footer-list {
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
}

.footer-col {
    margin-bottom: 1.875rem
}

@media only screen and (min-width: 801px) {
    .footer-col {
        width: 20%
    }
}

@media only screen and (min-width: 801px) {
    .footer-col:last-of-type {
        -ms-flex: none;
        flex: none;
        max-width: 20%;
        width: auto;
        display: block
    }
}

.footer-col:not(:last-of-type) {
    padding-left: .9375rem
}

@media only screen and (max-width: 800px) {
    .footer-col {
        width: 25%
    }
}

@media only screen and (max-width: 500px) {
    .footer-col {
        width: 50%
    }
}

.footer-icon {
    display: block;
    max-width: 4.6875rem;
    max-height: 4.6875rem;
    margin-bottom: 1.25rem
}

.footer-title {
    position: relative;
    display: inline-block;
    color: gray;
    margin-bottom: 3.125rem
}

.footer-title::after {
    content: '';
    width: 2.25rem;
    height: 2px;
    background: #999;
    border-radius: 2px;
    position: absolute;
    right: 0;
    bottom: -1.5625rem;
    pointer-events: none
}

.footer-url a {
    color: #b3b3b3;
    transition: color .1s linear
}

@media only screen and (min-width: 801px) {
    .footer-url a:hover {
        color: #1d4f9b
    }
}

.footer-url li {
    margin-bottom: .3125rem
}

.footer-divider {
    height: 2px;
    border-radius: 2px;
    background: #E6E6E6;
    margin-bottom: 3.75rem
}

.footer-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    column-gap: 2rem;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 800px) {
    .footer-container {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.footer-nav {
    margin-bottom: 1.125rem;
    position: relative
}

@media only screen and (max-width: 800px) {
    .footer-nav {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
        padding-right: 1rem
    }
}

.footer-nav ul {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns:1fr 1fr 1fr;
    gap: 1rem 2rem;
    text-align: right
}

@media only screen and (max-width: 800px) {
    .footer-nav ul {
        -ms-grid-columns: 1fr;
        grid-template-columns:1fr
    }
}

.footer-nav .enamad-container {
    position: absolute;
    left: 0;
    top: 0
}

@media only screen and (max-width: 800px) {
    .footer-nav .enamad-container {
        position: relative;
        left: unset;
        top: unset;
        width: 100%;
        text-align: center;
        margin-bottom: 20px
    }
}

@media only screen and (max-width: 800px) {
    .footer-nav nav {
        width: 100%;
        text-align: center
    }
}

.footer-nav nav:last-of-type {
    text-align: center
}

@media only screen and (max-width: 800px) {
    .footer-nav nav:last-of-type {
        text-align: center
    }
}

.footer-nav li {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center
}

.footer-nav li:nth-child(4) {
    -ms-flex-pack: start;
    justify-content: start
}

@media only screen and (max-width: 900px) {
    .footer-nav li {
        margin: 0 .9375rem
    }
}

@media only screen and (max-width: 800px) {
    .footer-nav li {
        display: block;
        margin: 0 0 .9375rem
    }
}

.footer-nav li:first-of-type {
    margin-right: 0
}

.footer-nav li:last-of-type {
    margin-left: 0
}

.footer-nav li a {
    color: gray;
    transition: color .1s linear
}

@media only screen and (min-width: 801px) {
    .footer-nav li a:hover {
        color: #1d4f9b
    }
}

.footer-logo {
    width: 11.25rem;
    height: 3rem;
    margin-right: 15px
}

@media only screen and (max-width: 800px) {
    .footer-logo {
        margin: 0 auto 1.875rem
    }
}

.footer-logo a, .footer-logo img {
    width: 100%;
    height: 100%;
    display: block
}

@media only screen and (max-width: 800px) {
    .footer-social {
        text-align: center
    }
}

.footer-social ul {
    padding: 6px 0px;
    width: 210px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 800px) {
    .footer-social ul {
        margin: 0 auto
    }
}

.footer-social li {
    display: inline-block
}

.footer-social li img {
    width: 1.375rem;
    height: 1.375rem;
    vertical-align: middle
}

.footer-social a {
    fill: #9a9a9a;
    opacity: .5
}

.footer-social a:hover {
    opacity: .8
}

.footer-social p {
    color: #0046ab;
    font-weight: bold;
    margin-top: 10px;
    font-size: 13px
}

.footer-copy {
    background: linear-gradient(10deg, #0078c8 0%, #0032a0 100%);
    font-size: .875rem;
    color: #fff;
    text-align: center;
    min-height: 4.4375rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 15px
}

.footer-copy small {
    opacity: .5
}

.footer-copy span {
    display: inline-block;
    direction: ltr
}

.footer .footer-item-col {
    margin-bottom: 0rem
}

.footer .footer-item-col a {
    color: #b3b3b3;
    transition: color .1s linear;
    line-height: 2.5
}

.footer .footer-item-col a a:hover {
    color: #1d4f9b
}

.intro {
    position: relative;
    height: calc(100vh - 5.3125rem);
    max-height: 150rem;
    min-height: 500px;
    background-color: #707070
}

@media only screen and (min-width: 501px) {
    .intro {
        min-height: 540px
    }
}

@media only screen and (max-width: 800px) {
    .intro {
        height: calc(100vh - 4.0625rem)
    }
}

@media only screen and (max-width: 500px) {
    .intro {
        height: calc(100vh - 4.0625rem)
    }
}

@media only screen and (max-width: 600px) {
    .intro--product + .section, .intro--support + .section {
        padding-top: 300px
    }
}

.intro--productlist {
    height: 35.625rem
}

@media only screen and (max-width: 500px) {
    .intro--productlist {
        height: auto
    }
}

.intro--search {
    height: auto;
    min-height: 1px;
    max-height: 100%
}

.intro--job {
    min-height: 43.75rem
}

@media only screen and (max-width: 800px) {
    .intro--job {
        height: auto;
        min-height: 1px;
        z-index: 10
    }
}

.intro--job-list {
    min-height: 1px;
    height: auto
}

.intro-slider {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    padding: 0
}

.intro-slide {
    height: 100%;
    text-align: right
}

.intro-slide::after {
    content: ''
}

.intro--support .intro-slide::before {
    content: '';
    width: 100%;
    height: 50%;
    background: linear-gradient(to top, #000 0%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1
}

.intro-bg {
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    bottom: 0;
    opacity: 0;
    overflow: hidden;
    transition: opacity 1s linear
}

.intro-slide.active:not(.swiper-slide) .intro-bg, .swiper-slide-active .intro-bg, .swiper-slide-duplicate-active .intro-bg {
    opacity: 1;
    transition: opacity .2s .3s linear
}

[data-parallax] .intro-bg {
    height: 110%
}

.intro--job .intro-header {
    position: relative;
    padding: 0 15px;
    max-width: 74.375rem;
    height: calc(100% - 25rem);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    margin: 0 auto;
    z-index: 5
}

@media only screen and (max-width: 800px) {
    .intro--job .intro-header {
        height: 52vw
    }
}

.intro--job-list .intro-header {
    padding: 6.25rem 0;
    height: auto
}

.intro-image {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    transition: transform 2s cubic-bezier(0.19, 1, 0.22, 1), opacity 1s linear
}

.intro-slide.active:not(.swiper-slide) .intro-image, .swiper-slide-active .intro-image, .swiper-slide-duplicate-active .intro-image {
    opacity: 1;
    -ms-transform: scale(1);
    transform: scale(1);
    transition: transform 2s 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.2s 0.3s linear
}

@media only screen and (max-width: 800px) {
    .intro-slide.active:not(.swiper-slide) .intro-image, .swiper-slide-active .intro-image, .swiper-slide-duplicate-active .intro-image {
        transition-delay: .1s
    }
}

[data-parallax] .intro-slide.active:not(.swiper-slide) .intro-image, [data-parallax] .swiper-slide-active .intro-image, [data-parallax] .swiper-slide-duplicate-active .intro-image {
    -ms-transform: scale(1.05);
    transform: scale(1.05)
}

@media only screen and (max-width: 800px) {
    .intro--job .intro-image {
        bottom: auto
    }
}

@media only screen and (max-width: 800px) {
    .intro--job .intro-image::after {
        content: "";
        display: block;
        padding-top: 55%
    }
}

.intro--job-list .intro-image {
    bottom: 0
}

.intro--job-list .intro-image::after {
    display: none
}

.intro-content {
    position: absolute;
    bottom: 45%;
    right: 0;
    width: 100%
}

.intro--about .intro-content, .intro--bottom .intro-content {
    bottom: 16.25rem
}

@media only screen and (max-width: 1050px) {
    .intro--about .intro-content, .intro--bottom .intro-content {
        bottom: 200px
    }
}

@media only screen and (max-width: 500px) {
    .intro--about .intro-content, .intro--bottom .intro-content {
        bottom: 180px
    }
}

.intro--support .intro-content {
    bottom: 16.25rem
}

@media only screen and (max-width: 600px) {
    .intro--support .intro-content {
        bottom: 200px
    }
}

.intro--productlist .intro-content {
    bottom: 50%;
    -ms-transform: translateY(50%);
    transform: translateY(50%)
}

.intro--left .intro-content {
    left: 80px;
    right: unset;
    width: auto
}

.intro--center .intro-content {
    margin: 0 auto;
    max-width: 28rem;
    position: absolute;
    right: 0;
    left: 0;
    bottom: 230px
}

.intro--top .intro-content {
    top: 30px
}

@media only screen and (max-width: 1050px) {
    .intro--index .intro-content, .intro--top .intro-content, .intro--bottom .intro-content, .intro--left .intro-content, .intro--center .intro-content {
        bottom: 196px
    }
}

@media only screen and (max-width: 500px) {
    .intro--index .intro-content, .intro--top .intro-content, .intro--bottom .intro-content, .intro--left .intro-content, .intro--center .intro-content {
        bottom: 155px
    }
}

.intro-wrap {
    padding-left: 15px;
    padding-right: 15px;
    max-width: 74.375rem;
    margin: 0 auto
}

@media only screen and (max-width: 1050px) {
    .intro--index .intro-nav .intro-wrap, .intro--about .intro-nav .intro-wrap, .intro--left .intro-nav .intro-wrap, .intro--top .intro-nav .intro-wrap, .intro--bottom .intro-nav .intro-wrap, .intro--center .intro-nav .intro-wrap {
        padding: 0
    }
}

.intro--job .intro-wrap {
    position: absolute;
    bottom: 3.4375rem;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 74.375rem
}

@media only screen and (max-width: 74.375rem) {
    .intro--job .intro-wrap {
        width: 100%
    }
}

@media only screen and (max-width: 800px) {
    .intro--job .intro-wrap {
        position: relative;
        bottom: auto;
        left: auto;
        -ms-transform: none;
        transform: none;
        padding: 0
    }
}

.intro--job-list .intro-wrap {
    position: relative;
    left: auto;
    -ms-transform: none;
    transform: none;
    bottom: -3.625rem;
    z-index: 2;
    bottom: auto;
    margin-bottom: -3.75rem
}

@media only screen and (max-width: 800px) {
    .intro--job-list .intro-wrap {
        margin-bottom: -2.5rem;
        bottom: -1.25rem;
        padding: 0 1.25rem
    }
}

@media only screen and (max-width: 500px) {
    .intro--job-list .intro-wrap {
        margin-bottom: 0;
        bottom: 0;
        padding: 0
    }
}

.intro-desc {
    display: inline-block;
    margin-top: 5rem;
    -ms-transform: translateX(102%);
    transform: translateX(102%);
    transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    overflow: hidden;
    padding-bottom: .3125rem
}

.intro--productlist .intro-slide.active .intro-desc, .intro--productlist .swiper-slide-active .intro-desc {
    -ms-transform: translateX(0);
    transform: translateX(0);
    transition-delay: .8s
}

.intro-desc p {
    color: #fff
}

.intro-desc span {
    display: block;
    font-size: 1.75rem;
    color: #fff;
    margin-bottom: .3125rem
}

@media only screen and (max-width: 1050px) {
    .intro-desc span {
        font-size: 1.625rem
    }
}

@media only screen and (max-width: 800px) {
    .intro-desc span {
        font-size: 1.5rem
    }
}

@media only screen and (max-width: 500px) {
    .intro-desc span {
        font-size: 1.375rem
    }
}

.intro-desc i {
    font-size: 1.625rem;
    color: #fff
}

@media only screen and (max-width: 1050px) {
    .intro-desc i {
        font-size: 1.5rem
    }
}

@media only screen and (max-width: 800px) {
    .intro-desc i {
        font-size: 1.375rem
    }
}

@media only screen and (max-width: 500px) {
    .intro-desc i {
        font-size: 1.125rem
    }
}

.intro-descwrap {
    -ms-transform: translateX(-102%);
    transform: translateX(-102%);
    transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955)
}

.intro--productlist .intro-slide.active .intro-descwrap, .intro--productlist .swiper-slide-active .intro-descwrap {
    -ms-transform: translateX(0);
    transform: translateX(0);
    transition-delay: .8s
}

@media only screen and (max-width: 600px) {
    .intro--product .bus li:not(:first-child)::before, .intro--support .bus li:not(:first-child)::before {
        display: none
    }
}

.intro .fpslider__content {
    height: 100% !important
}

.intro .fpslider__nav {
    position: absolute;
    width: 100%;
    z-index: 3;
    line-height: 0;
    bottom: 14.375rem;
    text-align: right;
    padding-left: 15px;
    padding-right: 15px;
    max-width: 74.375rem;
    right: 0;
    left: 0;
    margin: auto
}

@media only screen and (max-width: 1050px) {
    .intro--index .fpslider__nav, .intro--top .fpslider__nav, .intro--bottom .fpslider__nav, .intro--left .fpslider__nav, .intro--center .fpslider__nav {
        bottom: 160px
    }
}

@media only screen and (max-width: 500px) {
    .intro--index .fpslider__nav, .intro--top .fpslider__nav, .intro--bottom .fpslider__nav, .intro--left .fpslider__nav, .intro--center .fpslider__nav {
        bottom: 130px
    }
}

.intro--productlist .fpslider__nav {
    max-width: 72.5rem;
    padding: 0 .625rem;
    bottom: 5.625rem
}

.intro .swiper-pagination {
    line-height: 0;
    bottom: 14.375rem;
    text-align: right;
    padding-left: 15px;
    padding-right: 15px;
    max-width: 74.375rem;
    right: 0;
    margin: auto
}

@media only screen and (max-width: 1050px) {
    .intro--index .swiper-pagination, .intro--top .swiper-pagination, .intro--bottom .swiper-pagination, .intro--left .swiper-pagination, .intro--center .swiper-pagination {
        bottom: 160px
    }
}

@media only screen and (max-width: 500px) {
    .intro--index .swiper-pagination, .intro--top .swiper-pagination, .intro--bottom .swiper-pagination, .intro--left .swiper-pagination, .intro--center .swiper-pagination {
        bottom: 130px
    }
}

@media only screen and (max-width: 500px) {
    .intro--productlist .swiper-pagination {
        text-align: center;
        bottom: 14px;
        top: initial !important
    }
}

.intro-btn {
    margin-top: -.3125rem;
    padding: 1.25rem 1.25rem;
    opacity: 0;
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.2s linear !important
}

.intro-slide.active .intro-btn, .swiper-slide-active .intro-btn {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.intro--index .intro-slide.active .intro-btn, .intro--index .swiper-slide-active .intro-btn, .intro--top .intro-slide.active .intro-btn, .intro--top .swiper-slide-active .intro-btn, .intro--bottom .intro-slide.active .intro-btn, .intro--bottom .swiper-slide-active .intro-btn, .intro--left .intro-slide.active .intro-btn, .intro--left .swiper-slide-active .intro-btn, .intro--center .intro-slide.active .intro-btn, .intro--center .swiper-slide-active .intro-btn {
    transition-delay: 1.3s !important
}

.intro-nav {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2.5rem;
    z-index: 2
}

@media only screen and (max-width: 1050px) {
    .intro--index .intro-nav, .intro--about .intro-nav, .intro--top .intro-nav, .intro--bottom .intro-nav, .intro--left .intro-nav, .intro--center .intro-nav {
        bottom: 0
    }
}

@media only screen and (max-width: 600px) {
    .page-home .intro--index .intro-nav {
        display: none
    }
}

@media only screen and (max-width: 600px) {
    .intro--product .intro-nav, .intro--support .intro-nav {
        bottom: 0;
        -ms-transform: translateY(66.66%);
        transform: translateY(66.66%)
    }
}

.intro-nav::after, .intro-nav::before {
    width: 80px;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 2;
    pointer-events: none
}

.intro--index .intro-nav::after, .intro--about .intro-nav::after, .intro--top .intro-nav::after, .intro--bottom .intro-nav::after, .intro--center .intro-nav::after, .intro--left .intro-nav::after, .intro--index .intro-nav::before, .intro--about .intro-nav::before, .intro--top .intro-nav::before, .intro--bottom .intro-nav::before, .intro--center .intro-nav::before, .intro--left .intro-nav::before {
    content: '';
    display: block
}

@media only screen and (min-width: 1051px) {
    .intro--index .intro-nav::after, .intro--about .intro-nav::after, .intro--top .intro-nav::after, .intro--bottom .intro-nav::after, .intro--center .intro-nav::after, .intro--left .intro-nav::after, .intro--index .intro-nav::before, .intro--about .intro-nav::before, .intro--top .intro-nav::before, .intro--bottom .intro-nav::before, .intro--center .intro-nav::before, .intro--left .intro-nav::before {
        display: none
    }
}

.intro-nav::after {
    left: 0;
    background: linear-gradient(to right, #fff 0%, rgba(255, 255, 255, 0) 100%)
}

@media only screen and (max-width: 1050px) {
    .intro-nav::after {
        background: none
    }
}

.intro-nav::before {
    right: 0;
    background: linear-gradient(to left, #fff 0%, rgba(255, 255, 255, 0) 100%)
}

@media only screen and (max-width: 1050px) {
    .intro-nav::before {
        background: none
    }
}

.intro-nav ul {
    display: -ms-flexbox;
    display: flex
}

@media only screen and (max-width: 1050px) {
    .intro--index .intro-nav ul, .intro--about .intro-nav ul, .intro--top .intro-nav ul, .intro--bottom .intro-nav ul, .intro--left .intro-nav ul, .intro--center .intro-nav ul {
        background: #fff;
        overflow-y: hidden;
        overflow-x: auto;
        text-align: center;
        white-space: nowrap;
        padding-bottom: .625rem
    }
}

@media only screen and (max-width: 600px) {
    .intro--product .intro-nav ul, .intro--support .intro-nav ul {
        display: block;
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
        border-radius: 4px
    }
}

.intro-nav ul li {
    text-align: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex: 1;
    flex: 1;
    background: #fff;
    height: 10rem;
    padding: 8px .625rem
}

@media only screen and (max-width: 600px) {
    .intro--product .intro-nav ul li, .intro--support .intro-nav ul li {
        height: auto;
        padding: 10px 25px
    }
}

@media only screen and (max-width: 1050px) {
    .intro--index .intro-nav ul li, .intro--about .intro-nav ul li, .intro--top .intro-nav ul li, .intro--bottom .intro-nav ul li, .intro--left .intro-nav ul li, .intro--center .intro-nav ul li {
        height: 125px
    }
}

@media only screen and (max-width: 500px) {
    .intro--index .intro-nav ul li, .intro--about .intro-nav ul li, .intro--top .intro-nav ul li, .intro--bottom .intro-nav ul li, .intro--left .intro-nav ul li, .intro--center .intro-nav ul li {
        height: 100px
    }
}

.intro-nav ul li:first-of-type {
    border-radius: 0 .25rem .25rem 0;
    padding-right: 24px
}

@media only screen and (max-width: 1050px) {
    .intro--index .intro-nav ul li:first-of-type, .intro--about .intro-nav ul li:first-of-type, .intro--top .intro-nav ul li:first-of-type, .intro--bottom .intro-nav ul li:first-of-type, .intro--left .intro-nav ul li:first-of-type, .intro--center .intro-nav ul li:first-of-type {
        border-radius: 0
    }
}

.intro--product .intro-nav ul li:first-of-type, .intro--support .intro-nav ul li:first-of-type {
    padding-right: .625rem
}

@media only screen and (max-width: 600px) {
    .intro--product .intro-nav ul li:first-of-type, .intro--support .intro-nav ul li:first-of-type {
        border-radius: 4px 4px 0 0;
        padding: 30px 25px 10px
    }
}

.intro-nav ul li:nth-last-child(2) {
    padding-left: 2.5rem
}

.intro--product .intro-nav ul li:nth-last-child(2), .intro--support .intro-nav ul li:nth-last-child(2) {
    padding-left: .625rem
}

@media only screen and (max-width: 1050px) {
    .intro--product .intro-nav ul li:nth-last-child(2), .intro--support .intro-nav ul li:nth-last-child(2) {
        border-radius: .25rem 0 0 .25rem
    }
}

@media only screen and (max-width: 600px) {
    .intro--product .intro-nav ul li:nth-last-child(2), .intro--support .intro-nav ul li:nth-last-child(2) {
        border-radius: 0 0 4px 4px;
        padding: 10px 25px 30px
    }
}

.intro-nav ul li:last-of-type {
    border-radius: .25rem 0 0 .25rem
}

@media only screen and (max-width: 1050px) {
    .intro--index .intro-nav ul li:last-of-type, .intro--about .intro-nav ul li:last-of-type, .intro--top .intro-nav ul li:last-of-type, .intro--bottom .intro-nav ul li:last-of-type, .intro--left .intro-nav ul li:last-of-type, .intro--center .intro-nav ul li:last-of-type {
        border-radius: 0
    }
}

.intro-nav ul li:last-of-type::before {
    display: none
}

.intro-nav ul li.intro-shop {
    -ms-flex: none;
    flex: none;
    width: 10rem;
    background: linear-gradient(45deg, #0078c8 0%, #0032a0 100%);
    padding: 8px 24px
}

@media only screen and (max-width: 600px) {
    .intro-nav ul li.intro-shop {
        width: 100%
    }
}

.intro-nav .card-f {
    position: relative;
    width: 100%;
    max-width: 15rem;
    height: 100%;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden
}

.intro--product .intro-nav .card-f {
    text-align: right
}

.intro-nav .card-f img, .intro-nav .card-f p {
    position: relative;
    z-index: 1
}

.intro--product .intro-nav .card-f img {
    -ms-flex: none;
    flex: none;
    height: 4.375rem
}

.intro--about .intro-shop img, .intro--support .intro-shop img {
    margin-bottom: 0;
    height: 3.875rem !important;
    width: 3.875rem !important;
    max-height: none
}

.intro-nav .card-f p {
    color: #666;
    font-size: .875rem
}

.intro--product .intro-nav .card-f p {
    color: #666;
    line-height: 1.25rem;
    height: 3.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: .6
}

@media only screen and (max-width: 600px) {
    .intro--product .intro-nav .card-f p {
        height: auto
    }
}

.intro-nav .intro-shop .card-f p {
    color: #fff;
    height: auto;
    opacity: 1
}

.intro--product .intro-nav .card-f b {
    color: #666
}

.intro--support .intro-nav .card-f__title {
    font-size: 1rem;
    margin-bottom: .625rem;
    text-align: right
}

.intro--support .intro-nav .card-f__desc {
    text-align: right;
    color: gray;
    font-size: 2.5rem;
    line-height: 1
}

@media only screen and (max-width: 1050px) {
    .intro--support .intro-nav .card-f__desc {
        font-size: 2.25rem
    }
}

@media only screen and (max-width: 800px) {
    .intro--support .intro-nav .card-f__desc {
        font-size: 2rem
    }
}

@media only screen and (max-width: 500px) {
    .intro--support .intro-nav .card-f__desc {
        font-size: 1.75rem
    }
}

.intro--support .intro-nav .card-f__desc span {
    opacity: .5;
    font-size: .875rem
}

.intro-links {
    margin-top: 2.8125rem
}

@media only screen and (max-width: 600px) {
    .intro-links {
        margin-top: 1.875rem
    }
}

.intro .s-title {
    opacity: 0;
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.2s linear
}

.intro--product .s-title, .intro--productlist .s-title, .intro--about .s-title, .intro--support .s-title {
    -ms-transform: translateY(-10px);
    transform: translateY(-10px)
}

.intro-slide.active .s-title, .swiper-slide-active .s-title {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
    transition-delay: 1s
}

@media only screen and (max-width: 600px) {
    .intro-slide.active .s-title, .swiper-slide-active .s-title {
        font-size: 1.1rem
    }
}

.intro--productlist .intro-slide.active .s-title, .intro--productlist .swiper-slide-active .s-title {
    transition-delay: .5s
}

.intro--index .intro-slide.active .s-title, .intro--index .swiper-slide-active .s-title, .intro--top .intro-slide.active .s-title, .intro--top .swiper-slide-active .s-title, .intro--bottom .intro-slide.active .s-title, .intro--bottom .swiper-slide-active .s-title, .intro--left .intro-slide.active .s-title, .intro--left .swiper-slide-active .s-title, .intro--center .intro-slide.active .s-title, .intro--center .swiper-slide-active .s-title {
    transition-delay: 1.2s
}

.intro .s-subtitle {
    max-width: 22.375rem;
    padding: 1.25rem;
    color: #373737;
    z-index: 2;
    -ms-transform: translateY(10px);
    transform: translateY(10px);
    opacity: 0;
    transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.2s linear
}

.intro-slide.active .s-subtitle, .swiper-slide-active .s-subtitle {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
    transition-delay: 1.2s
}

.intro--productlist .intro-slide.active .s-subtitle, .intro--productlist .swiper-slide-active .s-subtitle {
    transition-delay: .7s
}

.intro--index .s-subtitle, .intro--top .s-subtitle, .intro--bottom .s-subtitle, .intro--left .s-subtitle, .intro--center .s-subtitle {
    opacity: 1;
    padding: 0;
    overflow: hidden;
    background: transparent;
    -ms-transform: translateX(102%);
    transform: translateX(102%);
    box-shadow: none;
    transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955), box-shadow 0.2s linear;
    transition-delay: .3s
}

.intro--index .intro-slide.active .s-subtitle, .intro--index .swiper-slide-active .s-subtitle, .intro--top .intro-slide.active .s-subtitle, .intro--top .swiper-slide-active .s-subtitle, .intro--bottom .intro-slide.active .s-subtitle, .intro--bottom .swiper-slide-active .s-subtitle, .intro--left .intro-slide.active .s-subtitle, .intro--left .swiper-slide-active .s-subtitle, .intro--center .intro-slide.active .s-subtitle, .intro--center .swiper-slide-active .s-subtitle {
    -ms-transform: translateX(0);
    transform: translateX(0);
    box-shadow: 0 .0625rem .125rem rgba(0, 0, 0, 0.02);
    transition-delay: 1s
}

.intro .s-subtitle p {
    padding: 0.75rem;
    background: #fff;
    border-radius: .25rem;
    -ms-transform: translateX(-102%);
    transform: translateX(-102%);
    transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    transition-delay: .3s
}

.intro--index .intro-slide.active .s-subtitle p, .intro--index .swiper-slide-active .s-subtitle p, .intro--top .intro-slide.active .s-subtitle p, .intro--top .swiper-slide-active .s-subtitle p, .intro--bottom .intro-slide.active .s-subtitle p, .intro--bottom .swiper-slide-active .s-subtitle p, .intro--left .intro-slide.active .s-subtitle p, .intro--left .swiper-slide-active .s-subtitle p, .intro--center .intro-slide.active .s-subtitle p, .intro--center .swiper-slide-active .s-subtitle p {
    -ms-transform: translateX(0);
    transform: translateX(0);
    transition-delay: 1s
}

.intro--product .s-subtitle, .intro--about .s-subtitle, .intro--productlist .s-subtitle, .intro--support .s-subtitle {
    font-family: IRANSansMedium, IRANSans, tahoma, arial;
    color: #666;
    padding: 0 .9375rem;
    height: 2.5rem;
    line-height: 2.5rem;
    line-height: 2.625rem
}

.intro--product .s-subtitle span, .intro--about .s-subtitle span, .intro--productlist .s-subtitle span, .intro--support .s-subtitle span {
    color: #9a9a9a;
    font-family: IRANSansLight, IRANSans, tahoma, arial
}

.intro .s-header {
    position: relative
}

.newsletter {
    max-width: 68.125rem;
    margin: 0 auto;
    padding: 0 15px
}

.newsletter [class*="col-"] {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.newsletter [class*="col-"]:last-of-type {
    -ms-flex-pack: end;
    justify-content: flex-end
}

@media only screen and (max-width: 1050px) {
    .newsletter [class*="col-"]:last-of-type {
        -ms-flex-pack: center;
        justify-content: center
    }
}

.newsletter-wrap {
    width: 100%
}

.newsletter-header {
    margin-bottom: 5rem
}

.newsletter-title {
    color: #373737
}

.newsletter-subtitle {
    color: #666;
    font-size: 1.125rem
}

.newsletter-form {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 2.5rem;
    margin-bottom: .9375rem
}

@media only screen and (max-width: 1050px) {
    .newsletter-form {
        padding-bottom: 1.875rem
    }
}

@media only screen and (max-width: 500px) {
    .newsletter-form {
        padding-bottom: 15px
    }
}

.newsletter-form::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: .25rem;
    border-radius: .25rem;
    background: #0078c8
}

@media only screen and (max-width: 500px) {
    .newsletter-form::after {
        height: 2px
    }
}

.newsletter-form input {
    -ms-flex: auto;
    flex: auto;
    background: transparent;
    border-radius: 0;
    color: #666;
    padding: 0 0 0 .625rem;
    font-size: 1.875rem;
    min-width: 0
}

@media only screen and (max-width: 1050px) {
    .newsletter-form input {
        font-size: 1.625rem
    }
}

@media only screen and (max-width: 800px) {
    .newsletter-form input {
        font-size: 18px
    }
}

@media only screen and (max-width: 500px) {
    .newsletter-form input {
        font-size: 16px
    }
}

.newsletter-form ::placeholder {
    color: gray
}

.newsletter-text {
    color: gray;
    font-size: 1.125rem
}

.newsletter-btn {
    -ms-flex: none;
    flex: none
}

@media only screen and (max-width: 500px) {
    .newsletter-btn .btn {
        min-width: 0;
        font-size: 13px
    }
}

.newsletter .flip-alone {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
    justify-content: flex-end
}

@media only screen and (max-width: 800px) {
    .newsletter .flip-alone {
        -ms-flex-pack: center;
        justify-content: center
    }
}

.newsletter-img {
    position: relative;
    width: 100%;
    max-width: 22.875rem
}

.newsletter-img::after {
    content: '';
    display: block;
    padding-top: 93%
}

.newsletter-img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

@media only screen and (max-width: 800px) {
    .newsletter-img {
        margin-top: 3.125rem
    }
}

.menu {
    position: fixed;
    right: 0;
    top: 50%;
    -ms-transform: translate(120%, -50%);
    transform: translate(120%, -50%);
    direction: rtl;
    transition: all 0.7s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    z-index: 80
}

@media only screen and (max-width: 800px) {
    .menu {
        width: 100%;
        top: auto;
        -ms-transform: translateY(110%);
        transform: translateY(110%);
        bottom: 0
    }
}

.menu--show {
    display: none;
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1)
}

@media only screen and (max-width: 800px) {
    .menu--show {
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

.menu::before {
    position: absolute;
    width: 100%;
    height: calc(100% - 15px);
    bottom: 0;
    left: 0;
    background-color: #fff;
    box-shadow: 0 -10px 10px rgba(0, 0, 0, 0.07)
}

@media only screen and (max-width: 800px) {
    .menu::before {
        content: ""
    }
}

.menu > ul {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    z-index: 2
}

@media only screen and (max-width: 800px) {
    .menu > ul {
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-align: end;
        align-items: flex-end;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

.menu-item {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 5.75rem
}

@media only screen and (max-width: 1200px) {
    .menu-item {
        width: 5rem
    }
}

@media only screen and (max-width: 800px) {
    .menu-item {
        width: auto !important;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
    }
}

.menu-item--sub {
    width: 6.4375rem
}

@media only screen and (max-width: 1200px) {
    .menu-item--sub {
        width: 5.75rem
    }
}

@media only screen and (max-width: 500px) {
    .menu--3 .menu-item {
        -ms-flex: 0 1 33.33333%;
        flex: 0 1 33.33333%;
        max-width: 33.33333%
    }
}

@media only screen and (max-width: 500px) {
    .menu--4 .menu-item {
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
        max-width: 25%
    }
}

@media only screen and (max-width: 500px) {
    .menu--5 .menu-item {
        -ms-flex: 0 1 20%;
        flex: 0 1 20%;
        max-width: 20%
    }
}

@media only screen and (max-width: 500px) {
    .menu--6 .menu-item {
        -ms-flex: 0 1 16.66667%;
        flex: 0 1 16.66667%;
        max-width: 16.66667%
    }
}

@media only screen and (max-width: 500px) {
    .menu--7 .menu-item {
        -ms-flex: 0 1 14.28571%;
        flex: 0 1 14.28571%;
        max-width: 14.28571%
    }
}

@media only screen and (max-width: 500px) {
    .menu--8 .menu-item {
        -ms-flex: 0 1 12.5%;
        flex: 0 1 12.5%;
        max-width: 12.5%
    }
}

@media only screen and (max-width: 500px) {
    .menu--9 .menu-item {
        -ms-flex: 0 1 11.11111%;
        flex: 0 1 11.11111%;
        max-width: 11.11111%
    }
}

@media only screen and (max-width: 500px) {
    .menu--10 .menu-item {
        -ms-flex: 0 1 10%;
        flex: 0 1 10%;
        max-width: 10%
    }
}

.menu-item::before {
    content: "";
    position: absolute;
    width: 0;
    height: 100%;
    left: 50%;
    top: 0;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    transition: all 0.3s;
    -ms-transform-origin: center;
    transform-origin: center;
    background: #23BEAC;
    background: linear-gradient(90deg, #23BEAC 0%, #78be1e 100%)
}

.menu-item.active::before {
    width: 100%
}

@media only screen and (max-width: 800px) {
    .menu-item.active::before {
        height: 110%
    }
}

@media only screen and (max-width: 800px) {
    .menu-item--sub.active::before {
        height: 100%
    }
}

@media only screen and (max-width: 800px) {
    .menu-item::before {
        height: 0;
        width: 100%;
        left: 0;
        top: 50%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

.menu-item__main {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 4.375rem;
    background-color: #fff;
    padding: 1.25rem 0;
    transition: all 0.2s;
    margin-right: 1.125rem;
    box-shadow: 0 .625rem 1.25rem rgba(0, 0, 0, 0.15)
}

@media only screen and (min-width: 1201px) {
    .menu-item--sub.active .menu-item__main {
        padding: 1.875rem 0
    }
}

@media only screen and (max-width: 1200px) {
    .menu-item__main {
        margin-right: 15px;
        width: 3.75rem;
        padding: .9375rem 0
    }
}

@media only screen and (max-width: 800px) {
    .menu-item__main {
        margin-right: 0;
        width: auto;
        height: 4rem !important;
        padding: 0 .9375rem;
        box-shadow: none
    }
}

@media only screen and (max-width: 500px) {
    .menu-item__main {
        padding: 0
    }
}

.menu-item__main::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 20px;
    left: 0;
    top: -10px;
    background-color: #fff;
    z-index: 1;
    pointer-events: none
}

.menu-item:first-child .menu-item__main::before {
    display: none
}

@media only screen and (max-width: 800px) {
    .menu-item__main::before {
        display: none
    }
}

.menu-item__main::after {
    content: "";
    z-index: 2
}

.menu-item.active .menu-item__main::after {
    background-color: #F2F2F2
}

.menu-item__main:hover::after {
    background-color: #F7f7f7
}

.menu-item__icon {
    position: relative;
    width: 2.5rem;
    z-index: 3;
    pointer-events: none
}

@media only screen and (max-width: 1200px) {
    .menu-item__icon {
        width: 1.5625rem
    }
}

@media only screen and (max-width: 800px) {
    .menu-item__icon {
        width: auto;
        height: 1.875rem
    }
}

@media only screen and (max-width: 500px) {
    .menu-item__icon {
        height: 24px
    }
}

.menu-item__sub {
    position: relative;
    width: .9375rem
}

@media only screen and (max-width: 800px) {
    .menu-item__sub {
        width: 100%;
        height: 15px
    }
}

.menu-item__sub ul {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
    padding: .1875rem 0
}

@media only screen and (max-width: 800px) {
    .menu-item__sub ul {
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        padding: 0 4px
    }
}

.menu-item__sub li {
    width: 100%;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin: .1875rem 0;
    pointer-events: none;
    opacity: 0;
    transition: none
}

.menu-item__sub li:nth-child(1) {
    -ms-transform: translateY(0px);
    transform: translateY(0px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(1) {
        -ms-transform: translateX(0px);
        transform: translateX(0px)
    }
}

.menu-item__sub li:nth-child(2) {
    -ms-transform: translateY(-3px);
    transform: translateY(-3px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(2) {
        -ms-transform: translateX(2px);
        transform: translateX(2px)
    }
}

.menu-item__sub li:nth-child(3) {
    -ms-transform: translateY(-9px);
    transform: translateY(-9px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(3) {
        -ms-transform: translateX(6px);
        transform: translateX(6px)
    }
}

.menu-item__sub li:nth-child(4) {
    -ms-transform: translateY(-18px);
    transform: translateY(-18px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(4) {
        -ms-transform: translateX(12px);
        transform: translateX(12px)
    }
}

.menu-item__sub li:nth-child(5) {
    -ms-transform: translateY(-30px);
    transform: translateY(-30px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(5) {
        -ms-transform: translateX(20px);
        transform: translateX(20px)
    }
}

.menu-item__sub li:nth-child(6) {
    -ms-transform: translateY(-45px);
    transform: translateY(-45px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(6) {
        -ms-transform: translateX(30px);
        transform: translateX(30px)
    }
}

.menu-item__sub li:nth-child(7) {
    -ms-transform: translateY(-63px);
    transform: translateY(-63px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(7) {
        -ms-transform: translateX(42px);
        transform: translateX(42px)
    }
}

.menu-item__sub li:nth-child(8) {
    -ms-transform: translateY(-84px);
    transform: translateY(-84px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(8) {
        -ms-transform: translateX(56px);
        transform: translateX(56px)
    }
}

.menu-item__sub li:nth-child(9) {
    -ms-transform: translateY(-108px);
    transform: translateY(-108px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(9) {
        -ms-transform: translateX(72px);
        transform: translateX(72px)
    }
}

.menu-item__sub li:nth-child(10) {
    -ms-transform: translateY(-135px);
    transform: translateY(-135px)
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li:nth-child(10) {
        -ms-transform: translateX(90px);
        transform: translateX(90px)
    }
}

@media only screen and (max-width: 800px) {
    .menu-item__sub li {
        width: auto;
        height: 100%;
        margin: 0 3px
    }
}

@media only screen and (max-width: 500px) {
    .menu-item__sub li {
        margin: 0 1px
    }
}

.menu-item.active .menu-item__sub li {
    opacity: 1;
    pointer-events: auto;
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    transition: all 1s cubic-bezier(0.19, 1, 0.22, 1) 0.3s
}

.menu-item__sub button {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: .9375rem;
    width: 100%
}

@media only screen and (max-width: 1200px) {
    .menu-item__sub button {
        height: .75rem
    }
}

@media only screen and (max-width: 800px) {
    .menu-item__sub button {
        height: 100%;
        width: 10px
    }
}

.menu-item__sub button::after {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    background-color: #fff;
    opacity: 0.35;
    border-radius: 50%;
    transition: all 0.1s
}

.menu-item__sub button:hover::after, .menu-item__sub li.active button::after {
    opacity: 1
}

.page-header {
    padding: 1.875rem 0;
    color: #fff;
    background: #0032a0;
    background: linear-gradient(-90deg, #0032a0 0%, #0078c8 100%)
}

@media only screen and (max-width: 500px) {
    .page-header {
        padding: 1.25rem 0
    }
}

.page-header [class*='max-'] {
    padding: 0 15px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 800px) {
    .page-header [class*='max-'] {
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-pack: start;
        justify-content: flex-start;
        text-align: center
    }
}

.page-header--customers .col {
    width: calc(100% - 28.125rem)
}

@media only screen and (max-width: 800px) {
    .page-header--customers .col {
        width: 100%
    }
}

@media only screen and (max-width: 500px) {
    .page-header .col {
        width: 100%
    }
}

.page-header .col:nth-child(2) {
    position: relative
}

@media only screen and (max-width: 800px) {
    .page-header .col:nth-child(2) {
        margin-top: 1.875rem
    }
}

.page-header__title {
    margin-bottom: .3125rem
}

.page-header__subtitle {
    font-size: .875rem
}

.page-header__search {
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    min-width: 31.25rem
}

@media only screen and (max-width: 500px) {
    .page-header__search {
        min-width: 1px
    }
}

.page-header__search input {
    color: #666 !important
}

.page-header__search input::-webkit-input-placeholder {
    font-size: 1.125rem
}

@media only screen and (max-width: 800px) {
    .page-header__search input::-webkit-input-placeholder {
        font-size: 1rem
    }
}

@media only screen and (max-width: 500px) {
    .page-header__search input::-webkit-input-placeholder {
        font-size: .875rem
    }
}

.page-header__search input:-moz-placeholder {
    font-size: 1.125rem
}

@media only screen and (max-width: 800px) {
    .page-header__search input:-moz-placeholder {
        font-size: 1rem
    }
}

@media only screen and (max-width: 500px) {
    .page-header__search input:-moz-placeholder {
        font-size: .875rem
    }
}

.page-header__search input::-moz-placeholder {
    font-size: 1.125rem
}

@media only screen and (max-width: 800px) {
    .page-header__search input::-moz-placeholder {
        font-size: 1rem
    }
}

@media only screen and (max-width: 500px) {
    .page-header__search input::-moz-placeholder {
        font-size: .875rem
    }
}

.page-header__search input:-ms-input-placeholder {
    font-size: 1.125rem
}

@media only screen and (max-width: 800px) {
    .page-header__search input:-ms-input-placeholder {
        font-size: 1rem
    }
}

@media only screen and (max-width: 500px) {
    .page-header__search input:-ms-input-placeholder {
        font-size: .875rem
    }
}

.search {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    background-color: #fff;
    overflow: hidden;
    direction: ltr;
    z-index: 210;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: visibility 0s linear 0.4s, opacity 0.4s ease-out, transform 0.7s cubic-bezier(0.075, 0.82, 0.165, 1)
}

.search-open .search {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: visibility 0s linear, opacity 0.4s ease-out
}

@media only screen and (max-width: 1050px) {
    .search {
        height: auto;
        background-color: transparent;
        top: 5.3125rem;
        opacity: 1;
        z-index: 190;
        visibility: visible;
        -ms-transform: translateY(-140%);
        transform: translateY(-140%);
        transition: transform 0.5s cubic-bezier(0.55, 0.055, 0.675, 0.19)
    }

    .search-open .search {
        -ms-transform: translateY(0);
        transform: translateY(0);
        transition: transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1)
    }
}

@media only screen and (max-width: 800px) {
    .search {
        top: 4.0625rem
    }
}

@media only screen and (max-width: 500px) {
    .search {
        top: 4.0625rem
    }
}

.search::before, .search::after {
    content: "";
    position: absolute;
    width: calc(100% - 17px);
    background-color: #fff;
    left: 0;
    bottom: 0;
    z-index: 2;
    pointer-events: none
}

@media only screen and (max-width: 1050px) {
    .search::before, .search::after {
        display: none
    }
}

.search::after {
    bottom: 0;
    height: calc(50vh - 20.625rem)
}

@media only screen and (min-width: 1051px) and (max-height: 760px) {
    .search::after {
        height: calc(50vh - 17.5rem)
    }
}

.search::before {
    top: 0;
    height: calc(50vh - 6.25rem)
}

@media only screen and (min-width: 1051px) and (max-height: 760px) {
    .search::before {
        height: calc(50vh - 3.125rem)
    }
}

.search .color-bar {
    z-index: 20
}

@media only screen and (max-width: 1050px) {
    .search .color-bar {
        display: none
    }
}

.search-close {
    background: #0048AD;
    background: linear-gradient(-135deg, #0048AD 0%, #006DC2 100%);
    position: fixed;
    width: 40px;
    height: 40px;
    left: 7.8125rem;
    top: 1.5625rem;
    border-radius: .25rem;
    z-index: 20
}

@media only screen and (max-width: 1400px) {
    .search-close {
        left: 1.875rem
    }
}

@media only screen and (max-width: 1050px) {
    .search-close {
        display: none
    }
}

.search-close:active, .search-close.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.search-close:hover {
    box-shadow: 0 5px 7px rgba(0, 0, 0, 0.05)
}

.search-close span {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 15px;
    height: 15px;
    transition: all 0.3s ease-in-out
}

@media only screen and (min-width: 1051px) {
    .search-close:hover span {
        -ms-transform: translate(-50%, -50%) rotate(180deg);
        transform: translate(-50%, -50%) rotate(180deg)
    }
}

.search-close span::before, .search-close span::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 2px;
    top: 50%;
    left: 50%;
    margin-top: -1px;
    margin-left: -10px;
    background-color: #fff;
    border-radius: 2px;
    transition: all 0.3s linear
}

.search-close span::before {
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.search-close span::after {
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.search-scroll {
    position: relative;
    overflow-y: auto;
    padding-right: calc(50vw - 65.625rem / 2);
    padding-left: calc(50vw - 65.625rem / 2);
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease-out 0.5s
}

.search--focus .search-scroll {
    opacity: 1
}

@media only screen and (max-width: 1050px) {
    .search-scroll {
        padding-right: 0;
        padding-left: 0;
        opacity: 1
    }
}

@media only screen and (min-width: 1051px) {
    .search-scroll {
        top: 4px;
        height: calc(100% - 4px) !important
    }
}

.search-in {
    direction: rtl;
    width: calc(100% + 17px);
    position: relative
}

@media only screen and (max-width: 1050px) {
    .search-in {
        width: 100%;
        background-color: #fff;
        padding-right: 15px;
        padding-left: 15px;
        padding-top: 10px;
        padding-bottom: 20px
    }
}

.search-catg {
    position: fixed;
    z-index: 3;
    width: calc(65.625rem / 2);
    left: calc(50vw - 65.625rem / 2);
    bottom: calc(50vh - 20.625rem);
    padding-right: 1.25rem;
    -ms-transform: none !important;
    transform: none !important
}

@media only screen and (min-width: 1051px) and (max-height: 760px) {
    .search-catg {
        bottom: calc(50vh - 17.5rem)
    }
}

@media only screen and (max-width: 1050px) {
    .search-catg {
        display: none
    }
}

.search-catg ul {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 3.75rem .9375rem;
    height: 25rem;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: #F7f7f7
}

.search-catg li {
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    text-align: center
}

.search-catg .card-f__img {
    margin-bottom: .9375rem
}

.search-catg .card-f__title {
    font-size: .75rem
}

.search-catg__title {
    position: absolute;
    white-space: normal;
    top: 0;
    left: 50%;
    font-size: 0;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.search-catg__title span {
    display: inline-block;
    height: 2rem;
    line-height: 2rem;
    padding: 0 .625rem;
    color: #fff;
    overflow: hidden;
    font-size: .875rem
}

.search-catg__title span:first-child {
    background-color: #78be1e;
    line-height: 1.8125rem;
    border-radius: 0 .125rem .125rem 0
}

.search-catg__title span:last-child {
    background-color: #0078c8;
    border-radius: .125rem 0 0 .125rem
}

.search-result {
    width: 50%;
    padding-top: calc(50vh - 6.25rem);
    padding-bottom: calc(50vh - 20.625rem);
    padding-left: 1.25rem
}

@media only screen and (min-width: 1051px) and (max-height: 760px) {
    .search-result {
        padding-top: calc(50vh - 3.125rem);
        padding-bottom: calc(50vh - 17.5rem)
    }
}

@media only screen and (max-width: 1050px) {
    .search-result {
        width: 100%;
        padding: 0
    }
}

.search-loading {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 25rem
}

.search-header {
    position: fixed;
    z-index: 5;
    width: 100%;
    left: 0;
    padding-right: calc(50vw - 65.625rem / 2);
    padding-left: calc(50vw - 65.625rem / 2);
    top: calc(50vh - 10.9375rem);
    opacity: 0;
    transition: opacity 0.3s ease-out 0.5s
}

@media only screen and (min-width: 1051px) and (max-height: 760px) {
    .search-header {
        top: calc(50vh - 6.875rem)
    }
}

@media only screen and (max-width: 1050px) {
    .search-header {
        position: relative;
        padding: 0 15px 15px;
        background-color: #fff;
        top: 0;
        opacity: 1
    }
}

.search--focus .search-header {
    opacity: 1
}

.search-header small {
    display: block;
    font-size: .875rem;
    color: #9a9a9a
}

.search-header span {
    display: block;
    font-size: 1.125rem;
    color: #666
}

.search-main {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-width: 65.625rem;
    width: 100%;
    z-index: 10;
    transition: transform 0.8s cubic-bezier(0.86, 0, 0.07, 1)
}

.search--focus .search-main {
    -ms-transform: translate(-50%, -21.875rem);
    transform: translate(-50%, -21.875rem)
}

@media only screen and (min-width: 1051px) and (max-height: 750px) {
    .search--focus .search-main {
        -ms-transform: translate(-50%, -17.5rem);
        transform: translate(-50%, -17.5rem)
    }
}

@media only screen and (max-width: 1050px) {
    .search-main {
        position: relative;
        max-width: 100%;
        left: auto;
        top: auto;
        -ms-transform: none !important;
        transform: none !important
    }
}

.search-main::after {
    content: "";
    position: absolute;
    width: 0;
    height: 1px;
    background-color: #ccc;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: 0;
    z-index: 6;
    transition: all 0.7s cubic-bezier(0.075, 0.82, 0.165, 1)
}

.search--focus .search-main::after {
    width: 100%
}

@media only screen and (max-width: 1050px) {
    .search-main::after {
        display: none
    }
}

.search-main input {
    position: relative;
    width: 100%;
    font-size: 4rem;
    color: #666;
    direction: rtl;
    padding: 1.25rem 0;
    padding-left: 6.875rem;
    background-color: #fff;
    z-index: 5
}

@media only screen and (max-width: 1050px) {
    .search-main input {
        font-family: IRANSansFaNum, IRANSans, tahoma, arial;
        font-size: 1.125rem;
        padding: 1.25rem
    }
}

.search-main input::-webkit-input-placeholder {
    font-family: IRANSansFaNum, IRANSans, tahoma, arial;
    opacity: 0;
    color: #ccc;
    font-size: 1.125rem
}

@media only screen and (max-width: 1050px) {
    .search-main input::-webkit-input-placeholder {
        opacity: 1
    }
}

.search-main input:-moz-placeholder {
    font-family: IRANSansFaNum, IRANSans, tahoma, arial;
    opacity: 0;
    color: #ccc;
    font-size: 1.125rem
}

@media only screen and (max-width: 1050px) {
    .search-main input:-moz-placeholder {
        opacity: 1
    }
}

.search-main input::-moz-placeholder {
    font-family: IRANSansFaNum, IRANSans, tahoma, arial;
    opacity: 0;
    color: #ccc;
    font-size: 1.125rem
}

@media only screen and (max-width: 1050px) {
    .search-main input::-moz-placeholder {
        opacity: 1
    }
}

.search-main input:-ms-input-placeholder {
    font-family: IRANSansFaNum, IRANSans, tahoma, arial;
    opacity: 0;
    color: #ccc;
    font-size: 1.125rem
}

@media only screen and (max-width: 1050px) {
    .search-main input:-ms-input-placeholder {
        opacity: 1
    }
}

.search-main span {
    position: absolute;
    right: 0;
    bottom: 1.25rem;
    font-size: 4rem;
    color: #ccc;
    z-index: 5;
    pointer-events: none
}

@media only screen and (max-width: 1050px) {
    .search-main span {
        display: none
    }
}

.search-main label {
    position: absolute;
    bottom: 100%;
    right: 0;
    font-size: 1.125rem;
    color: #666;
    -ms-transform: translateY(200%);
    transform: translateY(200%);
    transition: all 0.6s cubic-bezier(0.075, 0.82, 0.165, 1) 0.4s
}

.search--focus .search-main label {
    -ms-transform: translateY(0);
    transform: translateY(0)
}

@media only screen and (max-width: 1050px) {
    .search-main label {
        display: none
    }
}

.search-main button {
    position: absolute;
    left: 0;
    top: 1.25rem;
    top: 50%;
    width: 5.625rem;
    height: 5.625rem;
    margin-top: -2.8125rem;
    z-index: 5
}

.search-main button:active, .search-main button.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

@media only screen and (max-width: 1050px) {
    .search-main button {
        display: none
    }
}

.search-main button svg {
    width: 100%;
    height: 100%;
    fill: #666
}

.cart {
    position: fixed;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
    overflow: hidden;
    direction: ltr;
    z-index: 300;
    pointer-events: none
}

.cart-open .cart {
    pointer-events: auto
}

@media only screen and (max-width: 520px) {
    .cart {
        top: 4.0625rem;
        z-index: 195
    }
}

.cart .color-bar {
    box-shadow: -374.4px 0 0 8px #78be1e, -338px 0 0 8px #019e43, -301.6px 0 0 8px #0182c6, 0px 0 0 8px #1d4f9b;
    z-index: 5
}

@media only screen and (max-width: 800px) {
    .cart .color-bar {
        box-shadow: -374.4px 0 0 4px #78be1e, -338px 0 0 4px #019e43, -301.6px 0 0 4px #0182c6, 0px 0 0 4px #1d4f9b
    }
}

@media only screen and (max-width: 520px) {
    .cart .color-bar {
        display: none
    }
}

.cart-bg {
    background-color: rgba(26, 26, 26, 0.5);
    transition: opacity 0.3s linear, visibility 0s 0.4s;
    visibility: hidden;
    pointer-events: none;
    opacity: 0
}

.cart-open .cart-bg {
    transition: all 0.3s linear;
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}

.cart-wrap {
    position: absolute;
    direction: rtl;
    overflow: hidden;
    right: 0;
    top: 0;
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    height: 100%;
    width: 32.5rem;
    background-color: #fff;
    transition: transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}

@media only screen and (max-width: 520px) {
    .cart-wrap {
        width: 100%
    }
}

@media only screen and (max-width: 520px) {
    .cart-wrap--scroll {
        overflow-y: auto
    }
}

.cart-open .cart-wrap {
    -ms-transform: translateX(0);
    transform: translateX(0);
    transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1)
}

.cart-header {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 5.3125rem;
    padding: .625rem 3rem 0;
    background: #ffffff;
    box-shadow: 0 .3125rem .625rem 0 rgba(0, 0, 0, 0.05);
    z-index: 4
}

@media only screen and (max-width: 520px) {
    .cart-header {
        background-color: #F7f7f7;
        box-shadow: none;
        padding: 1.25rem 1.25rem 1.25rem .9375rem;
        height: auto
    }
}

.cart-header__title {
    display: -ms-flexbox;
    display: flex;
    color: #333
}

@media only screen and (max-width: 520px) {
    .cart-header__title {
        font-size: 1.125rem
    }
}

.cart-header__title span {
    position: relative;
    font-size: 0;
    margin-left: .8125rem
}

@media only screen and (max-width: 520px) {
    .cart-header__title span {
        display: none
    }
}

.cart-header__title span svg {
    width: 1.125rem;
    height: 1.4375rem
}

.cart-header__title span::after {
    position: absolute;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #f22b2b;
    border: 3px solid #ffffff;
    bottom: -.125rem;
    right: -.375rem
}

.cart-header__title--notif span::after {
    content: ""
}

.cart-header__desc {
    font-size: .75rem;
    color: gray
}

@media only screen and (max-width: 520px) {
    .cart-header__desc {
        display: none
    }
}

.cart-header__desc span {
    display: inline-block;
    font-size: 1rem;
    margin-left: 8px;
    vertical-align: middle
}

.cart-header__close {
    display: none;
    position: relative;
    width: 2rem;
    height: 2rem
}

.cart-header__close:active, .cart-header__close.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

@media only screen and (max-width: 520px) {
    .cart-header__close {
        display: block
    }
}

.cart-header__close svg {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 1.125rem;
    height: 1.125rem
}

.cart-list {
    position: relative;
    padding: 1.875rem;
    background: #F7f7f7;
    overflow-x: hidden;
    overflow-y: auto;
    direction: ltr
}

@media only screen and (max-width: 520px) {
    .cart-list--auto {
        height: auto !important
    }
}

@media only screen and (max-width: 520px) {
    .cart-list {
        padding-top: 0;
        padding-left: 10px;
        padding-right: 10px
    }
}

.cart-list li:not(:last-child) {
    margin-bottom: 1.25rem
}

.cart-list .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.cart-list--step-pay {
    display: none
}

@media only screen and (max-width: 730px) {
    .cart-list--step-pay {
        display: block;
        margin-top: 1.875rem;
        padding-top: .8125rem;
        padding-bottom: 1.25rem
    }
}

.cart-list-in {
    direction: rtl
}

.cart-item {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    background: #ffffff;
    border-radius: .25rem;
    padding: .875rem 1.25rem;
    box-shadow: 0 .3125rem .625rem 0 rgba(0, 0, 0, 0.03)
}

@media only screen and (max-width: 520px) {
    .cart-item {
        padding: 1rem 20px
    }
}

.cart-item__info-wrap {
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 900px) {
    .cart-item__info-wrap {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.cart-item__info {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: start;
    align-items: flex-start
}

@media only screen and (max-width: 900px) {
    .cart-item__info {
        margin-bottom: .625rem
    }
}

.cart-item--mlb {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: 2.1875rem 1.875rem
}

@media only screen and (max-width: 730px) {
    .cart-item--mlb {
        padding: 1rem 1.25rem
    }
}

.cart-item--mlp {
    box-shadow: none;
    padding: 1.25rem 0
}

.cart-item__number {
    position: absolute;
    height: 100%;
    width: 3rem;
    left: 100%;
    top: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #E6E6E6;
    color: #999;
    font-size: 1.375rem;
    border-radius: 0 .25rem .25rem 0
}

.cart-item__img {
    -ms-flex: 0 0 9.875rem;
    flex: 0 0 9.875rem;
    height: 9.875rem;
    margin-left: 1.5625rem
}

@media only screen and (max-width: 520px) {
    .cart-item__img {
        margin-left: 1.125rem
    }
}

@media only screen and (max-width: 400px) {
    .cart-item__img {
        -ms-flex: 0 0 7.5rem;
        flex: 0 0 7.5rem;
        height: 7.5rem;
        margin-left: .9375rem
    }
}

.cart-item--mlb .cart-item__img {
    margin-left: 1.25rem;
    -ms-flex: 0 0 6.25rem;
    flex: 0 0 6.25rem;
    height: 6.25rem;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center
}

.cart-item__img img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.cart-item__body {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: start;
    align-items: flex-start;
    padding-left: .9375rem
}

.cart-item--mlb .cart-item__body {
    width: 100%;
    padding-left: 0
}

.cart-item__title {
    margin-bottom: 8px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.cart-item__subtitle {
    background: linear-gradient(to right, #07BEDA, #3CBE82);
    font-size: .75rem;
    padding: 0 5px;
    border-radius: 3px;
    color: #ffffff;
    margin-bottom: .5rem
}

@media only screen and (max-width: 520px) {
    .cart-item__subtitle {
        margin-bottom: 10px
    }
}

.cart-item__subtitle span {
    font-size: .875rem
}

.cart-item__color-tag {
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative;
    border: 1px solid #E6E6E6;
    border-radius: .75rem;
    font-size: .75rem;
    padding: .125rem 1.8125rem .1875rem .8125rem;
    margin-bottom: .625rem
}

.cart-item--mlb .cart-item__color-tag {
    margin-bottom: 0
}

@media only screen and (max-width: 730px) {
    .cart-item--mlb .cart-item__color-tag {
        margin-bottom: .625rem
    }
}

@media only screen and (max-width: 520px) {
    .cart-item__color-tag {
        margin-bottom: .625rem
    }
}

.cart-item__color-tag span {
    color: #666
}

.cart-item__color-tag:before {
    content: "";
    display: block;
    position: absolute;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    color: inherit;
    background: currentColor;
    border: 1px solid #c9c9c9;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: .3125rem
}

.cart-item__prices {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: end;
    align-items: flex-end
}

@media only screen and (max-width: 900px) {
    .cart-item__prices {
        line-height: 1.5;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-item-align: start;
        align-self: flex-start
    }
}

.cart-item__prices del {
    color: #f22b2b;
    font-size: .75rem;
    -ms-flex-order: 1;
    order: 1
}

.cart-item--mlb .cart-item__prices del {
    padding-left: 3px
}

.cart-item__prices del span {
    font-size: .875rem
}

.cart-item__current-price {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-order: 2;
    order: 2;
    font-size: .875rem;
    color: #545454
}

.cart-item__current-price span {
    font-size: 1.25rem;
    margin-left: 5px
}

.cart-item__close {
    position: absolute;
    width: 1.875rem;
    height: 1.875rem;
    left: .625rem;
    top: .625rem;
    transition: all 0.2s
}

.cart-item__close::before, .cart-item__close::after {
    content: '';
    position: absolute;
    width: 1rem;
    height: 2px;
    background-color: #f22b2b;
    left: 50%;
    top: 50%;
    margin-top: -1px;
    margin-left: -.5rem
}

.cart-item__close::before {
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.cart-item__close::after {
    -ms-transform: rotate(135deg);
    transform: rotate(135deg)
}

.cart-item__close:hover {
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.cart-item .img {
    -ms-flex: 0 0 9.875rem;
    flex: 0 0 9.875rem;
    height: 9.875rem;
    margin-left: 1.5625rem
}

.cart-invoice {
    position: relative;
    background: #ffffff;
    box-shadow: 0 -.3125rem .625rem rgba(0, 0, 0, 0.05);
    padding: 1.75rem 0 2.25rem;
    z-index: 1
}

.cart-invoice--mlb {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    height: auto;
    padding: 1.5rem 1.875rem;
    box-shadow: none;
    border-radius: 4px
}

.cart-invoice--mlp {
    margin-top: 0;
    margin-bottom: 0;
    padding: 1.25rem 1.875rem;
    background: #F6F6F6;
    border-radius: 0
}

@media only screen and (max-width: 730px) {
    .cart-invoice--mlp {
        background: #fff;
        box-shadow: none;
        padding-right: 0;
        padding-left: 0;
        padding-bottom: 0
    }
}

.cart-invoice--hide-desktop {
    display: none
}

@media only screen and (max-width: 730px) {
    .cart-invoice--hide-desktop {
        display: block
    }
}

@media only screen and (max-width: 520px) {
    .cart-invoice {
        width: 100%;
        bottom: 0;
        right: 0;
        height: auto;
        padding: 1rem 1.25rem 1.6875rem
    }

    .cart-invoice--mlp {
        position: relative;
        padding: 1.25rem 0
    }
}

@media only screen and (max-width: 520px) and (max-width: 500px) {
    .cart-invoice--mlp {
        padding: 1.25rem
    }
}

.cart-invoice__wrap {
    max-width: 25rem;
    margin: 0 auto
}

@media only screen and (max-width: 520px) {
    .cart-invoice__wrap {
        max-width: 100%
    }
}

.cart-invoice--mlb .cart-invoice__wrap {
    max-width: none
}

@media only screen and (max-width: 730px) {
    .cart-invoice--mlp .cart-invoice__wrap {
        max-width: 100%;
        padding: 0 1.875rem
    }
}

@media only screen and (max-width: 500px) {
    .cart-invoice--mlp .cart-invoice__wrap {
        padding: 0
    }
}

.cart-invoice__header {
    display: none
}

@media only screen and (max-width: 520px) {
    .cart-invoice__header {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin-bottom: 11px
    }
}

.cart-invoice__title {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: .5rem
}

.cart-invoice__title span {
    color: #666;
    font-size: .875rem
}

.cart-invoice__title .title-sum {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.cart-invoice__title .title-sum var {
    color: #373737;
    font-size: 1rem;
    direction: ltr
}

.cart-invoice__title .title-sum span {
    font-size: .75rem;
    color: #373737;
    margin-right: 5px
}

.cart-invoice__last-price {
    transition: opacity 0.2s 0.3s
}

.open-details .cart-invoice__last-price {
    transition: opacity 0.2s;
    opacity: 0
}

.cart-invoice__last-price var {
    color: #545454;
    font-size: 1.375rem
}

.cart-invoice__last-price span {
    color: gray;
    font-size: .75rem
}

.cart-invoice__dropper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 520px) {
    .cart-invoice__dropper span {
        font-size: 12px;
        color: #2B59BE
    }
}

.cart-invoice__dropper svg {
    margin-right: 6px;
    width: 8px;
    height: 4px
}

.open-details .cart-invoice__dropper svg {
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.cart-invoice .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.cart-prices {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-bottom: 1.125rem;
    border-bottom: 1px solid #E6E6E6;
    margin-bottom: 12px
}

.cart-prices--no-border {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: .875rem
}

@media only screen and (max-width: 520px) {
    .cart-prices {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.cart-prices__tax {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: .5rem
}

.cart-prices__tax > span {
    font-size: .875rem;
    color: #666;
    display: inline-block
}

.cart-prices__tax .tax-price {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.cart-prices__tax .tax-price var {
    font-size: 1rem;
    color: #373737;
    direction: ltr
}

.cart-prices__tax .tax-price span {
    font-size: .75rem;
    color: #373737;
    margin-right: 5px
}

.cart-prices__off {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.cart-prices__off > span {
    margin-left: auto;
    font-size: .875rem;
    color: #f22b2b
}

.cart-prices__off .off-price {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.cart-prices__off .off-price var {
    display: inline-block;
    direction: ltr;
    font-size: 1rem;
    color: #f22b2b
}

.cart-prices__off .off-price span {
    font-size: .75rem;
    color: #f22b2b;
    margin-right: 5px
}

.cart-prices__percentage {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 6px;
    background: #f22b2b;
    padding: 2px 10px;
    border-radius: 6.25rem
}

.cart-prices__percentage b {
    font-size: .8125rem;
    color: #ffffff
}

.cart-details--mlb {
    max-height: initial;
    margin-top: 1.25rem;
    padding-top: .625rem;
    padding-left: .125rem;
    padding-right: .125rem
}

.cart-payable {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1.6875rem
}

.cart-invoice--mlb .cart-payable {
    margin-bottom: 0
}

@media only screen and (max-width: 730px) {
    .cart-invoice--mlp .cart-payable {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 520px) {
    .cart-payable {
        margin-bottom: 1.375rem
    }

    .cart-details--mlb .cart-payable {
        margin-bottom: .375rem
    }
}

.cart-payable__title span {
    font-size: 1rem;
    color: #373737
}

.cart-payable__price {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.cart-payable__price var {
    color: #545454;
    font-size: 1.25rem
}

.cart-payable__price span {
    font-size: .75rem;
    color: #373737;
    margin-right: 5px
}

.cart-error {
    text-align: center;
    padding: 1.875rem 0
}

.cart-error > p {
    margin-bottom: 1.25rem
}

.cart .btn-group {
    display: -ms-flexbox;
    display: flex;
    margin: 0 -.625rem
}

@media only screen and (max-width: 520px) {
    .cart .btn-group {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.cart .btn-group .col {
    padding: 0 .625rem;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%
}

@media only screen and (max-width: 520px) {
    .cart .btn-group .col {
        -ms-flex: 100%;
        flex: 100%
    }

    .cart .btn-group .col:first-child {
        margin-bottom: 1rem
    }
}

.cart .btn-group .btn {
    width: 100%
}

@media only screen and (max-width: 520px) {
    .cart .btn-group .btn {
        height: 3rem;
        line-height: 3rem
    }
}

.ty-no-image {
    border: 0 none;
    padding-top: 100%;
    height: 0 !important
}

.ty-no-image {
    position: relative;
    display: block;
    border: 1px solid #ebebeb;
    background: #fcfcfc;
    color: #c8c8c8;
    cursor: default;
    max-width: 100%;
    min-width: 100%;
    box-sizing: border-box
}

.ty-no-image__icon {
    position: absolute;
    top: 50%;
    right: 50%;
    display: inline-block;
    margin: -16px -16px 0 0;
    width: 32px;
    height: 32px;
    font-size: 32px;
    line-height: 32px
}

.btn {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 .75rem;
    text-align: center;
    height: 2.5rem;
    line-height: 2.5rem;
    border-radius: .25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    color: #fff
}

@media only screen and (max-width: 500px) {
    .btn {
        font-family: IRANSans, tahoma, arial
    }

    html.ltr .btn {
        font-family: tahoma, tahoma, arial
    }
}

.btn:active:not(:disabled), .btn.nice-select.open:not(:disabled) {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.btn:not(:disabled):hover {
    box-shadow: 0 .1875rem .625rem rgba(0, 0, 0, 0.15)
}

.btn:disabled {
    cursor: not-allowed
}

.btn:disabled:not(.btn--border) {
    background: gray
}

.btn:disabled.btn--border {
    color: gray;
    border-color: gray
}

.btn--sm, .btn--md {
    height: 3rem;
    line-height: 3rem
}

@media only screen and (max-width: 800px) {
    .btn--sm, .btn--md {
        height: 2.875rem;
        line-height: 2.875rem
    }
}

@media only screen and (max-width: 500px) {
    .btn--sm, .btn--md {
        height: 2.75rem;
        line-height: 2.75rem
    }
}

.btn--lg {
    height: 3.625rem;
    line-height: 3.625rem
}

@media only screen and (max-width: 800px) {
    .btn--lg {
        height: 3.375rem;
        line-height: 3.375rem
    }
}

@media only screen and (max-width: 500px) {
    .btn--lg {
        height: 3.125rem;
        line-height: 3.125rem
    }
}

.btn--xlg {
    height: 4rem;
    line-height: 4rem
}

@media only screen and (max-width: 800px) {
    .btn--xlg {
        height: 3.75rem;
        line-height: 3.75rem
    }
}

@media only screen and (max-width: 500px) {
    .btn--xlg {
        height: 3.5rem;
        line-height: 3.5rem
    }
}

.btn--wide {
    min-width: 8.125rem
}

.btn--wide.btn--md {
    min-width: 13.75rem
}

@media only screen and (max-width: 800px) {
    .btn--wide.btn--md {
        min-width: 11.875rem
    }
}

@media only screen and (max-width: 500px) {
    .btn--wide.btn--md {
        min-width: 10rem
    }
}

.btn--wide2 {
    padding: 0 3.125rem !important
}

.btn--full {
    width: 100%
}

.btn--long {
    height: 3.125rem;
    line-height: 3.125rem
}

.btn--w-blue {
    background: #fff;
    color: #0078c8
}

.btn--solid-blue {
    background: #0078c8;
    color: #fff
}

.btn--w-green {
    background: #fff;
    color: #22bead
}

.btn--green {
    background: #78be1e;
    color: #fff
}

.btn--gray.btn--border {
    color: #666;
    border-color: #999
}

.btn--gray-3 {
    background: #F2F2F2;
    color: #373737
}

.btn--gray-9.btn--border {
    color: #999;
    border-color: #707070
}

.btn--white.btn--border {
    color: #fff;
    border-color: #fff
}

.btn--transparent {
    background: transparent
}

.btn--pink {
    background: #eb4176;
    background: linear-gradient(-135deg, #eb4176 0%, #8953c7 100%)
}

.btn--border {
    border-width: 1px;
    border-style: solid;
    background: transparent
}

.btn--shadow {
    box-shadow: 0 .1875rem .4375rem rgba(0, 0, 0, 0.05)
}

.btn--shadow:hover {
    box-shadow: 0 .1875rem .625rem rgba(0, 0, 0, 0.15)
}

.btn span, .btn svg, .btn .loading {
    transition: all 0.15s ease-out
}

.btn--loading svg {
    opacity: 0
}

.btn--loading span {
    opacity: 0
}

.btn .loading {
    opacity: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.btn--loading .loading {
    opacity: 1
}

.btn--sm, .btn--md, .btn--lg, .btn--xlg {
    font-size: 1.125rem;
    padding: 0 1.25rem
}

@media only screen and (max-width: 800px) {
    .btn--sm, .btn--md, .btn--lg, .btn--xlg {
        padding: 0 .9375rem
    }
}

.post {
    color: gray;
    text-align: justify
}

.post p {
    margin-bottom: .625rem
}

.post h1, .post h2, .post h3, .post h4, .post h5, .post h6 {
    color: #666;
    margin-bottom: .9375rem
}

.post h1, .post h2, .post h3 {
    font-size: 1.125rem
}

.post img {
    display: block;
    max-width: 100%;
    margin: .9375rem 0
}

.modal {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 400;
    overflow-y: auto;
    direction: ltr;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    transition: opacity 0.3s ease-out, visibility 0s 0.3s;
    background-color: rgba(0, 0, 0, 0.8)
}

.modal--open {
    opacity: 1;
    pointer-events: all;
    visibility: visible;
    transition: all 0.3s ease-out
}

.modal-wrap {
    position: relative;
    direction: rtl;
    width: 100%;
    padding: 2.8125rem 15px
}

.modal--product-features .modal-wrap {
    padding: 0
}

@media only screen and (max-width: 900px) {
    .modal-wrap {
        padding: 0
    }
}

.modal-inner {
    position: relative;
    z-index: 2;
    max-width: 50rem;
    margin: 0 auto;
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    -ms-transform: scale(0.95);
    transform: scale(0.95)
}

.modal--product-features .modal-inner {
    -ms-transform: none;
    transform: none;
    max-width: none;
    width: 100%;
    background-color: #1A1A1A
}

.resizing .modal-inner {
    transition: none
}

@media only screen and (max-width: 900px) {
    .modal-inner {
        max-width: none;
        padding-top: 50px;
        background-color: #fff
    }

    .modal--product-features .modal-inner {
        padding-top: 0
    }
}

.modal--open .modal-inner {
    -ms-transform: scale(1);
    transform: scale(1)
}

.modal-close {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    position: fixed;
    left: 1.5625rem;
    top: 1.6875rem;
    transition: all .15s linear;
    z-index: 400
}

.modal--product-features .modal-close .icon--arrow-left {
    width: 1.5rem;
    height: 1.5rem;
    fill: #999;
    left: 48%;
    -ms-transform: translate(-50%, -48%);
    transform: translate(-50%, -48%)
}

@media only screen and (max-width: 900px) {
    .modal-close {
        background-color: rgba(0, 0, 0, 0.2);
        width: 45px;
        height: 45px
    }
}

@media only screen and (min-width: 901px) {
    .modal-close:hover {
        background-color: rgba(255, 255, 255, 0.2)
    }
}

.modal-close svg {
    width: 18px;
    height: 18px;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    fill: #fff
}

@media only screen and (max-width: 900px) {
    .modal-close svg {
        width: 16px;
        height: 16px
    }
}

.icon {
    display: inline-block;
    overflow: hidden;
    width: 100px;
    height: 100px
}

.icon--search {
    width: 1.375rem;
    height: 1.4375rem
}

.icon--telegram {
    width: 1.375rem;
    height: 1.1875rem
}

.icon--instagram {
    width: 1.3125rem;
    height: 1.375rem
}

.icon--linkedin {
    width: 1.125rem;
    height: 1.125rem
}

.icon--linkedin2 {
    width: 1.75rem;
    height: 1.6875rem
}

.icon--facebook {
    width: .6875rem;
    height: 1.3125rem
}

.icon--facebook2 {
    width: 1.875rem;
    height: 1.875rem
}

.icon--twitter {
    width: 1.3125rem;
    height: 1.125rem
}

.icon--twitter2 {
    width: 1.875rem;
    height: 1.4375rem
}

.icon--play {
    width: 2.125rem;
    height: 2.125rem
}

.icon--close {
    width: .6875rem;
    height: .6875rem
}

.icon--label {
    width: 4rem;
    height: 1.625rem
}

.icon--close-circle {
    width: 1.375rem;
    height: 1.3125rem
}

.icon--close-circle-redbg {
    width: 1.25rem;
    height: 1.25rem
}

.icon--plus {
    width: .75rem;
    height: .75rem
}

.icon--heart {
    width: 1rem;
    height: .9375rem
}

.icon--heart2 {
    width: .8125rem;
    height: .75rem
}

.icon--retweet {
    width: 1.1875rem;
    height: .8125rem
}

.icon--comment {
    width: 1.125rem;
    height: 1.0625rem
}

.icon--comment2 {
    width: .75rem;
    height: .75rem
}

.icon--quote {
    width: 1.9375rem;
    height: 1.0625rem
}

.icon--quote2 {
    width: 2.125rem;
    height: 2rem
}

.icon--hash {
    width: 1.3125rem;
    height: 1.5625rem
}

.icon--share {
    width: .75rem;
    height: .75rem
}

.icon--share2 {
    width: 1.5625rem;
    height: 1.6875rem
}

.icon--bookmark {
    width: .625rem;
    height: .75rem
}

.icon--bookmark3 {
    width: 1.5rem;
    height: 1.75rem
}

.icon--dots {
    width: .625rem;
    height: .1875rem
}

.icon--filter {
    width: 1.8125rem;
    height: 1.75rem
}

.icon--location {
    width: .8125rem;
    height: .875rem
}

.icon--location-thicker {
    width: .8125rem;
    height: 1rem
}

.icon--phone {
    width: .875rem;
    height: 1.25rem
}

.icon--checked {
    width: 1.5625rem;
    height: 1.5rem
}

.icon--refresh {
    width: 1.625rem;
    height: 2.1875rem
}

.icon--instaqoute {
    width: 2.125rem;
    height: 2rem
}

.icon--arrow {
    width: .75rem;
    height: 1.1875rem
}

.icon--arrow-right {
    width: .75rem;
    height: 1.25rem
}

.icon--arrow-left {
    width: .75rem;
    height: 1.25rem
}

.icon--arrow-down {
    width: 12px;
    height: 6px
}

.icon--forwarding {
    width: 1.5rem;
    height: .875rem
}

.icon--installation {
    width: 1.25rem;
    height: 1.125rem
}

.icon--special-offer {
    width: 6.125rem;
    height: 1.6875rem
}

.icon--grid-vertical {
    width: 1.375rem;
    height: 1.375rem
}

.icon--grid-horizontal {
    width: 1.375rem;
    height: 1.1875rem
}

.icon--time {
    width: 1rem;
    height: 1rem
}

.icon--checked-gray {
    width: 1.125rem;
    height: 1.125rem
}

.icon--checked-color {
    width: 1.875rem;
    height: 1.875rem
}

.icon--wait {
    width: .6875rem;
    height: .9375rem
}

.icon--download {
    width: .9375rem;
    height: 1rem
}

.flip {
    display: -ms-flexbox;
    display: flex
}

.flip--center {
    -ms-flex-align: center;
    align-items: center
}

.flip--bottom {
    -ms-flex-align: end;
    align-items: flex-end
}

.flip--left {
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.flip > * {
    -ms-flex: 0 1 50%;
    flex: 0 1 50%;
    max-width: 50%
}

@media only screen and (max-width: 500px) {
    .flip--xs > * {
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%
    }
}

@media only screen and (max-width: 1050px) {
    .flip--md > * {
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%
    }
}

@media only screen and (max-width: 1400px) {
    .flip--lg > * {
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%
    }
}

@media only screen and (max-width: 800px) {
    .flip:not(.flip--xs) > *, .flip:not(.flip--md) > *, .flip:not(.flip--lg) > * {
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
        padding: 0 30px
    }
}

.flip-empty {
    margin-top: 30px
}

.s-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: start;
    align-items: flex-start;
    position: relative
}

.s-title {
    border-radius: .25rem;
    padding: 0 .9375rem .625rem;
    color: #fff;
    box-shadow: 0 .0625rem .125rem rgba(0, 0, 0, 0.02)
}

@media only screen and (max-width: 500px) {
    .s-title {
        padding: .3125rem .9375rem .9375rem
    }
}

.s-subtitle {
    background-color: #fff;
    border-radius: .25rem 0 .25rem .25rem;
    color: #373737;
    padding: .625rem .9375rem;
    margin-top: 0px;
    box-shadow: 0 .3125rem .625rem rgba(0, 0, 0, 0.15)
}

.form {
    position: relative
}

.input {
    position: relative
}

.login .input {
    margin-bottom: .9375rem
}

.input input, .input textarea {
    height: 4rem;
    line-height: 4rem;
    display: block;
    width: 100%;
    border: 1px solid #D6D6D6;
    border-radius: .3125rem;
    padding: 0 1.25rem;
    transition: all 0.12s;
    color: #666
}

@media only screen and (max-width: 500px) {
    .input input, .input textarea {
        padding-left: .9375rem;
        padding-right: .9375rem
    }
}

.input input:focus, .input textarea:focus {
    border-color: #0078c8;
    color: #0078c8;
    box-shadow: 0 .1875rem .4375rem rgba(0, 0, 0, 0.05)
}

.input input.justborderbot, .input textarea.justborderbot {
    border-top: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0
}

.input input.justborderbot:focus, .input textarea.justborderbot:focus {
    box-shadow: none
}

@media only screen and (max-width: 800px) {
    .input input, .input textarea {
        height: 3.75rem;
        line-height: 3.75rem
    }
}

@media only screen and (max-width: 500px) {
    .input input, .input textarea {
        height: 3.5rem;
        line-height: 3.5rem
    }
}

.input--ltr input, .input--ltr textarea {
    text-align: left;
    direction: ltr
}

.input--icon input {
    padding-left: 4.375rem
}

@media only screen and (max-width: 500px) {
    .input--icon input {
        padding-left: 3.4375rem
    }
}

.input--solid input, .input--solid textarea {
    border: 0 !important
}

.input--solid input:focus, .input--solid textarea:focus {
    box-shadow: 0 .3125rem 1.25rem rgba(0, 0, 0, 0.07)
}

.input--md input {
    height: 4.5rem;
    line-height: 4.5rem
}

.input--shadow input {
    border: none;
    box-shadow: 0 .1875rem .8125rem rgba(0, 0, 0, 0.16)
}

.input--shadow input:focus {
    box-shadow: 0 .625rem .8125rem rgba(0, 0, 0, 0.3)
}

.input--fat input {
    font-size: 1.125rem;
    height: 4.5rem;
    line-height: 4.5rem
}

@media only screen and (max-width: 500px) {
    .input--fat input {
        height: 4rem;
        line-height: 4rem
    }
}

.login .input input, .login .input textarea {
    border-radius: 0;
    border-top: 0;
    border-right: 0;
    border-left: 0;
    box-shadow: none;
    padding: 0
}

.input input::-webkit-input-placeholder, .input textarea::-webkit-input-placeholder {
    font-family: IRANSansLight, IRANSans, tahoma, arial
}

.input input:-moz-placeholder, .input textarea:-moz-placeholder {
    font-family: IRANSansLight, IRANSans, tahoma, arial
}

.input input::-moz-placeholder, .input textarea::-moz-placeholder {
    font-family: IRANSansLight, IRANSans, tahoma, arial
}

.input input:-ms-input-placeholder, .input textarea:-ms-input-placeholder {
    font-family: IRANSansLight, IRANSans, tahoma, arial
}

.input textarea {
    min-height: 12.5rem
}

.input svg {
    position: absolute;
    width: 1.875rem;
    height: 1.875rem;
    left: 1.25rem;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media only screen and (max-width: 500px) {
    .input svg {
        left: .625rem
    }
}

.input button {
    position: absolute;
    width: 2.5rem;
    height: 2.5rem;
    left: 1.25rem;
    top: 50%;
    margin-top: -1.25rem
}

@media only screen and (max-width: 500px) {
    .input button {
        left: .625rem
    }
}

.input button:active, .input button.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.input button svg {
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.select {
    position: relative
}

.select select {
    opacity: 0
}

.select.disabled {
    opacity: 0.8
}

.select:after {
    content: '';
    cursor: not-allowed;
    pointer-events: none;
    opacity: 0;
    background-color: transparent;
    position: absolute;
    top: -10px;
    right: 0;
    width: 100%;
    height: 100%
}

.select.disabled:after {
    opacity: 1;
    pointer-events: all
}

.form-error {
    font-size: .875rem;
    color: #ff5f5f;
    margin-top: .4375rem
}

@media only screen and (max-width: 500px) {
    .form-error {
        font-size: 12px
    }
}

.checkbox input, .radiobtn input {
    cursor: pointer;
    opacity: 0
}

.checkbox i, .radiobtn i {
    position: absolute;
    width: 1rem;
    height: 1rem;
    right: 0;
    top: .3125rem;
    border-radius: 1px;
    transition: all 0.12s;
    border: 1px solid #0078c8;
    box-sizing: border-box
}

.checkbox input:active + i, .radiobtn input:active + i, .checkbox input.nice-select.open + i, .radiobtn input.nice-select.open + i, .radiobtn input:active + i, .radiobtn input.nice-select.open + i {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.checkbox i::after, .radiobtn i::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: .625rem;
    height: .625rem;
    border-radius: 1px;
    opacity: 0;
    transition: all 0.1s;
    -ms-transform-origin: center center;
    transform-origin: center center;
    background: #0078c8;
    background: linear-gradient(135deg, #0078c8 0%, #0032a0 100%)
}

.checkbox input:checked + i::after, .radiobtn input:checked + i::after, .radiobtn input:checked + i::after {
    opacity: 1
}

@media only screen and (min-width: 801px) {
    .checkbox:hover i::after, .radiobtn:hover i::after, .radiobtn:hover i::after {
        opacity: 0.5
    }
}

.checkbox span, .radiobtn span {
    display: block;
    color: #666;
    padding-right: 1.875rem
}

.checkbox input:checked + i + span, .radiobtn input:checked + i + span, .radiobtn input:checked + i + span {
    color: #373737
}

@media only screen and (min-width: 801px) {
    .checkbox:hover span, .radiobtn:hover span, .radiobtn:hover span {
        color: #373737
    }
}

.checkbox, .radiobtn {
    display: inline-block;
    position: relative
}

.login .checkbox, .login .radiobtn {
    margin-top: .625rem;
    font-size: .875rem
}

.checkbox input, .radiobtn input {
    z-index: 1
}

.page-job-list .filters-group .checkbox span, .page-job-list .filters-group .radiobtn span {
    font-size: .9375rem;
    padding-right: 2rem
}

@media only screen and (max-width: 500px) {
    .page-job-list .filters-group .checkbox span, .page-job-list .filters-group .radiobtn span {
        font-size: 1rem
    }
}

.radiobtn input {
    z-index: 1
}

.radiobtn i {
    border-radius: 50%;
    pointer-events: none
}

.radiobtn--color i {
    position: relative;
    display: block;
    top: auto;
    border: 1px solid #E6E6E6;
    height: 20px;
    width: 20px;
    transition: transform .3s
}

.radiobtn--color input:checked + i, .radiobtn--color.active i {
    border: 1px solid transparent
}

.radiobtn input:active + i, .radiobtn input.nice-select.open + i {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.radiobtn i::after {
    border-radius: 50%;
    transition: border-color .3s, border .3s
}

.radiobtn--color i::after {
    background: transparent;
    height: 22px;
    width: 22px;
    border: 2px solid transparent
}

.radiobtn--color input:checked + i::after, .radiobtn--color.active i::after {
    height: 32px;
    width: 32px;
    border-color: #c9c9c9;
    opacity: 0.5
}

.switch {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.switch-label {
    color: gray;
    cursor: pointer;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: color .2s ease-in-out
}

.switch.on .switch-label {
    color: #0078c8
}

.switch-label:first-of-type {
    color: #0078c8
}

.switch.on .switch-label:first-of-type {
    color: gray
}

.switch-handle {
    position: relative;
    width: 2.375rem;
    height: 1.25rem;
    border-radius: 1.25rem;
    background: #E6E6E6;
    margin: 0 2.1875rem;
    cursor: pointer
}

.switch-handle span {
    display: block;
    height: 0px;
    width: 0px;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 0;
    transition: .2s ease-in-out
}

.switch.on .switch-handle span {
    right: 100%
}

.switch-handle span::after {
    content: '';
    height: 30px;
    width: 30px;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 30px;
    background: #0078c8
}

.form-field {
    position: relative
}

.form-field--ltr {
    direction: ltr
}

.form-field--ltr .form-label {
    right: 100%;
    left: 0
}

.form-field--ltr.active .form-label {
    right: 100%
}

.form-field:not(:last-of-type) {
    margin-bottom: 2.5rem
}

.form-field::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 1px solid #E5E5E5;
    transition: all 0.15s linear
}

.form-field:not(.disabled):hover::before {
    border-color: #b2b2b2
}

.form-field::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: #0078c8;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1)
}

.form-field.focused::after {
    -ms-transform: scale(1, 1);
    transform: scale(1, 1)
}

.form-field.error::after {
    background: #ff5f5f
}

.form-input {
    background: transparent;
    width: 100%;
    height: 2.5rem;
    line-height: 2.5rem;
    font-size: 1.125rem;
    color: #545454
}

.form-input[disabled] {
    color: #999
}

.form-text {
    background: transparent;
    width: 100%;
    font-size: 1.125rem;
    color: #545454;
    min-height: 5rem;
    resize: vertical
}

.form-label {
    color: #999;
    pointer-events: none;
    position: absolute;
    right: 0;
    bottom: 50%;
    -ms-transform: translateY(50%);
    transform: translateY(50%);
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    -ms-transform-origin: right center;
    transform-origin: right center
}

.form-field.active .form-label {
    bottom: 100%;
    -ms-transform: translateY(5px) scale(0.75);
    transform: translateY(5px) scale(0.75)
}

.form-field.error .form-label {
    color: #ff5f5f
}

.form-error, .form label.error {
    position: absolute;
    top: 100%;
    right: 0;
    width: 100%;
    color: #ff5f5f;
    margin-top: 0;
    font-size: .75rem;
    transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.15s linear
}

.select {
    position: relative
}

.select::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 1px solid #E5E5E5;
    transition: all 0.15s linear
}

.select:hover::before {
    border-color: #b2b2b2
}

.select::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: #0078c8;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1)
}

.select.focus::after {
    -ms-transform: scale(1, 1);
    transform: scale(1, 1)
}

.select.error::after {
    background: #ff5f5f
}

.select-label {
    font-size: 1rem;
    color: #999;
    pointer-events: none;
    position: absolute;
    right: 0;
    bottom: 50%;
    -ms-transform: translateY(50%);
    transform: translateY(50%);
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    -ms-transform-origin: right center;
    transform-origin: right center
}

.select.active .select-label {
    bottom: 100%;
    -ms-transform: translateY(5px) scale(0.75);
    transform: translateY(5px) scale(0.75)
}

.select.error .select-label {
    color: #ff5f5f
}

.select-text {
    cursor: pointer;
    width: 100%;
    min-width: 0;
    max-width: none;
    height: 2.5rem;
    line-height: 2.5rem;
    font-size: 1.125rem;
    color: #545454;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #fff
}

.select-arrow {
    position: absolute;
    left: 0;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -ms-transform-origin: center center;
    transform-origin: center center;
    width: .875rem;
    height: .5625rem;
    transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    fill: #999
}

.select.open .select-arrow {
    -ms-transform: translateY(-50%) rotate(180deg);
    transform: translateY(-50%) rotate(180deg)
}

.select-options {
    display: none
}

.select-wrap {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    border-radius: 0 0 .3125rem .3125rem;
    overflow: hidden;
    background: #fff;
    -ms-transform-origin: center top;
    transform-origin: center top;
    -ms-transform: scale(0.9);
    transform: scale(0.9);
    pointer-events: none;
    box-shadow: 0 7px 10px rgba(0, 0, 0, 0.1);
    z-index: 100;
    max-height: 11.8125rem;
    overflow: auto;
    opacity: 0;
    transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.15s linear
}

.select.open .select-wrap {
    pointer-events: all;
    opacity: 1;
    -ms-transform: scale(1);
    transform: scale(1)
}

.select-wrap li {
    min-height: 2.9375rem;
    color: #545454;
    padding: .625rem;
    transition: background-color 0.15s cubic-bezier(0.23, 1, 0.32, 1);
    cursor: pointer
}

.select-wrap li:hover {
    background: #f5f5f5
}

.select-wrap li.active {
    background: #E5E5E5
}

.select-wrap li.disabled {
    pointer-events: none;
    color: #b3b3b3
}

.select-error {
    position: absolute;
    top: calc(100% + .5rem);
    right: 0;
    width: 100%;
    color: #ff5f5f;
    font-size: .875rem;
    opacity: 0;
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
    transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s linear
}

.select.error .select-error {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.bus--1 li, .bus--2 li, .bus--3 li, .bus--4 li, .bus--5 li, .bus--6 li, .bus--7 li, .bus--8 li, .bus--9 li, .bus--10 li {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 1.25rem
}

.bus {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-align: center;
    align-items: center
}

.bus--center {
    -ms-flex-pack: center;
    justify-content: center
}

.bus--1 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus--2 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus--3 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus--4 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus--5 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus--6 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus--7 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus--8 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus--9 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus--10 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bus li {
    position: relative;
    padding: 0 1.25rem
}

.bus--1 li {
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    max-width: 100%
}

.bus--1 li:nth-child(1n+1)::before {
    display: none
}

.bus--2 li {
    -ms-flex: 0 1 50%;
    flex: 0 1 50%;
    max-width: 50%
}

.bus--2 li:nth-child(2n+1)::before {
    display: none
}

.bus--3 li {
    -ms-flex: 0 1 33.33333%;
    flex: 0 1 33.33333%;
    max-width: 33.33333%
}

.bus--3 li:nth-child(3n+1)::before {
    display: none
}

.bus--4 li {
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    max-width: 25%
}

.bus--4 li:nth-child(4n+1)::before {
    display: none
}

.bus--5 li {
    -ms-flex: 0 1 20%;
    flex: 0 1 20%;
    max-width: 20%
}

.bus--5 li:nth-child(5n+1)::before {
    display: none
}

.bus--6 li {
    -ms-flex: 0 1 16.66667%;
    flex: 0 1 16.66667%;
    max-width: 16.66667%
}

.bus--6 li:nth-child(6n+1)::before {
    display: none
}

.bus--7 li {
    -ms-flex: 0 1 14.28571%;
    flex: 0 1 14.28571%;
    max-width: 14.28571%
}

.bus--7 li:nth-child(7n+1)::before {
    display: none
}

.bus--8 li {
    -ms-flex: 0 1 12.5%;
    flex: 0 1 12.5%;
    max-width: 12.5%
}

.bus--8 li:nth-child(8n+1)::before {
    display: none
}

.bus--9 li {
    -ms-flex: 0 1 11.11111%;
    flex: 0 1 11.11111%;
    max-width: 11.11111%
}

.bus--9 li:nth-child(9n+1)::before {
    display: none
}

.bus--10 li {
    -ms-flex: 0 1 10%;
    flex: 0 1 10%;
    max-width: 10%
}

.bus--10 li:nth-child(10n+1)::before {
    display: none
}

.bus li:not(:first-child)::before {
    content: "";
    position: absolute;
    width: 1px;
    height: 2.5rem;
    border-radius: 2px;
    right: 0;
    top: 50%;
    margin-top: -1.25rem;
    background-color: #E6E6E6
}

.bus--white li:not(:first-child)::before {
    background-color: #fff;
    opacity: 0.3
}

.bus--bottom li:not(:first-child)::before {
    height: 5.9375rem;
    top: 50%;
    -ms-transform: none;
    transform: none
}

.card-a {
    position: relative;
    z-index: 1
}

.card-a__header {
    margin-bottom: 1.875rem
}

.card-a__title {
    color: #666
}

.card-a__subtitle {
    color: #666
}

.card-a__body {
    color: #373737;
    margin-bottom: 2.5rem;
    text-align: justify
}

.card-a__preview {
    display: block;
    border-radius: 3px
}

.card-a__preview::after {
    content: '';
    display: block;
    padding-top: 100%
}

.card-a__slider {
    position: relative;
    border-radius: 3px;
    overflow: hidden
}

.card-a__slider .swiper-pagination {
    position: absolute;
    text-align: left;
    padding: 0 1.25rem;
    bottom: 1.25rem;
    z-index: 10;
    line-height: 0
}

.flip--left .card-a__slider .swiper-pagination {
    text-align: right
}

.card-a__slider .swiper-slide::after {
    content: '';
    display: block;
    padding-top: 52.8%
}

@media only screen and (min-width: 801px) {
    .card-a__content {
        margin-top: 3.125rem;
        padding-left: 50px;
        max-width: 33.125rem
    }
}

@media only screen and (min-width: 801px) {
    .flip--left .card-a__content {
        padding: 0 50px 0 0
    }
}

@media only screen and (max-width: 800px) {
    .card-a__btn {
        text-align: center;
        margin-top: 2.5rem
    }
}

.card-b {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    overflow: hidden;
    min-height: 280px;
    border-radius: .25rem;
    padding-right: 5rem;
    background-color: #666
}

@media only screen and (max-width: 800px) {
    .card-b {
        padding-right: 0
    }
}

.card-b::after {
    content: '';
    display: block;
    padding-top: 36.21%
}

.card-b--small::after {
    padding-top: 73.7%
}

.card-b__img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1)
}

@media only screen and (min-width: 801px) {
    .card-b .btn:hover ~ .card-b__img {
        -ms-transform: scale(1.03);
        transform: scale(1.03)
    }
}

.card-b__img::after {
    content: '';
    width: 60%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background: linear-gradient(to left, #000 0%, rgba(0, 0, 0, 0) 100%)
}

@media only screen and (max-width: 800px) {
    .card-b__img::after {
        width: 100%
    }
}

@media only screen and (max-width: 500px) {
    .card-b__img::after {
        background: rgba(0, 0, 0, 0.5)
    }
}

.card-b__content {
    max-width: 20.625rem;
    z-index: 2
}

@media only screen and (max-width: 1050px) {
    .card-b__content {
        right: 2.5rem
    }
}

@media only screen and (max-width: 800px) {
    .card-b__content {
        right: 0;
        max-width: none;
        padding: 0 15px
    }
}

.card-b__content p {
    color: #fff;
    font-size: 1.0625rem;
    opacity: .8;
    margin-bottom: 1.5625rem;
    text-align: justify;
    position: relative;
    z-index: 1
}

.card-b__content .btn {
    position: relative;
    z-index: 1
}

.card-b__title {
    color: #fff;
    margin-bottom: .9375rem;
    position: relative;
    z-index: 1
}

.card-f {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center
}

.card-f--vertical {
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center
}

@media only screen and (max-width: 800px) {
    .intro--index .card-f--vertical {
        width: 90px
    }
}

.card-f--right {
    text-align: right;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-f--smicon {
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 1.25rem;
    border-radius: .3125rem;
    transition: all 0.2s
}

@media only screen and (min-width: 801px) {
    .card-f--smicon:hover {
        background-color: #F7f7f7
    }
}

@media only screen and (max-width: 800px) {
    .card-f--smicon {
        padding: 0
    }
}

.card-f--border {
    position: relative
}

.card-f--border:not(:last-of-type)::after {
    content: '';
    width: 100%;
    height: 1px;
    background: #E6E6E6;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: -1
}

@media only screen and (min-width: 801px) {
    .card-f--border:hover::after {
        opacity: 0
    }
}

.card-f__wrap {
    width: 100%;
    text-align: right
}

.card-f__img {
    -ms-flex: none;
    flex: none;
    max-width: 30%;
    max-height: 5rem;
    margin-left: 1.25rem;
    transition: all 0.2s
}

@media only screen and (max-width: 500px) {
    .card-f__img {
        margin-left: .9375rem;
        max-width: 25%
    }
}

.card-f--vertical .card-f__img {
    display: block;
    max-width: 100%;
    height: 4.6875rem;
    margin: 0 auto .625rem
}

.card-f--right .card-f__img {
    margin: 0 0 .625rem;
    filter: brightness(5.5)
}

.card-f--smicon .card-f__img {
    -ms-flex: none;
    flex: none;
    max-width: 2.5rem;
    margin-top: .3125rem
}

.card-f--hover:hover .card-f__img {
    -ms-transform: translateY(-.3125rem);
    transform: translateY(-.3125rem)
}

.card-f__title {
    color: #666;
    transition: all 0.2s
}

@media only screen and (max-width: 500px) {
    .card-f--vertical .card-f__title {
        font-size: 12px
    }
}

.card-f--light .card-f__title {
    color: #fff
}

@media only screen and (min-width: 801px) {
    .card-f--smicon:hover .card-f__title {
        color: #373737
    }
}

.card-f__desc {
    font-size: .875rem;
    margin-top: .3125rem;
    color: #b3b3b3;
    text-align: right;
    transition: all 0.1s
}

.darkness .darkness-wrap .card-f--light .card-f__desc {
    color: #fff;
    min-height: 170px
}

.card-f--light .card-f__desc {
    color: #fff
}

@media only screen and (min-width: 801px) {
    .card-f--smicon:hover .card-f__desc {
        color: #373737
    }
}

@media only screen and (max-width: 800px) {
    .card-agent {
        padding: 20px 0 0
    }
}

.card-agent__title {
    position: relative;
    color: #666;
    margin-bottom: .625rem
}

@media only screen and (max-width: 800px) {
    .card-agent__title {
        padding: 0 20px 0 35px
    }
}

@media only screen and (max-width: 500px) {
    .card-agent__title {
        font-size: 13px
    }
}

.card-agent__title span {
    display: inline-block;
    margin-right: .3125rem;
    font-size: .875rem
}

.card-agent__title::after {
    content: '';
    display: none;
    position: absolute;
    left: 15px;
    top: 5px;
    height: 10px;
    width: 10px;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    border-right: 2px solid #078cdc;
    border-bottom: 2px solid #078cdc;
    transition: transform .2s ease-in-out
}

.card-agent.active .card-agent__title::after {
    -ms-transform: rotate(225deg);
    transform: rotate(225deg)
}

@media only screen and (max-width: 800px) {
    .card-agent__title::after {
        display: block
    }
}

.card-agent__banks {
    display: none;
    font-size: .875rem;
    color: #078cdc;
    margin-bottom: 20px
}

@media only screen and (max-width: 800px) {
    .card-agent__banks {
        display: block;
        padding: 0 20px
    }
}

.card-agent__info {
    display: -ms-flexbox;
    display: flex;
    margin-bottom: .625rem
}

@media only screen and (max-width: 800px) {
    .card-agent__info {
        padding-top: 20px
    }
}

@media only screen and (min-width: 801px) {
    .card-agent__desc {
        height: auto !important;
        display: block !important;
        padding: 0 !important
    }
}

@media only screen and (max-width: 800px) {
    .card-agent__desc {
        display: none;
        background: #EDEDED;
        padding: 0 20px
    }
}

.card-agent__state {
    font-size: .8125rem;
    color: #666;
    margin-left: 1.25rem
}

.card-agent__tel {
    display: block;
    font-size: .875rem;
    color: #4d4d4d;
    -ms-flex: none;
    flex: none;
    transition: color .15s linear
}

@media only screen and (min-width: 1051px) {
    .card-agent__tel:hover {
        color: #0078c8
    }
}

.card-agent__tel i {
    direction: ltr;
    display: inline-block
}

.card-agent__tel span {
    color: #a3a3a3;
    display: inline-block;
    margin-right: .3125rem;
    transition: color .15s linear
}

@media only screen and (min-width: 1051px) {
    .card-agent__tel:hover span {
        color: #0078c8
    }
}

.card-agent__address {
    font-size: .8125rem;
    color: #4d4d4d
}

@media only screen and (max-width: 800px) {
    .card-agent__address {
        padding-bottom: 20px
    }
}

.color-bar {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    box-shadow: -72vw 0 0 8px #78be1e, -65vw 0 0 8px #019e43, -58vw 0 0 8px #0182c6, 0vw 0 0 8px #1d4f9b
}

@media only screen and (max-width: 800px) {
    .color-bar {
        box-shadow: -72vw 0 0 4px #78be1e, -65vw 0 0 4px #019e43, -58vw 0 0 4px #0182c6, 0vw 0 0 4px #1d4f9b
    }
}

.card-v {
    width: 100%;
    text-align: center
}

.card-v__img {
    height: 4.625rem;
    width: 3.6875rem;
    margin-bottom: 1.4375rem
}

.card-v__title {
    color: #ffffff;
    font-size: 1rem;
    margin-bottom: 6px
}

.card-v__desc {
    color: rgba(255, 255, 255, 0.6);
    font-size: .875rem
}

.card-v--morepadd {
    padding: 2.5rem 0 1.6875rem
}

.card-v--nopaddtop {
    padding-top: 0
}

.card-v--nopaddleft {
    padding-left: 0
}

.card-video__content {
    width: 50%;
    max-width: 28.125rem;
    min-height: 21.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 15px
}

@media only screen and (max-width: 800px) {
    .card-video__content {
        width: 100%;
        min-height: 0;
        max-width: none;
        padding-left: 0;
        display: block
    }
}

.card-video__content::after {
    content: '';
    width: 50%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    background: linear-gradient(145deg, #00bee6 -50%, #78be1e 150%)
}

@media only screen and (max-width: 800px) {
    .card-video__content::after {
        width: 100%
    }
}

.card-video__content--pad-y {
    padding: 8.75rem 0
}

.card-video__content--marg-x {
    margin: 0 4.75rem
}

.card-video__content--rightradius::after {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px
}

.card-video__content--bg55deg::after {
    background: linear-gradient(55deg, #00bee6 5%, #78be1e 134%)
}

.card-video__info {
    position: relative;
    text-align: center;
    z-index: 1
}

.card-video__title {
    color: #fff;
    text-align: center;
    margin-bottom: .9375rem
}

.card-video__title--lowmarbottom {
    margin-bottom: .625rem
}

.card-video__subtitle {
    display: inline-block;
    text-align: center;
    padding: .3125rem .9375rem;
    background: #fff;
    border-radius: .25rem;
    color: #373737;
    margin-bottom: 1.875rem;
    min-width: 15rem
}

.card-video__subtitle--nobgcolor {
    color: #fff;
    background: none
}

.card-video__subtitle--lowsize {
    font-size: 1.25rem
}

.card-video__subtitle--moremarbottom {
    margin-bottom: 2.75rem
}

.card-video__text {
    color: #fff;
    text-align: justify
}

.card-video__text--lowweight {
    font-size: .9375rem
}

.card-video__text--center {
    text-align: center
}

.card-video__preview {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 50%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media only screen and (max-width: 800px) {
    .card-video__preview {
        position: relative;
        width: 100%;
        height: 400px
    }
}

.card-video__preview::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: .38;
    background: linear-gradient(45deg, #00a03c 0%, #0078c8 100%)
}

.card-video__preview::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: .4;
    background: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0) 50%, #000 100%)
}

.card-video__preview--leftradius {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.card-video__preview--leftradius::after {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.card-video__preview--leftradius::before {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.sort {
    position: relative;
    height: 4.375rem
}

@media only screen and (min-width: 1051px) {
    .sort {
        display: none
    }
}

.sort-wrap {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background: #fff;
    box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.07);
    padding: 0 1.5rem
}

.sort-wrap.fixed {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 99
}

.sort-wrap.tr {
    transition: transform 0.3s ease-in-out
}

body.header-show .sort-wrap.fixed {
    -ms-transform: translateY(5.3125rem);
    transform: translateY(5.3125rem)
}

@media only screen and (max-width: 800px) {
    body.header-show .sort-wrap.fixed {
        padding-top: 4px;
        -ms-transform: translateY(4.0625rem);
        transform: translateY(4.0625rem)
    }
}

@media only screen and (max-width: 500px) {
    body.header-show .sort-wrap.fixed {
        -ms-transform: translateY(4.0625rem);
        transform: translateY(4.0625rem)
    }
}

.sort-container {
    max-width: 74.375rem;
    margin: 0 auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-align: center;
    align-items: center;
    height: 4.375rem
}

.sort-container span {
    margin-right: .75rem
}

.sort-info {
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    color: #373737
}

.sort-info > span {
    display: inline-block;
    margin-right: .625rem
}

.sort-info:first-of-type > span {
    margin-right: 0
}

@media only screen and (max-width: 1050px) {
    .sort-info--clear, .sort-info--result, .sort-info--select {
        display: none
    }
}

.sort .select {
    height: 100%;
    -ms-flex: none;
    flex: none;
    font-size: 1.0625rem;
    color: #373737;
    min-width: 12.8125rem
}

.sort .select a {
    display: block;
    color: #373737
}

.sort .nice-select {
    height: 100%;
    border: 1px solid transparent;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.sort .nice-select::after {
    border-color: #707070
}

.sort .current {
    font-size: 1.0625rem;
    color: #373737
}

.sort-divider {
    width: 1px;
    height: 1rem;
    background: #a3a3a3;
    margin: 0 1.125rem;
    border-radius: 1px
}

.sort-btn {
    color: #373737
}

@media only screen and (min-width: 801px) {
    .sort-btn:hover {
        color: #ff5f5f
    }
}

.sort-btn svg {
    margin-right: .3125rem;
    fill: #707070
}

@media only screen and (min-width: 801px) {
    .sort-btn:hover svg {
        fill: #ff5f5f
    }
}

.sort-filter {
    display: none
}

@media only screen and (max-width: 1050px) {
    .sort-filter {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align: center;
        align-items: center
    }

    .sort-filter:last-child {
        margin-right: auto;
        padding: .625rem .625rem .625rem 0
    }
}

.filters-wrap {
    z-index: 99
}

@media only screen and (max-width: 1050px) {
    .filters-wrap {
        position: fixed;
        right: 0;
        top: 5.3125rem;
        padding: 2rem 1.25rem;
        width: 360px;
        height: calc(100vh - (5.3125rem));
        overflow: hidden;
        overflow-y: auto;
        -ms-transform: translateX(100%);
        transform: translateX(100%);
        transition: transform .3s ease-in-out;
        z-index: 99;
        direction: ltr;
        background: #fff
    }
}

@media only screen and (max-width: 800px) {
    .filters-wrap {
        top: 4.0625rem;
        height: calc(100vh - (4.0625rem))
    }
}

@media only screen and (max-width: 500px) {
    .filters-wrap {
        width: 100%
    }
}

.resizing .filters-wrap {
    transition: none !important
}

.filter-open .filters-wrap {
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.tr .filters-wrap {
    top: 4.375rem;
    height: calc(100vh - 4.375rem)
}

@media only screen and (max-width: 1050px) {
    .header-show .filters-wrap {
        top: calc(4.375rem + 5.3125rem);
        height: calc(100vh - (4.375rem + 5.3125rem))
    }
}

@media only screen and (max-width: 800px) {
    .header-show .filters-wrap {
        top: calc(4.375rem + 4.0625rem);
        height: calc(100vh - (4.375rem + 4.0625rem))
    }
}

.filters-header {
    display: none;
    position: fixed;
    right: 0;
    top: 0;
    width: 360px;
    height: 5.3125rem;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 0 1.25rem;
    font-size: 1.0625rem;
    color: #373737;
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.07);
    background: #fff;
    z-index: 99;
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    transition: transform .3s ease-in-out
}

@media only screen and (max-width: 1050px) {
    .filters-header {
        display: -ms-flexbox;
        display: flex;
        direction: rtl
    }
}

@media only screen and (max-width: 800px) {
    .filters-header {
        height: 4.0625rem
    }
}

@media only screen and (max-width: 500px) {
    .filters-header {
        width: 100%
    }
}

.tr .filters-header {
    height: 4.375rem
}

.filters.top .filters-header {
    z-index: 200
}

.resizing .filters-header {
    transition: none
}

.filter-open .filters-header {
    -ms-transform: translateX(0);
    transform: translateX(0)
}

@media only screen and (max-width: 1050px) {
    .header-show .filters-header {
        top: 5.3125rem
    }
}

@media only screen and (max-width: 800px) {
    .header-show .filters-header {
        top: 4.0625rem
    }
}

.filters-header button {
    font-size: 0
}

.filters-header button.filter-close {
    margin-right: 1.25rem
}

.filters-header button.list-filters__clear {
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    -ms-flex-item-align: auto;
    align-self: auto
}

.filters-header button.list-filters__clear span {
    color: #f22b2b
}

.filters-header button svg {
    height: 16px;
    width: 16px;
    fill: #707070
}

.filters-header span {
    margin-right: .75rem
}

.filters-title {
    position: relative;
    display: block;
    color: #373737;
    font-size: 1.0625rem;
    padding-left: 1.25rem;
    width: 100%;
    text-align: right
}

.filters-title::after, .filters-title::before {
    content: '';
    width: .875rem;
    height: 2px;
    border-radius: 2px;
    background: #707070;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 0
}

.filters-title::before {
    -ms-transform-origin: center center;
    transform-origin: center center;
    transition: transform .15s ease-in-out
}

.open .filters-title::before {
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.filters-group {
    background: #fff;
    padding: 1.5rem
}

@media only screen and (max-width: 1050px) {
    .filters-group {
        direction: rtl;
        padding: 2rem 0 2rem
    }

    .filters-group:first-child {
        padding: 0 0 2rem
    }
}

.filters-group:not(:last-child) {
    border-bottom: 1px solid #E6E6E6
}

.filters-group:last-of-type {
    margin-bottom: 2px
}

@media only screen and (max-width: 1050px) {
    .filters-group:last-of-type {
        margin-bottom: 0
    }
}

.filters-group:first-child {
    margin-bottom: 1.25rem;
    border-bottom: none;
    border-radius: 4px;
    position: relative
}

@media only screen and (max-width: 1050px) {
    .filters-group:first-child {
        margin-bottom: 0;
        border-radius: 0;
        border-bottom: 1px solid #E6E6E6
    }
}

.filters-group:first-child::after {
    content: '';
    position: absolute;
    top: 4.6875rem;
    right: 0;
    width: 100%;
    height: 1px;
    background-color: #E6E6E6
}

@media only screen and (max-width: 1050px) {
    .filters-group:first-child::after {
        display: none
    }
}

.filters-group:nth-child(2) {
    border-top-right-radius: 4px;
    border-top-left-radius: 4px
}

@media only screen and (max-width: 1050px) {
    .filters-group:nth-child(2) {
        border-top-right-radius: 0;
        border-top-left-radius: 0
    }
}

.filters-group:last-child {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px
}

@media only screen and (max-width: 1050px) {
    .filters-group:last-child {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0
    }
}

.filters-group li {
    padding-right: .625rem
}

.filters-group li:not(:last-of-type) {
    margin-bottom: .625rem
}

.filters-group--colors li:not(:last-of-type) {
    margin-bottom: 0
}

.filters-group li:first-of-type {
    margin-top: 1.25rem
}

.filters-group--colors li:first-of-type {
    margin: 0 .625rem 0 .3125rem;
    padding-right: 0
}

.filters-group .filters-box li:first-of-type {
    margin-top: 0
}

.filters-group--colors li {
    display: inline-block;
    padding: 0;
    margin: 0 0 0 .3125rem
}

.filters-group--colors ul {
    margin-top: 1.5625rem
}

.filters-box {
    margin-top: .9375rem;
    overflow: auto;
    direction: ltr
}

.filters-box > * {
    direction: rtl
}

.filters-footer {
    bottom: 0;
    right: 0;
    z-index: 99;
    background: #fff;
    height: 6.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    transition: transform .3s ease-in-out;
    padding: 0 1.25rem
}

@media only screen and (max-width: 1050px) {
    .filters-footer {
        box-shadow: 0 -2px 7px rgba(0, 0, 0, 0.02)
    }
}

.resizing .filters-footer {
    transition: none
}

.filter-open .filters-footer {
    -ms-transform: translateX(0);
    transform: translateX(0)
}

@media only screen and (max-width: 1050px) {
    .filters-footer {
        position: fixed;
        width: 360px;
        -ms-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@media only screen and (max-width: 500px) {
    .filters-footer {
        width: 100%
    }
}

.filters-footer .btn {
    height: 3rem;
    line-height: 3rem;
    font-size: 1.125rem
}

.filters-show {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem
}

@media only screen and (max-width: 1050px) {
    .filters-show {
        display: none
    }
}

.filters-show span {
    font-size: 1.0625rem
}

.filters-show__buttons {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.filters-show button {
    font-size: 0
}

.filters-show button:not(:last-child) {
    margin-left: 1rem
}

.filters-show button:hover svg {
    fill: #0078c8
}

.filters-show button.active svg {
    fill: #0078c8
}

.filters-show svg {
    transition: all .3s;
    fill: #999
}

.card-product {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.5625rem 1.25rem 1.25rem;
    border-radius: .25rem;
    background-color: #fff;
    margin-bottom: 1.25rem;
    transition: box-shadow .15s linear
}

@media only screen and (min-width: 1051px) {
    .card-product:hover {
        box-shadow: 0 .3125rem .625rem rgba(0, 120, 200, 0.05)
    }
}

.card-product__preview {
    width: 13rem;
    overflow: hidden;
    position: relative;
    margin-left: .875rem;
    -ms-flex: none;
    flex: none
}

@media only screen and (max-width: 600px) {
    .card-product__preview {
        width: 100%
    }
}

.card-product__preview::after {
    content: '';
    display: block;
    padding-top: 100%
}

@media only screen and (max-width: 600px) {
    .card-product__preview::after {
        display: none
    }
}

.card-product__preview a, .card-product__preview img {
    display: block
}

.card-product__preview img {
    margin: 0 auto 30px;
    width: 100%;
    max-width: 13rem;
    height: auto
}

@media only screen and (min-width: 601px) {
    .card-product__preview img {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        margin: auto
    }
}

.card-product__content {
    position: relative;
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-product__header {
    color: #373737;
    margin-bottom: .5rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-product__model {
    display: none;
    color: #373737;
    font-size: 1rem
}

.card-product__title {
    margin-top: .1875rem;
    color: #373737;
    font-size: 1.25rem
}

.card-product__desc {
    font-size: .9375rem;
    margin-bottom: 1rem
}

.card-product__info-wrap {
    display: -ms-flexbox;
    display: flex;
    margin-top: 1rem
}

.card-product__info {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex: 2;
    flex: 2;
    position: relative
}

.card-product__info::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 94%;
    height: 1px;
    background-color: #E6E6E6
}

.card-product__footer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center
}

.card-product__spec {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex: 1;
    flex: 1
}

.card-product__energy {
    display: inline-block;
    position: relative;
    line-height: 0;
    margin-left: 1.5rem
}

.card-product__energy span {
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    margin-left: .25rem;
    line-height: 1;
    color: #fff;
    direction: ltr
}

.card-product__colors ul {
    font-size: 0
}

.card-product__colors li {
    display: inline-block;
    margin-left: .625rem
}

.card-product__colors .radiobtn {
    margin-top: .3125rem
}

.card-product__send {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex: 1;
    flex: 1;
    margin-top: 1.1875rem;
    -ms-flex-pack: center;
    justify-content: center
}

.card-product__send span {
    margin-right: .75rem;
    font-size: .75rem;
    color: #666
}

.card-product .icon {
    fill: #373737
}

.card-product .icon--label {
    stroke: #C0D730
}

.card-product .icon--plus {
    width: .625rem;
    height: .625rem
}

.card-product .icon--forwarding {
    margin-left: .375rem
}

.card-product .icon--installation {
    margin-right: .375rem
}

.card-product__price {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex: 1;
    flex: 1;
    min-height: 3rem
}

.card-product__price .leasing_sell, .card-product__price .cash_sell {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    font-size: 0.7rem;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    -ms-flex-pack: center;
    justify-content: center
}

.card-product__price .leasing_sell p, .card-product__price .cash_sell p {
    margin-left: 1rem
}

.card-product__price .leasing_sell {
    opacity: 0.8
}

.card-product__price-original {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.card-product__price-original span:first-child {
    font-size: 1.375rem;
    color: #373737
}

.card-product__price-original span:last-child {
    font-size: 1.125rem;
    color: #333;
    margin-right: .5rem
}

.card-product__price-discount {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: .875rem;
    padding: 0 .5rem;
    color: #f22b2b;
    position: relative
}

.card-product__price-discount span:first-child {
    font-size: 1.375rem
}

.card-product__price-discount span:last-child {
    font-size: 1.125rem;
    margin-right: .5rem
}

.card-product__price-discount::before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    top: 49%;
    background-color: rgba(242, 43, 43, 0.5)
}

.card-product__price--unavailable {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex: 1;
    flex: 1
}

.card-product__price--unavailable .card-product__price-original span:first-child {
    font-size: 1.125rem;
    color: #999
}

.card-product__price--unavailable .card-product__price-original span:last-child {
    font-size: .875rem;
    color: #999;
    margin-right: .25rem
}

.card-product__price-unavailable {
    font-size: .6875rem;
    color: gray;
    margin-right: 1.0625rem
}

.card-product__btn {
    max-width: 13.625rem
}

.card-product__btn a, .card-product__btn button {
    min-width: 13.625rem;
    min-height: 3rem;
    font-size: 1.0625rem
}

@media only screen and (min-width: 801px) {
    .card-product__btn {
        opacity: 1
    }
}

.card-product__buy {
    margin-top: 1.0625rem;
    max-width: 13.625rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.card-product__buy a {
    font-size: .8125rem;
    color: #2b2929;
    transition: all .2s
}

.card-product__buy a:hover {
    color: #0078c8
}

.card-product__buy-online {
    padding-left: 1.75rem;
    margin-left: 1.75rem;
    border-left: 1px solid #E6E6E6
}

.card-product__offer {
    position: absolute;
    top: .75rem;
    right: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-product__offer .icon--special-offer {
    margin-right: -.25rem
}

.card-product__offer span {
    position: absolute;
    top: 0;
    right: .625rem;
    color: #fff;
    font-size: .8125rem;
    padding: .1875rem 0
}

.card-product .loading-box::before {
    content: "";
    position: absolute;
    right: -.25rem;
    width: .25rem;
    height: 1.6875rem;
    top: .75rem;
    background-color: rgba(255, 255, 255, 0.7)
}

.card-product--vertical {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 2.25rem .9375rem 1.25rem;
    min-height: 35.8125rem
}

.card-product--vertical .card-product__preview {
    margin-left: 0;
    width: 10.375rem
}

.card-product--vertical .card-product__preview img {
    max-width: 10.375rem;
    margin: 0
}

.card-product--vertical .card-product__header {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 0;
    margin-top: .5rem
}

.card-product--vertical .card-product__title {
    margin-top: 0;
    color: #373737;
    font-size: 1rem
}

.card-product--vertical .card-product__model {
    display: block;
    margin-top: .375rem
}

.card-product--vertical .card-product__desc {
    display: none
}

.card-product--vertical .card-product__info-wrap {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 0
}

.card-product--vertical .card-product__info {
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.card-product--vertical .card-product__info::after {
    display: none
}

.card-product--vertical .card-product__spec {
    position: absolute;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-order: -1;
    order: -1;
    margin-top: -1.25rem;
    width: 100%
}

.card-product--vertical .card-product__energy {
    display: none
}

.card-product--vertical .card-product__price {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 4.6875rem;
    width: 100%
}

.card-product--vertical .card-product__price .leasing_sell, .card-product--vertical .card-product__price .cash_sell {
    -ms-flex-direction: row;
    flex-direction: row
}

.card-product--vertical .card-product__price-original span:first-child {
    color: #2b2929
}

.card-product--vertical .card-product__price-original span:last-child {
    color: #2b2929;
    margin-right: .25rem
}

.card-product--vertical .card-product__price-discount {
    margin-right: 0;
    padding: 0 .25rem
}

.card-product--vertical .card-product__price-discount span:first-child {
    font-size: 1rem
}

.card-product--vertical .card-product__price-discount span:last-child {
    font-size: .875rem;
    margin-right: .25rem
}

.card-product--vertical .card-product__price--unavailable {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center
}

.card-product--vertical .card-product__price--unavailable .card-product__price-original {
    margin-bottom: .1875rem
}

.card-product--vertical .card-product__price--unavailable .card-product__price-original span:first-child {
    color: #999
}

.card-product--vertical .card-product__price--unavailable .card-product__price-original span:last-child {
    color: #999;
    margin-right: .25rem
}

.card-product--vertical .card-product__price-unavailable {
    max-width: 11.25rem;
    margin-right: 0;
    text-align: center
}

.card-product--vertical .card-product__footer {
    width: 100%
}

.card-product--vertical .card-product__send {
    margin-top: 1rem;
    padding-top: 1rem;
    margin-bottom: 1.5rem;
    border-top: 1px solid #E6E6E6;
    min-width: 14.8125rem
}

@media only screen and (max-width: 500px) {
    .card-product--vertical .card-product__send {
        min-width: 17.5rem
    }
}

.card-product--vertical .card-product__colors .radiobtn {
    margin-top: .25rem
}

.card-product--vertical .card-product__colors .radiobtn--color i {
    pointer-events: none;
    height: 14px;
    width: 14px
}

.card-product--vertical .card-product__colors .radiobtn--color i::after {
    height: 20px;
    width: 20px
}

.card-product--vertical .card-product__colors .radiobtn--color input:checked + i::after, .card-product--vertical .card-product__colors .radiobtn--color.active i::after {
    height: 24px;
    width: 24px
}

.card-product--vertical .card-product__btn {
    width: 100%;
    max-width: none
}

.card-product--vertical .card-product__btn a, .card-product--vertical .card-product__btn button {
    width: 100%
}

@media only screen and (max-width: 500px) {
    .card-product--vertical .card-product__buy {
        max-width: 17.5rem
    }
}

.card-product--empty {
    padding: 2.5rem 1.25rem
}

.jumbotron {
    position: relative;
    height: 100vh;
    min-height: 31.25rem;
    max-height: 2400px;
    overflow: hidden
}

@media only screen and (max-width: 800px) {
    .jumbotron {
        height: auto !important
    }
}

.jumbotron--feature, .jumbotron--desc {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: end;
    align-items: flex-end
}

.jumbotron::after {
    content: none;
    width: 100%;
    height: 50%;
    position: absolute;
    left: 0;
    bottom: 0;
    background: linear-gradient(to top, #000 0%, rgba(0, 0, 0, 0) 100%);
    z-index: 2
}

@media only screen and (max-width: 800px) {
    .jumbotron::after {
        height: 100%;
        background: rgba(0, 0, 0, 0.6)
    }
}

.jumbotron-bg {
    position: absolute;
    width: 100%;
    height: 120%;
    left: 0;
    bottom: 0;
    z-index: 1
}

.jumbotron-footer {
    position: relative;
    z-index: 5;
    width: 100%;
    padding: 0 15px
}

.jumbotron--feature .jumbotron-footer {
    max-width: 68.125rem
}

.jumbotron--desc .jumbotron-footer {
    max-width: 74.375rem
}

.jumbotron-footer .bus {
    -ms-flex-align: inherit;
    align-items: inherit;
    border-radius: 12px
}

@media only screen and (max-width: 800px) {
    .jumbotron-footer .bus {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

.jumbotron-footer .bus li {
    -ms-flex: 1;
    flex: 1;
    padding: 0 2.5rem
}

@media only screen and (max-width: 800px) {
    .jumbotron-footer .bus li {
        -ms-flex: auto;
        flex: auto;
        width: 100%;
        padding: 0;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        justify-content: center;
        margin-bottom: 1.875rem
    }
}

.jumbotron-footer .bus li:first-of-type {
    padding-right: 0
}

.jumbotron-footer .bus li:last-of-type {
    padding-left: 0
}

.jumbotron-footer .bus li:not(:first-child)::before {
    opacity: .3;
    width: 2px
}

@media only screen and (max-width: 800px) {
    .jumbotron-footer .bus li:not(:first-child)::before {
        top: -15px;
        left: 0;
        margin: auto;
        width: 35px;
        height: 1px
    }
}

.jumbotron-footer .post {
    max-width: 23.125rem;
    font-size: .875rem;
    color: #fff;
    margin-top: 1.875rem
}

.jumbotron-footer .card-f {
    -ms-flex-align: start;
    align-items: flex-start
}

@media only screen and (max-width: 800px) {
    .jumbotron-footer .card-f {
        max-width: 25rem
    }
}

.jumbotron-footer .card-f__img {
    height: 4.5rem;
    max-width: none;
    filter: brightness(5.5)
}

@media only screen and (max-width: 800px) {
    .jumbotron-footer .card-f__img {
        width: 72px
    }
}

.jumbotron-footer .card-f__title {
    font-size: .875rem
}

.jumbotron.content-fixed-size .jumbotron-footer_container {
    max-width: 74.375rem;
    height: 100%;
    width: 100%;
    position: relative
}

.jumbotron.content-fixed-size .jumbotron-footer_container .jumbotron-footer {
    position: absolute;
    z-index: 5;
    width: 100%;
    padding: 0 15px;
    max-width: 350px
}

@media only screen and (max-width: 800px) {
    .jumbotron.content-fixed-size .jumbotron-footer_container .jumbotron-footer {
        position: relative;
        width: 100%;
        max-width: unset
    }

    .jumbotron.content-fixed-size .jumbotron-footer_container .jumbotron-footer .s-header {
        -ms-flex-align: center;
        align-items: center
    }

    .jumbotron.content-fixed-size .jumbotron-footer_container .jumbotron-footer .post {
        text-align: center;
        margin-right: auto;
        margin-left: auto
    }
}

.jumbotron.show_shadow::after {
    content: ""
}

@media only screen and (min-width: 601px) {
    .jumbotron.jumbotron.content-fixed-size.desc-position_b_left .jumbotron-footer {
        left: auto;
        right: auto;
        bottom: auto;
        top: auto;
        bottom: 0;
        left: 0
    }
}

@media only screen and (min-width: 601px) {
    .jumbotron.jumbotron.content-fixed-size.desc-position_b_right .jumbotron-footer {
        left: auto;
        right: auto;
        bottom: auto;
        top: auto;
        bottom: 0;
        right: 0
    }
}

@media only screen and (min-width: 601px) {
    .jumbotron.jumbotron.content-fixed-size.desc-position_t_right .jumbotron-footer {
        left: auto;
        right: auto;
        bottom: auto;
        top: auto;
        top: 0;
        right: 0
    }
}

@media only screen and (min-width: 601px) {
    .jumbotron.jumbotron.content-fixed-size.desc-position_t_left .jumbotron-footer {
        left: auto;
        right: auto;
        bottom: auto;
        top: auto;
        top: 0;
        left: 0
    }
}

@media only screen and (min-width: 601px) {
    .jumbotron.jumbotron.content-fixed-size.desc-position_center .jumbotron-footer {
        position: absolute;
        left: 50%;
        top: 50%;
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%)
    }
}

.da-slider {
    width: 100%;
    height: 70vh;
    position: relative;
    background-repeat: no-repeat;
    background-position: 0% 0%;
    background-size: cover;
    transition: background-position 1.4s ease-in-out 0.3s;
    direction: ltr;
    display: none
}

@media only screen and (max-width: 992px) {
    .da-slider {
        display: block
    }
}

.da-slide {
    position: absolute;
    width: 100%;
    bottom: 8%;
    left: 0px;
    right: 0;
    background: #fff;
    max-width: 90%;
    border-radius: 12px;
    padding: 1rem;
    margin: auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    transition: all 0.3s
}

.da-slide .slide__image {
    -ms-flex: 1 1 30%;
    flex: 1 1 30%;
    max-width: 30%
}

.da-slide .slide__image img {
    width: 100%;
    height: 50px
}

.da-slide .slide__info {
    -ms-flex: 1 1 67%;
    flex: 1 1 67%;
    max-width: 67%;
    text-align: right
}

.da-slide .slide__title h2 {
    margin: 0;
    font-size: 1rem
}

.da-slide .slide__description p {
    font-size: 10rem
}

.da-slide-current {
    z-index: 2;
    -ms-transform: translateX(0%);
    transform: translateX(0%);
    background: #fff
}

.da-slide-translate .da-slide {
    -ms-transform: translateX(200%);
    transform: translateX(200%);
    transition: all 1.4s ease-in-out 0.3s
}

.da-slide-translate .da-slide-current {
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.da-slide-fade .da-slide {
    opacity: 0;
    transition: all 1.4s ease-in-out 0.3s
}

.da-slide-fade .da-slide-current {
    opacity: 1;
    transition: all 1s ease-in-out 0.3s;
    transition-delay: 1.5s
}

.da-slider-fb .da-slide {
    left: 100%;
    opacity: 1
}

.da-slider-fb .da-slide.da-slide-current {
    left: 0px
}

.da-dots {
    width: 100%;
    position: absolute;
    text-align: center;
    left: 0px;
    right: 0;
    display: -ms-flexbox;
    display: flex;
    max-width: 150px;
    margin: auto;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0.25rem 0.5rem;
    bottom: 0;
    -ms-transform: translateY(50%);
    transform: translateY(50%);
    z-index: 2;
    -moz-user-select: none;
    background: linear-gradient(to left, #077dbe, #76bd21);
    -webkit-user-select: none
}

.da-dots span {
    display: block;
    position: relative;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    margin: 3px;
    cursor: pointer;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1) inset, 1px 1px 1px rgba(255, 255, 255, 0.1)
}

.da-dots span.da-dots-current:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: white;
    background: linear-gradient(top, white 0%, #f6f6f6 47%, #ededed 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#ededed", GradientType=0)
}

.da-slider:hover .da-arrows span {
    opacity: 1
}

.tag {
    height: 2.375rem;
    line-height: 2.375rem;
    position: relative;
    border-radius: 6.25rem;
    padding: 0 2.1875rem;
    display: inline-block;
    white-space: nowrap;
    border: 1px solid #c9c9c9;
    margin: 0 0 .5rem .5rem;
    font-size: 0;
    color: #000000
}

.tag:visited {
    color: #000000
}

@media only screen and (max-width: 800px) {
    .tag {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 1050px) {
    .tag {
        padding: 0 .75rem 0 .4375rem
    }
}

@media only screen and (min-width: 1051px) {
    .tag:hover {
        background-color: #F3F3F3;
        border-color: #F3F3F3;
        color: #2b2929
    }
}

.tag > * {
    pointer-events: none
}

.tag span {
    font-size: .8125rem;
    color: #373737
}

.tag svg {
    position: absolute;
    display: inline-block;
    left: .625rem;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    fill: #f22b2b;
    opacity: 0
}

@media only screen and (max-width: 1050px) {
    .tag svg {
        position: relative;
        opacity: 1;
        fill: #c9c9c9;
        top: 5px;
        left: auto;
        -ms-transform: none;
        transform: none;
        margin-right: .5rem
    }
}

@media only screen and (min-width: 1051px) {
    .tag:hover svg {
        fill: #f22b2b;
        opacity: 1
    }
}

.blog-post {
    display: block;
    position: relative;
    border-radius: .25rem;
    overflow: hidden;
    height: 18.125rem
}

.blog-post::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    height: 50%;
    bottom: 0;
    background: linear-gradient(to top, #000 0%, rgba(0, 0, 0, 0) 100%)
}

.blog-post__img {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: .25rem;
    overflow: hidden;
    display: block;
    height: 100%;
    width: 100%
}

.blog-post__img img, .blog-post__img span {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: .25rem
}

.blog-post__img span {
    transition: transform 0.9s cubic-bezier(0.075, 0.82, 0.165, 1)
}

@media only screen and (min-width: 801px) {
    .blog-post:hover .blog-post__img span {
        -ms-transform: scale(1.04);
        transform: scale(1.04)
    }
}

.blog-post__info {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0 1.875rem 1.875rem;
    z-index: 1;
    transition: opacity .1s linear
}

@media only screen and (min-width: 801px) {
    .blog-post:hover .blog-post__info {
        opacity: 0
    }
}

.blog-post__title {
    color: #fff
}

.blog-post__date {
    color: #fff;
    display: block;
    font-size: .8125rem
}

.blog-post__hover {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(120, 190, 30, 0.55) 0%, rgba(0, 190, 230, 0.55) 100%);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    flex-direction: column;
    color: #fff;
    font-size: 1.125rem;
    z-index: 2;
    opacity: 0;
    transition: opacity .2s linear
}

@media only screen and (min-width: 801px) {
    .blog-post:hover .blog-post__hover {
        opacity: 1
    }
}

.blog-post__hover i, .blog-post__hover p {
    opacity: 0;
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
    transition: transform .2s ease-in-out, opacity .1s linear
}

.blog-post:hover .blog-post__hover i, .blog-post:hover .blog-post__hover p {
    transition-delay: .1s;
    opacity: 1;
    -ms-transform: translateY(0px);
    transform: translateY(0px)
}

.blog-post__hover i {
    font-size: 2.25rem;
    letter-spacing: -1px
}

.blog-post:hover .blog-post__hover i {
    transition-delay: .15s
}

.gallery {
    margin: 4.375rem -10px 0;
    overflow: hidden;
    min-height: 25rem
}

.gallery--lowmargtop {
    margin-top: 3.125rem
}

@media only screen and (max-width: 500px) {
    .gallery {
        margin: 4.375rem -7px 0
    }
}

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

.gallery.loaded .loading {
    opacity: 0
}

.gallery-item {
    width: 33.33%;
    padding: 0 10px 20px;
    position: absolute;
    opacity: 0
}

@media only screen and (max-width: 800px) {
    .gallery-item {
        width: 100% !important;
        padding: 0 7px 14px
    }
}

.gallery.loaded .gallery-item {
    opacity: 1
}

@media only screen and (max-width: 800px) {
    .gallery-item:nth-of-type(3) {
        width: 100%
    }
}

.gallery-item:nth-of-type(4) {
    width: 66.66%
}

@media only screen and (max-width: 800px) {
    .gallery-item:nth-of-type(4) {
        width: 100%
    }
}

.gallery-item:nth-of-type(5) {
    width: 100%
}

.gallery-item a {
    position: relative;
    display: block;
    border-radius: 3px;
    overflow: hidden;
    background: #c4c4c4
}

.gallery-item a::after {
    content: "";
    display: block;
    padding-top: 100%
}

.gallery-item:nth-of-type(3) a::after {
    padding: 200% 0 30px
}

@media only screen and (max-width: 500px) {
    .gallery-item:nth-of-type(3) a::after {
        padding: 100% 0 0
    }
}

.gallery-item:nth-of-type(4) a::after {
    padding-top: 50%
}

.gallery-item:nth-of-type(5) a::after {
    padding-top: 33%
}

@media only screen and (max-width: 500px) {
    .gallery-item:nth-of-type(5) a::after {
        padding-top: 50%
    }
}

.gallery-item a::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    background: linear-gradient(45deg, #00a03c 0%, #0078c8 100%);
    transition: opacity 0.2s linear
}

@media only screen and (min-width: 801px) {
    .gallery-item:hover a::before {
        opacity: 0.38
    }
}

.gallery-bg {
    display: block;
    width: 100%;
    height: 100%
}

.gallery-tool {
    position: absolute;
    z-index: 2
}

.gallery .tooltip {
    width: 15rem;
    margin-right: -20px;
    visibility: visible !important;
    pointer-events: none;
    z-index: 1
}

.gallery .tooltip[x-placement="right"] {
    margin-left: -20px
}

.gallery .tooltip.show {
    pointer-events: auto
}

.gallery .tooltip-inner {
    background: #fff;
    padding: 15px 35px 15px 15px;
    box-shadow: 5px 7px 15px 0 rgba(0, 0, 0, 0.16);
    border-radius: 3px;
    font-size: .875rem;
    color: #373737;
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
    opacity: 0;
    transition: transform 0.2s ease-in-out, opacity 0.2s linear
}

@media only screen and (max-width: 500px) {
    .gallery .tooltip-inner {
        font-size: 12px;
        padding: 5px 35px 5px 5px
    }
}

.tooltip[x-placement="right"] .tooltip-inner {
    padding: 15px 15px 15px 35px;
    -ms-transform: translateX(20px);
    transform: translateX(20px)
}

.tooltip.active .tooltip-inner, .tooltip.show .tooltip-inner {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0);
    text-align: justify
}

.gallery-feature {
    position: relative;
    width: 40px;
    height: 40px;
    border-radius: 40px;
    background: linear-gradient(135deg, #78be1e 0%, #00bee6 100%);
    box-shadow: 0px 2px 10px 0 rgba(0, 0, 0, 0.16);
    z-index: 2;
    border: .1875rem solid #fff;
    box-sizing: border-box;
    cursor: pointer
}

@media only screen and (max-width: 800px) {
    .gallery-feature {
        width: 30px;
        height: 30px
    }
}

.gallery-feature svg {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    fill: #fff;
    width: .9375rem;
    height: .9375rem;
    transition: transform 0.4s ease-out
}

@media only screen and (max-width: 800px) {
    .gallery-feature svg {
        width: 10px;
        height: 10px
    }
}

.gallery-item:hover .gallery-feature svg {
    -ms-transform: translate(-50%, -50%) rotate(180deg);
    transform: translate(-50%, -50%) rotate(180deg)
}

.gallery-play {
    z-index: 1;
    height: 6rem;
    width: 6rem;
    background: linear-gradient(-135deg, #00bee6 0%, #78be1e 180%);
    border-radius: 50%;
    line-height: 0;
    opacity: 0;
    text-align: center
}

@media only screen and (max-width: 800px) {
    .gallery-play {
        opacity: 1;
        height: 3.75rem;
        width: 3.75rem
    }
}

.gallery-item a:hover .gallery-play {
    opacity: 1
}

.gallery-play svg {
    fill: #fff;
    left: .375rem
}

@media only screen and (max-width: 800px) {
    .gallery-play svg {
        width: 14px;
        height: 20px;
        left: 4px
    }
}

.agency {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: 0
}

@media only screen and (max-width: 900px) {
    .agency {
        display: block
    }
}

.agency-col {
    font-size: 1rem;
    display: -ms-flexbox;
    display: flex;
    width: 50%;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 8.125rem 0 4.6875rem;
    margin: 0;
    background: linear-gradient(90deg, #0078c8 -200%, #0032a0 150%);
    border: 0
}

.agency--gray .agency-col {
    background: #464646;
    padding: 4.6875rem 0 4.0625rem
}

@media only screen and (max-width: 900px) {
    .agency-col {
        width: 100%
    }
}

.agency-col:last-of-type {
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-direction: column;
    flex-direction: column
}

@media only screen and (max-width: 900px) {
    .agency-col:last-of-type {
        padding-top: 0
    }
}

.agency--gray .agency-col:last-of-type {
    background: #373737
}

@media only screen and (max-width: 900px) {
    .agency--gray .agency-col:last-of-type {
        padding-top: 4.6875rem
    }
}

.agency-wrap {
    width: 100%;
    max-width: 37.5rem;
    padding: 0 15px;
    text-align: right;
    margin-bottom: 8.125rem;
    display: -ms-flexbox;
    display: flex
}

.agency--gray .agency-wrap {
    margin-bottom: 2.5rem
}

@media only screen and (max-width: 900px) {
    .agency--gray .agency-wrap {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 900px) {
    .agency-wrap {
        margin: 0 auto;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media only screen and (max-width: 500px) {
    .agency-wrap {
        display: block;
        text-align: center
    }
}

@media only screen and (max-width: 900px) {
    .agency-col:last-of-type .agency-wrap {
        margin-bottom: 100px
    }
}

@media only screen and (min-width: 901px) {
    .agency-col:last-of-type .agency-wrap {
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

@media only screen and (max-width: 900px) {
    .agency--gray .agency-col:last-of-type .agency-wrap {
        margin-bottom: 50px
    }
}

.agency-image {
    position: relative;
    top: .75rem;
    display: block;
    height: 7rem;
    margin: 0 0 0 1.875rem;
    opacity: .4
}

@media only screen and (max-width: 500px) {
    .agency-image {
        top: 0;
        margin: 0 auto 30px
    }
}

.agency-main {
    width: 100%;
    max-width: 20rem
}

@media only screen and (max-width: 900px) {
    .agency-main {
        max-width: none
    }
}

.agency-title {
    max-width: 25rem;
    margin: 0 auto
}

.agency-title {
    color: #fff;
    margin-bottom: .625rem
}

.agency-desc {
    font-size: .9375rem;
    color: #fff;
    margin-bottom: 1.5625rem;
    text-align: justify;
    max-width: 14.375rem
}

@media only screen and (max-width: 500px) {
    .agency-desc {
        text-align: center;
        margin: 0 auto 20px
    }
}

.agency-content {
    max-width: 29.375rem;
    font-size: 1rem;
    line-height: 2.5;
    text-align: justify
}

.agency--gray .agency-content {
    color: #ddd
}

.agency-btn {
    width: 200%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-transform: translateX(50%);
    transform: translateX(50%)
}

@media only screen and (max-width: 900px) {
    .agency-btn {
        text-align: center;
        width: 100%;
        -ms-transform: translateX(0%);
        transform: translateX(0%)
    }
}

.agency-btn--shift:active:not(:disabled), .agency-btn--shift.nice-select.open:not(:disabled) {
    -ms-transform: translateX(50%) translateY(2px);
    transform: translateX(50%) translateY(2px)
}

@media only screen and (max-width: 900px) {
    .agency-btn--shift:active:not(:disabled), .agency-btn--shift.nice-select.open:not(:disabled) {
        -ms-transform: translateX(0%) translateY(2px);
        transform: translateX(0%) translateY(2px)
    }
}

.agency-services {
    width: 100%;
    padding: 0 15px
}

@media only screen and (min-width: 901px) {
    .agency-services {
        -ms-transform: translateX(50%);
        transform: translateX(50%);
        width: 100vw;
        max-width: 74.375rem
    }
}

.agency .bus {
    padding: 3.75rem 0;
    background: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    border-radius: .25rem;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15)
}

@media only screen and (max-width: 500px) {
    .agency .bus {
        display: block
    }
}

.agency .bus li {
    -ms-flex: 1;
    flex: 1
}

@media only screen and (max-width: 500px) {
    .agency .bus li:not(:last-of-type) {
        margin-bottom: 2.5rem
    }
}

.agency .bus li::before {
    height: 100%;
    top: 0;
    bottom: 0;
    max-height: 12.5rem;
    margin: auto
}

@media only screen and (max-width: 500px) {
    .agency .bus li::before {
        height: 1px;
        width: 50%;
        top: -15px;
        bottom: auto;
        left: 0;
        right: 0;
        margin: auto
    }
}

.card-services {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    max-width: 15rem;
    margin: 0 auto
}

@media only screen and (max-width: 500px) {
    .card-services {
        max-width: none;
        margin-bottom: 1.875rem
    }
}

.card-services__image {
    height: 4.5625rem;
    margin-bottom: .9375rem
}

.card-services__title {
    color: #666;
    margin-bottom: .625rem
}

.card-services__desc {
    color: #666;
    text-align: justify;
    font-size: .875rem
}

.table:not(:last-child) {
    margin-bottom: 3.125rem
}

.table-title {
    color: #464646
}

.table-header {
    margin-bottom: 1.875rem
}

.table-footer {
    margin-top: 1.875rem
}

.table-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: .75rem 0
}

.table-row:not(:last-of-type) {
    border-bottom: 1px solid #E0E0E0
}

.table-col {
    margin: 0 !important;
    padding: 0 !important;
    color: #666
}

@media only screen and (max-width: 500px) {
    .table-col {
        font-size: 12px
    }
}

.table-col:not(:first-of-type) {
    padding-right: 1.25rem !important
}

.table-col--50 {
    max-width: 50%;
    -ms-flex: none;
    flex: none
}

.inbox {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 800px) {
    .inbox {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

.inbox-image {
    display: block;
    width: 62.5rem;
    height: 43.75rem
}

@media only screen and (max-width: 1050px) {
    .inbox-image {
        width: 50rem;
        height: 31.25rem
    }
}

@media only screen and (max-width: 800px) {
    .inbox-image {
        margin: 0 auto;
        width: 470px;
        height: 350px;
        max-width: 100%
    }
}

@media only screen and (max-width: 500px) {
    .inbox-image {
        height: 250px
    }
}

.inbox-center {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 3.75rem;
    line-height: 0
}

@media only screen and (max-width: 800px) {
    .inbox-center {
        width: 100%;
        max-width: none;
        -ms-flex-order: 1;
        order: 1;
        padding-right: 0
    }
}

.inbox-side {
    -ms-flex: auto;
    flex: auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

@media only screen and (max-width: 800px) {
    .inbox-side {
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
        margin-top: 50px
    }
}

@media only screen and (max-width: 500px) {
    .inbox-side {
        margin-top: 30px
    }
}

@media only screen and (max-width: 800px) {
    .inbox-side:first-of-type {
        -ms-flex-order: 2;
        order: 2
    }
}

@media only screen and (max-width: 800px) {
    .inbox-side:last-of-type {
        -ms-flex-order: 3;
        order: 3
    }
}

@media only screen and (max-width: 800px) {
    .inbox-side .s-header {
        width: 100%
    }
}

.inbox-side .card-f {
    width: 17.5rem;
    padding: 0
}

.inbox-side .card-f:not(:last-of-type) {
    margin-bottom: 3.125rem
}

@media only screen and (max-width: 800px) {
    .inbox-side .card-f:not(:last-of-type) {
        margin-bottom: 40px
    }
}

@media only screen and (max-width: 800px) {
    .inbox-side .card-f {
        width: 50%;
        max-width: none;
        padding: 0 15px
    }
}

@media only screen and (max-width: 500px) {
    .inbox-side .card-f {
        width: 100%;
        padding: 0
    }
}

@media only screen and (min-width: 801px) {
    .inbox-side:last-of-type .card-f {
        padding-right: 30px
    }
}

.inbox-side .card-f__img {
    width: 5rem;
    filter: brightness(17.5)
}

.inbox-side .card-f__title {
    color: #E0E0E0
}

.inbox-side .card-f__desc {
    color: #fff;
    opacity: .6
}

.festivals {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-bottom: 1.875rem;
    margin: 0 -.625rem -1.25rem
}

@media only screen and (max-width: 500px) {
    .festivals {
        margin: 0 -.3125rem -.625rem
    }
}

.card-festival {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    padding: 0 .625rem
}

@media only screen and (max-width: 500px) {
    .card-festival {
        padding: 0 .3125rem
    }
}

.card-festival--66 {
    width: 66.6666%
}

@media only screen and (max-width: 500px) {
    .card-festival--66 {
        width: 100%
    }
}

.card-festival--50 {
    width: 50%
}

.card-festival--33 {
    width: 33.333%
}

@media only screen and (max-width: 500px) {
    .card-festival--33 {
        width: 50%
    }
}

.card-festival--16 {
    width: 16.666%
}

.card-festival--past {
    filter: grayscale(100%)
}

.card-festival--past:hover {
    filter: grayscale(0)
}

.card-festival > a {
    position: relative;
    display: block;
    width: 100%;
    margin-bottom: 1.25rem;
    border-radius: .25rem;
    overflow: hidden
}

@media only screen and (max-width: 500px) {
    .card-festival > a {
        margin-bottom: .625rem
    }
}

.card-festival img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
}

.card-festival__img {
    position: relative;
    padding-top: 33.333%;
    width: 100%;
    transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1)
}

.card-festival:hover .card-festival__img {
    -ms-transform: scale(1.04);
    transform: scale(1.04)
}

.card-festival--66 .card-festival__img {
    padding-top: 50%
}

@media only screen and (max-width: 500px) {
    .card-festival--66 .card-festival__img {
        padding-top: 33.333%
    }
}

.card-festival--50 .card-festival__img {
    padding-top: 66.666%
}

.card-festival--33 .card-festival__img {
    padding-top: calc(100% + .625rem)
}

@media only screen and (max-width: 500px) {
    .card-festival--33 .card-festival__img {
        padding-top: 66.666%
    }
}

.card-post {
    padding: 0 10px 20px 10px;
    width: 25%
}

.blog-posts .card-post {
    position: absolute;
    opacity: 0
}

.blog-posts.loaded .card-post {
    opacity: 1
}

@media only screen and (max-width: 1050px) {
    .card-post {
        width: 33.33%
    }
}

@media only screen and (max-width: 800px) {
    .card-post {
        width: 50%;
        padding: 0 7px 14px 7px
    }
}

@media only screen and (max-width: 400px) {
    .card-post {
        width: 100%
    }
}

.card-post__inner {
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: .25rem;
    transition: box-shadow 0.15s linear
}

@media only screen and (min-width: 801px) {
    .card-post__inner:hover {
        box-shadow: 0 3px 17px rgba(0, 0, 0, 0.3)
    }
}

.card-post--simple .card-post__inner {
    padding-top: 124%
}

@media only screen and (max-width: 400px) {
    .card-post--simple .card-post__inner {
        height: 16.875rem;
        padding-top: 0
    }
}

.card-post--video .card-post__inner {
    height: 16.875rem
}

.card-post--free .card-post__inner {
    background: #fff
}

.card-post--quote .card-post__inner {
    background: linear-gradient(135deg, #0032a0 -20%, #00c864 150%);
    padding: 2.5rem 1.875rem;
    color: #fff
}

.card-post--insta .card-post__inner {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2.1875rem 1.875rem
}

.card-post--text .card-post__inner {
    background: #fff;
    padding: 1.25rem 1.875rem
}

.card-post--video .card-post__inner::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    background: linear-gradient(45deg, #00a03c 0%, #0078c8 100%);
    z-index: 1;
    transition: opacity 0.15s linear
}

@media only screen and (max-width: 800px) {
    .card-post--video .card-post__inner::before {
        opacity: .38
    }
}

@media only screen and (min-width: 801px) {
    .card-post--video .card-post__inner:hover::before {
        opacity: 0.38
    }
}

.card-post--simple .card-post__inner::after, .card-post--video .card-post__inner::after {
    content: "";
    width: 100%;
    height: 40%;
    background: linear-gradient(to top, #000 0%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    bottom: 0;
    left: 0
}

.card-post--insta .card-post__inner::after {
    content: "";
    width: 100%;
    height: 100%;
    background: #5f0042;
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: 0.6
}

.card-post--simple .card-post__inner img, .card-post--video .card-post__inner img, .card-post--insta .card-post__inner img {
    position: absolute;
    width: 100%;
    height: 100%
}

.card-post--free .card-post__inner img {
    display: block;
    width: 100%;
    height: auto
}

.card-post__inner svg {
    position: relative;
    z-index: 2
}

.card-post__bg {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

.card-post__footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: .625rem .9375rem 1.25rem;
    color: #fff;
    z-index: 1
}

.card-post--free .card-post__footer, .card-post--text .card-post__footer {
    position: relative;
    color: #666
}

.card-post--text .card-post__footer {
    padding: 0
}

.card-post__footer::after {
    content: "";
    width: calc(100% - 1.875rem);
    height: 1px;
    background: #fff;
    position: absolute;
    bottom: 3.125rem;
    opacity: 0.38
}

.card-post--text .card-post__footer::after {
    width: 100%;
    bottom: auto;
    top: -.625rem
}

.card-post--free .card-post__footer::after, .card-post--text .card-post__footer::after {
    background: #707070
}

.card-post__info {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    font-size: .75rem
}

.card-post__info svg {
    fill: #fff;
    margin-right: .3125rem
}

.card-post--free .card-post__info svg, .card-post--text .card-post__info svg {
    fill: #a3a3a3
}

.card-post--free .card-post__info svg.icon--heart, .card-post--text .card-post__info svg.icon--heart {
    fill: #ff6717
}

.card-post__info span:not(:first-of-type) {
    display: inline-block;
    margin-right: 1.25rem
}

.card-post__date {
    font-size: .75rem
}

.card-post--free .card-post__date {
    color: #666
}

.card-post__title {
    position: relative;
    margin-bottom: 1.25rem;
    font-size: 1.0625rem;
    z-index: 2
}

.card-post--free .card-post__title {
    color: #666;
    margin: .625rem 0
}

.card-post--text .card-post__title {
    color: #666;
    margin: 0 0 .625rem
}

.card-post--insta .card-post__title {
    color: #fff;
    margin: .9375rem 0 1.5625rem
}

.card-post__play {
    bottom: 1.875rem;
    z-index: 1;
    height: 3.875rem;
    width: 3.875rem;
    background: linear-gradient(-135deg, #00bee6 0%, #78be1e 180%);
    border-radius: 50%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    line-height: 0;
    opacity: 0;
    transition: opacity 0.15s linear
}

@media only screen and (min-width: 801px) {
    .card-post__inner:hover .card-post__play {
        opacity: 1
    }
}

@media only screen and (max-width: 800px) {
    .card-post__play {
        opacity: 1
    }
}

.card-post__play svg {
    height: 1.5rem;
    width: 1.5rem;
    fill: #fff;
    margin-left: .375rem
}

.card-post__content {
    position: relative;
    z-index: 2;
    padding: .9375rem;
    text-align: justify
}

.card-post--text .card-post__content {
    padding: 0;
    color: #666;
    font-size: .9375rem;
    margin-bottom: 1.875rem
}

.card-post--insta .card-post__content {
    padding: 0;
    font-size: .8125rem;
    color: #fff
}

.card-post__avatar {
    height: 24px;
    width: 24px;
    border-radius: 50%;
    margin-bottom: .3125rem
}

.card-post__name {
    font-size: .8125rem;
    margin-bottom: .9375rem
}

.card-post__text {
    margin-top: .3125rem;
    text-align: justify
}

.card-aparat {
    display: block
}

@media only screen and (max-width: 500px) {
    .card-aparat {
        margin-bottom: 1.875rem
    }
}

.card-aparat__img {
    position: relative;
    margin-bottom: .625rem;
    border-radius: .25rem;
    overflow: hidden
}

.card-aparat__img::after {
    content: '';
    display: block;
    padding-top: 60%
}

.card-aparat__img::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    background: linear-gradient(45deg, #00a03c 0%, #0078c8 100%);
    z-index: 1;
    transition: opacity .15s linear
}

@media only screen and (min-width: 801px) {
    .card-aparat:hover .card-aparat__img::before {
        opacity: .38
    }
}

.card-aparat__img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.card-aparat__cover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.card-aparat__title {
    color: #4d4d4d;
    margin-bottom: .625rem
}

.card-aparat__group, .card-aparat-details {
    color: gray;
    font-size: .6875rem
}

.card-aparat__slider {
    position: relative;
    margin: 0 -.625rem
}

.card-aparat__play {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    z-index: 1;
    height: 3.875rem;
    width: 3.875rem;
    background: linear-gradient(-135deg, #00bee6 0%, #78be1e 180%);
    border-radius: 50%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    line-height: 0;
    opacity: 0;
    transition: opacity .15s linear
}

@media only screen and (min-width: 801px) {
    .card-aparat:hover .card-aparat__play {
        opacity: 1
    }
}

.card-aparat__play svg {
    height: 1.375rem;
    width: 1.375rem;
    fill: #fff;
    margin-left: .1875rem
}

.card-aparat__info {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    font-size: .8125rem;
    color: #666
}

.card-aparat__info span, .card-aparat__info time {
    display: inline-block;
    margin-left: .3125rem
}

.card-aparat__info svg {
    margin-right: .3125rem;
    fill: gray
}

.card-aparat__data {
    position: relative;
    display: inline-block;
    margin-right: 1.25rem;
    color: gray
}

.card-aparat__data::after {
    content: '';
    position: absolute;
    bottom: 0;
    top: 0;
    margin: auto;
    right: -11px;
    width: 2px;
    height: .875rem;
    border-radius: 5px;
    background: #0078c8
}

.card-properties {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.card-properties img {
    display: block;
    margin: 0 auto 1.875rem;
    height: 3.75rem
}

.card-properties p {
    position: relative;
    color: #373737;
    margin-bottom: .3125rem
}

.card-properties p::after {
    content: '';
    width: 1.25rem;
    height: 3px;
    border-radius: 5px;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: -.875rem;
    background: #56c484
}

.card-properties b {
    color: gray;
    line-height: 1;
    margin-left: .3125rem
}

.card-properties span {
    color: gray;
    font-size: .875rem;
    line-height: 1;
    position: relative;
    opacity: .5
}

.list-filters {
    padding: 2rem 1.25rem;
    border-radius: .25rem;
    background: #fff
}

@media only screen and (min-width: 1051px) {
    .list-filters {
        margin-bottom: 1.25rem
    }
}

@media only screen and (max-width: 1050px) {
    .list-filters {
        padding: .5rem 0 0
    }
}

.list-filters__tags-slider {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 1.5rem
}

@media only screen and (max-width: 1050px) {
    .list-filters__tags-slider {
        padding: 1.5625rem 1.25rem 1.25rem;
        margin-top: 0;
        background: #F7f7f7
    }
}

.list-filters__title {
    color: #373737;
    margin-bottom: 1.25rem
}

@media only screen and (max-width: 1050px) {
    .list-filters__title {
        display: none
    }
}

@media only screen and (min-width: 1051px) {
    .list-filters__products-slider {
        margin-bottom: -.5rem
    }
}

@media only screen and (max-width: 1050px) {
    .list-filters__products-slider {
        padding: 0 1.25rem;
        box-shadow: 0 1px 0 rgba(0, 0, 0, 0.07)
    }
}

.list-filters__product {
    margin-bottom: .5rem;
    margin-left: .5rem;
    font-size: 0
}

.list-filters__product button, .list-filters__product a {
    height: 2.625rem;
    line-height: 2.625rem;
    display: block;
    position: relative;
    padding: 0 1.25rem;
    white-space: nowrap;
    border-radius: 6.25rem;
    overflow: hidden;
    transition: all 0.15s;
    color: #2b2929;
    font-size: 1rem
}

@media only screen and (min-width: 1051px) {
    .list-filters__product button:hover, .list-filters__product a:hover {
        color: #fff
    }
}

.list-filters__product button.active, .list-filters__product a.active {
    color: #fff
}

.list-filters__product button::before, .list-filters__product a::before {
    content: "";
    background: #00bee6;
    background: linear-gradient(30deg, #00bee6 0%, #0078c8 100%);
    opacity: 0;
    transition: all 0.15s
}

@media only screen and (min-width: 801px) {
    .list-filters__product a:hover::before, button:hover::before {
        opacity: 1
    }
}

.list-filters__product a.active::before, button.active::before {
    opacity: 1
}

.list-filters__product button span, .list-filters__product a span {
    position: relative;
    z-index: 2
}

.list-filters__clear {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-item-align: start;
    align-self: flex-start;
    margin-top: .3125rem
}

@media only screen and (max-width: 1050px) {
    .list-filters__clear {
        display: none
    }
}

.list-filters__clear > * {
    pointer-events: none
}

.list-filters__clear:hover span {
    color: #f22b2b
}

.list-filters__clear:hover svg {
    fill: #f22b2b
}

.list-filters__clear span {
    font-size: .9375rem;
    color: #666
}

.list-filters__clear svg {
    fill: #666;
    margin-right: .5rem
}

.list-filters .swiper-container {
    -ms-flex: 1;
    flex: 1;
    padding-bottom: 1px
}

.list-filters .swiper-slide {
    display: inline-block;
    width: auto;
    height: auto
}

@media only screen and (min-width: 1051px) {
    .list-filters .swiper-wrapper {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

.list-filters .swiper-button-prev, .list-filters .swiper-button-next {
    width: 50px;
    box-shadow: none
}

@media only screen and (min-width: 1051px) {
    .list-filters .swiper-button-prev, .list-filters .swiper-button-next {
        display: none
    }
}

@media only screen and (max-width: 500px) {
    .list-filters .swiper-button-prev, .list-filters .swiper-button-next {
        width: 17px
    }
}

.list-filters .swiper-button-prev {
    right: -2px;
    background: linear-gradient(to left, #f7f7f7 0%, #f7f7f7 20%, rgba(247, 247, 247, 0) 100%) !important
}

.list-filters .swiper-button-next {
    left: -2px;
    background: linear-gradient(to right, #f7f7f7 0%, #f7f7f7 20%, rgba(247, 247, 247, 0) 100%) !important
}

.data-table {
    position: relative;
    width: 100%;
    background: #fff;
    border-radius: .25rem;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.07);
    max-width: 74.375rem;
    margin: 2.5rem auto 3.125rem;
    min-height: 15.625rem
}

@media only screen and (max-width: 800px) {
    .data-table {
        margin: 0 auto 40px
    }
}

@media only screen and (max-width: 730px) {
    .data-table {
        display: none
    }
}

.data-table .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1
}

.data-table.loaded .loading {
    display: none
}

.data-table__error {
    text-align: center;
    padding: 0 15px;
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
    pointer-events: none;
    opacity: 0;
    transition: opacity .15s linear
}

.error .data-table__error {
    pointer-events: auto;
    opacity: 1
}

.data-table__error p {
    font-size: .875rem;
    color: #373737;
    margin-bottom: 1.5625rem
}

.data-table__error p span {
    display: block;
    font-size: 1.375rem;
    margin-bottom: .625rem
}

.data-table__error .btn {
    border-radius: .25rem
}

.data-table .dataTable {
    width: 100% !important
}

@media only screen and (max-width: 800px) {
    .data-table .dataTable thead tr {
        display: none
    }
}

.data-table .dataTable thead th {
    white-space: nowrap;
    border-bottom: 1px solid #E2E2E2;
    padding: 1.875rem .9375rem;
    color: #078cdc;
    text-align: center;
    font-weight: 300;
    font-size: .9375rem
}

@media only screen and (max-width: 1050px) {
    .data-table .dataTable thead th {
        padding: 25px 10px
    }
}

.data-table .dataTable thead th:first-of-type {
    text-align: right;
    padding-right: 2.5rem
}

@media only screen and (max-width: 1050px) {
    .data-table .dataTable thead th:first-of-type {
        padding-right: 20px
    }
}

@media only screen and (max-width: 800px) {
    .data-table .dataTable thead th:first-of-type {
        display: block;
        width: 100% !important
    }
}

.data-table .dataTable thead th:last-of-type {
    padding-left: 2.5rem
}

@media only screen and (max-width: 1050px) {
    .data-table .dataTable thead th:last-of-type {
        padding-left: 20px
    }
}

.data-table .dataTable tbody tr:nth-last-of-type(even) {
    background: #E6E6E6
}

@media only screen and (max-width: 800px) {
    .data-table .dataTable tbody tr:nth-last-of-type(even) {
        background: none
    }
}

.data-table .dataTable tbody td {
    text-align: center;
    vertical-align: middle;
    padding: 1.25rem .9375rem
}

@media only screen and (max-width: 800px) {
    .data-table .dataTable tbody td {
        padding: 0
    }
}

@media only screen and (max-width: 800px) {
    .data-table .dataTable tbody tr:not(:last-of-type) td {
        border-bottom: 1px solid #E2E2E2
    }
}

.data-table .dataTable tbody td:not(:first-of-type) {
    line-height: 0
}

@media only screen and (max-width: 800px) {
    .data-table .dataTable tbody td:not(:first-of-type) {
        display: none
    }
}

.data-table .dataTable tbody td:first-of-type:not(.dataTables_empty) {
    vertical-align: top;
    text-align: right;
    padding-right: 2.5rem
}

@media only screen and (max-width: 1050px) {
    .data-table .dataTable tbody td:first-of-type:not(.dataTables_empty) {
        padding-right: 20px
    }
}

@media only screen and (max-width: 800px) {
    .data-table .dataTable tbody td:first-of-type:not(.dataTables_empty) {
        padding: 0
    }
}

.data-table .dataTable tbody td:last-of-type {
    padding-left: 2.5rem
}

@media only screen and (max-width: 1050px) {
    .data-table .dataTable tbody td:last-of-type {
        padding-left: 20px
    }
}

@media only screen and (max-width: 1050px) {
    .data-table .dataTable tbody td svg.icon--checked {
        height: 18px;
        width: 18px
    }
}

.data-table table.dataTable.no-footer {
    border-bottom: 0;
    margin-bottom: 3.125rem
}

.data-table .dataTables_paginate {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 3.125rem
}

.data-table .dataTables_paginate .ellipsis {
    padding: 0 .3125rem
}

.data-table .dataTables_paginate .paginate_button {
    height: 1.875rem;
    padding: 0 .625rem;
    line-height: 1.875rem;
    color: #999;
    font-size: 1.25rem;
    transition: all .15s linear
}

@media only screen and (max-width: 800px) {
    .data-table .dataTables_paginate .paginate_button {
        font-size: 14px;
        padding: 0 5px
    }
}

.data-table .dataTables_paginate .paginate_button:hover {
    background: transparent;
    border-color: #0078c8;
    color: #999
}

.data-table .dataTables_paginate .paginate_button.current, .data-table .dataTables_paginate .paginate_button.current:hover {
    border-color: transparent;
    color: #fff;
    background: #0032a0;
    background: linear-gradient(-135deg, #0032a0 0%, #0078c8 100%)
}

.data-table .dataTables_paginate .paginate_button.previous, .data-table .dataTables_paginate .paginate_button.next {
    position: relative;
    font-size: 1.0625rem;
    background: transparent;
    border-color: transparent;
    color: #666;
    height: 1.875rem;
    line-height: 1.75rem;
    margin: 0 1.25rem;
    -ms-flex: none;
    flex: none
}

@media only screen and (max-width: 800px) {
    .data-table .dataTables_paginate .paginate_button.previous, .data-table .dataTables_paginate .paginate_button.next {
        font-size: 14px
    }
}

.data-table .dataTables_paginate .paginate_button.previous::after, .data-table .dataTables_paginate .paginate_button.next::after {
    content: '';
    height: 10px;
    width: 10px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.paginate_button.previous::after {
    left: 100%;
    border-right: 1px solid #666;
    border-bottom: 1px solid #666
}

.paginate_button.next::after {
    right: 100%;
    border-left: 1px solid #666;
    border-top: 1px solid #666
}

.data-table .dataTables_paginate .paginate_button.previous.disabled, .data-table .dataTables_paginate .paginate_button.next.disabled {
    opacity: .7
}

.data-table .dataTables_empty {
    font-size: 1.125rem;
    color: #666;
    text-align: center;
    padding: 2.5rem 15px 0 !important
}

.data-table .dataTables_filter, .data-table .dataTables_length {
    display: none
}

.data-table .dataTables_info {
    font-family: IRANSansFaNum;
    padding-left: 30px;
    color: #999999
}

.card-search {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-search:not(:last-child) {
    margin-bottom: 1.875rem
}

.card-search__img {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex: 0 1 4.6875rem;
    flex: 0 1 4.6875rem;
    height: 4.6875rem;
    border-radius: 5px;
    padding: 7px
}

.card-search__img img {
    display: block;
    max-width: 100%;
    max-height: 100%
}

.card-search__text {
    max-width: calc(100% - 4.6875rem);
    padding-right: .9375rem;
    -ms-transform: translateY(-6px);
    transform: translateY(-6px)
}

.card-search__title {
    color: #666;
    font-size: 1.125rem;
    margin-bottom: .3125rem;
    transition: all 0.1s
}

.card-search:hover .card-search__title {
    color: #0078c8
}

.card-search__desc {
    color: #9a9a9a;
    font-size: .875rem;
    line-height: 1.5rem;
    max-height: 3rem;
    overflow: hidden
}

.spin-slider {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    max-width: 100%;
    margin: 0 auto;
    min-height: 400px
}

.spin-slider.loaded {
    min-height: 0
}

.spin-slider > * {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s ease-out
}

.spin-slider.loaded > * {
    opacity: 1;
    pointer-events: all
}

.spin-slider > .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    pointer-events: none;
    opacity: 1 !important
}

.spin-slider.loaded > .loading {
    opacity: 0 !important
}

.spin-slider__main {
    position: relative;
    max-width: 100%;
    -ms-transform: translateY(3.125rem);
    transform: translateY(3.125rem);
    z-index: 5
}

@media only screen and (min-width: 801px) {
    .spin-slider__main:hover {
        cursor: grab
    }

    .spin-slider__main:active, .spin-slider__main.nice-select.open {
        cursor: grabbing
    }
}

@media only screen and (max-width: 1050px) {
    .spin-slider__main {
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

.spin-slider__main i {
    position: fixed;
    opacity: 0;
    pointer-events: none;
    left: -9999px;
    top: -9999px
}

.spin-slider__main img {
    display: block
}

.spin-slider__main span {
    display: block;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    transition: all 0.3s
}

.spin-slider__main.loaded span {
    opacity: 0
}

.spin-slider__main .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 1
}

.spin-slider__main.loaded .loading {
    opacity: 0
}

.spin-slider__arrow {
    position: relative;
    width: 100%;
    max-width: 600px;
    margin: 0 auto
}

.spin-slider__arrow::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 50%;
    left: 0;
    top: 0;
    background: #fff;
    background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0) 100%)
}

.spin-slider__arrow i {
    display: block;
    width: 33.33%
}

.spin-slider__arrow i:nth-of-type(1) {
    float: right
}

.spin-slider__arrow i:nth-of-type(2) {
    float: left
}

.spin-slider__arrow i::after {
    content: "";
    display: block;
    padding-top: 67.03%
}

.spin-slider__color {
    position: absolute;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    bottom: -30px;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    cursor: pointer
}

@media only screen and (max-width: 500px) {
    .spin-slider__color {
        width: 60px;
        height: 60px;
        bottom: -20px
    }
}

.spin-slider__color.clickable {
    cursor: pointer
}

.spin-slider__color span {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin-top: -20px;
    margin-left: -20px;
    border-radius: 50%;
    border: .5rem solid #fff;
    z-index: 2;
    cursor: pointer;
    transition: all 0.2s ease-out;
    -ms-transform: scale(0.8);
    transform: scale(0.8)
}

.spin-slider__color.clickable span {
    -ms-transform: none;
    transform: none
}

@media only screen and (max-width: 500px) {
    .spin-slider__color span {
        width: 30px;
        height: 30px;
        margin-top: -15px;
        margin-left: -15px
    }
}

.spin-slider__color canvas {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    cursor: pointer;
    transition: all 0.2s ease-out;
    -ms-transform: scale(1) rotate(0deg);
    transform: scale(1) rotate(0deg)
}

.spin-slider__color.clickable canvas {
    pointer-events: none;
    -ms-transform: scale(0.7) rotate(-15deg);
    transform: scale(0.7) rotate(-15deg)
}

html.is-ie .spin-slider__color.clickable canvas {
    -ms-transform: scale(0.7);
    transform: scale(0.7)
}

.spin-slider__title {
    margin-top: 3.75rem;
    color: #bebebe;
    font-size: 1.5rem
}

.threesixty {
    position: relative;
    overflow: hidden;
    margin: 0 auto
}

.threesixty .threesixty_images {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0
}

.threesixty .threesixty_images img {
    position: absolute;
    top: 0;
    width: 100%;
    height: auto
}

.threesixty .threesixty_images img.previous-image {
    visibility: hidden
}

.threesixty .threesixty_images img.current-image {
    visibility: visible
}

.threesixty .spinner {
    width: 60px;
    display: block;
    margin: 0 auto;
    height: 30px;
    background: #333;
    background: rgba(0, 0, 0, 0.7);
    border-radius: 5px
}

.threesixty .spinner span {
    font-family: Arial, "MS Trebuchet", sans-serif;
    font-size: 12px;
    font-weight: bolder;
    color: #FFF;
    text-align: center;
    line-height: 30px;
    display: block
}

.threesixty .nav_bar {
    position: absolute;
    bottom: 0;
    z-index: 11;
    display: -ms-grid;
    right: 35%
}

@media (max-width: 912px) and (min-width: 801px) {
    .threesixty .nav_bar {
        right: 30%
    }
}

@media (max-width: 800px) and (min-width: 600px) {
    .threesixty .nav_bar {
        right: 38%
    }
}

@media (max-width: 500px) and (min-width: 400px) {
    .threesixty .nav_bar {
        right: 30%
    }
}

@media (max-width: 400px) {
    .threesixty .nav_bar {
        right: 25%
    }
}

.threesixty .nav_bar .butn {
    display: initial
}

.threesixty .nav_bar a, .threesixty .nav_bar span {
    display: block;
    float: left;
    width: 44px;
    height: 44px;
    background: url(../../src/images/sprites22.png) no-repeat;
    text-indent: -99999px
}

.threesixty .nav_bar a.nav_bar_play, .threesixty .nav_bar .btnPlay .icon-play {
    background-position: -57px -57px !important
}

.threesixty .nav_bar a.nav_bar_pause, .threesixty .nav_bar .btnPlay .icon-pause {
    background-position: -57px -13px !important
}

.threesixty .nav_bar a.nav_bar_previous, .threesixty .nav_bar .btnPrev .icon-back {
    background-position: -12px -101px
}

.threesixty .nav_bar a.nav_bar_next, .threesixty .nav_bar .btnNext .icon-forward {
    background-position: -100px -101px
}

.threesixty .nav_bar a.nav_bar_stop {
    background-position: 0 -37px !important
}

.threesixty .nav_bar .btnFull {
    display: none
}

.threesixty:-webkit-full-screen {
    background: #ffffff;
    width: 100%;
    height: 100%;
    margin-top: 0;
    padding-top: 200px
}

.threesixty:-moz-full-screen {
    background: #ffffff;
    width: 100%;
    height: 100%;
    margin-top: 0;
    padding-top: 200px
}

.loading {
    opacity: 1;
    transition: all 0.3s
}

.loading::after {
    content: "";
    display: block;
    width: 3.125rem;
    height: 3.125rem;
    border-radius: 50%;
    border: .375rem solid rgba(255, 255, 255, 0.2);
    border-top-color: #fff;
    animation: spin-cw 1s infinite linear
}

.loading--blue::after {
    border-color: rgba(0, 120, 200, 0.2);
    border-top-color: #0078c8
}

.loading--white::after {
    border-color: rgba(255, 255, 255, 0.2);
    border-top-color: #fff
}

.loading--xs::after {
    width: 1.75rem;
    height: 1.75rem;
    border-width: .1875rem
}

@keyframes spin-cw {
    from {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(360deg)
    }
}

.loading-box {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: rgba(255, 255, 255, 0.7)
}

.videoplayer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer
}

.videoplayer-frame {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0;
    background: #000;
    transition: opacity .3s linear;
    overflow: hidden
}

.videoplayer.active .videoplayer-frame {
    opacity: 1;
    z-index: 2
}

.videoplayer.end .videoplayer-frame {
    opacity: 0
}

.videoplayer-frame video {
    position: relative;
    width: 100%;
    height: 100%
}

.videoplayer-play {
    position: relative;
    z-index: 1;
    height: 6rem;
    width: 6rem;
    background: linear-gradient(-135deg, #00bee6 0%, #78be1e 180%);
    border-radius: 50%;
    line-height: 0;
    transition: opacity .15s linear
}

.videoplayer.active .videoplayer-play {
    opacity: 0
}

@media only screen and (max-width: 800px) {
    .videoplayer-play {
        height: 86px;
        width: 86px
    }
}

@media only screen and (max-width: 800px) {
    .videoplayer-play {
        height: 66px;
        width: 66px
    }
}

.videoplayer-play svg {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: 2.125rem;
    width: 2.125rem;
    fill: #fff;
    margin-left: .25rem
}

@media only screen and (max-width: 800px) {
    .videoplayer-play svg {
        height: 24px;
        width: 24px;
        margin-left: 2px
    }
}

@media only screen and (max-width: 500px) {
    .videoplayer-play svg {
        height: 20px;
        width: 20px;
        margin-left: 3px
    }
}

.videoplayer .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
    opacity: 0;
    transition: opacity .15s linear
}

.videoplayer.active .loading {
    opacity: 1
}

.videoplayer.end .loading {
    opacity: 0
}

.branch {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    border-radius: .25rem;
    transition: background .15s linear;
    margin-bottom: 1.25rem;
    cursor: pointer
}

.branch:last-of-type {
    margin-bottom: 0
}

@media only screen and (min-width: 1051px) {
    html.is-desktop .branch:hover {
        background: #F6F6F6
    }
}

#map .branch {
    background: transparent;
    margin-bottom: 0
}

.branch-img {
    -ms-flex: none;
    flex: none;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.branch-img span {
    position: relative;
    height: 6.5625rem;
    width: 6.5625rem;
    border-radius: 0 .25rem .25rem 0
}

@media only screen and (max-width: 800px) {
    .branch-img span {
        border-radius: .25rem
    }
}

@media only screen and (max-width: 500px) {
    .branch-img span {
        height: 80px;
        width: 80px
    }
}

#map .branch-img span {
    height: 5rem;
    width: 5rem;
    border-radius: .25rem
}

.branch-img span::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: #0078c8;
    border-radius: 0 .25rem .25rem 0;
    opacity: 0;
    transition: all .15s linear
}

#map .branch-img span::after {
    display: none
}

.branch:hover .branch-img span::after {
    opacity: .3
}

.branch-content {
    padding: .9375rem 1.25rem;
    color: #707070;
    font-size: .75rem;
    text-align: justify
}

@media only screen and (max-width: 500px) {
    .branch-content {
        padding: 0 1.25rem
    }
}

#map .branch-content {
    padding: 0 .625rem
}

.branch-content a {
    color: #4d4d4d;
    transition: color .1s linear
}

.branch-content a:hover {
    color: #0078c8
}

.branch-title {
    margin-bottom: .625rem;
    font-size: 1rem;
    line-height: 1.2;
    transition: color .15s linear
}

.branch:hover .branch-title {
    color: #0078c8
}

.branch-contact {
    margin-bottom: .3125rem;
    color: #b3b3b3;
    font-size: .9375rem
}

.branch-contact span {
    display: inline-block;
    direction: ltr
}

.branch-contact span i {
    color: #a3a3a3;
    transition: color .1s linear
}

.branch-contact a:hover i {
    color: #0078c8
}

.branch-contact svg {
    position: relative;
    fill: #4d4d4d;
    margin-left: .1875rem
}

.branch-state {
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: 1.25rem
}

.branch-state span {
    direction: rtl
}

.branch-state svg {
    position: relative;
    top: 3px;
    margin-left: .3125rem
}

@media only screen and (max-width: 600px) {
    .branch-state {
        display: -ms-flexbox;
        display: flex;
        margin: 0 0 .3125rem
    }
}

#map .branch-state {
    display: -ms-flexbox;
    display: flex;
    margin: 0 0 .3125rem
}

.branch-tel {
    font-size: .9375rem
}

.branch-address {
    font-size: .9375rem;
    color: #b3b3b3
}

.card-category {
    position: relative;
    width: 100%;
    padding: 2.1875rem;
    border: 1px solid #ccc;
    border-radius: .25rem;
    text-align: center;
    cursor: pointer
}

@media only screen and (max-width: 800px) {
    .card-category {
        padding: 25px
    }
}

@media only screen and (max-width: 500px) {
    .card-category {
        padding: 15px
    }
}

.card-category::after {
    content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #0078c8;
    background: linear-gradient(45deg, #0078c8 0%, #0032a0 100%);
    border-radius: .1875rem;
    transition: opacity .15s linear;
    opacity: 0
}

.card-category__img {
    position: relative;
    z-index: 1
}

.card-category__img img {
    transition: opacity .15s linear
}

.card-category__img img:first-of-type {
    max-width: 100%;
    height: 3.75rem;
    margin: 0 auto 2.5rem;
    display: block
}

@media only screen and (max-width: 800px) {
    .card-category__img img:first-of-type {
        height: 50px
    }
}

@media only screen and (max-width: 800px) {
    .card-category__img img:first-of-type {
        height: 40px;
        margin-bottom: 20px
    }
}

@media only screen and (min-width: 1051px) {
    .card-category:hover .card-category__img img:first-of-type {
        opacity: 0
    }
}

.card-category__img img:last-of-type {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0
}

@media only screen and (min-width: 1051px) {
    .card-category:hover .card-category__img img:last-of-type {
        opacity: 1
    }
}

.card-category__text {
    position: relative;
    z-index: 1;
    font-size: 1.0625rem;
    color: gray;
    transition: color .15s linear
}

@media only screen and (max-width: 800px) {
    .card-category__text {
        font-size: 14px
    }
}

@media only screen and (max-width: 500px) {
    .card-category__text {
        font-size: 12px
    }
}

.help-categories {
    padding: 0 1.25rem
}

.help-categories .card-category a {
    z-index: 9999
}

.pagination-p {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch
}

@media only screen and (max-width: 1050px) {
    .pagination-p {
        padding: 0 1.25rem
    }
}

.pagination-p__content {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    max-height: 3rem;
    background-color: #fff;
    border-radius: .25rem;
    padding: 0 1.25rem
}

@media only screen and (max-width: 545px) {
    .pagination-p__content {
        -ms-flex-pack: center;
        justify-content: center
    }
}

.pagination-p__filter {
    display: -ms-flexbox;
    display: flex
}

.pagination-p__filter span:first-child {
    color: #666;
    font-size: .9375rem
}

@media only screen and (max-width: 360px) {
    .pagination-p__filter span:nth-child(2) {
        display: none
    }
}

.pagination-p__filter span:not(:first-child) {
    color: #373737;
    font-size: .9375rem;
    margin-right: .75rem
}

.pagination-p__list {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 545px) {
    .pagination-p__list {
        display: none
    }
}

.pagination-p__list a {
    padding: .625rem
}

.pagination-p__list a:link, .pagination-p__list a:visited {
    font-size: 1.125rem;
    color: #999
}

.pagination-p__list a:link.active, .pagination-p__list a:visited.active {
    font-size: 1.25rem;
    color: #0078c8
}

.pagination-p__list a:hover {
    color: #0078c8
}

.pagination-p__prev, .pagination-p__next {
    height: 3rem;
    -ms-flex: 0 0 3rem;
    flex: 0 0 3rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #d9d9d9;
    color: #fff
}

.pagination-p__prev .icon, .pagination-p__next .icon {
    pointer-events: none
}

.pagination-p__prev .icon--arrow-right, .pagination-p__prev .icon--arrow-left, .pagination-p__next .icon--arrow-right, .pagination-p__next .icon--arrow-left {
    fill: #fff
}

.pagination-p__prev:not([disabled]):hover, .pagination-p__next:not([disabled]):hover {
    background-color: #0078c8
}

.pagination-p__prev[disabled], .pagination-p__next[disabled] {
    opacity: 0.5
}

.pagination-p__prev {
    border-radius: 0 .25rem .25rem 0;
    margin-right: .75rem
}

@media only screen and (max-width: 800px) {
    .pagination-p__prev {
        border-radius: .25rem;
        -ms-flex-order: -1;
        order: -1;
        margin-right: 0;
        margin-left: .375rem
    }
}

.pagination-p__next {
    border-radius: .25rem 0 0 .25rem;
    margin-right: .125rem
}

@media only screen and (max-width: 800px) {
    .pagination-p__next {
        border-radius: .25rem;
        margin-right: .375rem
    }
}

.pagination {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 3.125rem 0;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.pagination ul {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media only screen and (max-width: 400px) {
    .pagination ul {
        -ms-flex-order: 1;
        order: 1;
        width: 100%;
        margin-bottom: 10px
    }
}

.pagination li {
    margin: 0 .125rem;
    color: #999
}

.pagination li a {
    display: block;
    height: 1.875rem;
    padding: 0 .4375rem;
    line-height: 1.875rem;
    color: #999;
    font-size: 1.25rem;
    transition: all 0.15s linear;
    border-radius: 2px;
    border: 1px solid transparent;
    min-width: 1.8125rem;
    text-align: center
}

@media only screen and (max-width: 800px) {
    .pagination li a {
        font-size: 14px;
        padding: 0 5px
    }
}

.pagination li:not(.pagination-next):not(.pagination-prev):not(.current) a:hover {
    background: transparent;
    border-color: #0078c8;
    color: #999
}

.pagination li.current a {
    border-color: transparent;
    color: #fff;
    background: #0032a0;
    background: linear-gradient(-135deg, #0032a0 0%, #0078c8 100%)
}

.pagination-prev, .pagination-next {
    -ms-flex: none;
    flex: none;
    position: relative;
    background: transparent;
    border-color: transparent;
    height: 1.875rem;
    line-height: 1.75rem;
    margin: 0 1.25rem;
    flex: none
}

.pagination-prev a, .pagination-next a {
    font-size: 1.0625rem;
    color: #666
}

.pagination-prev:not(.disabled) a:hover, .pagination-next:not(.disabled) a:hover {
    color: #595959
}

@media only screen and (max-width: 800px) {
    .pagination-prev, .pagination-next {
        font-size: 14px
    }
}

.pagination-prev.disabled, .pagination-next.disabled {
    opacity: 0.7;
    pointer-events: none
}

.pagination-prev::after, .pagination-next::after {
    content: "";
    height: 10px;
    width: 10px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    transition: transform .15s ease-in-out
}

.pagination-prev::after {
    left: 100%;
    border-right: 1px solid #666;
    border-bottom: 1px solid #666
}

.pagination-prev:hover::after {
    -ms-transform: rotate(-45deg) translate(2px, 2px);
    transform: rotate(-45deg) translate(2px, 2px)
}

.pagination-next::after {
    right: 100%;
    border-left: 1px solid #666;
    border-top: 1px solid #666
}

.pagination-next:hover::after {
    -ms-transform: rotate(-45deg) translate(-2px, -2px);
    transform: rotate(-45deg) translate(-2px, -2px)
}

@media only screen and (max-width: 400px) {
    .pagination-prev {
        -ms-flex-order: 2;
        order: 2
    }
}

@media only screen and (max-width: 400px) {
    .pagination-next {
        -ms-flex-order: 3;
        order: 3
    }
}

.justified-250, .justified-200 {
    position: relative;
    overflow: hidden;
    min-height: 18.75rem
}

.justified-250 > a, .justified-250 > div, .justified-250 > figure, .justified-200 > a, .justified-200 > div, .justified-200 > figure {
    position: absolute;
    opacity: 0
}

.justified-200.loaded > a, .justified-200.loaded > div, .justified-200.loaded > figure, .justified-250.loaded > a, .justified-250.loaded > div, .justified-250.loaded > figure {
    opacity: 1
}

.links {
    font-size: 1.125rem
}

.links ul {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.links--center ul {
    -ms-flex-pack: center;
    justify-content: center
}

@media only screen and (max-width: 600px) {
    .intro-links ul {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.links li {
    margin: 0 12px
}

@media only screen and (max-width: 600px) {
    .intro-links li:not(:last-child) {
        margin: 0 0 .9375rem 0
    }
}

.links button, .links a {
    display: inline-block;
    padding: 5px;
    transition: color 0.1s
}

.links--white button, .links--white a {
    color: rgba(255, 255, 255, 0.6)
}

@media only screen and (min-width: 801px) {
    .links--white button:hover, .links--white a:hover {
        color: #fff
    }
}

.links--white button:focus, .links--white a:focus {
    color: #fff
}

.links--white button:active, .links--white button.nice-select.open, .links--white a:active, .links--white a.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.links--white button.active, .links--white a.active {
    color: #fff
}

.login {
    position: relative;
    -ms-flex: none;
    flex: none;
    width: 92%;
    max-width: 30rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    border-radius: .25rem;
    padding: 1.25rem 1.5625rem
}

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

@media only screen and (max-width: 800px) {
    .login {
        -ms-flex-order: 1;
        order: 1;
        margin: 30px auto 30px
    }
}

.login-wrap {
    width: 100%
}

.login-title {
    text-align: center;
    color: #373737;
    margin-bottom: 1.875rem
}

.login-link {
    display: inline-block;
    font-size: .875rem;
    color: #0078c8;
    margin-top: 1.25rem
}

.login-captcha {
    background: #f5f5f5;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    line-height: 0;
    border-radius: .25rem;
    margin: 1.875rem 0 .9375rem 0;
    min-height: 4.375rem;
    padding: 0 1.25rem
}

.login-captcha img {
    max-height: 3.75rem;
    max-width: 70%
}

.login-btns {
    margin-top: 1.875rem
}

.login-btns .btn:nth-of-type(1) {
    margin-bottom: 1.25rem
}

.mls {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    background-color: #F4F2F2;
    z-index: 320;
    transition: opacity 0.2s linear, visibility 0s 0.3s;
    visibility: hidden;
    pointer-events: none;
    opacity: 0
}

@media only screen and (max-width: 730px) {
    .mls {
        background-color: #fff;
        top: 4.0625rem;
        z-index: 199
    }
}

@media only screen and (max-width: 500px) {
    .mls {
        top: 4.0625rem
    }
}

.mls .color-bar {
    z-index: 10
}

@media only screen and (max-width: 730px) {
    .mls .color-bar {
        display: none
    }
}

.mls-logo {
    width: 10rem
}

@media only screen and (max-width: 730px) {
    .mls-logo {
        display: none
    }
}

.mls-logo a, .mls-logo img {
    display: block
}

.mls-close {
    position: absolute;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 3.125rem;
    height: 3.125rem;
    top: 2.1875rem;
    left: 1.5625rem;
    z-index: 10
}

@media only screen and (max-width: 800px) {
    .mls-close {
        top: 1.5625rem;
        left: .9375rem
    }
}

@media only screen and (max-width: 500px) {
    .mls-close {
        width: 2.5rem;
        height: 2.5rem;
        top: 1.25rem;
        left: .75rem
    }
}

.mls-close svg {
    fill: gray;
    width: 1.25rem;
    height: 1.25rem;
    transition: all 0.3s ease-out
}

@media only screen and (max-width: 730px) {
    .mls-close svg:first-child {
        display: none
    }
}

.mls-close svg:last-child {
    display: none
}

@media only screen and (max-width: 730px) {
    .mls-close svg:last-child {
        display: block
    }
}

.mls-close:hover svg {
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

@media only screen and (max-width: 500px) {
    .mls-close svg {
        width: 1rem;
        height: 1rem
    }
}

.mls-side {
    position: relative;
    -ms-flex: 0 0 32.5rem;
    flex: 0 0 32.5rem;
    background-color: #fff;
    box-shadow: 0 .3125rem 1.25rem rgba(0, 0, 0, 0.03);
    padding: 3.125rem 8.75rem 3.125rem 5.625rem;
    direction: ltr;
    overflow-y: auto;
    z-index: 1
}

@media only screen and (max-width: 1050px) {
    .mls-side {
        padding: 3.125rem 5rem
    }
}

.mls-side-in {
    direction: rtl
}

.mls-side-in > .loading {
    pointer-events: none;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.mls-main {
    position: relative;
    -ms-flex: 0 0 calc(100% - 32.5rem);
    flex: 0 0 calc(100% - 32.5rem)
}

.mls-main > .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    pointer-events: none;
    margin-top: -3.125rem
}

.mls-footer {
    position: absolute;
    width: 100%;
    bottom: 5rem
}

.mls-footer ul {
    margin: 0 -4.375rem -1.875rem;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media only screen and (max-width: 1050px) {
    .mls-footer ul {
        margin: 0 -4.375rem -1.875rem;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.mls-footer li {
    padding: 0 4.375rem;
    margin-bottom: 1.875rem
}

@media only screen and (max-width: 1050px) {
    .mls-footer li {
        margin-bottom: 3.125rem
    }
}

.mls-footer li::before {
    height: 3.75rem !important
}

.mls-footer li:nth-child(odd)::before {
    display: none
}

@media only screen and (max-width: 1050px) {
    .mls-footer li::before {
        display: none
    }
}

.mls-footer .card-f {
    max-width: 15.625rem
}

@media only screen and (max-width: 1050px) {
    .mls-footer .card-f {
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center
    }
}

@media only screen and (max-width: 1050px) {
    .mls-footer .card-f__img {
        margin-bottom: .9375rem;
        margin-left: 0
    }
}

@media only screen and (max-width: 1050px) {
    .mls-footer .card-f__desc {
        text-align: center
    }
}

.mlb-open .mlb {
    transition: all 0.3s linear;
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}

.mlb-title {
    display: none;
    position: absolute;
    top: 2.1875rem;
    font-size: 1.125rem;
    color: #373737
}

@media only screen and (max-width: 730px) {
    .mlb-title {
        display: block
    }
}

@media only screen and (max-width: 500px) {
    .mlb-title {
        top: 1.375rem
    }

    .mlb--step-pay .mlb-title {
        padding-right: 1.25rem
    }
}

.mlb-side {
    padding-left: 5rem
}

@media only screen and (max-width: 1050px) {
    .mlb-side {
        -ms-flex: 0 0 28.75rem;
        flex: 0 0 28.75rem
    }
}

@media only screen and (max-width: 730px) {
    .mlb-side {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        box-shadow: none !important;
        margin: 0 auto
    }
}

@media only screen and (max-width: 500px) {
    .mlb-side {
        padding: 1.25rem
    }
}

.mlb--step-pay .mlb-side {
    box-shadow: -.625rem 0 2.1875rem rgba(0, 0, 0, 0.1)
}

@media only screen and (max-width: 500px) {
    .mlb--step-pay .mlb-side {
        padding-right: 0;
        padding-left: 0
    }
}

.mlb-side-in {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%
}

.mlb-wrap {
    position: relative;
    height: calc(100% - 7.5rem)
}

@media only screen and (max-width: 730px) {
    .mlb-wrap {
        height: 100%;
        padding-top: 4.375rem
    }
}

@media only screen and (max-width: 500px) {
    .mlb-wrap {
        padding-top: 3.75rem
    }
}

.mlb-steps {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 730px) {
    .mlb-steps {
        -ms-flex-pack: center;
        justify-content: center
    }
}

.mlb-steps button {
    position: relative;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.875rem;
    height: 2.875rem;
    border-radius: .25rem;
    background-color: #F2F2F2;
    padding: 0 1rem;
    color: #c9c9c9;
    text-align: center
}

@media only screen and (max-width: 730px) {
    .mlb-steps button {
        margin: 0 .25rem
    }
}

.mlb-steps button.active {
    width: 11.875rem;
    text-align: right;
    -ms-flex-pack: start;
    justify-content: flex-start;
    color: #fff;
    background: #04BEDF;
    background: linear-gradient(45deg, #04BEDF 0%, #36BE8D 100%)
}

.mlb-steps button:disabled {
    cursor: not-allowed
}

.mlb-steps button:not(:disabled):active, .mlb-steps button.nice-select.open:not(:disabled) {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.mlb-steps i {
    font-size: 1.25rem
}

.mlb-steps span {
    display: none;
    margin-right: .9375rem;
    font-size: .9375rem
}

.mlb-steps button.active span {
    display: inline-block
}

.mlb-main {
    height: calc(100% - 6.875rem);
    direction: ltr;
    padding-top: 1.5625rem;
    padding-bottom: 1.875rem
}

.mlb--step-pay .mlb-main {
    height: calc(100% - 10.875rem)
}

@media only screen and (max-width: 500px) {
    .mlb--step-pay .mlb-main {
        height: auto
    }
}

@media only screen and (max-width: 500px) {
    .mlb-main {
        padding-top: .625rem;
        padding-bottom: .625rem
    }
}

.mlb-main-in {
    position: relative;
    direction: rtl;
    padding-top: 2.5rem;
    height: 100%
}

.mlb-main-in--auto {
    height: auto
}

@media only screen and (max-width: 730px) {
    .mlb-main-in.mlb--step-confirm-mobile {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: center;
        align-items: center;
        max-width: 18.75rem;
        width: 100%;
        margin: 0 auto
    }
}

.mlb-main .ss-content {
    overflow-y: scroll
}

@media only screen and (max-width: 730px) {
    .mlb-main .ss-scroll {
        display: none
    }
}

.mlb-form-title {
    color: #545454;
    font-size: 1.0625rem;
    margin-bottom: 1.875rem
}

.mlb-actions {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: absolute;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    bottom: 0;
    left: 0
}

@media only screen and (max-width: 730px) {
    .mlb-actions {
        max-width: 25rem;
        left: 50%;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

@media only screen and (max-width: 730px) and (max-width: 500px) {
    .mlb--step-pay .mlb-actions {
        max-width: none;
        position: relative;
        -ms-transform: none;
        transform: none;
        left: 0;
        padding: 1.25rem
    }
}

.mlb-btn {
    width: 100%
}

.mlb-btn--half {
    width: 9.0625rem
}

.mlb-field-stick {
    position: absolute;
    top: 100%;
    width: 100%;
    margin-top: 2.5rem
}

.mlb-userinfo {
    position: relative;
    background-color: #F7f7f7;
    padding: 1.25rem 1rem;
    font-size: .9375rem
}

@media only screen and (max-width: 500px) {
    .mlb--step-pay .mlb-userinfo {
        margin: 0 1.25rem
    }
}

.mlb-userinfo::before, .mlb-userinfo::after {
    content: "";
    background-image: url("../images/border-triangle.svg");
    position: absolute;
    height: .8125rem;
    width: 100%;
    left: 0
}

.mlb-userinfo::before {
    bottom: 99.5%
}

.mlb-userinfo::after {
    top: 99.5%;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.mlb-userinfo > p {
    color: #545454
}

.mlb-userinfo ul {
    margin-top: 1.25rem;
    color: #666
}

.mlb-userinfo li {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.mlb-userinfo li:not(:last-child) {
    margin-bottom: .5rem
}

.mlb-userinfo li span {
    min-width: 3.75rem;
    font-size: .875rem
}

.mlb-userinfo li var {
    direction: ltr;
    text-align: left
}

.mlb-media {
    background-color: #4d4d4d
}

@media only screen and (max-width: 1050px) {
    .mlb-media {
        -ms-flex: 0 0 calc(100% - 28.75rem);
        flex: 0 0 calc(100% - 28.75rem)
    }
}

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

.mlb-media::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 50%;
    left: 0;
    bottom: 0;
    opacity: 0.5;
    background: rgba(0, 0, 0, 0);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%)
}

.mlb--step-pay .mlb-media::before {
    display: none
}

.mlb--step-pay .mlb-media {
    direction: ltr;
    background-color: #F7f7f7
}

.mlb-media-in {
    display: none;
    padding: 6.25rem 6.25rem 4.375rem 12.5rem;
    direction: rtl
}

@media only screen and (max-width: 1400px) {
    .mlb-media-in {
        padding-left: 6.25rem
    }
}

@media only screen and (max-width: 1200px) {
    .mlb-media-in {
        margin-top: 3.125rem;
        padding-top: 6.25rem;
        padding-left: 3.125rem;
        padding-right: 3.125rem
    }
}

.mlb--step-pay .mlb-media-in {
    display: block;
    max-width: 62.5rem;
    margin: 0 auto
}

.mlb-cart {
    max-width: 100rem
}

.mlb-cart-loading {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 15rem
}

.mlb--step-pay .mlb-footer {
    display: none
}

.mlb-footer .card-f__title {
    color: #fff
}

.mlb-footer .card-f__desc {
    color: rgba(255, 255, 255, 0.6)
}

.mlb-close svg {
    fill: #fff
}

@media only screen and (max-width: 730px) {
    .mlb-close svg {
        fill: gray
    }
}

.mlb--step-pay .mlb-close svg {
    fill: gray
}

.mlb-timer {
    margin-top: 2.5rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 730px) {
    .mlb-timer {
        width: 100%
    }
}

.mlb-timer > div span {
    font-size: .875rem;
    display: block;
    color: #666
}

.mlb-timer [data-mlb-timer] {
    font-size: 1.25rem;
    color: #545454;
    text-align: left
}

.mlb-timer button {
    height: 2.8125rem;
    line-height: 2.8125rem;
    font-size: 1rem;
    padding: 0 .9375rem
}

.mlb-cart-list li {
    padding-right: 3rem
}

.mlb-cart-list li:not(:last-child) {
    margin-bottom: 1.25rem
}

.mlb-cart-feature {
    background-color: #fff;
    padding: 1.25rem .625rem;
    border-radius: 4px
}

.mlb-cart-feature li {
    margin-bottom: 0
}

.mlb-cart-feature .card-f {
    max-width: 18.75rem
}

.mlb-cart-details {
    display: none
}

@media only screen and (max-width: 730px) {
    .mlb-cart-details {
        display: block
    }
}

@media only screen and (max-width: 500px) {
    .mlb--step-pay .mlb-cart-details {
        padding: 0 1.375rem
    }
}

.mlp {
    background: linear-gradient(to right, #F7F7F7 50%, #fff 50%);
    position: relative;
    opacity: 1;
    visibility: visible;
    z-index: 1;
    pointer-events: initial
}

@media only screen and (max-width: 730px) {
    .mlp {
        top: 0;
        background: #fff
    }
}

.mlp__wrap {
    display: -ms-flexbox;
    display: flex;
    max-width: 74.375rem;
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px
}

@media only screen and (max-width: 730px) {
    .mlp__wrap {
        -ms-flex: 1;
        flex: 1;
        max-width: none;
        padding: 0;
        margin: 0
    }
}

.mlp-side {
    -ms-flex: 0 0 23.625rem;
    flex: 0 0 23.625rem;
    padding: 5rem 0 7.8125rem 5rem;
    box-shadow: none;
    direction: rtl
}

@media only screen and (max-width: 1050px) {
    .mlp-side {
        padding-right: 2.1875rem;
        padding-left: 3.125rem
    }
}

@media only screen and (max-width: 730px) {
    .mlp-side {
        -ms-flex: 1;
        flex: 1;
        text-align: center;
        padding: 3.125rem 0
    }
}

@media only screen and (max-width: 500px) {
    .mlp-side {
        padding: 2rem 0 3.125rem
    }
}

.mlp-main {
    -ms-flex: 1;
    flex: 1;
    background-color: #F7f7f7;
    direction: ltr
}

@media only screen and (max-width: 730px) {
    .mlp-main {
        display: none
    }
}

.mlp-main-in {
    padding: 4.375rem 6.25rem 4.375rem 0;
    direction: rtl
}

@media only screen and (max-width: 1400px) {
    .mlp-main-in {
        padding-left: 6.25rem
    }
}

@media only screen and (max-width: 1050px) {
    .mlp-main-in {
        padding-left: 1.875rem;
        padding-right: 1.875rem
    }
}

.mlp__title {
    font-size: 2.25rem
}

@media only screen and (max-width: 500px) {
    .mlp__title {
        font-size: 1.5rem
    }
}

.mlp__title--success {
    color: #0078c8
}

.mlp__title--fail {
    color: #eb4176
}

.mlp__subtitle {
    font-size: 1.25rem;
    color: #373737;
    margin-top: .25rem;
    margin-bottom: 1.875rem
}

@media only screen and (max-width: 500px) {
    .mlp__subtitle {
        font-size: 1.125rem
    }
}

.mlp-userinfo {
    font-size: .875rem;
    color: #666;
    text-align: justify
}

@media only screen and (max-width: 730px) {
    .mlp-userinfo {
        max-width: 21.25rem;
        margin: 0 auto
    }
}

@media only screen and (max-width: 500px) {
    .mlp-userinfo {
        max-width: none;
        margin: 0 1.25rem
    }
}

.mlp-userinfo--fail {
    min-height: 15rem
}

@media only screen and (max-width: 730px) {
    .mlp-userinfo--fail {
        max-width: 21.25rem;
        margin: 0 auto
    }
}

@media only screen and (max-width: 500px) {
    .mlp-userinfo--fail {
        max-width: 100%;
        margin: 0 1.25rem
    }
}

.mlp-userinfo--fail .loading {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 16.25rem
}

.mlp__code-wrap {
    margin-top: 2.125rem
}

@media only screen and (max-width: 730px) {
    .mlp__code-wrap {
        max-width: 18.75rem;
        margin: 2.125rem auto 0
    }
}

.mlp__code-wrap p {
    position: relative;
    font-size: .75rem;
    color: #666;
    text-align: center;
    margin-top: .625rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.mlp__code-wrap p::after, .mlp__code-wrap p::before {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%
}

.mlp__code-wrap p::before {
    background: #78be1e;
    margin-left: .625rem
}

.mlp__code-wrap p::after {
    background: #00bee6;
    margin-right: .625rem
}

.mlp__code {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: .9375rem 1.25rem;
    border-radius: 4px;
    color: #fff;
    background: linear-gradient(40deg, #05BEDC, #3CBE80);
    height: 3.125rem;
    line-height: 3.125rem
}

.mlp__code var {
    font-size: 1.125rem;
    margin-top: 2px;
    min-width: 5.625rem
}

.mlp__order-wrap {
    margin-top: 2.5rem
}

.mlp__order-wrap .loading {
    display: none
}

.mlp--loading .mlp__order-wrap {
    position: relative;
    min-height: 12.5rem
}

.mlp--loading .mlp__order-wrap > .loading {
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

@media only screen and (max-width: 730px) {
    .mlp__order-wrap ul {
        padding-right: 5rem;
        max-width: 20rem;
        margin: 0 auto
    }
}

@media only screen and (max-width: 500px) {
    .mlp__order-wrap ul {
        padding-right: .625rem;
        max-width: 11.25rem;
        margin: 0 auto
    }
}

.mlp__order {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1
}

.mlp.mlp--loading .mlp__order {
    opacity: 0;
    -ms-transform: translateY(15px);
    transform: translateY(15px)
}

.mlp__order:nth-child(1) {
    transition: transform 0.5s 0s, opacity 0.2s 0s
}

.mlp.mlp--loading .mlp__order:nth-child(1) {
    transition: transform 0.5s .5s, opacity 0.3s .5s
}

.mlp__order:nth-child(2) {
    transition: transform 0.5s .1s, opacity 0.2s .1s
}

.mlp.mlp--loading .mlp__order:nth-child(2) {
    transition: transform 0.5s .4s, opacity 0.3s .4s
}

.mlp__order:nth-child(3) {
    transition: transform 0.5s .2s, opacity 0.2s .2s
}

.mlp.mlp--loading .mlp__order:nth-child(3) {
    transition: transform 0.5s .3s, opacity 0.3s .3s
}

.mlp__order:nth-child(4) {
    transition: transform 0.5s .3s, opacity 0.2s .3s
}

.mlp.mlp--loading .mlp__order:nth-child(4) {
    transition: transform 0.5s .2s, opacity 0.3s .2s
}

.mlp__order:nth-child(5) {
    transition: transform 0.5s .4s, opacity 0.2s .4s
}

.mlp.mlp--loading .mlp__order:nth-child(5) {
    transition: transform 0.5s .1s, opacity 0.3s .1s
}

.mlp__order:nth-child(6) {
    transition: transform 0.5s .5s, opacity 0.2s .5s
}

.mlp.mlp--loading .mlp__order:nth-child(6) {
    transition: transform 0.5s 0s, opacity 0.3s 0s
}

.mlp__order:not(:last-child) {
    margin-bottom: .5rem
}

.mlp__order--doing {
    padding-right: 1px
}

.mlp__order span {
    font-size: .875rem
}

.mlp__order--done span {
    color: #BFBFBF
}

.mlp__order--wait span {
    color: #666
}

.mlp__order--doing span {
    font-size: 1rem;
    color: #0078c8
}

.mlp__order-icon {
    width: 1.875rem;
    height: 1.875rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: .5rem
}

.mlp-cart {
    position: relative;
    background: #fff;
    box-shadow: 0 .3125rem .9375rem -.3125rem rgba(0, 0, 0, 0.07)
}

.mlp-cart::after, .mlp-cart::before {
    content: '';
    position: absolute;
    left: 0;
    background-image: url("../images/border-triangle-white.svg");
    width: 100%;
    height: 16px
}

.mlp-cart::after {
    top: 100%;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.mlp-cart::before {
    bottom: 100%
}

.mlp-cart-list {
    padding: 0 1.875rem
}

.mlp-cart-list li {
    padding-right: 0
}

.mlp-cart-list li:not(:last-child) {
    margin-bottom: 0;
    border-bottom: 1px solid #E6E6E6
}

.mlp-cart__header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1.875rem 1.875rem .0625rem
}

.mlp-cart__header span {
    font-size: 1.125rem;
    color: #373737
}

.mlp-cart__header .btn {
    height: 2.5rem;
    line-height: 2.5rem;
    font-size: .8125rem;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    border-color: rgba(0, 120, 200, 0.5);
    transition: border-color .2s
}

.mlp-cart__header .btn:hover {
    box-shadow: none;
    border-color: #0078c8
}

.mlp-cart__header .btn svg {
    margin-left: .375rem
}

.mlp-cart__footer {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 4.5rem 1.875rem 1.25rem
}

@media only screen and (max-width: 900px) {
    .mlp-cart__footer {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.mlp-cart__footer::after, .mlp-cart__footer::before {
    content: '';
    position: absolute;
    top: 2.3125rem;
    background-image: url("../images/factor-circle.svg");
    width: 14px;
    height: 21px
}

.mlp-cart__footer::after {
    left: 0;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.mlp-cart__footer::before {
    right: 0
}

.mlp__dash {
    position: absolute;
    top: 3rem;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    background-image: url("../images/dashed.svg");
    width: calc(100% - 40px);
    height: 1px
}

.mlp__tracking-code, .mlp__bank-code {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 900px) {
    .mlp__tracking-code, .mlp__bank-code {
        width: 100%;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .mlp__tracking-code {
        margin-bottom: .3125rem
    }
}

.mlp__tracking-code span, .mlp__bank-code span {
    font-size: .8125rem;
    color: #373737
}

.mlp__tracking-code var, .mlp__bank-code var {
    font-size: 1.125rem;
    color: #373737;
    margin-right: .875rem
}

.mlp__footer {
    margin-top: 3.125rem
}

@media only screen and (max-width: 730px) {
    .mlp__footer {
        margin-top: 1.875rem
    }
}

@media only screen and (max-width: 500px) {
    .mlp__footer {
        margin: 1.875rem 1.25rem 0
    }
}

@media only screen and (max-width: 730px) {
    .mlp__footer .btn {
        max-width: 20rem
    }
}

@media only screen and (max-width: 500px) {
    .mlp__footer .btn {
        max-width: none;
        width: 100%
    }
}

.mlp__circle {
    position: absolute;
    top: 2.3125rem;
    background-image: url("../images/factor-circle.svg");
    width: 14px;
    height: 21px
}

.mlp__circle--right {
    right: -.875rem;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.mlp__circle--left {
    left: -.875rem
}

.mlp__pay {
    margin-top: 1.875rem;
    min-width: 20rem
}

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

.inputnum {
    height: 3.125rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -ms-flex-pack: end;
    justify-content: flex-end;
    line-height: 3.125rem
}

.inputnum input {
    height: 100%;
    width: 3.125rem;
    background-color: #fff;
    font-size: 1.875rem;
    text-align: center;
    color: #545454
}

.inputnum input:not(:first-child) {
    margin-left: .75rem
}

.inputnum input::-webkit-input-placeholder {
    font-size: 2.1875rem;
    color: #c9c9c9
}

.inputnum input:-moz-placeholder {
    font-size: 2.1875rem;
    color: #c9c9c9
}

.inputnum input::-moz-placeholder {
    font-size: 2.1875rem;
    color: #c9c9c9
}

.inputnum input:-ms-input-placeholder {
    font-size: 2.1875rem;
    color: #c9c9c9
}

.custom-file {
    position: relative;
    border-radius: 4px
}

.custom-file.has-file .custom-file__label {
    pointer-events: none;
    background: #F2F2F2;
    border: 1px solid transparent
}

.custom-file.has-file .custom-file__upload {
    pointer-events: none;
    opacity: 0;
    visibility: hidden
}

.custom-file.has-file .custom-file__done {
    opacity: 1;
    visibility: visible;
    cursor: pointer;
    pointer-events: visible
}

.custom-file__input {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1
}

.custom-file__label {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    width: 100%;
    height: calc(2.875rem + 2px);
    padding: 10px 1rem;
    border-radius: 4px;
    border: 1px solid #E6E6E6;
    background: #fff;
    transition: border-color .15s linear
}

.custom-file__input:focus .custom-file__label, .custom-file__label:hover {
    border-color: #0078c8
}

.custom-file__label > span {
    color: #999
}

.custom-file__upload, .custom-file__done {
    position: absolute;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    top: 50%;
    left: 20px;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.custom-file__upload span {
    font-size: 1.0625rem;
    color: #0078c8
}

.custom-file__upload svg {
    vertical-align: middle;
    width: 14px;
    height: 15px;
    margin-left: 10px
}

.custom-file__done {
    opacity: 0;
    visibility: hidden
}

.custom-file__done:hover svg {
    fill: #f22b2b
}

.custom-file__done span {
    color: #2b2929
}

.custom-file__done svg {
    width: 10px;
    height: 10px;
    fill: #c9c9c9;
    margin-right: 1.25rem;
    vertical-align: middle;
    transition: fill .15s linear
}

.custom-file__btn {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    z-index: 3;
    width: 7.375rem;
    height: 1.875rem
}

.loading-full {
    position: fixed;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 2000
}

.loading-full img {
    width: 7.5rem;
    height: 7.5rem;
    animation: kf-rotate 1s ease-out infinite forwards
}

@keyframes kf-rotate {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(-360deg)
    }
}

.swa-popup {
    padding: 3.125rem !important
}

@media only screen and (max-width: 500px) {
    .swa-popup {
        padding: 2.5rem .9375rem !important
    }
}

.swa-title {
    font-size: 1.5rem !important
}

@media only screen and (max-width: 500px) {
    .swa-title {
        font-size: 1.25rem !important
    }
}

#festival {
    counter-reset: section
}

#festival .landing_festival_steps .steps-container {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 55.625rem;
    padding: 2rem 0.9375rem
}

#festival .landing_festival_steps .steps-container .level {
    display: -ms-flexbox;
    display: flex
}

#festival .landing_festival_steps .steps-container .level .level__icon {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%
}

#festival .landing_festival_steps .steps-container .level .level__icon > div:before {
    position: absolute;
    top: -20px;
    right: 0;
    width: 4.375rem;
    height: 4.375rem;
    border-radius: 50%;
    border: .3125rem solid #fff;
    background: linear-gradient(-45deg, #F68E00, #E33F56);
    text-align: center;
    font-size: 2.25rem;
    color: #fff;
    line-height: 4.0625rem;
    counter-increment: section;
    content: counter(section)
}

#festival .landing_festival_steps .steps-container .level .level__icon div {
    position: relative;
    width: 11.5rem;
    height: 11.5rem;
    border-radius: 50%;
    background: linear-gradient(-30deg, #FF6E39, #F68E00);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    box-shadow: 0 1rem 1.625rem rgba(255, 110, 57, 0.22)
}

#festival .landing_festival_steps .steps-container .level .level__body {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex: 0 0 70%;
    flex: 0 0 70%
}

#festival .landing_festival_steps .steps-container .level .level__body .level__step {
    font-size: 1rem;
    color: #F68E00
}

#festival .landing_festival_steps .steps-container .level .level__body h3 {
    font-size: 1.3125rem;
    color: #000;
    margin-bottom: 1.1875rem
}

#festival .landing_festival_steps .steps-container .level .level__body .level__desc {
    font-size: 1rem;
    color: #666;
    line-height: 1.9
}

#festival .landing_festival_steps .steps-container .level .level__body .level__desc > div {
    margin-top: 1.875rem;
    margin-bottom: 1.5625rem;
    font-size: 1rem;
    color: #666
}

#festival .landing_festival_steps .steps-container .level .level__body .level__desc > div p {
    margin-right: 1.6875rem;
    font-weight: bold;
    display: inline-block
}

#festival .landing_festival_steps .steps-container .level .step-warning {
    padding: 1rem 1.5rem;
    background-color: rgba(246, 185, 0, 0.08);
    border-radius: .625rem;
    margin-top: 1.5625rem;
    line-height: 1.9
}

#festival .landing_festival_steps .steps-container .level .step-warning p {
    font-size: .875rem;
    color: #F6B900
}

#festival .landing_festival_steps:nth-child(2n) {
    background-color: #fff
}

#festival .landing_festival_steps:nth-child(2n+1) {
    background-color: #f5f5f5
}

#festival.barfi .landing_festival_steps .steps-container {
    width: 100%;
    max-width: unset
}

#festival.barfi .landing_festival_steps .steps-container .level .level__icon > div {
    background: transparent;
    box-shadow: none
}

#festival.barfi .landing_festival_steps .steps-container .level .level__icon > div svg.icon {
    -ms-transform: scale(1.4);
    transform: scale(1.4);
    position: relative
}

#festival.barfi .landing_festival_steps .steps-container .level .level__icon > div svg.icon--headphone, #festival.barfi .landing_festival_steps .steps-container .level .level__icon > div svg.icon--smartphone, #festival.barfi .landing_festival_steps .steps-container .level .level__icon > div svg.icon--mail, #festival.barfi .landing_festival_steps .steps-container .level .level__icon > div svg.icon--gift-card {
    fill: #888
}

#festival.barfi .landing_festival_steps .steps-container .level .level__icon > div svg.icon--mail, #festival.barfi .landing_festival_steps .steps-container .level .level__icon > div svg.icon--card {
    stroke: #888
}

#festival.barfi .landing_festival_steps .steps-container .level .level__icon > div svg.icon--card {
    fill: none
}

#festival.barfi .landing_festival_steps .steps-container .level .level__icon > div:before {
    content: "";
    height: 11.5rem;
    width: 5.75rem;
    border: none;
    border-bottom: solid 5.75rem transparent;
    border-top: solid 5.75rem transparent;
    border-radius: 0;
    top: 0;
    counter-increment: unset
}

#festival.barfi .landing_festival_steps .steps-container .level .level__icon > div:after {
    counter-increment: section;
    content: counter(section);
    z-index: 1;
    color: white;
    font-size: 2rem;
    position: absolute
}

#festival.barfi .landing_festival_steps .steps-container .level .step-warning {
    background-color: #fcf8e3;
    color: #d9b917;
    border-color: #d9b917;
    border-width: 1px
}

#festival.barfi .landing_festival_steps:nth-child(2n) {
    background-color: #dadada
}

#festival.barfi .landing_festival_steps:nth-child(2n) .steps-container {
    padding-right: 0
}

#festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level {
    -ms-flex-direction: row;
    flex-direction: row
}

#festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level .level__icon svg {
    right: 40%
}

#festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level .level__icon > div {
    background: none
}

#festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level .level__icon > div:before {
    right: 0;
    border-right: solid 5.75rem #0078c8
}

#festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level .level__icon > div:after {
    right: 15%
}

#festival.barfi .landing_festival_steps:nth-child(2n+1) {
    background-color: #e3e3e3
}

#festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container {
    padding-left: 0
}

#festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level {
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

#festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level .level__icon {
    -ms-flex-pack: end;
    justify-content: flex-end
}

#festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level .level__icon > div {
    background: none;
    box-shadow: none
}

#festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level .level__icon > div svg {
    left: 40%
}

#festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level .level__icon > div:before {
    left: 0;
    right: auto;
    border-left: solid 5.75rem #0078c8
}

#festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level .level__icon > div:after {
    left: 15%
}

@media screen and (max-width: 700px) {
    #festival .landing_festival_steps .steps-container {
        padding-top: 2.0625rem;
        padding-bottom: 2rem
    }

    #festival .landing_festival_steps .steps-container .level {
        -ms-flex-direction: column;
        flex-direction: column
    }

    #festival .landing_festival_steps .steps-container .level .level__icon {
        -ms-flex-order: -1;
        order: -1;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        -ms-flex-pack: center;
        justify-content: center
    }

    #festival .landing_festival_steps .steps-container .level .level__icon > div:before {
        width: 2.8125rem;
        height: 2.8125rem;
        font-size: 1.25rem;
        color: #fff;
        line-height: 2.05
    }

    #festival .landing_festival_steps .steps-container .level .level__icon .icon--headphone {
        width: 2.875rem;
        height: 3.0625rem
    }

    #festival .landing_festival_steps .steps-container .level .level__icon div {
        width: 6.9375rem;
        height: 6.9375rem
    }

    #festival .landing_festival_steps .steps-container .level .level__body {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align: center;
        align-items: center;
        text-align: center;
        margin-top: 1.5625rem
    }

    #festival .landing_festival_steps .steps-container .level .level__body h3 {
        font-size: 1rem;
        margin-top: .125rem;
        margin-bottom: 1rem
    }

    #festival .landing_festival_steps .steps-container .level .level__body .level__desc {
        font-size: .875rem;
        line-height: 1.8
    }

    #festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container, #festival.barfi .landing_festival_steps:nth-child(2n) .steps-container {
        padding-left: 10px;
        padding-right: 10px
    }

    #festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level, #festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level {
        -ms-flex-direction: column;
        flex-direction: column
    }

    #festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level .level__icon, #festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level .level__icon {
        -ms-flex-pack: center;
        justify-content: center
    }

    #festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level .level__icon > div svg, #festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level .level__icon > div svg {
        left: 0;
        right: 0
    }

    #festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level .level__icon > div:before, #festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level .level__icon > div:before {
        display: none
    }

    #festival.barfi .landing_festival_steps:nth-child(2n+1) .steps-container .level .level__icon > div:after, #festival.barfi .landing_festival_steps:nth-child(2n) .steps-container .level .level__icon > div:after {
        display: none
    }
}

.icon--headphone {
    width: 4.8125rem;
    height: 5.125rem
}

.icon--gift-card {
    width: 5.0625rem;
    height: 3.5625rem
}

.icon--mail {
    width: 5.875rem;
    height: 3.0625rem
}

.icon--smartphone {
    width: 4.125rem;
    height: 5rem;
    margin-left: .3125rem
}

.icon--card {
    width: 5.125rem;
    height: 3.625rem
}

.festival_product {
    background-color: #e6e6e6
}

.festival_product .table_header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
    box-shadow: none
}

.festival_product .table_header span {
    display: inline-block;
    font-size: 1.25rem;
    color: #545454;
    margin-left: .8125rem
}

.festival_product .table_header i {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    width: 2.125rem;
    height: 2.125rem;
    border-radius: 50%;
    border: 1px solid #C9C9C9;
    transition: all 0.5s ease-out;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.festival_product .table_header i svg {
    width: .9375rem;
    height: .5rem;
    margin-top: 1px
}

.festival_product .ftable_container.open .table_header i {
    -ms-transform: rotate(0deg);
    transform: rotate(0deg)
}

.festival_product .ftable {
    direction: rtl;
    text-align: center !important;
    width: 100%;
    vertical-align: middle;
    color: #494949;
    transition: all 0.7s ease-out;
    overflow: hidden;
    margin-top: 1.875rem
}

.festival_product .ftable tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit
}

.festival_product .ftable td, .festival_product .ftable th {
    padding: 10px 12px;
    border-color: #ebebeb;
    border-width: 3px 3px 0 0;
    border-style: solid;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    font-family: iransans, serif
}

.festival_product .ftable th {
    border-width: 0 3px 0 0
}

.festival_product .ftable th {
    background-color: #009e42;
    color: #ebebeb
}

.festival_product .ftable tr:nth-child(2n) td {
    background-color: #dadada
}

.festival_product .ftable tr:nth-child(2n+1) td {
    background-color: #e1e1e1
}

@media screen and (max-width: 600px) {
    .ftable_container {
        overflow-x: auto
    }

    .ftable.ftable-mobile thead {
        display: none
    }

    .ftable.ftable-mobile tbody, .ftable.ftable-mobile tr, .ftable.ftable-mobile td {
        display: block;
        width: 100%
    }

    .ftable.ftable-mobile td:nth-child(2n) {
        background-color: red
    }

    .ftable.ftable-mobile tr {
        margin-bottom: 150px
    }

    .ftable.ftable-mobile td {
        text-align: right;
        padding-right: 50%;
        position: relative
    }

    .ftable.ftable-mobile td:before {
        content: attr(data-label);
        position: absolute;
        right: 0;
        width: 50%
    }
}

#general_information {
    padding: 1rem 1.5rem;
    background-color: #e6e6e6;
    border-width: 3px;
    border-color: #d3d3d3;
    border-style: solid
}

#general_information h1 {
    font-size: 1.2rem;
    margin-right: -0.5rem;
    font-weight: bold
}

#general_information p {
    margin-bottom: 1rem;
    font-size: 0.9rem;
    color: #666
}

#general_information p:first-of-type {
    margin-bottom: 1.5rem;
    font-weight: bold
}

#general_information .drawRules-container {
    padding-top: 1rem;
    color: #666
}

#general_information .drawRules-container ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0;
    margin-inline-end: 0;
    padding-inline-start: 40px
}

#general_information .drawRules-container ul li {
    font-size: 0.9rem
}

#general_information .warning {
    background-color: #f2dede;
    color: #a64242;
    border: 1px solid #a64242;
    clear: both;
    font-size: 0.8rem;
    position: relative;
    padding: 25px;
    border-radius: 0;
    margin-bottom: 20px;
    text-shadow: none
}

#general_information .warning i {
    margin-left: 0.5rem
}

#festival {
    padding: 0
}

#festival .default_warning_class {
    padding: .9375rem 2.5rem;
    border-radius: .3125rem;
    font-size: .8125rem;
    background-color: rgba(255, 27, 27, 0.03);
    color: #BF0000;
    margin-top: 2.5rem
}

#festival .landing_festival_warning {
    padding: .9375rem 2.5rem 6.75rem;
    border-radius: .3125rem;
    font-size: .8125rem;
    background-color: rgba(255, 27, 27, 0.03);
    color: #BF0000
}

#festival .landing_festival_warning .warning_container {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 55.625rem;
    padding: 2rem 0.9375rem;
    text-align: center
}

#festival .landing_festival_warning .warning_container h2 {
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 1.5rem
}

#festival .landing_festival_warning .warning_container ul {
    line-height: 1.9
}

#festival .landing_festival_warning .warning_container ul li {
    position: relative;
    text-align: right;
    padding-right: 1rem
}

#festival .landing_festival_warning .warning_container ul li:before {
    content: '';
    position: absolute;
    right: 0;
    top: .525rem;
    width: .625rem;
    height: .625rem;
    border-radius: 50%;
    background-color: #BF0000
}

#festival .intro-img {
    width: 33.75rem
}

#festival .festivals-button-container .section-btns {
    text-align: center
}

#festival .festivals-button-container .section-btns .btn {
    line-height: 4.375rem;
    height: 4.375rem
}

#festival .festivals-button-container .section-btns a:first-child {
    margin-left: 1rem
}

#festival svg.icon--headphone, #festival svg.icon--smartphone, #festival svg.icon--mail, #festival svg.icon--gift-card {
    fill: white
}

#festival svg.icon--mail, #festival svg.icon--card {
    stroke: white
}

#festival svg.icon--card {
    fill: none
}

#festival {
    background-color: #e6e6e6
}

#festival .festival_main_banner {
    background: radial-gradient(circle at 30%, #FFB550, #F68E00 70%);
    height: 100vh;
    overflow: hidden
}

#festival .festival_main_banner .row {
    position: relative;
    max-width: 71.875rem;
    height: 100%;
    padding: 0 .9375rem;
    margin: 0 auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

#festival .festival_main_banner .row .col {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    flex-direction: column;
    z-index: 2
}

#festival .festival_main_banner .row .col img {
    width: 100%
}

#festival .festival_main_banner .row .col:first-child {
    -ms-flex: 0 0 35%;
    flex: 0 0 35%;
    z-index: 3
}

#festival .festival_main_banner .row .col:last-child {
    -ms-flex: 0 0 65%;
    flex: 0 0 65%;
    -ms-flex-align: end;
    align-items: flex-end
}

#festival .festival_main_banner .row .col .intro-subtitle {
    font-size: 2.125rem;
    margin-bottom: 4.375rem
}

#festival .festival_main_banner .row .col .intro-title, #festival .festival_main_banner .row .col .intro-subtitle {
    font-size: 1.625rem;
    color: #fff;
    font-weight: bold;
    text-shadow: 0.1875rem 0.3125rem 0.75rem rgba(121, 73, 7, 0.24)
}

#festival .festival_main_banner .row .col .intro-title var {
    font-size: 3.4375rem;
    text-shadow: 0.1875rem 0.3125rem 0 #794907;
    padding-right: .625rem
}

#festival .festival_main_banner .row .col .intro-discount {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-right: 2.5rem;
    width: 22.25rem;
    height: 7.8125rem;
    font-size: 1.6875rem;
    color: #DC7F00;
    -ms-transform: rotate(-8deg);
    transform: rotate(-8deg);
    font-weight: bold
}

#festival .festival_main_banner .row .col .intro-discount > span {
    position: relative;
    z-index: 1
}

#festival .festival_main_banner .row .col .intro-discount i, #festival .festival_main_banner .row .col .intro-discount img {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0
}

#festival .festival_main_banner .row .col .intro-discount i img {
    -ms-transform-origin: right center;
    transform-origin: right center
}

#festival .festival_main_banner .row .col .intro-discount i img:nth-child(1) {
    opacity: 0.09;
    -ms-transform: rotate(-12deg);
    transform: rotate(-12deg);
    width: calc(100% - 1.25rem)
}

#festival .festival_main_banner .row .col .intro-discount i img:nth-child(2) {
    -ms-transform: rotate(-6deg);
    transform: rotate(-6deg);
    width: calc(100% - .625rem);
    opacity: 0.3
}

#festival .festival_main_banner .row .col .intro-discount div {
    position: absolute;
    width: 3.625rem;
    height: 4.0625rem;
    left: -1.875rem;
    top: 40%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover
}

#festival .festival_main_banner .row .col .intro-particles {
    position: absolute;
    width: 62.5rem;
    height: 22.5rem;
    left: 50%;
    top: 50%;
    margin-left: -31.25rem;
    margin-top: -11.25rem;
    -ms-transform: translate(-12%, 50%) scale(0.8);
    transform: translate(-12%, 50%) scale(0.8)
}

#festival .festival_main_banner .row .col .intro-particles li {
    position: absolute;
    transition: all 0.3s ease-out
}

#festival .festival_main_banner .row .col .intro-particles li img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#festival .festival_main_banner .row .col .intro-particles li:nth-child(1) {
    width: 5.54%;
    height: 13.05%;
    right: 2.86%;
    top: 13%
}

#festival .festival_main_banner .row .col .intro-particles li:nth-child(2) {
    width: 7.22%;
    height: 27.3%;
    right: 0;
    top: 45%
}

#festival .festival_main_banner .row .col .intro-particles li:nth-child(3) {
    width: 10.27%;
    height: 32.8%;
    right: 12%;
    top: 53%
}

#festival .festival_main_banner .row .col .intro-particles li:nth-child(4) {
    width: 7.9%;
    height: 23.1%;
    right: 72%;
    top: 16%
}

#festival .festival_main_banner .row .col .intro-particles li:nth-child(5) {
    width: 11.95%;
    height: 38.6%;
    right: 74%;
    top: 31%
}

#festival .festival_main_banner .row .col .intro-particles li:nth-child(6) {
    width: 10.27%;
    height: 27.8%;
    right: 77%;
    bottom: 0
}

#festival .festival_main_banner .row .col .intro-particles li:nth-child(7) {
    width: 6.75rem;
    height: 7rem;
    left: 0;
    top: 0
}

#festival #festival_introduction .section-wrap {
    padding-top: 0
}

#festival #festival_introduction #general_information {
    border: none;
    padding: 0
}

#festival #festival_introduction #general_information .festival-introduction-main {
    position: relative;
    top: -4.375rem;
    background: #fff;
    padding: 3.75rem 8.125rem;
    border-radius: .625rem;
    margin-bottom: 1.875rem;
    z-index: 10
}

#festival #festival_introduction #general_information .festival-introduction-main h1 {
    display: none
}

#festival .landing_festival_inactive_info .list li, #festival .landing_festival_active_info .list li, #festival .landing_festival_draw_rules .list li, #festival .landing_festival_important_note .list li {
    font-size: 1.125rem;
    color: #000;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    padding-right: 1.625rem;
    line-height: 1.9
}

#festival .landing_festival_inactive_info .list li:not(:last-child), #festival .landing_festival_active_info .list li:not(:last-child), #festival .landing_festival_draw_rules .list li:not(:last-child), #festival .landing_festival_important_note .list li:not(:last-child) {
    margin-bottom: 1.625rem
}

#festival .landing_festival_inactive_info .list li::before, #festival .landing_festival_active_info .list li::before, #festival .landing_festival_draw_rules .list li::before, #festival .landing_festival_important_note .list li::before {
    content: '';
    position: absolute;
    right: 0;
    top: .625rem;
    width: .625rem;
    height: .625rem;
    border-radius: 50%;
    background-color: #F68E00
}

#festival .landing_festival_inactive_info, #festival .landing_festival_active_info {
    position: relative;
    padding-right: .9375rem;
    padding-left: .9375rem;
    margin: 0 auto;
    width: 100%;
    max-width: 66.875rem
}

#festival .landing_festival_inactive_info .offer, #festival .landing_festival_active_info .offer {
    position: relative;
    top: -4.375rem;
    background: #fff;
    padding: 3.75rem 8.125rem;
    border-radius: .625rem;
    margin-bottom: 1.875rem;
    z-index: 10
}

#festival .landing_festival_inactive_info .offer h2, #festival .landing_festival_active_info .offer h2 {
    font-size: 2rem;
    color: #F68E00;
    margin-bottom: 2.875rem
}

#festival .landing_festival_inactive_info .offer h2 span, #festival .landing_festival_active_info .offer h2 span {
    font-weight: bold
}

#festival .landing_festival_draw_rules {
    position: relative;
    padding-right: .9375rem;
    padding-left: .9375rem;
    margin: 0 auto 4rem;
    width: 100%;
    max-width: 50.625rem;
    padding-bottom: 2.75rem
}

#festival .landing_festival_draw_rules h2 {
    font-size: 1.75rem;
    color: #000;
    text-align: center
}

#festival .landing_festival_important_note {
    padding: 5rem .9375rem;
    background-color: #f5f5f5;
    position: relative
}

#festival .landing_festival_important_note .offer {
    margin: 0 auto;
    width: 100%;
    max-width: 55.625rem
}

#festival .landing_festival_important_note h2 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 1.75rem;
    color: #000
}

#festival .landing_festival_important_note .important-note .note_title {
    font-weight: bold
}

#festival .landing_festival_important_note .important-note .note_description {
    margin-top: .625rem;
    color: #666;
    font-size: 1rem
}

#festival .landing_festival_steps_header {
    background: #fff
}

#festival .landing_festival_steps_header .offer {
    padding: 3.75rem 8.125rem;
    border-radius: .625rem;
    width: 100%;
    max-width: 66.625rem;
    margin: auto
}

#festival .landing_festival_steps_header .offer h2 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 1.75rem;
    color: #000
}

#festival .landing_festival_steps_header .offer ul li {
    font-size: 1.25rem;
    color: gray;
    margin-top: .625rem;
    text-align: center
}

#festival .landing_festival_products {
    width: 100%;
    background: #fff
}

#festival .landing_festival_products .ftable_container {
    padding: 1.875rem;
    top: 0;
    -ms-transform: translateY(-6.25rem);
    transform: translateY(-6.25rem);
    box-shadow: 0 0.3125rem 0.9375rem rgba(0, 0, 0, 0.05);
    margin-bottom: 0;
    position: relative;
    background: #fff;
    border-radius: .625rem;
    z-index: 10
}

#festival.festival_inactive .landing_festival_active_info {
    display: none
}

#festival.festival_inactive .landing_festival_inactive_info {
    display: block
}

#festival.festival_active .landing_festival_active_info {
    display: block
}

#festival.festival_active .landing_festival_inactive_info {
    display: none
}

#festival.barfi {
    background-color: #ebebeb
}

#festival.barfi .festival_main_banner {
    background: transparent;
    padding-top: 2rem;
    height: auto
}

#festival.barfi .festival_main_banner .row {
    max-width: 71.875rem;
    display: block
}

#festival.barfi .festival_main_banner .row .col {
    display: none
}

#festival.barfi .festival_main_banner .row .col .intro-title, #festival.barfi .festival_main_banner .row .col .intro-subtitle, #festival.barfi .festival_main_banner .row .col .intro-discount, #festival.barfi .festival_main_banner .row .col .intro-particles {
    display: none
}

#festival.barfi .festival_main_banner .row .col.intro-image {
    display: block;
    position: relative;
    width: 100%
}

#festival.barfi .festival_main_banner .row .col.intro-image .intro-img {
    width: 100%
}

#festival.barfi .festival_main_banner .row .col.intro-image .intro-img img {
    width: 100%
}

#festival.barfi .landing_festival_inactive_info, #festival.barfi .landing_festival_active_info, #festival.barfi .landing_festival_draw_rules {
    max-width: 71.875rem;
    margin-top: 4rem;
    border: 2px solid #747474;
    border-bottom: none
}

#festival.barfi .landing_festival_inactive_info .offer, #festival.barfi .landing_festival_active_info .offer, #festival.barfi .landing_festival_draw_rules .offer {
    position: unset;
    padding: 3.75rem 2.125rem 0;
    background-color: unset;
    margin-bottom: 0
}

#festival.barfi .landing_festival_inactive_info .offer .section-header, #festival.barfi .landing_festival_active_info .offer .section-header, #festival.barfi .landing_festival_draw_rules .offer .section-header {
    margin-bottom: 10px
}

#festival.barfi .landing_festival_inactive_info .offer .section-header h2, #festival.barfi .landing_festival_active_info .offer .section-header h2, #festival.barfi .landing_festival_draw_rules .offer .section-header h2 {
    text-align: right;
    color: #747474;
    font-size: 18px;
    margin: 0
}

#festival.barfi .landing_festival_inactive_info .offer ul, #festival.barfi .landing_festival_active_info .offer ul, #festival.barfi .landing_festival_draw_rules .offer ul {
    list-style-image: none
}

#festival.barfi .landing_festival_inactive_info .offer ul li, #festival.barfi .landing_festival_active_info .offer ul li, #festival.barfi .landing_festival_draw_rules .offer ul li {
    color: #747474;
    font-size: 15px;
    margin: 0;
    padding: 0
}

#festival.barfi .landing_festival_inactive_info .offer ul li:before, #festival.barfi .landing_festival_active_info .offer ul li:before, #festival.barfi .landing_festival_draw_rules .offer ul li:before {
    content: unset
}

#festival.barfi .landing_festival_draw_rules {
    margin: 0 auto;
    border: 2px solid #747474;
    border-top: none;
    padding-top: 1rem
}

#festival.barfi .landing_festival_draw_rules .section-header {
    margin-bottom: 0
}

#festival.barfi .landing_festival_draw_rules .section-header h2 {
    text-align: right
}

#festival.barfi .landing_festival_draw_rules .offer {
    position: unset;
    padding: 0 2.125rem 3.75rem;
    background-color: unset;
    margin-bottom: 0
}

#festival.barfi .landing_festival_draw_rules .offer ul {
    list-style-image: none
}

#festival.barfi .landing_festival_draw_rules .offer ul li {
    color: #747474;
    font-size: 15px;
    margin: 0;
    padding-right: 1.625rem
}

#festival.barfi .landing_festival_draw_rules .offer ul li:before {
    content: "";
    background-color: #747474
}

#festival.barfi .landing_festival_steps_header, #festival.barfi .landing_festival_steps {
    max-width: 71.875rem;
    margin: auto
}

#festival.barfi .landing_festival_important_note {
    background-color: #e3e3e3;
    max-width: 71.875rem;
    margin: auto;
    padding: 20px
}

#festival.barfi .landing_festival_important_note .offer {
    margin: 0;
    width: 100%;
    max-width: unset
}

#festival.barfi .landing_festival_important_note ul li:before {
    content: none
}

#festival.barfi .landing_festival_important_note ul li h3, #festival.barfi .landing_festival_important_note ul li p {
    color: #6f6f6f
}

#festival.barfi .landing_festival_steps_header {
    background-color: #dadada
}

@media screen and (max-width: 800px) {
    #festival .festival_main_banner {
        height: auto
    }

    #festival .festival_main_banner .row {
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        -ms-flex-align: center;
        align-items: center;
        padding-bottom: 6.25rem
    }

    #festival .festival_main_banner .row .col:first-child {
        -ms-transform: translateY(-2.5rem);
        transform: translateY(-2.5rem)
    }

    #festival .festival_main_banner .row .col .intro-particles {
        width: 43.75rem;
        height: 15.75rem;
        margin-left: -23.75rem;
        margin-top: -7.875rem;
        -ms-transform: translate(2vw, 50%) scale(0.8);
        transform: translate(2vw, 50%) scale(0.8)
    }

    #festival .festival_main_banner .row .col:last-child {
        margin-top: 5rem
    }

    #festival .landing_festival_products .ftable_container {
        overflow: scroll
    }

    #festival .landing_festival_inactive_info .offer, #festival .landing_festival_active_info .offer, #festival .landing_festival_draw_rules .offer, #festival .landing_festival_steps_header .offer, #festival .landing_festival_warning .offer, #festival .landing_festival_important_note .offer {
        top: -2.5rem;
        padding: 1.875rem;
        box-shadow: 0 0.5rem 0.9375rem rgba(0, 0, 0, 0.05)
    }

    #festival .landing_festival_inactive_info .offer h2, #festival .landing_festival_active_info .offer h2, #festival .landing_festival_draw_rules .offer h2, #festival .landing_festival_steps_header .offer h2, #festival .landing_festival_warning .offer h2, #festival .landing_festival_important_note .offer h2 {
        text-align: center;
        font-size: 1.1875rem;
        margin-bottom: 1.875rem
    }

    #festival .landing_festival_inactive_info .offer .list ul li, #festival .landing_festival_active_info .offer .list ul li, #festival .landing_festival_draw_rules .offer .list ul li, #festival .landing_festival_steps_header .offer .list ul li, #festival .landing_festival_warning .offer .list ul li, #festival .landing_festival_important_note .offer .list ul li {
        padding-right: 1.5rem;
        margin-bottom: 1rem;
        font-size: .875rem;
        line-height: 1.8;
        font-weight: 400
    }

    #festival .landing_festival_inactive_info .offer .list ul li::before, #festival .landing_festival_active_info .offer .list ul li::before, #festival .landing_festival_draw_rules .offer .list ul li::before, #festival .landing_festival_steps_header .offer .list ul li::before, #festival .landing_festival_warning .offer .list ul li::before, #festival .landing_festival_important_note .offer .list ul li::before {
        top: .5rem
    }

    #festival .festivals-button-container {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 0 5rem;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align: center;
        align-items: center;
        background: #f5f5f5;
        padding-bottom: 4rem
    }

    #festival .festivals-button-container .section-btns a:first-child {
        margin: 0 0 1rem
    }
}

@media screen and (max-width: 500px) {
    #festival .intro-img {
        width: 18.75rem
    }

    #festival .festival_main_banner .row .col {
        width: 18.75rem
    }

    #festival .festival_main_banner .row .col .intro-discount {
        width: 16.25rem;
        height: 6.5625rem;
        font-size: 1.1875rem
    }

    #festival .festival_main_banner .row .col .intro-discount div {
        left: -2.275rem;
        top: 30%
    }

    #festival .festival_main_banner .row .col .intro-title, #festival .festival_main_banner .row .col .intro-subtitle {
        font-size: 1.25rem
    }

    #festival .festival_main_banner .row .col .intro-title var, #festival .festival_main_banner .row .col .intro-subtitle var {
        font-size: 2.625rem
    }
}

.icon--user {
    width: 1.3rem;
    height: 1.6rem;
    display: block
}

.profile_menu_button .profile_menu_info {
    position: absolute;
    z-index: -100;
    background-color: white;
    padding: 0.7rem 2rem;
    box-shadow: 0px 0px 10px 0px #ccc;
    border-radius: 10px;
    left: -2.7rem;
    top: 3rem;
    pointer-events: none;
    white-space: nowrap;
    opacity: 0;
    -ms-transform: translateY(1rem);
    transform: translateY(1rem);
    transition: all 0.2s linear
}

.profile_menu_button .profile_menu_info.open {
    opacity: 1;
    z-index: 100;
    pointer-events: auto;
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.header .header-wrap .header-container .header-info .header-divider {
    width: 2px;
    height: 1.25rem;
    border-radius: 2px;
    background: #bfb8af;
    margin: 0 .9375rem
}

.header .header-wrap .header-container .header-info .header-info {
    margin-left: 1rem
}

.header .header-wrap .header-container .header-info .header-magnifier, .header .header-wrap .header-container .header-info .header-cart {
    position: relative;
    width: 2rem;
    height: 2rem;
    fill: #373737
}

.icon {
    pointer-events: none
}

.profile_menu_button .profile_menu_info ul li:not(:last-child) {
    border-bottom: 1px solid #ccc
}

.profile_menu_button .profile_menu_info ul li {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: 1rem 0
}

.profile_menu_button .profile_menu_info ul li div:first-child {
    padding-left: 1rem
}

.profile_menu_button .profile_menu_info ul li .profile-button__icon {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.profile_menu_button .profile_menu_info ul li .profile-button__action {
    font-size: 0.9rem
}

.profile_menu_button .profile_menu_info ul li .profile-button__action h3 {
    font-size: 1rem;
    margin-bottom: 0.5rem
}

.profile_menu_button .profile_menu_info ul li .profile-button__action .edit {
    color: #3593d3
}

.profile_menu_button .profile_menu_info ul li div:first-child {
    padding-left: 1rem
}

.icon--order {
    width: 1.3rem;
    height: 1.6rem
}

a {
    color: #555
}

.profile_menu_button.logged_in:after {
    position: absolute;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #2b9938;
    border: 3px solid #fff;
    bottom: -0.0625rem;
    left: 5rem;
    content: ""
}

@media only screen and (max-width: 1050px) {
    .profile_menu_button .profile_menu_info.open {
        left: 0;
        top: -19rem
    }

    .profile_menu_button.logged_in:after {
        bottom: -6px;
        right: 0.89rem
    }
}

.section--feature .s-header {
    margin-bottom: 1.875rem
}

.section--feature .bus {
    margin-top: 2.5rem
}

.section--feature .card-f--vertical:not(.card-f--right) {
    max-height: 5.9375rem
}

.section--feature .card-f--vertical {
    padding: 0 1.25rem
}

@media only screen and (max-width: 800px) {
    .section--feature .card-f--vertical {
        padding: 0 .625rem
    }
}

@media only screen and (max-width: 500px) {
    .section--feature .card-f--vertical {
        padding: 0
    }
}

.section--feature .card-f--vertical:not(.card-f--right) .card-f__title {
    max-width: 7.5rem;
    font-family: IRANSans, tahoma, arial
}

.section--table .s-header {
    padding: 0px 12px
}

.section--table .row--35 [class*="col-"] {
    padding: 0 50px
}

.compare .card-f {
    position: relative;
    z-index: 2;
    padding: 1.25rem;
    background: transparent;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 800px) {
    .compare .card-f {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
        padding: 20px 10px
    }
}

@media only screen and (max-width: 800px) {
    .campare .bus li:first-of-type .card-f {
        padding-right: 1.25rem !important
    }
}

@media only screen and (max-width: 800px) {
    .bus li:last-of-type .card-f {
        padding-left: 1.25rem !important
    }
}

@media only screen and (max-width: 800px) {
    .compare .card-f__wrap {
        width: 100%
    }
}

.compare .card-f__img {
    margin-top: 0;
    opacity: 1;
    max-width: 3rem;
    filter: brightness(0.5)
}

.compare .bus li.active .card-f__img {
    filter: brightness(0) invert(1);
    opacity: 1
}

@media only screen and (max-width: 800px) {
    .compare .card-f__img {
        margin: 0 0 10px 0
    }
}

.compare .bus li.active .card-f__title {
    color: #fff
}

@media only screen and (max-width: 800px) {
    .compare .card-f__title {
        font-size: 14px
    }
}

@media only screen and (max-width: 800px) {
    .compare .card-f__title {
        font-size: 12px
    }
}

.compare .bus {
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.17);
    -ms-flex-align: stretch;
    align-items: stretch;
    background: #fff;
    border-radius: .25rem
}

@media only screen and (max-width: 800px) {
    .compare .bus {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

@media only screen and (max-width: 500px) {
    .compare .bus {
        border-radius: 0
    }
}

.compare .bus li {
    -ms-flex: 1;
    flex: 1;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: start;
    justify-content: flex-start;
    display: -ms-flexbox;
    display: flex;
    overflow: visible;
    width: 25%;
    cursor: pointer;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: background-color .15s linear
}

@media only screen and (max-width: 800px) {
    .compare .bus li {
        padding: 0;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

.compare .bus li:first-of-type {
    border-radius: 0 .25rem .25rem 0
}

.compare .bus li:last-of-type {
    border-radius: .25rem 0 0 .25rem
}

@media only screen and (min-width: 801px) {
    .compare .bus li:hover {
        background: #F2F2F2
    }
}

.compare .bus li::after {
    content: "";
    width: 100%;
    height: calc(100% + 15px);
    background: linear-gradient(45deg, #0078c8 -50%, #0032a0 150%);
    position: absolute;
    left: 0;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    opacity: 0;
    transition: opacity 0.15s linear
}

.compare .bus li:first-of-type::after {
    border-radius: 0 .25rem .25rem 0
}

.compare .bus li:last-of-type::after {
    border-radius: .25rem 0 0 .25rem
}

.compare .bus li.active::after {
    opacity: 1
}

.compare-wrap {
    position: relative;
    max-width: 74.375rem;
    margin: 0 auto;
    padding: 0 15px;
    z-index: 2;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 500px) {
    .compare-cards .compare-wrap {
        padding: 0
    }
}

.compare-cards {
    position: absolute;
    left: 0;
    right: 0;
    top: 3.75rem;
    margin: auto
}

@media only screen and (max-width: 800px) {
    .compare-cards {
        top: 30px
    }
}

@media only screen and (max-width: 500px) {
    .compare-cards {
        position: relative;
        top: 0
    }
}

.compare-footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 5.625rem;
    margin: auto;
    z-index: 2;
    text-align: justify;
    text-align-last: center;
    color: #fff;
    max-width: 47.5rem
}

@media only screen and (max-width: 800px) {
    .compare-footer {
        bottom: 30px;
        padding: 0 15px
    }
}

@media only screen and (max-width: 500px) {
    .compare-footer {
        font-size: 12px
    }
}

.compare-resize li, .compare-main li {
    display: none;
    position: relative;
    transition: transform .15s ease-in-out, opacity .15s linear
}

@media only screen and (min-width: 801px) {
    .compare-resize li, .compare-main li {
        min-height: 700px
    }
}

@media only screen and (min-width: 1051px) {
    .compare-resize li, .compare-main li {
        height: auto;
        max-height: 53.125rem
    }
}

@media only screen and (max-width: 800px) {
    .compare-resize li, .compare-main li {
        min-height: 600px
    }
}

@media only screen and (max-width: 500px) {
    .compare-resize li, .compare-main li {
        min-height: 400px
    }
}

.compare-resize li::after, .compare-main li::after {
    content: "";
    display: block;
    padding-top: 62%
}

.compare-resize li::before, .compare-main li::before {
    content: "";
    display: block;
    height: 50%;
    background: rgba(0, 0, 0, 0);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%);
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none
}

.compare-main {
    min-height: 25rem
}

@media only screen and (min-width: 801px) {
    .compare-main {
        min-height: 700px
    }
}

.compare.loaded .compare-main {
    min-height: 0
}

.compare-resize li {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%
}

.compare-slider {
    position: relative;
    width: 100%;
    overflow: hidden
}

.compare-resize {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 50%;
    overflow: hidden
}

.compare-handle {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 4px;
    margin-left: -2px;
    cursor: ew-resize
}

.compare-handle i {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    margin: auto;
    height: 46px;
    width: 46px;
    border-radius: 50%;
    border: 4px solid #fff;
    background: rgba(154, 154, 154, 0.3)
}

@media only screen and (max-width: 500px) {
    .compare-handle i {
        height: 36px;
        width: 36px;
        border: 3px solid #fff
    }
}

.compare-handle i svg {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 6px;
    height: 20px
}

@media only screen and (max-width: 500px) {
    .compare-handle i svg {
        width: 5px;
        height: 17px
    }
}

.compare-handle i svg:first-of-type {
    right: 4px
}

.compare-handle i svg:last-of-type {
    left: 4px;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    -ms-transform-origin: center center;
    transform-origin: center center
}

.compare-handle::after, .compare-handle::before {
    content: "";
    width: 100%;
    height: calc(50% - 23px);
    position: absolute;
    left: 0
}

.compare-handle::after {
    bottom: calc(50% + 23px);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 20%, #fff 100%)
}

@media only screen and (max-width: 500px) {
    .compare-handle::after {
        bottom: calc(50% + 18px)
    }
}

.compare-handle::before {
    top: calc(50% + 23px);
    background: linear-gradient(to top, rgba(255, 255, 255, 0) 30%, #fff 100%)
}

@media only screen and (max-width: 500px) {
    .compare-handle::before {
        top: calc(50% + 18px)
    }
}

.darkness-image {
    display: block;
    width: 90%;
    max-width: 34.375rem;
    height: auto
}

@media only screen and (max-width: 1050px) {
    .darkness-image {
        margin: 1.875rem auto
    }
}

@media only screen and (min-width: 1051px) {
    .darkness-wrap {
        max-width: 28.125rem
    }
}

.darkness-wrap .post {
    color: #fff
}

.darkness .flip-wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center
}

.darkness .bus {
    -ms-flex-align: inherit;
    align-items: inherit;
    margin-top: 3.75rem
}

.darkness .bus li {
    width: 50%
}

.darkness .bus li:first-of-type {
    padding-right: 0
}

.darkness .bus li:last-of-type {
    padding-left: 0
}

.darkness .bus li:first-of-type .card-f {
    padding-right: 0
}

.darkness .bus li:last-of-type .card-f {
    padding-left: 0
}

.features-image {
    position: relative
}

@media only screen and (max-width: 800px) {
    .features-image {
        margin: 0 auto
    }
}

@media only screen and (min-width: 801px) {
    .features-image {
        width: 90%
    }
}

.features-image--400 {
    max-width: 28.125rem
}

.features-image__img {
    display: block;
    width: 100%;
    height: auto
}

.position-right {
    background-position: 90%
}

.position-left {
    background-position: 10%
}

.page-productdetails .features {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: stretch;
    align-items: stretch;
    margin: 0 0 -30px
}

@media only screen and (max-width: 500px) {
    .page-productdetails .features {
        margin-bottom: -15px
    }
}

.page-productdetails .features li {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    margin-bottom: 30px
}

@media only screen and (max-width: 1050px) {
    .page-productdetails .features li {
        -ms-flex-preferred-size: 33.33%;
        flex-basis: 33.33%
    }
}

@media only screen and (max-width: 500px) {
    .page-productdetails .features li {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        margin-bottom: 15px
    }
}

.page-productdetails .features .card-f {
    display: -ms-flexbox;
    display: flex;
    max-width: 13.375rem;
    margin: 0 auto;
    transition: background .15s linear;
    padding: 2.5rem 1.5625rem;
    height: 100%;
    border-radius: .25rem
}

@media only screen and (min-width: 801px) {
    .page-productdetails .features .card-f:hover {
        background: #fff;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06)
    }
}

.page-productdetails .features .card-f__desc {
    white-space: normal
}

.visualization {
    margin-top: 4.375rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

@media only screen and (max-width: 600px) {
    .visualization {
        -ms-flex-direction: column;
        flex-direction: column;
        margin-top: 0
    }
}

.visualization-btn {
    position: absolute;
    bottom: 50%;
    right: 50%;
    display: -ms-flexbox;
    display: flex;
    height: 100px;
    width: 100px;
    border-radius: 100px;
    box-shadow: 0 3px 19px rgba(0, 0, 0, 0.1);
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    transition: box-shadow .2s linear;
    background: #fff;
    z-index: 2
}

@media only screen and (max-width: 1400px) {
    .visualization-btn {
        height: 90px;
        width: 90px
    }
}

@media only screen and (max-width: 800px) {
    .visualization-btn {
        height: 70px;
        width: 70px
    }
}

@media only screen and (max-width: 600px) {
    .visualization-btn {
        height: 50px;
        width: 50px
    }
}

@media only screen and (min-width: 601px) {
    .visualization-btn.plus {
        -ms-transform: translate(285px, 50%);
        transform: translate(285px, 50%)
    }
}

@media only screen and (min-width: 801px) {
    .visualization-btn.plus {
        -ms-transform: translate(380px, 50%);
        transform: translate(380px, 50%)
    }
}

@media only screen and (min-width: 1051px) {
    .visualization-btn.plus {
        -ms-transform: translate(450px, 50%);
        transform: translate(450px, 50%)
    }
}

@media only screen and (min-width: 1401px) {
    .visualization-btn.plus {
        -ms-transform: translate(600px, 50%);
        transform: translate(600px, 50%)
    }
}

@media only screen and (max-width: 600px) {
    .visualization-btn.plus {
        -ms-transform: translate(120px, 50%);
        transform: translate(120px, 50%)
    }
}

@media only screen and (min-width: 601px) {
    .visualization-btn.minus {
        right: auto;
        left: 50%;
        -ms-transform: translate(-285px, 50%);
        transform: translate(-285px, 50%)
    }
}

@media only screen and (min-width: 801px) {
    .visualization-btn.minus {
        -ms-transform: translate(-380px, 50%);
        transform: translate(-380px, 50%)
    }
}

@media only screen and (min-width: 1051px) {
    .visualization-btn.minus {
        -ms-transform: translate(-450px, 50%);
        transform: translate(-450px, 50%)
    }
}

@media only screen and (min-width: 1401px) {
    .visualization-btn.minus {
        -ms-transform: translate(-600px, 50%);
        transform: translate(-600px, 50%)
    }
}

@media only screen and (max-width: 600px) {
    .visualization-btn.minus {
        -ms-transform: translate(-70px, 50%);
        transform: translate(-70px, 50%)
    }
}

.visualization-btn:active, .visualization-btn.nice-select.open {
    margin-bottom: -2px
}

.visualization-btn:hover {
    box-shadow: 0 3px 25px rgba(0, 0, 0, 0.15)
}

.visualization-btn.plus svg {
    height: 50%;
    width: 50%;
    fill: #00a03c
}

.visualization-btn.minus svg {
    width: 50%;
    height: .3125rem;
    fill: #f47648
}

.visualization-main {
    position: relative
}

.visualization-image {
    position: relative;
    width: 450px;
    height: 450px;
    border-radius: 50%;
    padding: 0
}

.visualization-image > li {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -4px;
    margin-top: -4px;
    width: 8px;
    height: 8px
}

.visualization-image > li:nth-of-type(1) {
    -ms-transform: rotate(0deg) translate(225px) rotate(90deg);
    transform: rotate(0deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(2) {
    -ms-transform: rotate(6deg) translate(225px) rotate(90deg);
    transform: rotate(6deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(3) {
    -ms-transform: rotate(12deg) translate(225px) rotate(90deg);
    transform: rotate(12deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(4) {
    -ms-transform: rotate(18deg) translate(225px) rotate(90deg);
    transform: rotate(18deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(5) {
    -ms-transform: rotate(24deg) translate(225px) rotate(90deg);
    transform: rotate(24deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(6) {
    -ms-transform: rotate(30deg) translate(225px) rotate(90deg);
    transform: rotate(30deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(7) {
    -ms-transform: rotate(36deg) translate(225px) rotate(90deg);
    transform: rotate(36deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(8) {
    -ms-transform: rotate(42deg) translate(225px) rotate(90deg);
    transform: rotate(42deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(9) {
    -ms-transform: rotate(48deg) translate(225px) rotate(90deg);
    transform: rotate(48deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(10) {
    -ms-transform: rotate(54deg) translate(225px) rotate(90deg);
    transform: rotate(54deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(11) {
    -ms-transform: rotate(60deg) translate(225px) rotate(90deg);
    transform: rotate(60deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(12) {
    -ms-transform: rotate(66deg) translate(225px) rotate(90deg);
    transform: rotate(66deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(13) {
    -ms-transform: rotate(72deg) translate(225px) rotate(90deg);
    transform: rotate(72deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(14) {
    -ms-transform: rotate(78deg) translate(225px) rotate(90deg);
    transform: rotate(78deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(15) {
    -ms-transform: rotate(84deg) translate(225px) rotate(90deg);
    transform: rotate(84deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(16) {
    -ms-transform: rotate(90deg) translate(225px) rotate(90deg);
    transform: rotate(90deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(17) {
    -ms-transform: rotate(96deg) translate(225px) rotate(90deg);
    transform: rotate(96deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(18) {
    -ms-transform: rotate(102deg) translate(225px) rotate(90deg);
    transform: rotate(102deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(19) {
    -ms-transform: rotate(108deg) translate(225px) rotate(90deg);
    transform: rotate(108deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(20) {
    -ms-transform: rotate(114deg) translate(225px) rotate(90deg);
    transform: rotate(114deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(21) {
    -ms-transform: rotate(120deg) translate(225px) rotate(90deg);
    transform: rotate(120deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(22) {
    -ms-transform: rotate(126deg) translate(225px) rotate(90deg);
    transform: rotate(126deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(23) {
    -ms-transform: rotate(132deg) translate(225px) rotate(90deg);
    transform: rotate(132deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(24) {
    -ms-transform: rotate(138deg) translate(225px) rotate(90deg);
    transform: rotate(138deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(25) {
    -ms-transform: rotate(144deg) translate(225px) rotate(90deg);
    transform: rotate(144deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(26) {
    -ms-transform: rotate(150deg) translate(225px) rotate(90deg);
    transform: rotate(150deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(27) {
    -ms-transform: rotate(156deg) translate(225px) rotate(90deg);
    transform: rotate(156deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(28) {
    -ms-transform: rotate(162deg) translate(225px) rotate(90deg);
    transform: rotate(162deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(29) {
    -ms-transform: rotate(168deg) translate(225px) rotate(90deg);
    transform: rotate(168deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(30) {
    -ms-transform: rotate(174deg) translate(225px) rotate(90deg);
    transform: rotate(174deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(31) {
    -ms-transform: rotate(180deg) translate(225px) rotate(90deg);
    transform: rotate(180deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(32) {
    -ms-transform: rotate(186deg) translate(225px) rotate(90deg);
    transform: rotate(186deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(33) {
    -ms-transform: rotate(192deg) translate(225px) rotate(90deg);
    transform: rotate(192deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(34) {
    -ms-transform: rotate(198deg) translate(225px) rotate(90deg);
    transform: rotate(198deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(35) {
    -ms-transform: rotate(204deg) translate(225px) rotate(90deg);
    transform: rotate(204deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(36) {
    -ms-transform: rotate(210deg) translate(225px) rotate(90deg);
    transform: rotate(210deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(37) {
    -ms-transform: rotate(216deg) translate(225px) rotate(90deg);
    transform: rotate(216deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(38) {
    -ms-transform: rotate(222deg) translate(225px) rotate(90deg);
    transform: rotate(222deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(39) {
    -ms-transform: rotate(228deg) translate(225px) rotate(90deg);
    transform: rotate(228deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(40) {
    -ms-transform: rotate(234deg) translate(225px) rotate(90deg);
    transform: rotate(234deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(41) {
    -ms-transform: rotate(240deg) translate(225px) rotate(90deg);
    transform: rotate(240deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(42) {
    -ms-transform: rotate(246deg) translate(225px) rotate(90deg);
    transform: rotate(246deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(43) {
    -ms-transform: rotate(252deg) translate(225px) rotate(90deg);
    transform: rotate(252deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(44) {
    -ms-transform: rotate(258deg) translate(225px) rotate(90deg);
    transform: rotate(258deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(45) {
    -ms-transform: rotate(264deg) translate(225px) rotate(90deg);
    transform: rotate(264deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(46) {
    -ms-transform: rotate(270deg) translate(225px) rotate(90deg);
    transform: rotate(270deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(47) {
    -ms-transform: rotate(276deg) translate(225px) rotate(90deg);
    transform: rotate(276deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(48) {
    -ms-transform: rotate(282deg) translate(225px) rotate(90deg);
    transform: rotate(282deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(49) {
    -ms-transform: rotate(288deg) translate(225px) rotate(90deg);
    transform: rotate(288deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(50) {
    -ms-transform: rotate(294deg) translate(225px) rotate(90deg);
    transform: rotate(294deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(51) {
    -ms-transform: rotate(300deg) translate(225px) rotate(90deg);
    transform: rotate(300deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(52) {
    -ms-transform: rotate(306deg) translate(225px) rotate(90deg);
    transform: rotate(306deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(53) {
    -ms-transform: rotate(312deg) translate(225px) rotate(90deg);
    transform: rotate(312deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(54) {
    -ms-transform: rotate(318deg) translate(225px) rotate(90deg);
    transform: rotate(318deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(55) {
    -ms-transform: rotate(324deg) translate(225px) rotate(90deg);
    transform: rotate(324deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(56) {
    -ms-transform: rotate(330deg) translate(225px) rotate(90deg);
    transform: rotate(330deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(57) {
    -ms-transform: rotate(336deg) translate(225px) rotate(90deg);
    transform: rotate(336deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(58) {
    -ms-transform: rotate(342deg) translate(225px) rotate(90deg);
    transform: rotate(342deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(59) {
    -ms-transform: rotate(348deg) translate(225px) rotate(90deg);
    transform: rotate(348deg) translate(225px) rotate(90deg)
}

.visualization-image > li:nth-of-type(60) {
    -ms-transform: rotate(354deg) translate(225px) rotate(90deg);
    transform: rotate(354deg) translate(225px) rotate(90deg)
}

@media only screen and (min-width: 1401px) {
    .visualization-image {
        width: 620px;
        height: 620px;
        border-radius: 50%;
        padding: 0
    }

    .visualization-image > li {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -5px;
        margin-top: -5px;
        width: 10px;
        height: 10px
    }

    .visualization-image > li:nth-of-type(1) {
        -ms-transform: rotate(0deg) translate(310px) rotate(90deg);
        transform: rotate(0deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(2) {
        -ms-transform: rotate(6deg) translate(310px) rotate(90deg);
        transform: rotate(6deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(3) {
        -ms-transform: rotate(12deg) translate(310px) rotate(90deg);
        transform: rotate(12deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(4) {
        -ms-transform: rotate(18deg) translate(310px) rotate(90deg);
        transform: rotate(18deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(5) {
        -ms-transform: rotate(24deg) translate(310px) rotate(90deg);
        transform: rotate(24deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(6) {
        -ms-transform: rotate(30deg) translate(310px) rotate(90deg);
        transform: rotate(30deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(7) {
        -ms-transform: rotate(36deg) translate(310px) rotate(90deg);
        transform: rotate(36deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(8) {
        -ms-transform: rotate(42deg) translate(310px) rotate(90deg);
        transform: rotate(42deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(9) {
        -ms-transform: rotate(48deg) translate(310px) rotate(90deg);
        transform: rotate(48deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(10) {
        -ms-transform: rotate(54deg) translate(310px) rotate(90deg);
        transform: rotate(54deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(11) {
        -ms-transform: rotate(60deg) translate(310px) rotate(90deg);
        transform: rotate(60deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(12) {
        -ms-transform: rotate(66deg) translate(310px) rotate(90deg);
        transform: rotate(66deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(13) {
        -ms-transform: rotate(72deg) translate(310px) rotate(90deg);
        transform: rotate(72deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(14) {
        -ms-transform: rotate(78deg) translate(310px) rotate(90deg);
        transform: rotate(78deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(15) {
        -ms-transform: rotate(84deg) translate(310px) rotate(90deg);
        transform: rotate(84deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(16) {
        -ms-transform: rotate(90deg) translate(310px) rotate(90deg);
        transform: rotate(90deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(17) {
        -ms-transform: rotate(96deg) translate(310px) rotate(90deg);
        transform: rotate(96deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(18) {
        -ms-transform: rotate(102deg) translate(310px) rotate(90deg);
        transform: rotate(102deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(19) {
        -ms-transform: rotate(108deg) translate(310px) rotate(90deg);
        transform: rotate(108deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(20) {
        -ms-transform: rotate(114deg) translate(310px) rotate(90deg);
        transform: rotate(114deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(21) {
        -ms-transform: rotate(120deg) translate(310px) rotate(90deg);
        transform: rotate(120deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(22) {
        -ms-transform: rotate(126deg) translate(310px) rotate(90deg);
        transform: rotate(126deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(23) {
        -ms-transform: rotate(132deg) translate(310px) rotate(90deg);
        transform: rotate(132deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(24) {
        -ms-transform: rotate(138deg) translate(310px) rotate(90deg);
        transform: rotate(138deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(25) {
        -ms-transform: rotate(144deg) translate(310px) rotate(90deg);
        transform: rotate(144deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(26) {
        -ms-transform: rotate(150deg) translate(310px) rotate(90deg);
        transform: rotate(150deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(27) {
        -ms-transform: rotate(156deg) translate(310px) rotate(90deg);
        transform: rotate(156deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(28) {
        -ms-transform: rotate(162deg) translate(310px) rotate(90deg);
        transform: rotate(162deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(29) {
        -ms-transform: rotate(168deg) translate(310px) rotate(90deg);
        transform: rotate(168deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(30) {
        -ms-transform: rotate(174deg) translate(310px) rotate(90deg);
        transform: rotate(174deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(31) {
        -ms-transform: rotate(180deg) translate(310px) rotate(90deg);
        transform: rotate(180deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(32) {
        -ms-transform: rotate(186deg) translate(310px) rotate(90deg);
        transform: rotate(186deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(33) {
        -ms-transform: rotate(192deg) translate(310px) rotate(90deg);
        transform: rotate(192deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(34) {
        -ms-transform: rotate(198deg) translate(310px) rotate(90deg);
        transform: rotate(198deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(35) {
        -ms-transform: rotate(204deg) translate(310px) rotate(90deg);
        transform: rotate(204deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(36) {
        -ms-transform: rotate(210deg) translate(310px) rotate(90deg);
        transform: rotate(210deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(37) {
        -ms-transform: rotate(216deg) translate(310px) rotate(90deg);
        transform: rotate(216deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(38) {
        -ms-transform: rotate(222deg) translate(310px) rotate(90deg);
        transform: rotate(222deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(39) {
        -ms-transform: rotate(228deg) translate(310px) rotate(90deg);
        transform: rotate(228deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(40) {
        -ms-transform: rotate(234deg) translate(310px) rotate(90deg);
        transform: rotate(234deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(41) {
        -ms-transform: rotate(240deg) translate(310px) rotate(90deg);
        transform: rotate(240deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(42) {
        -ms-transform: rotate(246deg) translate(310px) rotate(90deg);
        transform: rotate(246deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(43) {
        -ms-transform: rotate(252deg) translate(310px) rotate(90deg);
        transform: rotate(252deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(44) {
        -ms-transform: rotate(258deg) translate(310px) rotate(90deg);
        transform: rotate(258deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(45) {
        -ms-transform: rotate(264deg) translate(310px) rotate(90deg);
        transform: rotate(264deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(46) {
        -ms-transform: rotate(270deg) translate(310px) rotate(90deg);
        transform: rotate(270deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(47) {
        -ms-transform: rotate(276deg) translate(310px) rotate(90deg);
        transform: rotate(276deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(48) {
        -ms-transform: rotate(282deg) translate(310px) rotate(90deg);
        transform: rotate(282deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(49) {
        -ms-transform: rotate(288deg) translate(310px) rotate(90deg);
        transform: rotate(288deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(50) {
        -ms-transform: rotate(294deg) translate(310px) rotate(90deg);
        transform: rotate(294deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(51) {
        -ms-transform: rotate(300deg) translate(310px) rotate(90deg);
        transform: rotate(300deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(52) {
        -ms-transform: rotate(306deg) translate(310px) rotate(90deg);
        transform: rotate(306deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(53) {
        -ms-transform: rotate(312deg) translate(310px) rotate(90deg);
        transform: rotate(312deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(54) {
        -ms-transform: rotate(318deg) translate(310px) rotate(90deg);
        transform: rotate(318deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(55) {
        -ms-transform: rotate(324deg) translate(310px) rotate(90deg);
        transform: rotate(324deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(56) {
        -ms-transform: rotate(330deg) translate(310px) rotate(90deg);
        transform: rotate(330deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(57) {
        -ms-transform: rotate(336deg) translate(310px) rotate(90deg);
        transform: rotate(336deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(58) {
        -ms-transform: rotate(342deg) translate(310px) rotate(90deg);
        transform: rotate(342deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(59) {
        -ms-transform: rotate(348deg) translate(310px) rotate(90deg);
        transform: rotate(348deg) translate(310px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(60) {
        -ms-transform: rotate(354deg) translate(310px) rotate(90deg);
        transform: rotate(354deg) translate(310px) rotate(90deg)
    }
}

@media only screen and (max-width: 800px) {
    .visualization-image {
        width: 370px;
        height: 370px;
        border-radius: 50%;
        padding: 0
    }

    .visualization-image > li {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -3.5px;
        margin-top: -3.5px;
        width: 7px;
        height: 7px
    }

    .visualization-image > li:nth-of-type(1) {
        -ms-transform: rotate(0deg) translate(185px) rotate(90deg);
        transform: rotate(0deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(2) {
        -ms-transform: rotate(6deg) translate(185px) rotate(90deg);
        transform: rotate(6deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(3) {
        -ms-transform: rotate(12deg) translate(185px) rotate(90deg);
        transform: rotate(12deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(4) {
        -ms-transform: rotate(18deg) translate(185px) rotate(90deg);
        transform: rotate(18deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(5) {
        -ms-transform: rotate(24deg) translate(185px) rotate(90deg);
        transform: rotate(24deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(6) {
        -ms-transform: rotate(30deg) translate(185px) rotate(90deg);
        transform: rotate(30deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(7) {
        -ms-transform: rotate(36deg) translate(185px) rotate(90deg);
        transform: rotate(36deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(8) {
        -ms-transform: rotate(42deg) translate(185px) rotate(90deg);
        transform: rotate(42deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(9) {
        -ms-transform: rotate(48deg) translate(185px) rotate(90deg);
        transform: rotate(48deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(10) {
        -ms-transform: rotate(54deg) translate(185px) rotate(90deg);
        transform: rotate(54deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(11) {
        -ms-transform: rotate(60deg) translate(185px) rotate(90deg);
        transform: rotate(60deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(12) {
        -ms-transform: rotate(66deg) translate(185px) rotate(90deg);
        transform: rotate(66deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(13) {
        -ms-transform: rotate(72deg) translate(185px) rotate(90deg);
        transform: rotate(72deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(14) {
        -ms-transform: rotate(78deg) translate(185px) rotate(90deg);
        transform: rotate(78deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(15) {
        -ms-transform: rotate(84deg) translate(185px) rotate(90deg);
        transform: rotate(84deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(16) {
        -ms-transform: rotate(90deg) translate(185px) rotate(90deg);
        transform: rotate(90deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(17) {
        -ms-transform: rotate(96deg) translate(185px) rotate(90deg);
        transform: rotate(96deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(18) {
        -ms-transform: rotate(102deg) translate(185px) rotate(90deg);
        transform: rotate(102deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(19) {
        -ms-transform: rotate(108deg) translate(185px) rotate(90deg);
        transform: rotate(108deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(20) {
        -ms-transform: rotate(114deg) translate(185px) rotate(90deg);
        transform: rotate(114deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(21) {
        -ms-transform: rotate(120deg) translate(185px) rotate(90deg);
        transform: rotate(120deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(22) {
        -ms-transform: rotate(126deg) translate(185px) rotate(90deg);
        transform: rotate(126deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(23) {
        -ms-transform: rotate(132deg) translate(185px) rotate(90deg);
        transform: rotate(132deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(24) {
        -ms-transform: rotate(138deg) translate(185px) rotate(90deg);
        transform: rotate(138deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(25) {
        -ms-transform: rotate(144deg) translate(185px) rotate(90deg);
        transform: rotate(144deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(26) {
        -ms-transform: rotate(150deg) translate(185px) rotate(90deg);
        transform: rotate(150deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(27) {
        -ms-transform: rotate(156deg) translate(185px) rotate(90deg);
        transform: rotate(156deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(28) {
        -ms-transform: rotate(162deg) translate(185px) rotate(90deg);
        transform: rotate(162deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(29) {
        -ms-transform: rotate(168deg) translate(185px) rotate(90deg);
        transform: rotate(168deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(30) {
        -ms-transform: rotate(174deg) translate(185px) rotate(90deg);
        transform: rotate(174deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(31) {
        -ms-transform: rotate(180deg) translate(185px) rotate(90deg);
        transform: rotate(180deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(32) {
        -ms-transform: rotate(186deg) translate(185px) rotate(90deg);
        transform: rotate(186deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(33) {
        -ms-transform: rotate(192deg) translate(185px) rotate(90deg);
        transform: rotate(192deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(34) {
        -ms-transform: rotate(198deg) translate(185px) rotate(90deg);
        transform: rotate(198deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(35) {
        -ms-transform: rotate(204deg) translate(185px) rotate(90deg);
        transform: rotate(204deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(36) {
        -ms-transform: rotate(210deg) translate(185px) rotate(90deg);
        transform: rotate(210deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(37) {
        -ms-transform: rotate(216deg) translate(185px) rotate(90deg);
        transform: rotate(216deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(38) {
        -ms-transform: rotate(222deg) translate(185px) rotate(90deg);
        transform: rotate(222deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(39) {
        -ms-transform: rotate(228deg) translate(185px) rotate(90deg);
        transform: rotate(228deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(40) {
        -ms-transform: rotate(234deg) translate(185px) rotate(90deg);
        transform: rotate(234deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(41) {
        -ms-transform: rotate(240deg) translate(185px) rotate(90deg);
        transform: rotate(240deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(42) {
        -ms-transform: rotate(246deg) translate(185px) rotate(90deg);
        transform: rotate(246deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(43) {
        -ms-transform: rotate(252deg) translate(185px) rotate(90deg);
        transform: rotate(252deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(44) {
        -ms-transform: rotate(258deg) translate(185px) rotate(90deg);
        transform: rotate(258deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(45) {
        -ms-transform: rotate(264deg) translate(185px) rotate(90deg);
        transform: rotate(264deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(46) {
        -ms-transform: rotate(270deg) translate(185px) rotate(90deg);
        transform: rotate(270deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(47) {
        -ms-transform: rotate(276deg) translate(185px) rotate(90deg);
        transform: rotate(276deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(48) {
        -ms-transform: rotate(282deg) translate(185px) rotate(90deg);
        transform: rotate(282deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(49) {
        -ms-transform: rotate(288deg) translate(185px) rotate(90deg);
        transform: rotate(288deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(50) {
        -ms-transform: rotate(294deg) translate(185px) rotate(90deg);
        transform: rotate(294deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(51) {
        -ms-transform: rotate(300deg) translate(185px) rotate(90deg);
        transform: rotate(300deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(52) {
        -ms-transform: rotate(306deg) translate(185px) rotate(90deg);
        transform: rotate(306deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(53) {
        -ms-transform: rotate(312deg) translate(185px) rotate(90deg);
        transform: rotate(312deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(54) {
        -ms-transform: rotate(318deg) translate(185px) rotate(90deg);
        transform: rotate(318deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(55) {
        -ms-transform: rotate(324deg) translate(185px) rotate(90deg);
        transform: rotate(324deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(56) {
        -ms-transform: rotate(330deg) translate(185px) rotate(90deg);
        transform: rotate(330deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(57) {
        -ms-transform: rotate(336deg) translate(185px) rotate(90deg);
        transform: rotate(336deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(58) {
        -ms-transform: rotate(342deg) translate(185px) rotate(90deg);
        transform: rotate(342deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(59) {
        -ms-transform: rotate(348deg) translate(185px) rotate(90deg);
        transform: rotate(348deg) translate(185px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(60) {
        -ms-transform: rotate(354deg) translate(185px) rotate(90deg);
        transform: rotate(354deg) translate(185px) rotate(90deg)
    }
}

@media only screen and (max-width: 600px) {
    .visualization-image {
        width: 200px;
        height: 200px;
        border-radius: 50%;
        padding: 0;
        margin: 0 auto
    }

    .visualization-image > li {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -2px;
        margin-top: -2px;
        width: 4px;
        height: 4px
    }

    .visualization-image > li:nth-of-type(1) {
        -ms-transform: rotate(0deg) translate(100px) rotate(90deg);
        transform: rotate(0deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(2) {
        -ms-transform: rotate(6deg) translate(100px) rotate(90deg);
        transform: rotate(6deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(3) {
        -ms-transform: rotate(12deg) translate(100px) rotate(90deg);
        transform: rotate(12deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(4) {
        -ms-transform: rotate(18deg) translate(100px) rotate(90deg);
        transform: rotate(18deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(5) {
        -ms-transform: rotate(24deg) translate(100px) rotate(90deg);
        transform: rotate(24deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(6) {
        -ms-transform: rotate(30deg) translate(100px) rotate(90deg);
        transform: rotate(30deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(7) {
        -ms-transform: rotate(36deg) translate(100px) rotate(90deg);
        transform: rotate(36deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(8) {
        -ms-transform: rotate(42deg) translate(100px) rotate(90deg);
        transform: rotate(42deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(9) {
        -ms-transform: rotate(48deg) translate(100px) rotate(90deg);
        transform: rotate(48deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(10) {
        -ms-transform: rotate(54deg) translate(100px) rotate(90deg);
        transform: rotate(54deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(11) {
        -ms-transform: rotate(60deg) translate(100px) rotate(90deg);
        transform: rotate(60deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(12) {
        -ms-transform: rotate(66deg) translate(100px) rotate(90deg);
        transform: rotate(66deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(13) {
        -ms-transform: rotate(72deg) translate(100px) rotate(90deg);
        transform: rotate(72deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(14) {
        -ms-transform: rotate(78deg) translate(100px) rotate(90deg);
        transform: rotate(78deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(15) {
        -ms-transform: rotate(84deg) translate(100px) rotate(90deg);
        transform: rotate(84deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(16) {
        -ms-transform: rotate(90deg) translate(100px) rotate(90deg);
        transform: rotate(90deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(17) {
        -ms-transform: rotate(96deg) translate(100px) rotate(90deg);
        transform: rotate(96deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(18) {
        -ms-transform: rotate(102deg) translate(100px) rotate(90deg);
        transform: rotate(102deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(19) {
        -ms-transform: rotate(108deg) translate(100px) rotate(90deg);
        transform: rotate(108deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(20) {
        -ms-transform: rotate(114deg) translate(100px) rotate(90deg);
        transform: rotate(114deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(21) {
        -ms-transform: rotate(120deg) translate(100px) rotate(90deg);
        transform: rotate(120deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(22) {
        -ms-transform: rotate(126deg) translate(100px) rotate(90deg);
        transform: rotate(126deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(23) {
        -ms-transform: rotate(132deg) translate(100px) rotate(90deg);
        transform: rotate(132deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(24) {
        -ms-transform: rotate(138deg) translate(100px) rotate(90deg);
        transform: rotate(138deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(25) {
        -ms-transform: rotate(144deg) translate(100px) rotate(90deg);
        transform: rotate(144deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(26) {
        -ms-transform: rotate(150deg) translate(100px) rotate(90deg);
        transform: rotate(150deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(27) {
        -ms-transform: rotate(156deg) translate(100px) rotate(90deg);
        transform: rotate(156deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(28) {
        -ms-transform: rotate(162deg) translate(100px) rotate(90deg);
        transform: rotate(162deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(29) {
        -ms-transform: rotate(168deg) translate(100px) rotate(90deg);
        transform: rotate(168deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(30) {
        -ms-transform: rotate(174deg) translate(100px) rotate(90deg);
        transform: rotate(174deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(31) {
        -ms-transform: rotate(180deg) translate(100px) rotate(90deg);
        transform: rotate(180deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(32) {
        -ms-transform: rotate(186deg) translate(100px) rotate(90deg);
        transform: rotate(186deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(33) {
        -ms-transform: rotate(192deg) translate(100px) rotate(90deg);
        transform: rotate(192deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(34) {
        -ms-transform: rotate(198deg) translate(100px) rotate(90deg);
        transform: rotate(198deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(35) {
        -ms-transform: rotate(204deg) translate(100px) rotate(90deg);
        transform: rotate(204deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(36) {
        -ms-transform: rotate(210deg) translate(100px) rotate(90deg);
        transform: rotate(210deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(37) {
        -ms-transform: rotate(216deg) translate(100px) rotate(90deg);
        transform: rotate(216deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(38) {
        -ms-transform: rotate(222deg) translate(100px) rotate(90deg);
        transform: rotate(222deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(39) {
        -ms-transform: rotate(228deg) translate(100px) rotate(90deg);
        transform: rotate(228deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(40) {
        -ms-transform: rotate(234deg) translate(100px) rotate(90deg);
        transform: rotate(234deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(41) {
        -ms-transform: rotate(240deg) translate(100px) rotate(90deg);
        transform: rotate(240deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(42) {
        -ms-transform: rotate(246deg) translate(100px) rotate(90deg);
        transform: rotate(246deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(43) {
        -ms-transform: rotate(252deg) translate(100px) rotate(90deg);
        transform: rotate(252deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(44) {
        -ms-transform: rotate(258deg) translate(100px) rotate(90deg);
        transform: rotate(258deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(45) {
        -ms-transform: rotate(264deg) translate(100px) rotate(90deg);
        transform: rotate(264deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(46) {
        -ms-transform: rotate(270deg) translate(100px) rotate(90deg);
        transform: rotate(270deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(47) {
        -ms-transform: rotate(276deg) translate(100px) rotate(90deg);
        transform: rotate(276deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(48) {
        -ms-transform: rotate(282deg) translate(100px) rotate(90deg);
        transform: rotate(282deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(49) {
        -ms-transform: rotate(288deg) translate(100px) rotate(90deg);
        transform: rotate(288deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(50) {
        -ms-transform: rotate(294deg) translate(100px) rotate(90deg);
        transform: rotate(294deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(51) {
        -ms-transform: rotate(300deg) translate(100px) rotate(90deg);
        transform: rotate(300deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(52) {
        -ms-transform: rotate(306deg) translate(100px) rotate(90deg);
        transform: rotate(306deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(53) {
        -ms-transform: rotate(312deg) translate(100px) rotate(90deg);
        transform: rotate(312deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(54) {
        -ms-transform: rotate(318deg) translate(100px) rotate(90deg);
        transform: rotate(318deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(55) {
        -ms-transform: rotate(324deg) translate(100px) rotate(90deg);
        transform: rotate(324deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(56) {
        -ms-transform: rotate(330deg) translate(100px) rotate(90deg);
        transform: rotate(330deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(57) {
        -ms-transform: rotate(336deg) translate(100px) rotate(90deg);
        transform: rotate(336deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(58) {
        -ms-transform: rotate(342deg) translate(100px) rotate(90deg);
        transform: rotate(342deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(59) {
        -ms-transform: rotate(348deg) translate(100px) rotate(90deg);
        transform: rotate(348deg) translate(100px) rotate(90deg)
    }

    .visualization-image > li:nth-of-type(60) {
        -ms-transform: rotate(354deg) translate(100px) rotate(90deg);
        transform: rotate(354deg) translate(100px) rotate(90deg)
    }
}

.visualization-image li i {
    position: absolute;
    left: 0;
    bottom: 0;
    display: block;
    width: 100%
}

.visualization-image li span {
    display: block;
    width: 100%;
    height: 25px;
    background: #b2b2b2;
    border-radius: 10px 10px 0 0
}

@media only screen and (max-width: 600px) {
    .visualization-image li span {
        height: 8px
    }
}

.visualization-image li:nth-of-type(6) span {
    height: 50px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 200%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(6) span {
        height: 20px
    }
}

.visualization-image li:nth-of-type(7) span {
    height: 80px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 170%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(7) span {
        height: 30px
    }
}

.visualization-image li:nth-of-type(8) span {
    height: 90px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 160%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(8) span {
        height: 40px
    }
}

.visualization-image li:nth-of-type(9) span {
    height: 70px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 150%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(9) span {
        height: 25px
    }
}

.visualization-image li:nth-of-type(10) span {
    height: 50px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 140%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(10) span {
        height: 20px
    }
}

.visualization-image li:nth-of-type(22) span {
    height: 50px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 250%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(22) span {
        height: 20px
    }
}

.visualization-image li:nth-of-type(23) span {
    height: 80px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 230%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(23) span {
        height: 30px
    }
}

.visualization-image li:nth-of-type(24) span {
    height: 90px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 200%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(24) span {
        height: 35px
    }
}

.visualization-image li:nth-of-type(25) span {
    height: 70px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 130%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(25) span {
        height: 25px
    }
}

.visualization-image li:nth-of-type(26) span {
    height: 50px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 100%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(26) span {
        height: 20px
    }
}

.visualization-image li:nth-of-type(27) span {
    height: 35px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 80%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(27) span {
        height: 15px
    }
}

.visualization-image li:nth-of-type(38) span {
    height: 50px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 80%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(38) span {
        height: 15px
    }
}

.visualization-image li:nth-of-type(39) span {
    height: 70px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 100%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(39) span {
        height: 25px
    }
}

.visualization-image li:nth-of-type(40) span {
    height: 80px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 200%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(40) span {
        height: 30px
    }
}

.visualization-image li:nth-of-type(41) span {
    height: 100px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 130%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(41) span {
        height: 40px
    }
}

.visualization-image li:nth-of-type(42) span {
    height: 60px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 180%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(42) span {
        height: 20px
    }
}

.visualization-image li:nth-of-type(45) span {
    height: 50px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 80%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(45) span {
        height: 20px
    }
}

.visualization-image li:nth-of-type(46) span {
    height: 80px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 150%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(46) span {
        height: 30px
    }
}

.visualization-image li:nth-of-type(47) span {
    height: 50px;
    background: linear-gradient(0deg, #78be1e -50%, #00bee6 230%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(47) span {
        height: 20px
    }
}

.visualization-image li:nth-of-type(50) span {
    height: 50px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 80%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(50) span {
        height: 20px
    }
}

.visualization-image li:nth-of-type(51) span {
    height: 70px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 100%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(51) span {
        height: 35px
    }
}

.visualization-image li:nth-of-type(52) span {
    height: 55px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 200%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(52) span {
        height: 25px
    }
}

.visualization-image li:nth-of-type(53) span {
    height: 50px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 130%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(53) span {
        height: 20px
    }
}

.visualization-image li:nth-of-type(54) span {
    height: 40px;
    background: linear-gradient(180deg, #78be1e -50%, #00bee6 180%)
}

@media only screen and (max-width: 600px) {
    .visualization-image li:nth-of-type(54) span {
        height: 15px
    }
}

.visualization-image svg {
    overflow: visible
}

.visualization-content {
    color: #999;
    z-index: 2;
    text-align: justify;
    font-size: .875rem
}

@media only screen and (min-width: 1401px) {
    .visualization-content {
        font-size: 1rem
    }
}

@media only screen and (min-width: 601px) {
    .visualization-content {
        position: absolute;
        left: 50%;
        top: 50%;
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        max-width: 200px
    }
}

@media only screen and (min-width: 801px) {
    .visualization-content {
        max-width: 15.625rem
    }
}

@media only screen and (min-width: 1401px) {
    .visualization-content {
        max-width: 21.875rem
    }
}

@media only screen and (max-width: 600px) {
    .visualization-content {
        margin-bottom: 70px
    }
}

@media only screen and (max-width: 800px) {
    .visualization-content {
        font-size: .8125rem
    }
}

.visualization .s-header {
    margin-bottom: .9375rem
}

.visualization .s-subtitle {
    line-height: 0
}

.visualization .s-subtitle img {
    width: 7.8125rem;
    height: 1.6875rem
}

@media only screen and (max-width: 1400px) {
    .visualization .s-subtitle img {
        width: 6.875rem;
        height: 1.5rem
    }
}

.visualization .s-title {
    font-size: 1.25rem
}

@media only screen and (min-width: 1401px) {
    .visualization .s-title {
        font-size: 1.5rem
    }
}

@media only screen and (max-width: 1050px) {
    .visualization .s-title {
        font-size: 1.125rem
    }
}

@media only screen and (max-width: 800px) {
    .visualization .s-title {
        font-size: 1rem
    }
}

@media only screen and (min-width: 801px) {
    .section--360 .flip-wrap {
        padding-left: 1.875rem
    }
}

@media only screen and (min-width: 801px) {
    .section--360 .flip-alone {
        padding-right: 3.75rem
    }
}

@media only screen and (max-width: 800px) {
    .section--360 .flip-alone {
        margin-top: 3.125rem
    }
}

.waterusage {
    height: 200vh;
    overflow: hidden
}

@media only screen and (max-width: 600px) {
    .waterusage {
        height: 150vh
    }
}

.waterusage-center {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-right: -27.5rem;
    transition: margin .3s ease-in-out
}

@media only screen and (max-width: 800px) {
    .waterusage-center {
        margin-right: -320px
    }
}

@media only screen and (max-width: 600px) {
    .waterusage-center {
        -ms-flex-direction: column;
        flex-direction: column;
        margin-right: 0
    }
}

.waterusage.max-water .waterusage-center {
    margin-right: 0
}

.waterusage-content {
    width: 27.5rem;
    padding-left: 3.75rem
}

@media only screen and (max-width: 800px) {
    .waterusage-content {
        width: 340px;
        font-size: .8125rem
    }
}

@media only screen and (max-width: 600px) {
    .waterusage-content {
        -ms-flex-order: 2;
        order: 2;
        padding: 0 15px;
        width: 100%
    }
}

.waterusage .s-title {
    font-size: 1.5rem
}

@media only screen and (max-width: 1050px) {
    .waterusage .s-title {
        font-size: 1.25rem
    }
}

@media only screen and (max-width: 800px) {
    .waterusage .s-title {
        font-size: 1.125rem
    }
}

@media only screen and (max-width: 600px) {
    .waterusage .s-title {
        margin-top: 30px
    }
}

.waterusage.max-water .s-subtitle {
    transition-delay: .1s
}

.waterusage-text {
    margin: 1.875rem 0 1.875rem;
    color: #9a9a9a;
    text-align: justify
}

.waterusage.max-water .waterusage-text {
    transition-delay: .2s
}

.waterusage-main {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.waterusage-main.fix {
    position: fixed
}

.waterusage-main.done {
    position: absolute;
    bottom: 0;
    top: auto
}

.waterusage-measure {
    position: relative;
    width: 2.875rem;
    height: 25rem;
    border-radius: 3.125rem;
    background: #E6E6E6;
    margin-left: 10.3125rem
}

@media only screen and (max-width: 800px) {
    .waterusage-measure {
        width: 1.875rem;
        height: 18.75rem
    }
}

@media only screen and (max-width: 600px) {
    .waterusage-measure {
        -ms-flex-order: 1;
        order: 1;
        width: 1.5625rem;
        height: 12.5rem;
        margin-left: 130px
    }
}

.waterusage-measure ul {
    position: absolute;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%;
    right: calc(100% + 20px)
}

.waterusage-measure ul li {
    height: .3125rem;
    border-radius: .3125rem;
    background: #E6E6E6;
    width: .75rem
}

@media only screen and (max-width: 800px) {
    .waterusage-measure ul li {
        height: 4px;
        width: 10px
    }
}

@media only screen and (max-width: 600px) {
    .waterusage-measure ul li {
        height: 3px;
        width: 8px
    }
}

.waterusage-measure ul li:nth-child(odd) {
    width: 1.5rem
}

@media only screen and (max-width: 800px) {
    .waterusage-measure ul li:nth-child(odd) {
        width: 20px
    }
}

@media only screen and (max-width: 600px) {
    .waterusage-measure ul li:nth-child(odd) {
        width: 15px
    }
}

.waterusage.max-water .switch {
    transition-delay: .3s
}

@media only screen and (max-width: 600px) {
    .waterusage .switch {
        margin-bottom: 20px
    }
}

@media only screen and (max-width: 800px) {
    .waterusage .switch-handle {
        margin: 0 20px
    }
}

@media only screen and (max-width: 800px) {
    .waterusage .switch-label {
        font-size: 11px
    }
}

.waterusage-static {
    height: 20%;
    background: #00bee6;
    border-radius: 0 0 50px 50px
}

.waterusage-dynamic {
    height: 80%;
    position: relative
}

.waterusage-dynamic > i {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 50px 50px 0 0
}

.waterusage-dynamic > i i {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #00bee6
}

.waterusage-info {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    right: calc(100% + 20px);
    font-size: 1.25rem;
    color: #999;
    line-height: 1;
    -ms-transform: translateY(50%);
    transform: translateY(50%)
}

.waterusage-info span {
    display: block;
    width: 2.25rem;
    height: .5625rem;
    border-radius: .5625rem;
    background: #f47648;
    margin-left: .9375rem
}

@media only screen and (max-width: 800px) {
    .waterusage-info span {
        width: 30px;
        height: 7px;
        margin-left: 10px
    }
}

@media only screen and (max-width: 600px) {
    .waterusage-info span {
        width: 22px;
        height: 5px;
        margin-left: 5px
    }
}

.waterusage-info i {
    position: relative;
    font-size: 3rem;
    margin-left: .3125rem;
    width: 4.375rem;
    height: 3rem;
    text-align: left
}

@media only screen and (max-width: 800px) {
    .waterusage-info i {
        width: 50px
    }
}

@media only screen and (max-width: 1050px) {
    .waterusage-info i {
        font-size: 2.25rem;
        height: 2.25rem
    }
}

@media only screen and (max-width: 800px) {
    .waterusage-info i {
        font-size: 2rem;
        height: 2rem
    }
}

@media only screen and (max-width: 500px) {
    .waterusage-info i {
        font-size: 1.75rem;
        height: 1.75rem
    }
}

.waterusage-info b {
    display: inline-block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto
}

.waterusage .s-title, .waterusage .s-subtitle, .waterusage-text, .waterusage .switch {
    transition: transform .3s ease-in-out, opacity .15s linear;
    opacity: 0;
    -ms-transform: translateX(50px);
    transform: translateX(50px)
}

@media only screen and (max-width: 600px) {
    .waterusage .s-title, .waterusage .s-subtitle, .waterusage-text, .waterusage .switch {
        transition: none;
        opacity: 1;
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
}

.waterusage.max-water .s-title, .waterusage.max-water .s-subtitle, .waterusage.max-water .waterusage-text, .waterusage.max-water .switch {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.temperature {
    height: 200vh;
    overflow: hidden
}

@media only screen and (max-width: 600px) {
    .temperature {
        height: 150vh
    }
}

.temperature-wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    padding: 0 15px;
    background: #fff
}

@media only screen and (min-width: 601px) {
    .temperature-wrap {
        overflow: hidden;
        overflow-y: auto
    }
}

@media only screen and (max-width: 600px) {
    .temperature-wrap {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.temperature-wrap.fix {
    position: fixed
}

.temperature-wrap.done {
    position: absolute;
    bottom: 0;
    top: auto
}

.temperature-counter {
    position: absolute;
    display: -ms-flexbox;
    display: flex;
    width: 7.5rem;
    height: 6.25rem;
    border-radius: 3px;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    background: #E6E6E6
}

@media only screen and (min-width: 1401px) {
    .temperature-counter {
        width: 9.125rem;
        height: 7.5rem
    }
}

@media only screen and (max-width: 1050px) {
    .temperature-counter {
        width: 6.25rem;
        height: 4.375rem
    }
}

@media only screen and (max-width: 800px) {
    .temperature-counter {
        width: 4.375rem;
        height: 3.4375rem
    }
}

@media only screen and (min-width: 601px) {
    .temperature-counter {
        bottom: 50%;
        right: 50%
    }
}

@media only screen and (max-width: 600px) {
    .temperature-counter {
        bottom: 0
    }
}

@media only screen and (min-width: 601px) {
    .temperature-counter.celsius {
        -ms-transform: translate(280px, 50%);
        transform: translate(280px, 50%)
    }
}

@media only screen and (min-width: 801px) {
    .temperature-counter.celsius {
        -ms-transform: translate(370px, 50%);
        transform: translate(370px, 50%)
    }
}

@media only screen and (min-width: 1051px) {
    .temperature-counter.celsius {
        -ms-transform: translate(400px, 50%);
        transform: translate(400px, 50%)
    }
}

@media only screen and (min-width: 1401px) {
    .temperature-counter.celsius {
        -ms-transform: translate(530px, 50%);
        transform: translate(530px, 50%)
    }
}

@media only screen and (max-width: 600px) {
    .temperature-counter.celsius {
        left: 50%;
        margin-left: 30px
    }
}

@media only screen and (min-width: 601px) {
    .temperature-counter.fahrenheit {
        right: auto;
        left: 50%;
        -ms-transform: translate(-280px, 50%);
        transform: translate(-280px, 50%)
    }
}

@media only screen and (min-width: 801px) {
    .temperature-counter.fahrenheit {
        -ms-transform: translate(-370px, 50%);
        transform: translate(-370px, 50%)
    }
}

@media only screen and (min-width: 1051px) {
    .temperature-counter.fahrenheit {
        -ms-transform: translate(-400px, 50%);
        transform: translate(-400px, 50%)
    }
}

@media only screen and (min-width: 1401px) {
    .temperature-counter.fahrenheit {
        -ms-transform: translate(-530px, 50%);
        transform: translate(-530px, 50%)
    }
}

@media only screen and (max-width: 600px) {
    .temperature-counter.fahrenheit {
        right: 50%;
        margin-right: 30px
    }
}

.temperature-counter span {
    position: relative;
    z-index: 1;
    display: inline-block;
    color: gray;
    font-size: 3.75rem;
    height: 3.125rem;
    line-height: 1
}

@media only screen and (max-width: 1400px) {
    .temperature-counter span {
        font-size: 2.8125rem;
        height: 2.5rem
    }
}

@media only screen and (max-width: 1050px) {
    .temperature-counter span {
        font-size: 2.1875rem;
        height: 1.875rem
    }
}

@media only screen and (max-width: 800px) {
    .temperature-counter span {
        font-size: 1.75rem;
        height: 1.25rem
    }
}

@media only screen and (max-width: 500px) {
    .temperature-counter span {
        font-size: 1.5625rem
    }
}

.temperature-counter::after {
    content: '';
    width: 100%;
    height: 50%;
    background: gray;
    opacity: .14;
    position: absolute;
    left: 0;
    bottom: 0
}

.temperature-counter svg {
    position: absolute;
    right: 0;
    top: 0;
    -ms-transform: translate(50%, -60%);
    transform: translate(50%, -60%);
    height: 2.125rem;
    width: 2.125rem
}

@media only screen and (min-width: 1401px) {
    .temperature-counter svg {
        height: 2.25rem;
        width: 2.25rem
    }
}

@media only screen and (max-width: 1050px) {
    .temperature-counter svg {
        height: 1.875rem;
        width: 1.875rem
    }
}

@media only screen and (max-width: 800px) {
    .temperature-counter svg {
        height: 1.75rem;
        width: 1.75rem
    }
}

@media only screen and (max-width: 600px) {
    .temperature-counter.fahrenheit svg {
        right: auto;
        left: 0;
        -ms-transform: translate(-50%, -60%);
        transform: translate(-50%, -60%)
    }
}

.temperature-main {
    position: relative
}

@media only screen and (min-width: 601px) {
    .temperature-main {
        margin: auto
    }
}

.temperature-circle {
    position: relative
}

@media only screen and (max-width: 600px) {
    .temperature-circle {
        width: 200px;
        margin: 0 auto
    }
}

.temperature-image {
    position: relative;
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    width: 450px;
    height: 450px;
    border-radius: 50%;
    padding: 0
}

.temperature-image > li {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -2px;
    margin-top: -13.5px;
    width: 4px;
    height: 27px
}

.temperature-image > li:nth-of-type(1) {
    -ms-transform: rotate(0deg) translate(225px) rotate(90deg);
    transform: rotate(0deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(2) {
    -ms-transform: rotate(10deg) translate(225px) rotate(90deg);
    transform: rotate(10deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(3) {
    -ms-transform: rotate(20deg) translate(225px) rotate(90deg);
    transform: rotate(20deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(4) {
    -ms-transform: rotate(30deg) translate(225px) rotate(90deg);
    transform: rotate(30deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(5) {
    -ms-transform: rotate(40deg) translate(225px) rotate(90deg);
    transform: rotate(40deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(6) {
    -ms-transform: rotate(50deg) translate(225px) rotate(90deg);
    transform: rotate(50deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(7) {
    -ms-transform: rotate(60deg) translate(225px) rotate(90deg);
    transform: rotate(60deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(8) {
    -ms-transform: rotate(70deg) translate(225px) rotate(90deg);
    transform: rotate(70deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(9) {
    -ms-transform: rotate(80deg) translate(225px) rotate(90deg);
    transform: rotate(80deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(10) {
    -ms-transform: rotate(90deg) translate(225px) rotate(90deg);
    transform: rotate(90deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(11) {
    -ms-transform: rotate(100deg) translate(225px) rotate(90deg);
    transform: rotate(100deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(12) {
    -ms-transform: rotate(110deg) translate(225px) rotate(90deg);
    transform: rotate(110deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(13) {
    -ms-transform: rotate(120deg) translate(225px) rotate(90deg);
    transform: rotate(120deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(14) {
    -ms-transform: rotate(130deg) translate(225px) rotate(90deg);
    transform: rotate(130deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(15) {
    -ms-transform: rotate(140deg) translate(225px) rotate(90deg);
    transform: rotate(140deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(16) {
    -ms-transform: rotate(150deg) translate(225px) rotate(90deg);
    transform: rotate(150deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(17) {
    -ms-transform: rotate(160deg) translate(225px) rotate(90deg);
    transform: rotate(160deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(18) {
    -ms-transform: rotate(170deg) translate(225px) rotate(90deg);
    transform: rotate(170deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(19) {
    -ms-transform: rotate(180deg) translate(225px) rotate(90deg);
    transform: rotate(180deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(20) {
    -ms-transform: rotate(190deg) translate(225px) rotate(90deg);
    transform: rotate(190deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(21) {
    -ms-transform: rotate(200deg) translate(225px) rotate(90deg);
    transform: rotate(200deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(22) {
    -ms-transform: rotate(210deg) translate(225px) rotate(90deg);
    transform: rotate(210deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(23) {
    -ms-transform: rotate(220deg) translate(225px) rotate(90deg);
    transform: rotate(220deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(24) {
    -ms-transform: rotate(230deg) translate(225px) rotate(90deg);
    transform: rotate(230deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(25) {
    -ms-transform: rotate(240deg) translate(225px) rotate(90deg);
    transform: rotate(240deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(26) {
    -ms-transform: rotate(250deg) translate(225px) rotate(90deg);
    transform: rotate(250deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(27) {
    -ms-transform: rotate(260deg) translate(225px) rotate(90deg);
    transform: rotate(260deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(28) {
    -ms-transform: rotate(270deg) translate(225px) rotate(90deg);
    transform: rotate(270deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(29) {
    -ms-transform: rotate(280deg) translate(225px) rotate(90deg);
    transform: rotate(280deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(30) {
    -ms-transform: rotate(290deg) translate(225px) rotate(90deg);
    transform: rotate(290deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(31) {
    -ms-transform: rotate(300deg) translate(225px) rotate(90deg);
    transform: rotate(300deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(32) {
    -ms-transform: rotate(310deg) translate(225px) rotate(90deg);
    transform: rotate(310deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(33) {
    -ms-transform: rotate(320deg) translate(225px) rotate(90deg);
    transform: rotate(320deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(34) {
    -ms-transform: rotate(330deg) translate(225px) rotate(90deg);
    transform: rotate(330deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(35) {
    -ms-transform: rotate(340deg) translate(225px) rotate(90deg);
    transform: rotate(340deg) translate(225px) rotate(90deg)
}

.temperature-image > li:nth-of-type(36) {
    -ms-transform: rotate(350deg) translate(225px) rotate(90deg);
    transform: rotate(350deg) translate(225px) rotate(90deg)
}

@media only screen and (min-width: 1401px) {
    .temperature-image {
        width: 620px;
        height: 620px;
        border-radius: 50%;
        padding: 0
    }

    .temperature-image > li {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -2px;
        margin-top: -13.5px;
        width: 4px;
        height: 27px
    }

    .temperature-image > li:nth-of-type(1) {
        -ms-transform: rotate(0deg) translate(310px) rotate(90deg);
        transform: rotate(0deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(2) {
        -ms-transform: rotate(10deg) translate(310px) rotate(90deg);
        transform: rotate(10deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(3) {
        -ms-transform: rotate(20deg) translate(310px) rotate(90deg);
        transform: rotate(20deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(4) {
        -ms-transform: rotate(30deg) translate(310px) rotate(90deg);
        transform: rotate(30deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(5) {
        -ms-transform: rotate(40deg) translate(310px) rotate(90deg);
        transform: rotate(40deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(6) {
        -ms-transform: rotate(50deg) translate(310px) rotate(90deg);
        transform: rotate(50deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(7) {
        -ms-transform: rotate(60deg) translate(310px) rotate(90deg);
        transform: rotate(60deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(8) {
        -ms-transform: rotate(70deg) translate(310px) rotate(90deg);
        transform: rotate(70deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(9) {
        -ms-transform: rotate(80deg) translate(310px) rotate(90deg);
        transform: rotate(80deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(10) {
        -ms-transform: rotate(90deg) translate(310px) rotate(90deg);
        transform: rotate(90deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(11) {
        -ms-transform: rotate(100deg) translate(310px) rotate(90deg);
        transform: rotate(100deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(12) {
        -ms-transform: rotate(110deg) translate(310px) rotate(90deg);
        transform: rotate(110deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(13) {
        -ms-transform: rotate(120deg) translate(310px) rotate(90deg);
        transform: rotate(120deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(14) {
        -ms-transform: rotate(130deg) translate(310px) rotate(90deg);
        transform: rotate(130deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(15) {
        -ms-transform: rotate(140deg) translate(310px) rotate(90deg);
        transform: rotate(140deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(16) {
        -ms-transform: rotate(150deg) translate(310px) rotate(90deg);
        transform: rotate(150deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(17) {
        -ms-transform: rotate(160deg) translate(310px) rotate(90deg);
        transform: rotate(160deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(18) {
        -ms-transform: rotate(170deg) translate(310px) rotate(90deg);
        transform: rotate(170deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(19) {
        -ms-transform: rotate(180deg) translate(310px) rotate(90deg);
        transform: rotate(180deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(20) {
        -ms-transform: rotate(190deg) translate(310px) rotate(90deg);
        transform: rotate(190deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(21) {
        -ms-transform: rotate(200deg) translate(310px) rotate(90deg);
        transform: rotate(200deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(22) {
        -ms-transform: rotate(210deg) translate(310px) rotate(90deg);
        transform: rotate(210deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(23) {
        -ms-transform: rotate(220deg) translate(310px) rotate(90deg);
        transform: rotate(220deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(24) {
        -ms-transform: rotate(230deg) translate(310px) rotate(90deg);
        transform: rotate(230deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(25) {
        -ms-transform: rotate(240deg) translate(310px) rotate(90deg);
        transform: rotate(240deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(26) {
        -ms-transform: rotate(250deg) translate(310px) rotate(90deg);
        transform: rotate(250deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(27) {
        -ms-transform: rotate(260deg) translate(310px) rotate(90deg);
        transform: rotate(260deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(28) {
        -ms-transform: rotate(270deg) translate(310px) rotate(90deg);
        transform: rotate(270deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(29) {
        -ms-transform: rotate(280deg) translate(310px) rotate(90deg);
        transform: rotate(280deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(30) {
        -ms-transform: rotate(290deg) translate(310px) rotate(90deg);
        transform: rotate(290deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(31) {
        -ms-transform: rotate(300deg) translate(310px) rotate(90deg);
        transform: rotate(300deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(32) {
        -ms-transform: rotate(310deg) translate(310px) rotate(90deg);
        transform: rotate(310deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(33) {
        -ms-transform: rotate(320deg) translate(310px) rotate(90deg);
        transform: rotate(320deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(34) {
        -ms-transform: rotate(330deg) translate(310px) rotate(90deg);
        transform: rotate(330deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(35) {
        -ms-transform: rotate(340deg) translate(310px) rotate(90deg);
        transform: rotate(340deg) translate(310px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(36) {
        -ms-transform: rotate(350deg) translate(310px) rotate(90deg);
        transform: rotate(350deg) translate(310px) rotate(90deg)
    }
}

@media only screen and (max-width: 800px) {
    .temperature-image {
        width: 370px;
        height: 370px;
        border-radius: 50%;
        padding: 0
    }

    .temperature-image > li {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -2px;
        margin-top: -13.5px;
        width: 4px;
        height: 27px
    }

    .temperature-image > li:nth-of-type(1) {
        -ms-transform: rotate(0deg) translate(185px) rotate(90deg);
        transform: rotate(0deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(2) {
        -ms-transform: rotate(10deg) translate(185px) rotate(90deg);
        transform: rotate(10deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(3) {
        -ms-transform: rotate(20deg) translate(185px) rotate(90deg);
        transform: rotate(20deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(4) {
        -ms-transform: rotate(30deg) translate(185px) rotate(90deg);
        transform: rotate(30deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(5) {
        -ms-transform: rotate(40deg) translate(185px) rotate(90deg);
        transform: rotate(40deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(6) {
        -ms-transform: rotate(50deg) translate(185px) rotate(90deg);
        transform: rotate(50deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(7) {
        -ms-transform: rotate(60deg) translate(185px) rotate(90deg);
        transform: rotate(60deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(8) {
        -ms-transform: rotate(70deg) translate(185px) rotate(90deg);
        transform: rotate(70deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(9) {
        -ms-transform: rotate(80deg) translate(185px) rotate(90deg);
        transform: rotate(80deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(10) {
        -ms-transform: rotate(90deg) translate(185px) rotate(90deg);
        transform: rotate(90deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(11) {
        -ms-transform: rotate(100deg) translate(185px) rotate(90deg);
        transform: rotate(100deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(12) {
        -ms-transform: rotate(110deg) translate(185px) rotate(90deg);
        transform: rotate(110deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(13) {
        -ms-transform: rotate(120deg) translate(185px) rotate(90deg);
        transform: rotate(120deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(14) {
        -ms-transform: rotate(130deg) translate(185px) rotate(90deg);
        transform: rotate(130deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(15) {
        -ms-transform: rotate(140deg) translate(185px) rotate(90deg);
        transform: rotate(140deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(16) {
        -ms-transform: rotate(150deg) translate(185px) rotate(90deg);
        transform: rotate(150deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(17) {
        -ms-transform: rotate(160deg) translate(185px) rotate(90deg);
        transform: rotate(160deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(18) {
        -ms-transform: rotate(170deg) translate(185px) rotate(90deg);
        transform: rotate(170deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(19) {
        -ms-transform: rotate(180deg) translate(185px) rotate(90deg);
        transform: rotate(180deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(20) {
        -ms-transform: rotate(190deg) translate(185px) rotate(90deg);
        transform: rotate(190deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(21) {
        -ms-transform: rotate(200deg) translate(185px) rotate(90deg);
        transform: rotate(200deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(22) {
        -ms-transform: rotate(210deg) translate(185px) rotate(90deg);
        transform: rotate(210deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(23) {
        -ms-transform: rotate(220deg) translate(185px) rotate(90deg);
        transform: rotate(220deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(24) {
        -ms-transform: rotate(230deg) translate(185px) rotate(90deg);
        transform: rotate(230deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(25) {
        -ms-transform: rotate(240deg) translate(185px) rotate(90deg);
        transform: rotate(240deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(26) {
        -ms-transform: rotate(250deg) translate(185px) rotate(90deg);
        transform: rotate(250deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(27) {
        -ms-transform: rotate(260deg) translate(185px) rotate(90deg);
        transform: rotate(260deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(28) {
        -ms-transform: rotate(270deg) translate(185px) rotate(90deg);
        transform: rotate(270deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(29) {
        -ms-transform: rotate(280deg) translate(185px) rotate(90deg);
        transform: rotate(280deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(30) {
        -ms-transform: rotate(290deg) translate(185px) rotate(90deg);
        transform: rotate(290deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(31) {
        -ms-transform: rotate(300deg) translate(185px) rotate(90deg);
        transform: rotate(300deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(32) {
        -ms-transform: rotate(310deg) translate(185px) rotate(90deg);
        transform: rotate(310deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(33) {
        -ms-transform: rotate(320deg) translate(185px) rotate(90deg);
        transform: rotate(320deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(34) {
        -ms-transform: rotate(330deg) translate(185px) rotate(90deg);
        transform: rotate(330deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(35) {
        -ms-transform: rotate(340deg) translate(185px) rotate(90deg);
        transform: rotate(340deg) translate(185px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(36) {
        -ms-transform: rotate(350deg) translate(185px) rotate(90deg);
        transform: rotate(350deg) translate(185px) rotate(90deg)
    }
}

@media only screen and (max-width: 600px) {
    .temperature-image {
        width: 200px;
        height: 200px;
        border-radius: 50%;
        padding: 0;
        margin: 25px auto 70px
    }

    .temperature-image > li {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -1.5px;
        margin-top: -7.5px;
        width: 3px;
        height: 15px
    }

    .temperature-image > li:nth-of-type(1) {
        -ms-transform: rotate(0deg) translate(100px) rotate(90deg);
        transform: rotate(0deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(2) {
        -ms-transform: rotate(10deg) translate(100px) rotate(90deg);
        transform: rotate(10deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(3) {
        -ms-transform: rotate(20deg) translate(100px) rotate(90deg);
        transform: rotate(20deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(4) {
        -ms-transform: rotate(30deg) translate(100px) rotate(90deg);
        transform: rotate(30deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(5) {
        -ms-transform: rotate(40deg) translate(100px) rotate(90deg);
        transform: rotate(40deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(6) {
        -ms-transform: rotate(50deg) translate(100px) rotate(90deg);
        transform: rotate(50deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(7) {
        -ms-transform: rotate(60deg) translate(100px) rotate(90deg);
        transform: rotate(60deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(8) {
        -ms-transform: rotate(70deg) translate(100px) rotate(90deg);
        transform: rotate(70deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(9) {
        -ms-transform: rotate(80deg) translate(100px) rotate(90deg);
        transform: rotate(80deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(10) {
        -ms-transform: rotate(90deg) translate(100px) rotate(90deg);
        transform: rotate(90deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(11) {
        -ms-transform: rotate(100deg) translate(100px) rotate(90deg);
        transform: rotate(100deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(12) {
        -ms-transform: rotate(110deg) translate(100px) rotate(90deg);
        transform: rotate(110deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(13) {
        -ms-transform: rotate(120deg) translate(100px) rotate(90deg);
        transform: rotate(120deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(14) {
        -ms-transform: rotate(130deg) translate(100px) rotate(90deg);
        transform: rotate(130deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(15) {
        -ms-transform: rotate(140deg) translate(100px) rotate(90deg);
        transform: rotate(140deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(16) {
        -ms-transform: rotate(150deg) translate(100px) rotate(90deg);
        transform: rotate(150deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(17) {
        -ms-transform: rotate(160deg) translate(100px) rotate(90deg);
        transform: rotate(160deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(18) {
        -ms-transform: rotate(170deg) translate(100px) rotate(90deg);
        transform: rotate(170deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(19) {
        -ms-transform: rotate(180deg) translate(100px) rotate(90deg);
        transform: rotate(180deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(20) {
        -ms-transform: rotate(190deg) translate(100px) rotate(90deg);
        transform: rotate(190deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(21) {
        -ms-transform: rotate(200deg) translate(100px) rotate(90deg);
        transform: rotate(200deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(22) {
        -ms-transform: rotate(210deg) translate(100px) rotate(90deg);
        transform: rotate(210deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(23) {
        -ms-transform: rotate(220deg) translate(100px) rotate(90deg);
        transform: rotate(220deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(24) {
        -ms-transform: rotate(230deg) translate(100px) rotate(90deg);
        transform: rotate(230deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(25) {
        -ms-transform: rotate(240deg) translate(100px) rotate(90deg);
        transform: rotate(240deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(26) {
        -ms-transform: rotate(250deg) translate(100px) rotate(90deg);
        transform: rotate(250deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(27) {
        -ms-transform: rotate(260deg) translate(100px) rotate(90deg);
        transform: rotate(260deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(28) {
        -ms-transform: rotate(270deg) translate(100px) rotate(90deg);
        transform: rotate(270deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(29) {
        -ms-transform: rotate(280deg) translate(100px) rotate(90deg);
        transform: rotate(280deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(30) {
        -ms-transform: rotate(290deg) translate(100px) rotate(90deg);
        transform: rotate(290deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(31) {
        -ms-transform: rotate(300deg) translate(100px) rotate(90deg);
        transform: rotate(300deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(32) {
        -ms-transform: rotate(310deg) translate(100px) rotate(90deg);
        transform: rotate(310deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(33) {
        -ms-transform: rotate(320deg) translate(100px) rotate(90deg);
        transform: rotate(320deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(34) {
        -ms-transform: rotate(330deg) translate(100px) rotate(90deg);
        transform: rotate(330deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(35) {
        -ms-transform: rotate(340deg) translate(100px) rotate(90deg);
        transform: rotate(340deg) translate(100px) rotate(90deg)
    }

    .temperature-image > li:nth-of-type(36) {
        -ms-transform: rotate(350deg) translate(100px) rotate(90deg);
        transform: rotate(350deg) translate(100px) rotate(90deg)
    }
}

.temperature-image li {
    background: #E6E6E6;
    border-radius: 10px
}

.temperature-image li:nth-of-type(3n) {
    width: 5px;
    background: #bfb8af
}

@media only screen and (max-width: 600px) {
    .temperature-image li:nth-of-type(3n) {
        width: 4px
    }
}

.temperature-image svg {
    overflow: visible
}

.temperature-imagebg {
    height: 85%;
    width: 85%;
    border-radius: 50%;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    background: #F2F2F2
}

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

.temperature-handle {
    position: absolute;
    right: 0;
    left: 0;
    bottom: 50%;
    margin: auto;
    width: 10px;
    height: 265px;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

@media only screen and (min-width: 1401px) {
    .temperature-handle {
        height: 350px
    }
}

@media only screen and (max-width: 800px) {
    .temperature-handle {
        width: 8px;
        height: 220px
    }
}

@media only screen and (max-width: 600px) {
    .temperature-handle {
        width: 4px;
        height: 130px
    }
}

.temperature-handle svg {
    display: block;
    width: 100%;
    height: 60px;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 10px;
    fill: #00bee6
}

@media only screen and (max-width: 600px) {
    .temperature-handle svg {
        left: 1px
    }
}

.temperature-content {
    color: #999;
    z-index: 2;
    text-align: justify;
    font-size: .875rem
}

@media only screen and (min-width: 1401px) {
    .temperature-content {
        font-size: 1rem
    }
}

@media only screen and (min-width: 601px) {
    .temperature-content {
        position: absolute;
        left: 50%;
        top: 50%;
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        max-width: 200px
    }
}

@media only screen and (min-width: 801px) {
    .temperature-content {
        max-width: 15.625rem
    }
}

@media only screen and (min-width: 1401px) {
    .temperature-content {
        max-width: 21.875rem
    }
}

@media only screen and (max-width: 800px) {
    .temperature-content {
        font-size: .8125rem
    }
}

.temperature-content img {
    width: 8.125rem;
    height: 1.75rem
}

.temperature .s-header {
    margin-bottom: .9375rem
}

.temperature .s-title {
    font-size: 1.25rem
}

@media only screen and (min-width: 1401px) {
    .temperature .s-title {
        font-size: 1.5rem
    }
}

@media only screen and (max-width: 1050px) {
    .temperature .s-title {
        font-size: 1.125rem
    }
}

@media only screen and (max-width: 800px) {
    .temperature .s-title {
        font-size: 1rem
    }
}

.pf-modal {
    background-color: #1A1A1A;
    max-width: 90rem;
    margin: 0 auto;
    padding: 7.8125rem 0 16.625rem
}

@media only screen and (max-width: 1050px) {
    .pf-modal {
        padding: 3.75rem 0 6.25rem
    }
}

@media only screen and (max-width: 600px) {
    .pf-modal {
        padding-bottom: 3.75rem
    }
}

.pf-modal__wrap {
    padding: 0 8.75rem
}

@media only screen and (max-width: 1050px) {
    .pf-modal__wrap {
        padding: 0 2.5rem
    }
}

@media only screen and (max-width: 600px) {
    .pf-modal__wrap {
        padding: 0 1.25rem
    }
}

.pf-modal__section {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: 4.375rem 0
}

@media only screen and (max-width: 600px) {
    .pf-modal__section {
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 2.1875rem 0
    }
}

.pf-modal__section:first-child {
    padding-top: 0
}

.pf-modal__section:last-child {
    padding-bottom: 0
}

.pf-modal__section:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3)
}

.pf-modal__section div:nth-child(1), .pf-modal__section div:nth-child(2) {
    color: #E6E6E6
}

.pf-modal__section div:nth-child(1) {
    -ms-flex-item-align: start;
    align-self: flex-start;
    -ms-flex-preferred-size: 17.5rem;
    flex-basis: 17.5rem;
    font-size: 1.5rem
}

@media only screen and (max-width: 800px) {
    .pf-modal__section div:nth-child(1) {
        -ms-flex-preferred-size: 13.75rem;
        flex-basis: 13.75rem;
        font-size: 1.25rem
    }
}

@media only screen and (max-width: 600px) {
    .pf-modal__section div:nth-child(1) {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        font-size: 1.1875rem
    }
}

.pf-modal__section div:nth-child(2) {
    -ms-flex: 1;
    flex: 1
}

@media only screen and (max-width: 600px) {
    .pf-modal__section div:nth-child(2) {
        margin-top: 2.1875rem
    }
}

.pf-modal__section div:nth-child(2) p {
    font-size: 1.125rem
}

@media only screen and (max-width: 800px) {
    .pf-modal__section div:nth-child(2) p {
        font-size: 1rem
    }
}

@media only screen and (max-width: 600px) {
    .pf-modal__section div:nth-child(2) p {
        font-size: .875rem
    }
}

.pf-modal__section div:nth-child(2) p:not(:last-of-type) {
    margin-bottom: 1.25rem
}

.pf-modal__section div:nth-child(2) ul li:not(:last-child) {
    margin-bottom: .625rem
}

.pf-modal__section div:nth-child(2) ul li::before {
    content: '';
    display: inline-block;
    font-weight: bold;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background-color: gray;
    margin-left: .75rem
}

.section--reviews textarea {
    display: block;
    width: 100%;
    border: 1px solid #D6D6D6;
    border-radius: .3125rem;
    padding: 1.25rem;
    margin: 0 0 1rem 0;
    transition: all 0.12s;
    color: #666
}

.section--reviews input[type="text"], .section--reviews input[type="email"] {
    height: 3rem;
    display: block;
    width: 100%;
    border: 1px solid #D6D6D6;
    border-radius: .3125rem;
    padding: 0 1.25rem;
    margin: 0 0 1rem 0;
    transition: all 0.12s;
    color: #666
}

.section--reviews input[type="submit"] {
    height: 4rem;
    width: 100%;
    line-height: 4rem;
    display: block;
    border-radius: .3125rem;
    padding: 0 1.25rem;
    margin: 0 0 1rem 0;
    transition: all 0.12s;
    background: linear-gradient(45deg, #0078c8 0%, #0032a0 100%);
    color: #fff
}

.section--reviews ul.page-numbers {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 1rem
}

.section--reviews ul.page-numbers li {
    padding: 1rem
}

.section--reviews ul.page-numbers li .current {
    color: #0032a0;
    padding: .4rem .8rem
}

.section--reviews ul.page-numbers li a {
    padding: 0 .4375rem;
    color: #666
}

.section--reviews ul.page-numbers li a:hover {
    color: #0032a0
}

.section--reviews h2 {
    font-size: 1.2rem;
    font-weight: bold
}

.section--reviews .commentlist {
    background: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: stretch;
    align-items: stretch;
    border-radius: .25rem
}

.section--reviews .commentlist li.review {
    padding: 1rem;
    border-bottom: 1px solid #cccccc
}

.section--reviews .commentlist p.meta {
    padding: 1rem;
    font-size: .9rem;
    color: #666
}

.section--reviews .commentlist div.description {
    padding: 0 1rem 2rem 1rem;
    color: #373737
}

.section--reviews .commentlist ul.children {
    margin-right: 2rem
}

.section--360 .swiper-wrapper img {
    width: 100%
}

.section--360 .multicolor-price {
    font-size: 20px
}

.section--360 .multicolor-price b {
    font-weight: 700
}

.section--360 .product-details {
    display: -ms-flexbox;
    display: flex;
    gap: 4rem;
    -ms-flex-align: start !important;
    align-items: start !important
}

@media screen and (max-width: 1024px) {
    .section--360 .product-details {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.section--360 .multicolor-buttons {
    padding: 25px 0;
    margin: 50px 0 25px 0;
    border-top: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5
}

.section--360 .multicolor-buttons > p {
    margin-bottom: 1rem
}

.section--360 .multicolor-buttons > p b {
    font-weight: bold
}

.section--360 .multicolor-buttons__items {
    display: -ms-flexbox;
    display: flex;
    gap: 10px
}

@media screen and (max-width: 724px) {
    .section--360 .multicolor-buttons__items {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.section--360 .multicolor-buttons input[type="radio"]:checked + label {
    border-color: #49BE6C
}

.section--360 .multicolor-buttons input[type="radio"]:checked + label span img {
    display: block !important
}

.section--360 .multicolor-buttons input {
    display: none
}

.section--360 .multicolor-buttons__item {
    color: #383838;
    border: 2px solid #D7D7D7;
    border-radius: 12px;
    padding: 9px;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    cursor: pointer;
    min-width: 135px;
    -ms-flex-align: center;
    align-items: center
}

.section--360 .multicolor-buttons__item span {
    width: 32px;
    height: 32px;
    border: 1px solid #E9E9E9;
    border-radius: 8px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center
}

.section--360 .swiper-button-prev:after, .section--360 .swiper-rtl .swiper-button-next:after {
    content: 'next'
}

.section--360 .swiper-button-next:after, .section--360 .swiper-rtl .swiper-button-prev:after {
    content: 'prev'
}

.section--360 .swiper-thumbs .swiper-slide {
    border: 1px solid #CDCDCD;
    border-radius: 4px;
    display: -ms-flexbox;
    display: flex
}

.section--360 .swiper-button-prev, .section--360 .swiper-button-next {
    background: transparent !important;
    box-shadow: unset !important
}

.section--360 .mySwiper2 {
    position: relative
}

.section--360 .mySwiper2 .swiper-slide {
    width: 100% !important;
    height: auto;
    object-fit: cover;
    object-position: center
}

.section--360 .btn-view-360 {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2
}

.section--360 .product-preview-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    z-index: 999;
    padding-top: 2rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center
}

.section--360 .product-preview-modal .btnPrev {
    position: fixed;
    left: 10%;
    top: 50%
}

.section--360 .product-preview-modal .btnPrev span {
    background-image: url("../images/arrow-icon-right.svg");
    background-position: unset !important;
    background-size: 100% 100% !important;
    filter: invert(1);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.section--360 .product-preview-modal .btnNext {
    position: fixed;
    right: 10%;
    top: 50%
}

.section--360 .product-preview-modal .btnNext span {
    background-image: url("../images/arrow-icon-right.svg");
    background-position: unset !important;
    background-size: 100% 100% !important;
    filter: invert(1)
}

.section--360 .product-preview-modal .btnPlay {
    display: none
}

.section--360 .product-preview-modal .nav_bar {
    bottom: 5rem !important
}

.section--360 .product-preview-modal .threesixty .threesixty_images img {
    width: 520px;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.section--360 #close-modal-preview {
    position: absolute;
    right: 5rem;
    top: 5rem
}

.section--360 .modalSwiperMain .swiper-button-prev, .section--360 .modalSwiperMain .swiper-button-next {
    position: fixed !important;
    filter: invert(1)
}

.section--360 .modalSwiperMain img {
    cursor: pointer;
    background: #fff;
    padding: 3rem;
    border-radius: 10px
}

.section--360 .multicolor-modal-gallery {
    -ms-flex-direction: column;
    flex-direction: column
}

.section--360 .swiper-container {
    width: 600px;
    height: auto
}

.section--360 .top-features {
    padding-top: 2rem;
    margin-top: 2rem;
    border-top: 1px solid #e5e5e5
}

.section--360 .top-features .bus {
    margin-top: 1.5rem
}

.section--360 .top-features .bus li {
    padding: 0;
    font-size: 14px
}

.section--360 .top-features .section--feature .bus {
    margin: 1rem 0
}

@media screen and (max-width: 1024px) {
    .section--360 .swiper-container {
        -ms-transform: scale(0.8);
        transform: scale(0.8)
    }

    .section--360 #close-modal-preview {
        position: absolute;
        right: 2rem;
        top: 2rem;
        z-index: 999
    }
}

.section--360 .product-title {
    font-size: 1.7rem;
    font-weight: bold
}

.section--360 .thumbnail-product-box {
    position: relative;
    width: 95%;
    -ms-transform: translateX(-1.2rem);
    transform: translateX(-1.2rem)
}

.section--360 .thumbnail-product-box .swiper-button-next:after, .section--360 .thumbnail-product-box .swiper-button-prev:after {
    font-size: 1rem !important
}

.section--360 .thumbnail-product-box .swiper-button-prev, .section--360 .thumbnail-product-box .swiper-container-rtl .swiper-button-next {
    right: -3rem !important;
    left: auto !important
}

.section--360 .thumbnail-product-box .swiper-button-next, .section--360 .thumbnail-product-box .swiper-container-rtl .swiper-button-prev {
    left: -3rem !important;
    right: auto !important
}

.section--360 .thumbnail-product-box .swiper-button-next, .section--360 .thumbnail-product-box .swiper-button-prev {
    color: #888
}

.section--swiper .swiper-features-container {
    position: relative
}

@media only screen and (max-width: 800px) {
    .section--swiper .swiper-features-navigations {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-align: center;
        align-items: center;
        padding: 0 2rem
    }

    .section--swiper .swiper-features-navigations .swiper-button-next, .section--swiper .swiper-features-navigations .swiper-button-prev {
        position: static !important;
        background: transparent;
        padding: 0;
        height: auto;
        -ms-transform: scale(0.5);
        transform: scale(0.5)
    }
}

.section--swiper .swiper-wrapper {
    padding: 3rem 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 800px) {
    .section--swiper .swiper-slide-active {
        height: 300px !important
    }
}

.section--swiper .swiper-slide {
    background: #fff;
    padding: 31px 26px;
    box-shadow: 0 4px 16px 1px rgba(26, 26, 26, 0.05);
    border-radius: 10px;
    text-align: center;
    height: 260px;
    font-size: 100%;
    font-style: normal;
    font-weight: 400;
    line-height: 190%;
    color: #373737;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (min-width: 801px) {
    .section--swiper .swiper-slide:nth-child(even) {
        height: 300px
    }
}

@media only screen and (max-width: 800px) {
    .section--swiper .swiper-slide {
        font-size: 80%
    }
}

.section--swiper .swiper-button-prev, .section--swiper .swiper-button-next {
    height: 300px;
    box-shadow: none;
    width: 15%;
    filter: grayscale(1)
}

.section--swiper .swiper-button-prev {
    background: linear-gradient(270deg, rgba(255, 255, 255, 0.1) 2.76%, #F7F7F7 105.44%) !important;
    padding-right: 7rem;
    left: -55px !important;
    right: auto !important
}

.section--swiper .swiper-button-next {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.1) 2.76%, #F7F7F7 105.44%) !important;
    padding-left: 7rem;
    right: -55px !important;
    left: auto !important
}

.section--swiper .featuresSwiper .swiper-slide {
    -ms-flex-flow: column;
    flex-flow: column;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 1rem
}

.section--swiper .featuresSwiper .swiper-slide h3 {
    font-weight: bold
}

.section-story__properties {
    max-width: 25rem;
    margin: 0 auto
}

@media only screen and (max-width: 800px) {
    .section-story__properties {
        margin: 30px auto
    }
}

.section-story__btn {
    margin-top: 3.125rem
}

@media only screen and (max-width: 800px) {
    .section-story__btn {
        text-align: center
    }
}

.section-story .s-header {
    margin-bottom: 1.875rem
}

.overview {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: stretch;
    align-items: stretch;
    overflow: visible
}

.overview-col {
    width: 50%;
    background: #F2F2F2;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media only screen and (min-width: 801px) {
    .overview-col {
        -ms-flex-pack: end;
        justify-content: flex-end;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

@media only screen and (max-width: 800px) {
    .overview-col {
        -ms-flex-pack: center;
        justify-content: center;
        width: 100%
    }
}

.overview-col:last-of-type {
    background: #4dbe66;
    background: linear-gradient(-45deg, #4dbe66 0%, #00bee6 100%)
}

@media only screen and (min-width: 801px) {
    .overview-col:last-of-type {
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.overview-quote {
    width: calc(100% - 30px);
    max-width: 43.125rem;
    padding: 3.125rem 6.25rem;
    background: #fff;
    border-radius: .1875rem;
    position: relative;
    z-index: 2;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.07)
}

@media only screen and (min-width: 801px) {
    .overview-quote {
        position: absolute;
        left: 0;
        right: 0;
        top: -9.375rem;
        margin: auto
    }
}

@media only screen and (max-width: 800px) {
    .overview-quote {
        margin: -8.125rem auto 0;
        padding: 3.125rem 5rem
    }
}

.overview-quotetext {
    position: relative;
    color: #666;
    margin-bottom: 1.5625rem
}

.overview-quotetext svg {
    position: absolute;
    height: 1.9375rem;
    width: 1.9375rem
}

.overview-quotetext svg:first-of-type {
    left: 100%;
    top: 1.875rem;
    fill: #00bee6;
    margin-left: 1.875rem
}

.overview-quotetext svg:nth-of-type(2) {
    right: 100%;
    bottom: 0;
    fill: #78be1e;
    -ms-transform-origin: center;
    transform-origin: center;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    margin-right: 1.875rem
}

.overview-wrap {
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 0 15px;
    max-width: 37.5rem
}

@media only screen and (max-width: 800px) {
    .overview-wrap {
        -ms-flex-pack: center;
        justify-content: center
    }
}

.overview-col:last-of-type .overview-wrap {
    -ms-flex-pack: end;
    justify-content: flex-end
}

@media only screen and (max-width: 800px) {
    .overview-col:last-of-type .overview-wrap {
        -ms-flex-pack: center;
        justify-content: center
    }
}

.overview-quotename {
    font-size: 1.125rem;
    color: gray
}

.overview-quotename span {
    font-size: 1rem
}

.overview .card-f {
    max-width: 32.5rem;
    margin: 11.25rem 0 6.25rem;
    -ms-flex-align: start;
    align-items: flex-start
}

@media only screen and (max-width: 800px) {
    .overview .card-f {
        margin: 6.25rem 0 6.25rem
    }
}

.overview .card-f__img {
    max-height: 6.25rem;
    margin-top: 1.875rem
}

.overview .card-f__title {
    color: #666
}

.overview-col:last-of-type .card-f__title {
    color: #fff
}

.overview .card-f__desc {
    font-size: 1.25rem;
    color: #666
}

@media only screen and (max-width: 1050px) {
    .overview .card-f__desc {
        font-size: 1.125rem
    }
}

@media only screen and (max-width: 800px) {
    .overview .card-f__desc {
        font-size: 1rem
    }
}

.overview-col:last-of-type .card-f__desc {
    color: #fff
}

.values {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media only screen and (min-width: 801px) {
    .values .section-header {
        position: absolute;
        left: 50%;
        top: 50%;
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%)
    }
}

@media only screen and (min-width: 801px) {
    .values .s-subtitle {
        position: absolute;
        top: 100%;
        right: 0;
        white-space: nowrap
    }
}

.values-col {
    width: 50%;
    background: #434343;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 6.25rem 0
}

@media only screen and (min-width: 801px) {
    .values-col {
        -ms-flex-pack: end;
        justify-content: flex-end;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

@media only screen and (max-width: 800px) {
    .values-col {
        display: block;
        -ms-flex-pack: center;
        justify-content: center;
        width: 100%;
        padding: 80px 15px
    }
}

.values-col:last-of-type {
    background: #373737
}

@media only screen and (min-width: 801px) {
    .values-col:last-of-type {
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.values-wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    padding: 0 15px
}

@media only screen and (min-width: 801px) {
    .values-wrap {
        max-width: 37.5rem
    }
}

@media only screen and (max-width: 800px) {
    .values-wrap {
        -ms-flex-align: center;
        align-items: center;
        padding: 0
    }
}

.values-col:last-of-type .values-wrap {
    -ms-flex-align: end;
    align-items: flex-end
}

@media only screen and (max-width: 800px) {
    .values-col:last-of-type .values-wrap {
        -ms-flex-align: center;
        align-items: center
    }
}

.values .card-f {
    max-width: 21.875rem
}

.values .card-f__title {
    color: #E6E6E6;
    font-family: IRANSansMedium, IRANSans, tahoma, arial;
    margin-bottom: .625rem
}

.values .card-f__img {
    margin-bottom: 2.5rem;
    height: 5rem;
    max-height: none
}

.values .card-f__desc {
    color: #999;
    font-size: .875rem
}

.values .card-f:first-of-type {
    margin-bottom: 8.75rem
}

@media only screen and (max-width: 800px) {
    .values .card-f:first-of-type {
        margin-bottom: 80px
    }
}

.timeline {
    background: linear-gradient(145deg, #00bee6 -50%, #78be1e 150%);
    min-height: 43.125rem;
    max-height: 125rem
}

@media only screen and (min-width: 1401px) {
    .timeline {
        min-height: 53.125rem
    }
}

@media only screen and (max-width: 800px) {
    .timeline {
        min-height: 500px
    }
}

.timeline-header {
    text-align: center;
    color: #fff
}

.timeline-subtitle {
    font-size: 1.125rem
}

.timeline .section-wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    padding-bottom: 0
}

.timelineslider {
    -ms-flex: auto;
    flex: auto;
    width: 23.75rem;
    margin: 0 auto;
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

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

.timelineslider-wrap {
    position: relative;
    height: 28.125rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 1400px) {
    .timelineslider-wrap {
        height: 21.875rem
    }
}

@media only screen and (max-width: 800px) {
    .timelineslider-wrap {
        height: auto;
        width: 100%;
        max-width: 400px;
        margin: 0 auto
    }
}

.timelineslider-slide {
    padding: 1.875rem;
    margin: .9375rem 0;
    background: #fff;
    border-radius: .25rem;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
    font-size: .875rem;
    width: 100%;
    transition: opacity .2s linear
}

@media only screen and (max-width: 1400px) {
    .timelineslider-slide {
        padding: 20px;
        margin: 10px 0
    }
}

@media only screen and (max-width: 800px) {
    .timelineslider-slide {
        margin: 0 auto;
        height: 100%;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center
    }
}

.timelineslider-slideinner {
    padding: 0 1.875rem;
    position: absolute;
    height: calc(100% - 60px);
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    overflow: hidden
}

.timelineslider-scrollbar {
    position: absolute;
    left: 100%;
    top: 0;
    bottom: 0;
    -ms-transform: translateX(6.25rem);
    transform: translateX(6.25rem);
    margin: auto;
    height: 100%;
    max-height: 25rem;
    width: 10px;
    z-index: 2
}

@media only screen and (max-width: 800px) {
    .timelineslider-scrollbar {
        right: 0;
        left: 0;
        height: 10px;
        -ms-transform: translateY(60px);
        transform: translateY(60px);
        top: 100%;
        width: 100%
    }
}

.timelineslider-scrollbar ul {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%
}

@media only screen and (max-width: 800px) {
    .timelineslider-scrollbar ul {
        -ms-flex-direction: row;
        flex-direction: row
    }
}

.timelineslider-scrollbar li {
    width: 100%;
    height: 3px;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.3)
}

@media only screen and (max-width: 800px) {
    .timelineslider-scrollbar li {
        width: 3px;
        height: 100%
    }
}

.timelineslider-info {
    position: absolute;
    right: 100%;
    -ms-transform: translateX(-4.375rem);
    transform: translateX(-4.375rem);
    height: 100%;
    top: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: start;
    align-items: flex-start;
    color: #fff;
    white-space: nowrap
}

@media only screen and (max-width: 800px) {
    .timelineslider-info {
        right: 0;
        top: auto;
        left: 0;
        height: auto;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-transform: none;
        transform: none;
        bottom: 100%
    }
}

.timelineslider-info li {
    white-space: nowrap;
    width: 7.5rem;
    position: relative
}

.timelineslider-info li:not(:last-of-type) {
    margin-bottom: 1.875rem
}

.timelineslider-info li:not(:last-of-type)::after {
    content: '';
    height: 2px;
    border-radius: 2px;
    width: 1.25rem;
    position: absolute;
    bottom: -.9375rem;
    right: 0;
    background: #fff;
    opacity: .5
}

@media only screen and (max-width: 800px) {
    .timelineslider-info li:not(:last-of-type)::after {
        display: none
    }
}

.timelineslider-info b {
    font-size: 3rem
}

.timelineslider-info li:nth-of-type(1) b {
    width: 5.9375rem
}

@media only screen and (max-width: 1050px) {
    .timelineslider-info li:nth-of-type(1) b {
        width: 4.6875rem
    }
}

@media only screen and (max-width: 800px) {
    .timelineslider-info li:nth-of-type(1) b {
        width: 4.0625rem
    }
}

.timelineslider-info li:nth-of-type(2) b {
    width: 5rem
}

@media only screen and (max-width: 1050px) {
    .timelineslider-info li:nth-of-type(2) b {
        width: 3.75rem
    }
}

@media only screen and (max-width: 800px) {
    .timelineslider-info li:nth-of-type(2) b {
        width: 3.125rem
    }
}

.timelineslider-info li:nth-of-type(3) b {
    width: 6.25rem
}

@media only screen and (max-width: 1050px) {
    .timelineslider-info li:nth-of-type(3) b {
        width: 5.3125rem
    }
}

@media only screen and (max-width: 800px) {
    .timelineslider-info li:nth-of-type(3) b {
        width: 4.375rem
    }
}

@media only screen and (max-width: 1050px) {
    .timelineslider-info b {
        font-size: 2.25rem
    }
}

@media only screen and (max-width: 800px) {
    .timelineslider-info b {
        font-size: 2rem
    }
}

@media only screen and (max-width: 500px) {
    .timelineslider-info b {
        font-size: 1.75rem
    }
}

.timelineslider-info span {
    font-size: .875rem;
    opacity: .5
}

.timelineslider .swiper-slide {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 800px) {
    .timelineslider .swiper-slide {
        padding: 0 15px;
        height: auto
    }
}

.timelineslider .swiper-slide.current-item {
    z-index: 2;
    opacity: 1 !important
}

.timelineslider .swiper-wrapper {
    width: 100%;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

@media only screen and (max-width: 800px) {
    .timelineslider .swiper-wrapper {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: stretch;
        align-items: stretch
    }
}

.timelineslider .swiper-container {
    width: 100%;
    overflow: visible
}

@media only screen and (min-width: 801px) {
    .timelineslider .swiper-container {
        height: 9.375rem
    }
}

.overview-col .card-f__desc {
    text-align: justify
}

.cat-slider {
    position: relative;
    margin: 2.5rem 0
}

.cat-slider .swiper-container {
    padding-right: 10px
}

.cat-slider .swiper-slide {
    padding: .9375rem 0;
    display: inline-block;
    width: auto;
    line-height: 0
}

.cat-slider__item {
    position: relative;
    display: inline-block;
    padding: 0 1.25rem;
    line-height: 4rem;
    height: 4rem;
    border-radius: 4.375rem;
    background: #fff;
    color: #666;
    font-size: 1.125rem;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
    overflow: hidden
}

.cat-slider__item input {
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 3;
    cursor: pointer
}

.cat-slider__item i {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity .15s linear;
    background: #0032a0;
    background: linear-gradient(75deg, #0032a0 0%, #0078c8 100%)
}

.activated .cat-slider__item i {
    opacity: 1
}

@media only screen and (max-width: 800px) {
    .cat-slider__item {
        line-height: 3.125rem;
        height: 3.125rem;
        font-size: 14px
    }
}

.cat-slider__item span {
    position: relative;
    z-index: 2
}

.activated .cat-slider__item span {
    color: #fff
}

.cat-slider__item svg {
    position: relative;
    fill: #fff;
    margin-right: .3125rem;
    display: none;
    z-index: 2
}

.activated .cat-slider__item button svg {
    display: inline-block
}

.cat-slider .swiper-pagination {
    display: none !important
}

.cat-slider .swiper-button-next, .cat-slider .swiper-button-prev {
    height: 3.125rem;
    width: 3.125rem;
    box-shadow: none;
    transition: opacity .15s linear
}

@media only screen and (max-width: 800px) {
    .cat-slider .swiper-button-next, .cat-slider .swiper-button-prev {
        width: 0
    }
}

@media only screen and (max-width: 800px) {
    .cat-slider .swiper-button-next svg, .cat-slider .swiper-button-prev svg {
        display: none
    }
}

.cat-slider .swiper-button-next.swiper-button-disabled, .cat-slider .swiper-button-prev.swiper-button-disabled {
    opacity: 0
}

.cat-slider .swiper-button-next::after, .cat-slider .swiper-button-prev::after {
    content: '';
    width: 8.75rem;
    height: 5.625rem;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    pointer-events: none
}

@media only screen and (max-width: 800px) {
    .cat-slider .swiper-button-next::after, .cat-slider .swiper-button-prev::after {
        width: 40px
    }
}

.cat-slider .swiper-button-next::before, .cat-slider .swiper-button-prev::before {
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    width: 100%;
    height: 100%;
    border-radius: 2px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);
    z-index: 1
}

.cat-slider .swiper-button-next {
    left: 0;
    right: auto
}

@media only screen and (min-width: 1401px) {
    .cat-slider .swiper-button-next {
        right: 100%;
        left: auto
    }
}

.cat-slider .swiper-button-next::after {
    left: 0;
    background: linear-gradient(to right, #f4f2f2 0%, #f4f2f2 50%, rgba(244, 242, 242, 0) 100%)
}

@media only screen and (max-width: 800px) {
    .cat-slider .swiper-button-next::after {
        background: linear-gradient(to right, #f4f2f2 0%, rgba(244, 242, 242, 0) 100%)
    }
}

.cat-slider .swiper-button-prev {
    right: 0
}

@media only screen and (min-width: 1401px) {
    .cat-slider .swiper-button-prev {
        left: 100%;
        right: auto
    }
}

.cat-slider .swiper-button-prev::after {
    right: 0;
    background: linear-gradient(to left, #f4f2f2 0%, #f4f2f2 50%, rgba(244, 242, 242, 0) 100%)
}

@media only screen and (max-width: 800px) {
    .cat-slider .swiper-button-prev::after {
        background: linear-gradient(to left, #f4f2f2 0%, rgba(244, 242, 242, 0) 100%)
    }
}

.blog-posts {
    position: relative;
    margin: 0 -10px 1.25rem -10px;
    min-height: 25rem;
    overflow: hidden
}

@media only screen and (max-width: 800px) {
    .blog-posts {
        margin: 0 -7px
    }
}

.blog-posts.loaded {
    min-height: 0
}

.blog-posts .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.blog-posts.loaded .loading {
    opacity: 0
}

.social-banner {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    padding: 2.5rem 15px;
    margin-bottom: 2.5rem;
    overflow: hidden
}

@media only screen and (min-width: 801px) {
    .social-banner {
        min-height: 25rem
    }
}

@media only screen and (max-width: 800px) {
    .social-banner {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

.social-banner--instagram {
    background: linear-gradient(to right, #4dbe66 0%, #4cbe67 10%, #21beae 100%)
}

@media only screen and (min-width: 801px) {
    .social-banner--instagram {
        min-height: 26.875rem
    }
}

.social-banner--instagram::after {
    content: '';
    width: 5.625rem;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.35);
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 100%);
    z-index: 2
}

@media only screen and (max-width: 500px) {
    .social-banner--instagram::after {
        display: none
    }
}

.social-banner--twitter {
    background: #1ea1f1
}

.social-banner__col {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 50%;
    position: relative
}

@media only screen and (max-width: 800px) {
    .social-banner__col {
        display: block;
        width: 100%
    }
}

.social-banner__preview {
    position: relative;
    margin-bottom: 30px
}

@media only screen and (min-width: 801px) {
    .social-banner__preview {
        position: absolute;
        right: 100%;
        top: 0;
        bottom: 0;
        width: 100%;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin-bottom: 0
    }
}

@media only screen and (min-width: 801px) {
    .social-banner--instagram .social-banner__preview {
        display: block
    }
}

.social-banner__content {
    position: static;
    z-index: 1
}

@media only screen and (max-width: 800px) {
    .social-banner__content {
        text-align: center;
        position: relative
    }
}

.social-banner__content .btn {
    position: relative;
    z-index: 2
}

.social-banner__title {
    font-size: 1.25rem;
    color: #fff;
    position: relative;
    z-index: 2
}

@media only screen and (max-width: 1050px) {
    .social-banner__title {
        font-size: 1.125rem
    }
}

.social-banner__desc {
    color: #fff;
    margin-bottom: 1.25rem;
    position: relative;
    z-index: 2
}

.social-banner__icon {
    position: absolute;
    right: 3.75rem;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 18.75rem;
    width: 18.75rem;
    fill: #fff;
    opacity: .1
}

.social-banner--twitter .social-banner__icon {
    width: 22.8125rem
}

.aparat-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1.5625rem
}

.aparat-logo {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    color: #4d4d4d
}

.aparat-logo img {
    height: 2.625rem;
    width: 2.625rem;
    margin-left: .625rem
}

.aparat-archive {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    color: #999;
    font-size: .8125rem;
    transition: color .15s linear
}

.aparat-archive:hover {
    color: #0078c8
}

.aparat-archive:active, .aparat-archive.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.aparat-archive svg {
    width: .5rem;
    height: .6875rem;
    margin-right: .3125rem;
    fill: #999;
    transition: fill .15s linear
}

.aparat-archive:hover svg {
    fill: #0078c8
}

.twitter-slider {
    width: 100%
}

@media only screen and (min-width: 801px) {
    .twitter-slider {
        position: absolute;
        left: 50%;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 100%;
        max-width: 30rem
    }
}

@media only screen and (max-width: 800px) {
    .twitter-slider {
        direction: ltr
    }
}

@media only screen and (max-width: 800px) {
    .twitter-slider .swiper-pagination {
        bottom: 0
    }
}

@media only screen and (min-width: 801px) {
    .twitter-slider .swiper-pagination {
        right: 0;
        left: 0;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        text-align: right;
        height: 285px;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: end;
        align-items: flex-end
    }
}

.twitter-slider .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
    display: inline-block;
    margin: 0 2px
}

.twitter-slide {
    text-align: right
}

@media only screen and (max-width: 800px) {
    .twitter-slide {
        direction: rtl;
        margin-bottom: 40px
    }
}

@media only screen and (min-width: 801px) {
    .twitter-slide {
        opacity: 1;
        transition: none;
        padding-left: 70px
    }
}

@media only screen and (min-width: 801px) {
    .prev .twitter-slide {
        padding-left: 35px
    }
}

@media only screen and (min-width: 801px) {
    .prev2 .twitter-slide {
        padding-left: 0
    }
}

.twitter-slide__inner {
    background: #fff;
    padding: 1.875rem 1.25rem 1.25rem;
    box-shadow: 0 7px 15px rgba(0, 0, 0, 0.2);
    transition: background .2s linear;
    border-radius: .25rem
}

@media only screen and (min-width: 801px) {
    .twitter-slide__inner {
        opacity: 0;
        background: #1ea1f1
    }
}

.swiper-slide-active .twitter-slide__inner {
    opacity: 1;
    background: #fff
}

.prev .twitter-slide__inner {
    opacity: 1
}

@media only screen and (min-width: 801px) {
    .prev .twitter-slide__inner {
        background: #73c3f5
    }
}

.prev2 .twitter-slide__inner {
    opacity: 1
}

@media only screen and (min-width: 801px) {
    .prev2 .twitter-slide__inner {
        background: #2ea8f1
    }
}

.twitter-slide__user {
    display: -ms-flexbox;
    display: flex;
    margin-bottom: .625rem
}

@media only screen and (min-width: 801px) {
    .twitter-slide__user {
        opacity: 0
    }
}

.swiper-slide-active .twitter-slide__user {
    opacity: 1;
    transition: .2s opacity linear
}

.twitter-slide__avatar {
    height: 1.875rem;
    width: 1.875rem;
    border-radius: 50%;
    margin-left: .625rem
}

.twitter-slide__name {
    font-size: .9375rem;
    color: #666;
    line-height: 1
}

.twitter-slide__email {
    font-size: .75rem;
    color: #a3a3a3
}

.twitter-slide__text {
    font-size: .875rem;
    color: #666;
    margin-bottom: .9375rem;
    line-height: 1.5rem;
    height: 4.5rem;
    overflow: hidden
}

@media only screen and (min-width: 801px) {
    .twitter-slide__text {
        opacity: 0
    }
}

.swiper-slide-active .twitter-slide__text {
    opacity: 1;
    transition: .2s opacity linear
}

.twitter-slide__details {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    border-top: 1px solid #EAEAEA;
    padding-top: .625rem
}

@media only screen and (min-width: 801px) {
    .twitter-slide__details {
        opacity: 0
    }
}

.swiper-slide-active .twitter-slide__details {
    opacity: 1;
    transition: .2s opacity linear
}

.twitter-slide__info {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    font-size: .75rem;
    color: #666;
    margin-left: 1.25rem
}

.twitter-slide__info svg {
    margin-right: .3125rem;
    fill: #a3a3a3
}

.insta-slide {
    display: inline-block !important;
    background: #fff;
    overflow: hidden;
    border-radius: .25rem;
    padding: 1.0625rem .8125rem;
    width: 13.375rem;
    direction: ltr;
    text-align: left;
    color: #000
}

.insta-slide__header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: baseline;
    align-items: baseline;
    margin-bottom: .625rem
}

.insta-slide__avatar {
    font-size: .75rem;
    color: #766b6b
}

.insta-slide__avatar i {
    display: inline-block;
    height: 1.5rem;
    width: 1.5rem;
    border-radius: 50%;
    margin-right: .3125rem
}

.insta-slide__img {
    position: relative;
    margin-bottom: .625rem;
    overflow: hidden
}

.insta-slide__img::after {
    content: '';
    display: block;
    padding-top: 101%
}

.insta-slide__img i {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.insta-slide__img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.insta-slide__icons {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.insta-slide__icons svg {
    fill: #363636
}

.insta-slide__icons svg:not(.icon--bookmark) {
    margin-right: .3125rem
}

.insta-slide__likes {
    font-size: .5625rem;
    margin-bottom: .25rem
}

.insta-slide__text {
    font-size: .625rem;
    text-align: right;
    line-height: 1.25rem;
    height: 1.25rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.insta-slide__tags {
    font-size: .5625rem;
    color: #67acf0;
    line-height: 1.25rem;
    height: 1.25rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.insta-slider {
    position: relative;
    min-height: 100%
}

@media only screen and (max-width: 800px) {
    .insta-slider {
        min-height: 200px
    }
}

.insta-slider__error {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 9.375rem;
    opacity: 0;
    pointer-events: none;
    transition: all 0.2s;
    z-index: 2
}

.insta-slider.error .insta-slider__error {
    opacity: 1;
    pointer-events: auto
}

.insta-slider__error span {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 10px);
    background: #fff;
    border-radius: 3px;
    padding: .625rem;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
    font-size: .75rem
}

.insta-slider__error button {
    position: relative;
    display: block;
    margin: 0 auto;
    width: 2.1875rem;
    height: 2.1875rem;
    border-radius: 50%;
    background: #0078c8
}

.insta-slider__error button:active, .insta-slider__error button.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.insta-slider__error button svg {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    fill: #fff
}

.insta-slider .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 2;
    pointer-events: none
}

.insta-slider.loaded .loading {
    opacity: 0
}

.insta-slider .swiper-slide {
    display: inline-block;
    width: auto;
    padding-left: 15px
}

.insta-slider .swiper-container {
    overflow: visible
}

.blog .section-wrap {
    padding: 0 15px
}

.blog [data-fancybox] {
    cursor: pointer
}

.blog-intro {
    position: relative
}

.blog-intro::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #00bee6;
    background: linear-gradient(-90deg, #00bee6 0%, #78be1e 100%);
    opacity: .3
}

.blog-introbg {
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    top: 0;
    z-index: 2;
    overflow: hidden
}

.blog-introimg {
    position: absolute;
    left: 0;
    right: 0;
    height: 120%;
    bottom: 0
}

.blog-introwrap {
    padding-left: 15px;
    padding-right: 15px;
    max-width: 74.375rem;
    margin: 0 auto;
    position: relative;
    height: 26.875rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    z-index: 2
}

.blog-introtitle {
    font-size: 0;
    text-shadow: 0 0 10px BLACK;
    background: #00000055;
    padding: 15px;
    border-radius: 5px
}

.blog-introtitle a {
    color: #fff
}

.blog-introtitle li {
    font-size: 1rem;
    position: relative;
    display: inline-block
}

.blog-introtitle li:not(:last-of-type) {
    margin-left: .9375rem
}

.blog-introtitle li:not(:last-of-type)::after {
    content: '.';
    line-height: 1;
    color: rgba(255, 255, 255, 0.7);
    display: block;
    position: absolute;
    left: -.625rem;
    bottom: .4375rem
}

.blog-introtitle h1 {
    color: #fff
}

.blog-introtags, .blog-writer {
    position: absolute
}

.blog-introtags {
    left: 15px;
    bottom: 0;
    padding-bottom: .9375rem;
    direction: ltr
}

.blog-introtags a {
    display: inline-block;
    margin-right: .9375rem
}

.blog-introtags svg {
    fill: rgba(255, 255, 255, 0.4)
}

.blog-introtags svg.icon--bookmark2 {
    width: 1.4375rem;
    height: 1.625rem
}

.blog-introtags svg.icon--heart3 {
    width: 1.8125rem;
    height: 1.625rem
}

.blog-writer {
    position: absolute;
    right: 50%;
    -ms-transform: translate(50%, -2.6875rem);
    transform: translate(50%, -2.6875rem);
    top: 100%;
    color: #999;
    font-size: 1.0625rem;
    text-align: center
}

.blog-writerimage {
    margin: 0 auto;
    display: block;
    height: 6rem;
    width: 6rem;
    border: 2px solid #fff;
    border-radius: 50%;
    margin-bottom: .9375rem;
    box-shadow: 0 5px 21px rgba(0, 0, 0, 0.16)
}

.blog-contentwrap {
    max-width: 53.75rem;
    margin: 0 auto;
    padding: 0 15px
}

.blog-content {
    position: relative;
    font-size: 1.1875rem;
    color: #373737;
    background: #F4F2F2;
    padding: 12.5rem 0 6.25rem
}

@media only screen and (max-width: 800px) {
    .blog-content {
        font-size: 1.125rem
    }
}

@media only screen and (max-width: 500px) {
    .blog-content {
        font-size: 1rem
    }
}

.blog-text > * {
    margin-bottom: 1rem
}

.blog-text strong {
    font-weight: bold
}

.blog-text p {
    text-align: justify;
    font-size: 1.1875rem
}

@media only screen and (max-width: 800px) {
    .blog-text p {
        font-size: 1.125rem
    }
}

@media only screen and (max-width: 500px) {
    .blog-text p {
        font-size: 1rem
    }
}

.blog-text p a {
    color: #0078c8
}

.blog-text p a:hover {
    color: #005995
}

.blog-text img {
    display: block;
    width: auto;
    max-width: 100%;
    margin: 3.75rem auto;
    height: auto
}

.blog-text h1, .blog-text h2, .blog-text h3, .blog-text h4, .blog-text h5, .blog-text h6 {
    margin: 1.25rem 0
}

.blog-text h1 {
    font-size: 1.5625rem
}

@media only screen and (max-width: 500px) {
    .blog-text h1 {
        font-size: 1.25rem
    }
}

.blog-text h2 {
    font-size: 1.375rem
}

@media only screen and (max-width: 500px) {
    .blog-text h2 {
        font-size: 1.125rem
    }
}

.blog-text h3 {
    font-size: 1.25rem
}

@media only screen and (max-width: 500px) {
    .blog-text h3 {
        font-size: 1.0625rem
    }
}

.blog-text h4 {
    font-size: 1.125rem
}

@media only screen and (max-width: 500px) {
    .blog-text h4 {
        font-size: 1rem
    }
}

.blog-text h5 {
    font-size: 1rem
}

@media only screen and (max-width: 500px) {
    .blog-text h5 {
        font-size: .875rem
    }
}

.blog-text h6 {
    font-size: .875rem
}

.blog-text ul {
    margin: 3.125rem 0
}

.blog-text ul li {
    position: relative;
    padding-right: 1.5625rem
}

.blog-text ul li:not(:last-child) {
    margin-bottom: .625rem
}

@media only screen and (max-width: 500px) {
    .blog-text ul li {
        padding-right: .9375rem
    }
}

.blog-text ul li::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    right: 0;
    top: 10px;
    background-color: #0078c8
}

@media only screen and (max-width: 500px) {
    .blog-text ul li::before {
        width: 6px;
        height: 6px;
        top: 8px
    }
}

.blog-text ul i {
    -ms-flex: none;
    flex: none;
    display: inline-block;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    height: 2rem;
    width: 2rem;
    border-radius: 50%;
    border: 1px solid rgba(0, 120, 200, 0.3);
    color: #0078c8;
    line-height: 2.0625rem
}

.blog-text ul b {
    -ms-flex: none;
    flex: none;
    display: inline-block;
    margin: 0 .625rem
}

.blog-tags {
    margin-top: 3.125rem;
    display: -ms-flexbox;
    display: flex;
    font-size: 1.1875rem
}

@media only screen and (max-width: 800px) {
    .blog-tags {
        font-size: 1.125rem
    }
}

@media only screen and (max-width: 500px) {
    .blog-tags {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        font-size: 1rem
    }
}

.blog-tags ul {
    margin-right: .9375rem
}

@media only screen and (max-width: 500px) {
    .blog-tags ul {
        width: 100%;
        margin: .625rem 0 0
    }
}

.blog-tags li {
    display: inline-block;
    padding: 0
}

.blog-tags span {
    display: inline-block;
    margin-top: .375rem
}

.blog-tags a {
    display: inline-block;
    height: 3rem;
    line-height: 3rem;
    color: #0078c8;
    border: 1px solid rgba(0, 120, 200, 0.15);
    border-radius: 3rem;
    padding: 0 1.25rem;
    margin: 0 0 .625rem .4375rem
}

@media only screen and (max-width: 800px) {
    .blog-tags a {
        height: 40px;
        line-height: 40px;
        border-radius: 40px;
        margin: 0 0 7px 5px
    }
}

@media only screen and (max-width: 500px) {
    .blog-tags a {
        height: 37px;
        line-height: 37px;
        border-radius: 37px;
        margin: 0 0 5px 3px
    }
}

.blog-tags a:hover {
    color: #005995
}

.blog-advertisement {
    background: #E6E6E6;
    padding: 2.5rem 0;
    margin: 6.25rem 0 5rem !important
}

.blog-advertisement .s-subtitle {
    color: #666
}

.blog-advertisement .s-header {
    margin-bottom: 1.25rem
}

.blog-advertext {
    font-size: 1.0625rem;
    color: #000;
    margin-bottom: 1.875rem
}

.blog-flipimage {
    position: relative
}

@media only screen and (min-width: 801px) {
    .blog-flipimage {
        -ms-transform: translateX(-3.125rem);
        transform: translateX(-3.125rem);
        margin-top: -6.25rem
    }
}

@media only screen and (max-width: 800px) {
    .blog-flipimage {
        margin-bottom: 1.875rem
    }
}

.blog-flipimage img {
    margin: 0;
    display: block
}

.blog-flipimage img:last-of-type {
    width: 100%;
    max-width: 24.375rem;
    margin: 0 auto
}

.blog-flipimage img:first-of-type {
    position: relative;
    width: 85%;
    max-width: 22.75rem;
    margin: 0 auto -3.125rem;
    z-index: 2
}

@media only screen and (max-width: 800px) {
    .blog-btn {
        text-align: center
    }
}

.blog-gallery {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 3.75rem
}

.blog-gallery img {
    width: 100%;
    height: auto
}

.blog-gallerycol {
    width: calc(33.33% - 0.875rem);
    margin: 0 0 .875rem
}

@media only screen and (max-width: 500px) {
    .blog-gallerycol {
        width: 100%;
        margin: 0 0 .9375rem
    }
}

.blog-banner {
    position: relative;
    height: 31.375rem;
    margin: 5rem 0 16.875rem
}

.blog-banner .blog-contentwrap {
    height: 100%;
    position: relative
}

.blog-bannerbg {
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    top: 0;
    overflow: hidden
}

.blog-bannerimg {
    position: absolute;
    left: 0;
    right: 0;
    height: 120%;
    bottom: 0
}

.blog-bannertext {
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    margin: 0 auto 0;
    -ms-transform: translateY(80%);
    transform: translateY(80%);
    box-shadow: 0 0 55px rgba(0, 0, 0, 0.08);
    background: #F4F2F2;
    padding: 1.875rem 6.25rem;
    text-align: center
}

@media only screen and (max-width: 500px) {
    .blog-bannertext {
        padding: 20px 60px
    }
}

.blog-bannertext svg.icon--share2 {
    margin-top: 2.1875rem;
    fill: #707070
}

.blog-bannercontent {
    position: relative
}

.blog-bannercontent svg.icon--quote2 {
    position: absolute
}

.blog-bannercontent svg.icon--quote2:first-of-type {
    top: .625rem;
    right: -3.125rem;
    fill: #0182c6
}

.blog-bannercontent svg.icon--quote2:nth-of-type(2) {
    bottom: .625rem;
    left: -3.125rem;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    fill: #78be1e
}

.blog-highlight {
    display: block;
    margin: 0;
    background: #F7f7f7;
    padding: 1.875rem 2.5rem;
    font-size: 1rem;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.03)
}

.blog-highlight p {
    font-size: 1rem
}

.blog-highlight ul {
    margin: 1.5625rem 0 0;
    padding: 0
}

.blog-highlight ul li {
    margin: 0 0 0 .625rem;
    display: inline-block
}

.blog-highlight ul a {
    color: #0078c8
}

.blog-highlight ul a:hover {
    color: #005995
}

.blog-resources {
    margin: 3.125rem 0;
    padding: .9375rem 0;
    display: -ms-flexbox;
    display: flex;
    font-size: 1.1875rem;
    border-top: 1px solid #D1D1D1;
    border-bottom: 1px solid #D1D1D1
}

@media only screen and (max-width: 500px) {
    .blog-resources {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

.blog-resources ul {
    margin: 0 .9375rem 0 0 !important
}

@media only screen and (max-width: 500px) {
    .blog-resources ul {
        width: 100%;
        margin: .625rem 0 0 !important
    }
}

.blog-resources li {
    display: inline-block;
    padding: 0;
    margin: 0 !important
}

.blog-resources span {
    display: inline-block
}

.blog-resources a {
    font-size: 1rem;
    display: inline-block;
    color: #0078c8;
    margin: 0 0 0 1.25rem
}

.blog-resources a:hover {
    color: #005995
}

.blog-slider {
    position: relative;
    background: #E6E6E6;
    padding: 3.125rem 0;
    margin: 3.125rem 0 3.75rem
}

.blog-slider .section-wrap {
    position: relative;
    padding: 0 15px
}

.blog-slider .swiper-slide {
    display: block;
    position: relative;
    border-radius: .25rem;
    overflow: hidden
}

.blog-slider .swiper-slide::after {
    content: '';
    display: block;
    padding-top: 100%
}

.blog-slider .swiper-slide img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.blog-slider .swiper-button-prev, .blog-slider .swiper-button-next {
    top: calc(50% + 2.5rem);
    width: 2.3125rem;
    height: 3rem
}

.blog-slider .swiper-button-next {
    border-radius: 3rem 0 0 3rem;
    left: 5px;
    right: auto
}

@media only screen and (min-width: 1201px) {
    .blog-slider .swiper-button-next {
        left: -.625rem;
        right: auto
    }
}

.blog-slider .swiper-button-prev {
    border-radius: 0 3rem 3rem 0;
    left: auto;
    right: 5px
}

@media only screen and (min-width: 1201px) {
    .blog-slider .swiper-button-prev {
        right: -.625rem
    }
}

.blog-slidertitle {
    text-align: center;
    margin-bottom: 1.875rem;
    color: gray
}

.blog-sliderimage {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2
}

.blog-sliderimage::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    display: block;
    width: 100%;
    height: 40%;
    background: #000;
    background: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, 0) 100%);
    opacity: .8
}

.blog-sliderimage i {
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 0 1.875rem 1.875rem;
    color: #fff;
    font-size: 1.125rem;
    z-index: 2
}

@media only screen and (max-width: 800px) {
    .blog-sliderimage i {
        font-size: 16px
    }
}

@media only screen and (max-width: 500px) {
    .blog-sliderimage i {
        font-size: 14px
    }
}

.blog-video {
    position: relative;
    margin: 3.75rem 0 6.25rem;
    min-height: 210px
}

.blog-video::after {
    content: '';
    display: block;
    width: 100%;
    padding-top: 43%
}

.blog-video::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: .38;
    background: linear-gradient(45deg, #00a03c 0%, #0078c8 100%);
    z-index: 2
}

.blog-video .videoplayer-play {
    z-index: 3;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.blog-video img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.blog-videoimage {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1
}

.blog-videoplay {
    z-index: 3;
    height: 6rem;
    width: 6rem;
    background: linear-gradient(-135deg, #00bee6 0%, #78be1e 180%);
    border-radius: 50%;
    display: block;
    text-align: center;
    line-height: 0
}

@media only screen and (max-width: 800px) {
    .blog-videoplay {
        height: 86px;
        width: 86px
    }
}

@media only screen and (max-width: 800px) {
    .blog-videoplay {
        height: 66px;
        width: 66px
    }
}

.blog-videoplay svg {
    display: inline-block;
    height: 2.125rem;
    width: 2.125rem;
    fill: #fff;
    margin-left: .5625rem
}

@media only screen and (max-width: 800px) {
    .blog-videoplay svg {
        height: 24px;
        width: 24px;
        margin-left: 6px
    }
}

@media only screen and (max-width: 500px) {
    .blog-videoplay svg {
        height: 20px;
        width: 20px;
        margin-left: 3px
    }
}

.blog-footer {
    position: relative;
    margin: 7.5rem 0 0
}

.blog-footer::after {
    content: '';
    position: absolute;
    right: 50%;
    -ms-transform: translateX(calc(50% + 15px));
    transform: translateX(calc(50% + 15px));
    top: -3.6875rem;
    width: 53px;
    overflow: hidden;
    box-shadow: 0px 3px 0px 2px #1d4f9b, -5px 3px 0px 2px #0182c6, -10px 3px 0px 2px #019e43, -30px 3px 0px 2px #78be1e
}

.blog-footer li {
    display: inline-block;
    margin: 0 0 .625rem .3125rem
}

.blog-footer a {
    display: inline-block;
    height: 4rem;
    line-height: 4rem;
    border-radius: 4rem;
    padding: 0 .9375rem;
    font-size: 1.125rem;
    color: #666;
    background: #fff;
    box-shadow: 0 3px 4px rgba(0, 0, 0, 0.16)
}

@media only screen and (max-width: 800px) {
    .blog-footer a {
        font-size: 1rem;
        height: 55px;
        line-height: 55px;
        border-radius: 55px;
        padding: 0 12px
    }
}

@media only screen and (max-width: 500px) {
    .blog-footer a {
        height: 45px;
        line-height: 45px;
        border-radius: 45px
    }
}

.blog-justified {
    margin: 1.875rem -18px
}

.blog-justified a {
    display: block;
    border-radius: .25rem
}

.blog-justified img {
    width: 100%;
    height: auto
}

.blog .h_iframe-aparat_embed_frame {
    margin: 3.75rem 0 6.25rem
}

.blog-share {
    text-align: center
}

@media only screen and (min-width: 1051px) {
    .blog-share {
        position: absolute;
        right: 0;
        top: -1.875rem;
        z-index: 98;
        display: block;
        -ms-transform: translateX(100%);
        transform: translateX(100%);
        transition: transform .3s ease-in-out
    }

    .blog-share.fixed {
        position: fixed;
        top: 100px
    }

    .blog-share.show {
        -ms-transform: translateX(-30px);
        transform: translateX(-30px)
    }

    .blog-share.end {
        position: absolute;
        right: 0;
        top: auto;
        bottom: 100px
    }
}

@media only screen and (max-width: 1050px) {
    .blog-share {
        margin-top: 50px
    }
}

.blog-share ul {
    width: 4.375rem;
    background: #fff;
    padding: 1.25rem 0;
    position: relative;
    line-height: 0
}

@media only screen and (max-width: 1050px) {
    .blog-share ul {
        display: inline-block;
        width: auto;
        padding: 10px
    }
}

.blog-share ul::after {
    content: '';
    position: absolute;
    left: 100%;
    top: 0;
    width: .375rem;
    height: 100%;
    background: linear-gradient(-30deg, #78be1e 0%, #00bee6 100%)
}

@media only screen and (max-width: 1050px) {
    .blog-share ul::after {
        left: 0;
        top: auto;
        bottom: 100%;
        width: 100%;
        height: 6px
    }
}

.blog-share li {
    display: block;
    font-size: 0;
    margin-bottom: .625rem
}

@media only screen and (max-width: 1050px) {
    .blog-share li {
        display: inline-block;
        margin: 0
    }
}

.blog-share li:last-of-type {
    margin-bottom: 0
}

.blog-share li a {
    position: relative;
    display: inline-block;
    height: 2.5rem;
    width: 2.5rem;
    transition: .15s background linear
}

@media only screen and (max-width: 800px) {
    .blog-share li a {
        width: 40px;
        height: 40px
    }
}

@media only screen and (min-width: 801px) {
    .blog-share li a.twitter:hover {
        background: #1ea1f1;
        border-color: #1ea1f1
    }
}

@media only screen and (min-width: 801px) {
    .blog-share li a.instagram:hover {
        background: linear-gradient(45deg, #f09a49 0%, #b32d9d 100%);
        border-color: transparent
    }
}

@media only screen and (min-width: 801px) {
    .blog-share li a.facebook:hover {
        background: #08c;
        border-color: #08c
    }
}

.blog-share li svg {
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 65%;
    height: 65%;
    fill: gray;
    transition: .15s fill linear
}

@media only screen and (min-width: 801px) {
    .blog-share li a:hover svg {
        fill: #00bee6
    }
}

.pi-modal {
    display: -ms-flexbox;
    display: flex
}

.pi-modal-open .pi-modal {
    transition: all 0.3s linear;
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}

@media only screen and (max-width: 730px) {
    .pi-modal .mls-close {
        position: fixed;
        top: 5.3125rem
    }
}

@media only screen and (max-width: 730px) {
    .pi-modal {
        -ms-flex-direction: column;
        flex-direction: column;
        overflow-y: auto;
        direction: ltr
    }
}

@media only screen and (max-width: 1200px) {
    .pi-modal__sidebar {
        padding-right: 3.75rem
    }
}

@media only screen and (max-width: 1050px) {
    .pi-modal__sidebar {
        -ms-flex: 0 0 46%;
        flex: 0 0 46%;
        padding-left: 3.75rem;
        padding-bottom: 5.3125rem;
        padding-right: 6.25rem
    }
}

@media only screen and (max-width: 900px) {
    .pi-modal__sidebar {
        padding-right: 3.75rem
    }
}

@media only screen and (max-width: 800px) {
    .pi-modal__sidebar {
        padding-right: 2.5rem;
        padding-left: 1.25rem
    }
}

@media only screen and (max-width: 730px) {
    .pi-modal__sidebar {
        overflow-y: initial;
        box-shadow: none;
        padding: 1.25rem 1.875rem 8.125rem
    }

    .pi-modal--add-to .pi-modal__sidebar {
        padding-top: .875rem;
        padding-bottom: 0
    }
}

.pi-modal__sidebar-in {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

@media only screen and (max-width: 730px) {
    .pi-modal__sidebar-in {
        -ms-flex: none;
        flex: none;
        box-shadow: none;
        -ms-flex-align: center;
        align-items: center
    }
}

.pi-modal:not(.pi-modal--loading) .pi-modal__sidebar-in > .loading {
    opacity: 0
}

.pi-modal__sidebar-in [data-sidebar] {
    opacity: 0;
    transition: all 0.2s linear
}

.pi-modal:not(.pi-modal--loading) [data-sidebar] {
    opacity: 1
}

@media only screen and (max-width: 730px) {
    .pi-modal__logo {
        display: none
    }
}

.pi-modal__header {
    margin-top: 2.6875rem;
    margin-bottom: 2.0625rem
}

@media only screen and (max-width: 730px) {
    .pi-modal__header {
        margin-top: 0;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

.pi-modal__title {
    font-size: 1.1875rem;
    color: gray;
    margin-bottom: 1px
}

@media only screen and (max-width: 730px) {
    .pi-modal__title {
        font-size: 1rem;
        margin-bottom: .3125rem
    }

    .pi-modal--add-to .pi-modal__title {
        font-size: .875rem;
        margin-bottom: 0
    }
}

.pi-modal__subtitle {
    font-size: 1.5625rem;
    color: #545454;
    margin-bottom: .5625rem
}

@media only screen and (max-width: 730px) {
    .pi-modal__subtitle {
        font-size: 1.25rem;
        margin-bottom: .625rem
    }

    .pi-modal--add-to .pi-modal__subtitle {
        font-size: 1.125rem;
        margin-bottom: .3125rem
    }
}

.pi-modal__model {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    height: 1.875rem;
    line-height: 1.875rem;
    padding: .1875rem .625rem 0;
    background: #00bee6;
    background: linear-gradient(45deg, #00bee6 0%, #78be1e 100%);
    border-radius: 4px;
    font-size: 0
}

@media only screen and (max-width: 730px) {
    .pi-modal--add-to .pi-modal__model {
        height: 1.5625rem;
        line-height: 1.5625rem;
        padding: .125rem .25rem 0 .375rem
    }
}

.pi-modal__model span:first-child {
    font-size: 1.25rem;
    color: #fff
}

@media only screen and (max-width: 730px) {
    .pi-modal--add-to .pi-modal__model span:first-child {
        font-size: 1.125rem
    }
}

.pi-modal__model span:last-child {
    font-size: 1rem;
    color: #fff;
    margin-right: .625rem
}

@media only screen and (max-width: 730px) {
    .pi-modal--add-to .pi-modal__model span:last-child {
        font-size: .8125rem;
        margin-right: 1.25rem
    }
}

.pi-modal__features-wrap > div {
    max-height: 9.375rem;
    overflow-y: hidden;
    margin-left: -4.375rem;
    transition: all 0.7s ease-out
}

.pi-modal__features-wrap.open > div {
    max-height: 93.75rem
}

.pi-modal__features-wrap button {
    position: relative;
    margin-top: .625rem;
    padding-right: 1.5625rem;
    transition: all 0.15s
}

@media only screen and (min-width: 801px) {
    .pi-modal__features-wrap button:hover {
        color: #006ebe
    }
}

.pi-modal__features-wrap button::after, .pi-modal__features-wrap button::before {
    content: '';
    width: .875rem;
    height: 2px;
    border-radius: 2px;
    background: #707070;
    position: absolute;
    top: .8125rem;
    right: 0;
    transition: all 0.15s
}

@media only screen and (min-width: 801px) {
    .pi-modal__features-wrap button:hover::before, .pi-modal__features-wrap button:hover::after {
        background: #006ebe
    }
}

.pi-modal__features-wrap button::before {
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.pi-modal__features-wrap.open button::before {
    -ms-transform: rotate(0deg);
    transform: rotate(0deg)
}

.pi-modal__features {
    font-size: .875rem;
    color: #373737
}

.pi-modal__features:not(:first-child) {
    margin-top: 1.25rem
}

.pi-modal__features-title {
    font-size: 1rem;
    color: #006ebe;
    margin-bottom: .75rem
}

.pi-modal__features > ul > li {
    position: relative;
    padding-right: 1.25rem
}

.pi-modal__features > ul > li:not(:first-child) {
    margin-top: .3125rem
}

.pi-modal__features > ul > li::before {
    content: '';
    position: absolute;
    right: 0;
    top: .6875rem;
    width: .75rem;
    height: .125rem;
    border-radius: .125rem;
    background-color: #E6E6E6
}

.pi-modal__features > ul > li span {
    display: inline-block;
    margin-right: .3125rem;
    line-height: 1
}

.pi-modal__select-color {
    margin-top: 1.375rem
}

@media only screen and (max-width: 730px) {
    .pi-modal--add-to .pi-modal__select-color {
        margin-top: .5rem
    }
}

.pi-modal__select-color > span {
    font-size: 1rem;
    color: #666
}

@media only screen and (max-width: 730px) {
    .pi-modal__select-color > span {
        font-size: .875rem;
        text-align: center;
        margin-top: .9375rem
    }

    .pi-modal--add-to .pi-modal__select-color > span {
        display: none
    }
}

.pi-modal__colors {
    margin-top: .75rem
}

@media only screen and (max-width: 730px) {
    .pi-modal--add-to .pi-modal__colors {
        display: none
    }
}

.pi-modal__colors ul {
    display: -ms-flexbox;
    display: flex
}

.pi-modal__colors li {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center
}

.pi-modal__colors li:not(:last-child) {
    margin-left: 1.0625rem
}

.pi-modal__color-name {
    font-size: .875rem;
    color: #666;
    display: block;
    margin-top: .75rem
}

.pi-modal__color-name span {
    display: none
}

@media only screen and (max-width: 730px) {
    .pi-modal__color-name {
        margin-top: .6875rem
    }

    .pi-modal--add-to .pi-modal__color-name span {
        display: initial
    }
}

.pi-modal__color-tag {
    display: none
}

@media only screen and (max-width: 730px) {
    .pi-modal--add-to .pi-modal__color-tag {
        display: -ms-inline-flexbox;
        display: inline-flex;
        height: 1.5rem;
        line-height: 1.5rem;
        font-size: .75rem;
        font-family: IRANSans, tahoma, arial;
        color: #666;
        -ms-flex-align: center;
        align-items: center;
        padding-right: .3125rem;
        padding-left: .8125rem;
        border: 1px solid #E6E6E6;
        border-radius: 6.25rem
    }

    .pi-modal--add-to .pi-modal__color-tag span {
        display: inline-block;
        width: .875rem;
        height: .875rem;
        border-radius: 6.25rem;
        border: 1px solid #c9c9c9;
        margin-left: .625rem
    }
}

.pi-modal__sidebar-footer {
    margin-top: 3rem;
    max-width: 17.6875rem
}

@media only screen and (max-width: 730px) {
    .pi-modal__sidebar-footer {
        max-width: none;
        margin-top: 2.5rem
    }

    .pi-modal--add-to .pi-modal__sidebar-footer {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        width: 100%;
        max-width: 20rem;
        position: fixed;
        bottom: 0;
        left: 50%;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        padding-bottom: 6rem
    }
}

.pi-modal__price, .pi-modal__product-price {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 730px) {
    .pi-modal--add-to .pi-modal__price, .pi-modal--add-to .pi-modal__product-price {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-order: 3;
        order: 3;
        border-top: 1px solid #E6E6E6;
        margin-top: 1rem;
        padding-top: 1rem
    }
}

.pi-modal__price span:first-child, .pi-modal__product-price span:first-child {
    font-size: .875rem;
    color: #666
}

.pi-modal__price .pi-modal__price-value, .pi-modal__product-price .pi-modal__price-value {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.pi-modal__price .pi-modal__price-value span:first-child, .pi-modal__product-price .pi-modal__price-value span:first-child {
    font-size: 1.25rem;
    color: #545454;
    margin-left: 5px
}

.pi-modal__price .pi-modal__price-value span:last-child, .pi-modal__product-price .pi-modal__price-value span:last-child {
    font-size: .75rem;
    color: #373737
}

.pi-modal__product-price {
    display: none
}

@media only screen and (max-width: 730px) {
    .pi-modal--add-to .pi-modal__product-price {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-order: 1;
        order: 1;
        border-top: none
    }

    .pi-modal--add-to .pi-modal__product-price span:first-child {
        font-size: .875rem;
        font-family: IRANSansLight, IRANSans, tahoma, arial;
        color: gray;
        margin-left: 0
    }

    .pi-modal--add-to .pi-modal__product-price .pi-modal__price-value span:first-child {
        font-size: 1.25rem;
        font-family: IRANSansMedium, IRANSans, tahoma, arial;
        margin-left: .6875rem;
        color: #545454
    }

    .pi-modal--add-to .pi-modal__product-price .pi-modal__price-value span:last-child {
        font-size: .75rem;
        font-family: IRANSansLight, IRANSans, tahoma, arial;
        color: gray;
        margin-left: .125rem
    }
}

.pi-modal__discount, .pi-modal__festival-discount {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: .75rem
}

.pi-modal__discount span:first-child, .pi-modal__festival-discount span:first-child {
    font-size: .875rem;
    color: #f22b2b
}

.pi-modal__discount .pi-modal__price-value, .pi-modal__festival-discount .pi-modal__price-value {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center
}

.pi-modal__discount .pi-modal__price-value span:first-child, .pi-modal__festival-discount .pi-modal__price-value span:first-child {
    display: inline-block;
    direction: ltr;
    font-size: 1rem;
    color: #f22b2b;
    -ms-flex-order: 2;
    order: 2
}

.pi-modal__discount .pi-modal__price-value span:nth-child(2), .pi-modal__festival-discount .pi-modal__price-value span:nth-child(2) {
    font-size: .75rem;
    color: #f22b2b;
    margin-right: 5px;
    -ms-flex-order: 3;
    order: 3
}

.pi-modal__discount .pi-modal__price-value span:nth-child(3), .pi-modal__festival-discount .pi-modal__price-value span:nth-child(3) {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 8px;
    background: #f22b2b;
    padding: 2px 10px;
    border-radius: 6.25rem;
    font-size: .8125rem;
    color: #ffffff;
    -ms-flex-order: 1;
    order: 1
}

.pi-modal__festival-discount {
    display: none
}

@media only screen and (max-width: 730px) {
    .pi-modal--add-to .pi-modal__festival-discount {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-order: 2;
        order: 2;
        margin-top: .125rem
    }

    .pi-modal--add-to .pi-modal__festival-discount span:nth-child(1) {
        font-size: .875rem;
        color: #f22b2b;
        margin-left: .4375rem
    }

    .pi-modal--add-to .pi-modal__festival-discount span:nth-child(2) {
        font-size: .875rem;
        color: #f22b2b
    }

    .pi-modal--add-to .pi-modal__festival-discount .pi-modal__price-value {
        margin-right: auto
    }

    .pi-modal--add-to .pi-modal__festival-discount .pi-modal__price-value span:first-child {
        font-size: .9375rem;
        color: #545454;
        margin-left: .6875rem;
        direction: ltr
    }

    .pi-modal--add-to .pi-modal__festival-discount .pi-modal__price-value span:nth-child(2) {
        font-size: .75rem;
        color: gray;
        margin-left: .125rem
    }
}

.pi-modal__btn {
    margin-top: 2.5rem
}

@media only screen and (max-width: 730px) {
    .pi-modal__btn {
        margin-top: 0;
        background-color: #fff;
        padding: 1.0625rem 1.75rem 3rem;
        width: 100%;
        text-align: center;
        position: fixed;
        bottom: 0;
        left: 50%;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        z-index: 2
    }
}

.pi-modal__btn--mobile {
    display: none
}

@media only screen and (max-width: 730px) {
    .pi-modal__btn--mobile {
        display: block
    }
}

.pi-modal--add-to .pi-modal__btn--mobile {
    display: none
}

@media only screen and (max-width: 730px) {
    .pi-modal__btn--desktop {
        display: none
    }
}

.pi-modal--add-to .pi-modal__btn--desktop {
    display: block
}

.pi-modal__btn .btn {
    min-width: 17.6875rem;
    height: 4rem;
    line-height: 4rem;
    font-size: 1.1875rem;
    padding: 0 4.0625rem
}

@media only screen and (max-width: 730px) {
    .pi-modal__btn .btn {
        min-width: 20rem;
        height: 3.125rem;
        line-height: 3.125rem;
        font-size: 1.125rem
    }
}

@media only screen and (max-width: 500px) {
    .pi-modal__btn .btn {
        max-width: none;
        width: 100%
    }
}

.pi-modal__product-view {
    -ms-flex: 1;
    flex: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: linear-gradient(to bottom, #fff, #fff)
}

@media only screen and (max-width: 730px) {
    .pi-modal__product-view {
        -ms-flex: none;
        flex: none;
        -ms-flex-order: -1;
        order: -1;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding-top: 2.875rem
    }
}

.pi-modal:not(.pi-modal--loading) .pi-modal__product-view .loading {
    opacity: 0
}

.pi-modal__product-view-bg {
    position: absolute;
    right: 5.625rem;
    top: 3.125rem;
    width: 15.9375rem;
    height: 18.3125rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover
}

@media only screen and (max-width: 900px) {
    .pi-modal__product-view-bg {
        right: 2.8125rem
    }
}

@media only screen and (max-width: 730px) {
    .pi-modal__product-view-bg {
        display: none
    }
}

.pi-modal__product-preview {
    position: relative;
    top: -1.875rem;
    width: 50vw;
    max-width: 37.5rem;
    opacity: 0;
    transition: all 0.2s linear
}

.pi-modal__product-preview::after {
    content: '';
    display: block;
    padding-top: 100%
}

.pi-modal:not(.pi-modal--loading) .pi-modal__product-preview {
    opacity: 1
}

@media only screen and (max-width: 800px) {
    .pi-modal__product-preview {
        top: -6.25rem
    }
}

@media only screen and (max-width: 730px) {
    .pi-modal__product-preview {
        top: 40%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .pi-modal--add-to .pi-modal__product-preview {
        width: 10.9375rem
    }
}

.pi-modal__product-preview img {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-width: 100%;
    max-height: 100%
}

@media only screen and (max-width: 730px) {
    .pi-modal__product-preview img:first-child {
        display: none
    }
}

.pi-modal__product-preview img:last-child {
    display: none
}

@media only screen and (max-width: 730px) {
    .pi-modal__product-preview img:last-child {
        display: block
    }
}

.pi-modal__product-view-footer {
    transition: all 0.2s ease-out;
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.pi-modal--loading .pi-modal__product-view-footer {
    opacity: 0;
    -ms-transform: translateY(2.5rem);
    transform: translateY(2.5rem)
}

@media only screen and (max-width: 730px) {
    .pi-modal__product-view-footer {
        display: none
    }
}

@media only screen and (max-width: 1050px) {
    .pi-modal__product-view-footer .bus {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

@media only screen and (max-width: 1050px) {
    .pi-modal__product-view-footer .card-f {
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center
    }
}

.pi-modal__product-view-footer .card-f__title {
    color: #373737
}

.pi-modal__product-view-footer .card-f__desc {
    color: rgba(55, 55, 55, 0.6)
}

@media only screen and (max-width: 1050px) {
    .pi-modal__product-view-footer .card-f__desc {
        text-align: center
    }
}

.page-productlist .nopadd-top {
    padding-top: 0 !important
}

.page-productlist .section-wrap {
    max-width: 72.5rem;
    padding: 1.25rem .625rem 4.6875rem .625rem
}

@media only screen and (max-width: 1050px) {
    .page-productlist .section-wrap {
        padding: 0 0 4.6875rem
    }
}

.page-productlist .row {
    margin: 0 -10px 0
}

@media only screen and (max-width: 1050px) {
    .page-productlist .row .row.card-product-wrap {
        margin-top: 1.25rem;
        padding: 0 20px
    }
}

.page-productlist [class*="col-"] {
    padding: 0 10px 0;
    margin-bottom: 0
}

.page-productlist .s-header {
    z-index: 2;
    top: calc(50% - 10.125rem);
    right: .625rem;
    max-width: 72.5rem;
    margin: 0 auto
}

@media only screen and (max-width: 800px) {
    .page-productlist .s-header {
        position: absolute
    }
}

@media only screen and (max-width: 800px) {
    .page-productlist .s-header {
        top: 2.125rem;
        right: 0;
        left: 0
    }
}

.page-productlist .s-header-wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: start;
    align-items: flex-start
}

@media only screen and (max-width: 800px) {
    .page-productlist .s-header-wrap {
        width: 100%;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.page-productlist .s-title {
    background: #14CBF1;
    border-radius: .25rem;
    padding: .625rem 1.875rem;
    color: #fff;
    opacity: 1;
    -ms-transform: none;
    transform: none
}

@media only screen and (max-width: 500px) {
    .page-productlist .s-title {
        padding: .5rem 1.25rem
    }
}

.page-productlist .intro-wrap {
    max-width: 72.5rem;
    padding-right: .625rem;
    padding-left: .625rem
}

@media only screen and (max-width: 800px) {
    .page-productlist .intro-content {
        top: 6.25rem;
        bottom: auto;
        -ms-transform: none;
        transform: none
    }
}

.page-productlist .intro-bg {
    height: 100%;
    background-image: linear-gradient(to right, #3FD0EF, #1392D3)
}

.page-productlist .intro-image {
    right: auto;
    top: auto;
    bottom: 0;
    height: 100%;
    left: calc(50% - 36.25rem);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: end;
    justify-content: flex-end;
    width: 36.25rem;
    -ms-transform: none !important;
    transform: none !important
}

@media only screen and (max-width: 800px) {
    .page-productlist .intro-image {
        left: 0;
        width: 100%;
        height: 18.75rem
    }
}

.page-productlist .intro-image img {
    max-width: 100%;
    max-height: 100%
}

.page-productlist .intro-desc {
    margin-top: 0rem;
    padding-bottom: 0
}

@media only screen and (max-width: 800px) {
    .page-productlist .intro-desc {
        text-align: center
    }
}

.page-productlist .intro-desc span {
    font-size: 1.5625rem;
    margin-bottom: 1.625rem;
    opacity: .8
}

.page-productlist .intro-desc i {
    font-size: 1.5625rem
}

.page-productlist .intro-desc button {
    font-size: .9375rem;
    height: 2.5rem;
    line-height: 2.5rem;
    padding: 0 1.375rem;
    transition: all .2s
}

.page-productlist .intro-wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

@media only screen and (max-width: 800px) {
    .page-productlist .intro-wrap {
        -ms-flex-align: center;
        align-items: center
    }
}

@media only screen and (max-width: 800px) {
    .page-productlist .intro .swiper-pagination {
        bottom: .9375rem;
        width: auto;
        right: auto;
        left: 50%;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

.a {
    padding: 20px
}

.card-customers {
    -ms-flex: 1;
    flex: 1;
    position: relative;
    text-align: center;
    border-radius: .25rem;
    background: #00b2e0;
    background: linear-gradient(45deg, #00b2e0 0%, #006ebe 100%);
    padding: 1.25rem 3.125rem;
    color: #fff;
    transition: background-color .15s linear
}

.card-customers__wrap {
    position: relative;
    z-index: 2
}

.card-customers img {
    height: 3.75rem;
    width: auto;
    margin-bottom: .9375rem
}

.card-customers__title {
    font-size: 1.0625rem;
    margin-bottom: .625rem
}

@media only screen and (max-width: 500px) {
    .card-customers__title {
        font-size: 16px
    }
}

.card-customers__text {
    font-size: .9375rem
}

.customers {
    width: 100%
}

.customers-title {
    color: #fff;
    margin-bottom: 1.5625rem;
    text-align: justify
}

.customers-hr {
    border-bottom: 1px solid #fff;
    opacity: .3;
    margin: 1.875rem 0 .9375rem
}

@media only screen and (max-width: 500px) {
    .customers-hr {
        margin: 40px 0 15px
    }
}

.customers-subtitle {
    font-size: .8125rem;
    color: #fff;
    margin-bottom: .3125rem;
    text-align: justify
}

.customers [class*="col-"] {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch
}

.customers-text {
    font-size: .875rem;
    color: #fff;
    opacity: .7;
    text-align: justify
}

.customers-text a {
    display: inline-block;
    direction: ltr;
    color: #fff
}

.page-agents #map {
    min-height: 400px
}

.page-agents #map::after {
    content: '';
    display: block;
    padding-top: 50%
}

.page-agents #map::before {
    content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #0078c8;
    opacity: 0;
    z-index: 1;
    pointer-events: none;
    transition: all .2s linear
}

#map.focused::before {
    opacity: .2
}

@media only screen and (min-width: 1051px) {
    .page-agents #map {
        height: 40.625rem
    }
}

.page-agents #map .leaflet-bottom {
    display: none
}

.page-agents .marker {
    height: 2.5rem;
    width: 2.5rem
}

.page-agents .leaflet-div-icon {
    background: transparent;
    border: 0
}

.page-agents .leaflet-marker-icon {
    z-index: 2
}

.page-agents .info-window {
    text-align: right
}

.page-agents .info-window::after {
    content: 'x';
    position: absolute;
    right: -7px;
    top: -7px;
    height: 20px;
    width: 20px;
    text-align: center;
    color: #fff;
    font-size: 14px;
    pointer-events: none
}

.page-agents .leaflet-popup-content {
    box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.2)
}

.page-agents .leaflet-popup-tip-container {
    top: -1px
}

.page-agents .leaflet-popup-close-button {
    background: #0078c8;
    border-radius: 50%;
    opacity: 1;
    height: 20px;
    width: 20px;
    right: -7px;
    top: -7px;
    transition: background .15s linear
}

.page-agents .leaflet-popup-close-button:hover {
    background: #005995
}

.page-agents .suggestions {
    position: absolute;
    top: 100%;
    right: 0;
    background: #fafafa;
    z-index: 99;
    width: 100%;
    border-radius: 0 0 .25rem .25rem
}

.page-agents .suggestions li {
    padding: 15px;
    display: block
}

.page-agents .suggestions li a {
    color: #000
}

.mapsearch {
    position: absolute;
    left: 0;
    width: 100%;
    top: 100%;
    -ms-transform: translateY(-5px);
    transform: translateY(-5px);
    background: #fff;
    padding: 1.5625rem 0;
    z-index: 5;
    border-radius: 0 0 .25rem .25rem;
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s linear, visibility 0s 0.3s;
    box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.15);
    overflow: hidden
}

.focused .mapsearch {
    transition: opacity 0.2s linear;
    opacity: 1;
    visibility: visible
}

.mapsearch::after {
    content: '';
    width: calc(100% - 1.875rem);
    height: 1px;
    background: #DADADA;
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    margin: auto
}

.mapsearch-content {
    direction: ltr;
    height: calc(100vh - 250px);
    max-height: 31.25rem
}

.noresult .mapsearch-content {
    height: auto
}

.mapsearch-content-in {
    direction: rtl
}

.mapsearch-noresult {
    padding: 1.875rem .9375rem;
    text-align: center;
    color: #4d4d4d;
    font-size: 1.125rem
}

.mapsearch ul {
    padding: 0 1.5625rem 0 1.25rem
}

@media only screen and (max-width: 500px) {
    .mapsearch ul {
        padding: 0 1.5625rem 0 10px
    }
}

.mapsearch .loading {
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 50px;
    pointer-events: none;
    transition: opacity .15s linear
}

.mapsearch.loaded .loading {
    opacity: 0
}

.mapsearch .ss-content {
    overflow-y: scroll
}

.page-retailers #retailers_map {
    min-height: 400px;
    border-bottom: 2px solid #e0e0e0;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.07)
}

.page-retailers #retailers_map::after {
    content: '';
    display: block;
    padding-top: 50%
}

.page-retailers #retailers_map::before {
    content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #0078c8;
    opacity: 0;
    z-index: 1;
    pointer-events: none;
    transition: all .2s linear
}

#map.focused::before {
    opacity: .2
}

@media only screen and (min-width: 1051px) {
    .page-retailers #retailers_map {
        height: 40.625rem
    }
}

.page-retailers #retailers_map .leaflet-bottom {
    display: none
}

.page-retailers .marker {
    height: 2.5rem;
    width: 2.5rem
}

.page-retailers .leaflet-div-icon {
    background: transparent;
    border: 0
}

.page-retailers .leaflet-marker-icon {
    z-index: 2
}

.page-retailers .info-window {
    text-align: right
}

.page-retailers .info-window::after {
    content: 'x';
    position: absolute;
    right: -7px;
    top: -7px;
    height: 20px;
    width: 20px;
    text-align: center;
    color: #fff;
    font-size: 14px;
    pointer-events: none
}

.page-retailers .leaflet-popup-content {
    box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.2)
}

.page-retailers .leaflet-popup-tip-container {
    top: -1px
}

.page-retailers .leaflet-popup-close-button {
    background: #0078c8;
    border-radius: 50%;
    opacity: 1;
    height: 20px;
    width: 20px;
    right: -7px;
    top: -7px;
    transition: background .15s linear
}

.page-retailers .leaflet-popup-close-button:hover {
    background: #005995
}

.page-retailers .suggestions {
    position: absolute;
    top: 100%;
    right: 0;
    background: #fafafa;
    z-index: 99;
    width: 100%;
    border-radius: 0 0 .25rem .25rem
}

.page-retailers .suggestions li {
    padding: 15px;
    display: block
}

.page-retailers .suggestions li a {
    color: #000
}

.page-retailers .branch-state {
    display: -ms-flexbox;
    display: flex;
    margin: 0 0 0.3125rem
}

.mapsearch {
    position: absolute;
    left: 0;
    width: 100%;
    top: 100%;
    -ms-transform: translateY(-5px);
    transform: translateY(-5px);
    background: #fff;
    padding: 1.5625rem 0;
    z-index: 5;
    border-radius: 0 0 .25rem .25rem;
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s linear, visibility 0s 0.3s;
    box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.15);
    overflow: hidden
}

.focused .mapsearch {
    transition: opacity 0.2s linear;
    opacity: 1;
    visibility: visible
}

.mapsearch::after {
    content: '';
    width: calc(100% - 1.875rem);
    height: 1px;
    background: #DADADA;
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    margin: auto
}

.mapsearch-content {
    direction: ltr;
    height: calc(100vh - 250px);
    max-height: 31.25rem
}

.noresult .mapsearch-content {
    height: auto
}

.mapsearch-content-in {
    direction: rtl
}

.mapsearch-noresult {
    padding: 1.875rem .9375rem;
    text-align: center;
    color: #4d4d4d;
    font-size: 1.125rem
}

.mapsearch ul {
    padding: 0 1.5625rem 0 1.25rem
}

@media only screen and (max-width: 500px) {
    .mapsearch ul {
        padding: 0 1.5625rem 0 10px
    }
}

.mapsearch .loading {
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 50px;
    pointer-events: none;
    transition: opacity .15s linear
}

.mapsearch.loaded .loading {
    opacity: 0
}

.mapsearch .ss-content {
    overflow-y: scroll
}

.page-chains .map_container {
    position: relative
}

.page-chains #chains_map {
    min-height: 400px;
    border-bottom: 2px solid #e0e0e0;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.07)
}

.page-chains #chains_map::after {
    content: '';
    display: block;
    padding-top: 50%
}

.page-chains #chains_map::before {
    content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #0078c8;
    opacity: 0;
    z-index: 1;
    pointer-events: none;
    transition: all .2s linear
}

#map.focused::before {
    opacity: .2
}

@media only screen and (min-width: 1051px) {
    .page-chains #chains_map {
        height: 40.625rem
    }
}

.page-chains #chains_map .leaflet-bottom {
    display: none
}

.page-chains .marker {
    height: 2.5rem;
    width: 2.5rem
}

.page-chains .leaflet-div-icon {
    background: transparent;
    border: 0
}

.page-chains .leaflet-marker-icon {
    z-index: 2
}

.page-chains .info-window {
    text-align: right
}

.page-chains .info-window::after {
    content: 'x';
    position: absolute;
    right: -7px;
    top: -7px;
    height: 20px;
    width: 20px;
    text-align: center;
    color: #fff;
    font-size: 14px;
    pointer-events: none
}

.page-chains .leaflet-popup-content {
    box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.2)
}

.page-chains .leaflet-popup-tip-container {
    top: -1px
}

.page-chains .leaflet-popup-close-button {
    background: #0078c8;
    border-radius: 50%;
    opacity: 1;
    height: 20px;
    width: 20px;
    right: -7px;
    top: -7px;
    transition: background .15s linear
}

.page-chains .leaflet-popup-close-button:hover {
    background: #005995
}

.page-chains .suggestions {
    position: absolute;
    top: 100%;
    right: 0;
    background: #fafafa;
    z-index: 99;
    width: 100%;
    border-radius: 0 0 .25rem .25rem
}

.page-chains .suggestions li {
    padding: 15px;
    display: block
}

.page-chains .suggestions li a {
    color: #000
}

.page-chains .branch-state {
    display: -ms-flexbox;
    display: flex;
    margin: 0 0 0.3125rem
}

.retails_container {
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
    max-width: 15.25rem;
    background: #fff;
    position: absolute;
    transition: all 500ms;
    top: 2rem;
    right: 2rem;
    z-index: 10
}

@media only screen and (max-width: 730px) {
    .retails_container {
        position: unset;
        max-width: unset
    }
}

.retailes_search-title {
    padding: 1rem 2rem;
    padding-left: 1rem;
    background: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

@media only screen and (max-width: 730px) {
    .retailes_search-title {
        display: none
    }
}

.retailes_search-title p {
    font-family: IRANSansMedium, IRANSans, tahoma, arial;
    margin: 0px;
    color: #b3b3b3
}

.retailes_search-title:after {
    content: "";
    position: absolute;
    background: linear-gradient(-90deg, #0078c8 0%, #78be1e 100%);
    width: calc(25px + 2rem);
    transition: all 500ms;
    left: 0;
    height: 100%;
    z-index: 0
}

.retailes_search-title .plus {
    position: relative;
    height: 25px;
    width: 25px;
    z-index: 1;
    transition: all 500ms
}

.retailes_search-title .plus:before {
    content: "";
    position: absolute;
    left: 50%;
    height: 100%;
    border-left: 2px solid #fff;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    transition: all 500ms
}

.retailes_search-title .plus:after {
    content: "";
    position: absolute;
    top: 50%;
    width: 100%;
    transition: all 500ms;
    border-top: 2px solid #fff;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.search_container {
    padding: 1rem 2rem 0 0;
    display: none
}

@media only screen and (max-width: 730px) {
    .search_container {
        display: block !important
    }
}

.search_container .input {
    border-bottom: 1px solid #666
}

.search_container .input input::placeholder {
    color: #ccc
}

.search_container ul {
    max-height: 450px;
    overflow-y: scroll;
    padding-top: 12px
}

.search_container .toggle_button {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    background: linear-gradient(-90deg, #0078c8 0%, #78be1e 100%);
    position: absolute;
    right: 0;
    bottom: 0;
    min-height: 4rem
}

.retails_container.open {
    max-width: 32.25rem
}

.retails_container.open .retailes_search-title p {
    display: none
}

.retails_container.open .retailes_search-title .plus {
    margin: auto
}

.retails_container.open .retailes_search-title:after {
    width: 100%
}

.retails_container.open .plus {
    width: 1.55rem;
    height: 1.55rem;
    display: inline-block;
    position: relative
}

.retails_container.open .plus:after, .retails_container.open .plus:before {
    top: 0.5rem;
    position: absolute;
    width: 60%;
    height: 10%;
    background-color: #fff;
    display: inline-block;
    transition: all 0.2s ease;
    content: "";
    left: 0
}

.retails_container.open .plus:before {
    left: 0;
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.retails_container.open .plus:after {
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    right: 0
}

.page-header__search {
    width: calc(100% - 2rem);
    min-width: unset
}

.city_selector {
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    max-width: 400px
}

.city_selector > div {
    max-width: 250px;
    width: 100%
}

.city_selector > div:last-of-type {
    margin-right: 2rem
}

.leaflet-pane, .leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-tile-container, .leaflet-pane > svg, .leaflet-pane > canvas, .leaflet-zoom-box, .leaflet-image-layer, .leaflet-layer {
    position: absolute;
    left: 0;
    top: 0
}

.leaflet-container {
    overflow: hidden
}

.leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow {
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none
}

.leaflet-safari .leaflet-tile {
    image-rendering: -webkit-optimize-contrast
}

.leaflet-safari .leaflet-tile-container {
    width: 1600px;
    height: 1600px;
    -webkit-transform-origin: 0 0
}

.leaflet-marker-icon, .leaflet-marker-shadow {
    display: block
}

.leaflet-container .leaflet-overlay-pane svg, .leaflet-container .leaflet-marker-pane img, .leaflet-container .leaflet-shadow-pane img, .leaflet-container .leaflet-tile-pane img, .leaflet-container img.leaflet-image-layer, .leaflet-container .leaflet-tile {
    max-width: none !important;
    max-height: none !important
}

.leaflet-container.leaflet-touch-zoom {
    -ms-touch-action: pan-x pan-y;
    touch-action: pan-x pan-y
}

.leaflet-container.leaflet-touch-drag {
    -ms-touch-action: pinch-zoom;
    touch-action: none;
    touch-action: pinch-zoom
}

.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
    -ms-touch-action: none;
    touch-action: none
}

.leaflet-container {
    -webkit-tap-highlight-color: transparent
}

.leaflet-container a {
    -webkit-tap-highlight-color: rgba(51, 181, 229, 0.4)
}

.leaflet-tile {
    filter: inherit;
    visibility: hidden
}

.leaflet-tile-loaded {
    visibility: inherit
}

.leaflet-zoom-box {
    width: 0;
    height: 0;
    box-sizing: border-box;
    z-index: 800
}

.leaflet-overlay-pane svg {
    -moz-user-select: none
}

.leaflet-tile-pane {
    z-index: 200
}

.leaflet-overlay-pane {
    z-index: 400
}

.leaflet-shadow-pane {
    z-index: 500
}

.leaflet-marker-pane {
    z-index: 600
}

.leaflet-tooltip-pane {
    z-index: 650
}

.leaflet-popup-pane {
    z-index: 700
}

.leaflet-map-pane canvas {
    z-index: 100
}

.leaflet-map-pane svg {
    z-index: 200
}

.leaflet-vml-shape {
    width: 1px;
    height: 1px
}

.lvml {
    behavior: url(#default#VML);
    display: inline-block;
    position: absolute
}

.leaflet-control {
    position: relative;
    z-index: 800;
    pointer-events: visiblePainted;
    pointer-events: auto
}

.leaflet-top, .leaflet-bottom {
    position: absolute;
    z-index: 1000;
    pointer-events: none
}

.leaflet-top {
    top: 0
}

.leaflet-right {
    right: 0
}

.leaflet-bottom {
    bottom: 0
}

.leaflet-left {
    left: 0
}

.leaflet-control {
    float: left;
    clear: both
}

.leaflet-right .leaflet-control {
    float: right
}

.leaflet-top .leaflet-control {
    margin-top: 10px
}

.leaflet-bottom .leaflet-control {
    margin-bottom: 10px
}

.leaflet-left .leaflet-control {
    margin-left: 10px
}

.leaflet-right .leaflet-control {
    margin-right: 10px
}

.leaflet-fade-anim .leaflet-tile {
    will-change: opacity
}

.leaflet-fade-anim .leaflet-popup {
    opacity: 0;
    transition: opacity 0.2s linear
}

.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
    opacity: 1
}

.leaflet-zoom-animated {
    -ms-transform-origin: 0 0;
    transform-origin: 0 0
}

.leaflet-zoom-anim .leaflet-zoom-animated {
    will-change: transform
}

.leaflet-zoom-anim .leaflet-zoom-animated {
    transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1)
}

.leaflet-zoom-anim .leaflet-tile, .leaflet-pan-anim .leaflet-tile {
    transition: none
}

.leaflet-zoom-anim .leaflet-zoom-hide {
    visibility: hidden
}

.leaflet-interactive {
    cursor: pointer
}

.leaflet-grab {
    cursor: grab
}

.leaflet-crosshair, .leaflet-crosshair .leaflet-interactive {
    cursor: crosshair
}

.leaflet-popup-pane, .leaflet-control {
    cursor: auto
}

.leaflet-dragging .leaflet-grab, .leaflet-dragging .leaflet-grab .leaflet-interactive, .leaflet-dragging .leaflet-marker-draggable {
    cursor: move;
    cursor: grabbing
}

.leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-image-layer, .leaflet-pane > svg path, .leaflet-tile-container {
    pointer-events: none
}

.leaflet-marker-icon.leaflet-interactive, .leaflet-image-layer.leaflet-interactive, .leaflet-pane > svg path.leaflet-interactive {
    pointer-events: visiblePainted;
    pointer-events: auto
}

.leaflet-container {
    background: #ddd;
    outline: 0
}

.leaflet-container a {
    color: #0078A8
}

.leaflet-container a.leaflet-active {
    outline: 2px solid orange
}

.leaflet-zoom-box {
    border: 2px dotted #38f;
    background: rgba(255, 255, 255, 0.5)
}

.leaflet-container {
    font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif
}

.leaflet-bar {
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.65);
    border-radius: 4px
}

.leaflet-bar a, .leaflet-bar a:hover {
    background-color: #fff;
    border-bottom: 1px solid #ccc;
    width: 26px;
    height: 26px;
    line-height: 26px;
    display: block;
    text-align: center;
    text-decoration: none;
    color: black
}

.leaflet-bar a, .leaflet-control-layers-toggle {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    display: block
}

.leaflet-bar a:hover {
    background-color: #f4f4f4
}

.leaflet-bar a:first-child {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

.leaflet-bar a:last-child {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    border-bottom: none
}

.leaflet-bar a.leaflet-disabled {
    cursor: default;
    background-color: #f4f4f4;
    color: #bbb
}

.leaflet-touch .leaflet-bar a {
    width: 30px;
    height: 30px;
    line-height: 30px
}

.leaflet-touch .leaflet-bar a:first-child {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px
}

.leaflet-touch .leaflet-bar a:last-child {
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px
}

.leaflet-control-zoom-in, .leaflet-control-zoom-out {
    font: bold 18px 'Lucida Console', Monaco, monospace;
    text-indent: 1px
}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out {
    font-size: 22px
}

.leaflet-control-layers {
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4);
    background: #fff;
    border-radius: 5px
}

.leaflet-control-layers-toggle {
    background-image: url(images/layers.png);
    width: 36px;
    height: 36px
}

.leaflet-retina .leaflet-control-layers-toggle {
    background-image: url(images/layers-2x.png);
    background-size: 26px 26px
}

.leaflet-touch .leaflet-control-layers-toggle {
    width: 44px;
    height: 44px
}

.leaflet-control-layers .leaflet-control-layers-list, .leaflet-control-layers-expanded .leaflet-control-layers-toggle {
    display: none
}

.leaflet-control-layers-expanded .leaflet-control-layers-list {
    display: block;
    position: relative
}

.leaflet-control-layers-expanded {
    padding: 6px 10px 6px 6px;
    color: #333;
    background: #fff
}

.leaflet-control-layers-scrollbar {
    overflow-y: scroll;
    overflow-x: hidden;
    padding-right: 5px
}

.leaflet-control-layers-selector {
    margin-top: 2px;
    position: relative;
    top: 1px
}

.leaflet-control-layers label {
    display: block
}

.leaflet-control-layers-separator {
    height: 0;
    border-top: 1px solid #ddd;
    margin: 5px -10px 5px -6px
}

.leaflet-default-icon-path {
    background-image: url(images/marker-icon.png)
}

.leaflet-container .leaflet-control-attribution {
    background: #fff;
    background: rgba(255, 255, 255, 0.7);
    margin: 0
}

.leaflet-control-attribution, .leaflet-control-scale-line {
    padding: 0 5px;
    color: #333
}

.leaflet-control-attribution a {
    text-decoration: none
}

.leaflet-control-attribution a:hover {
    text-decoration: underline
}

.leaflet-container .leaflet-control-attribution, .leaflet-container .leaflet-control-scale {
    font-size: 11px
}

.leaflet-left .leaflet-control-scale {
    margin-left: 5px
}

.leaflet-bottom .leaflet-control-scale {
    margin-bottom: 5px
}

.leaflet-control-scale-line {
    border: 2px solid #777;
    border-top: none;
    line-height: 1.1;
    padding: 2px 5px 1px;
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
    background: #fff;
    background: rgba(255, 255, 255, 0.5)
}

.leaflet-control-scale-line:not(:first-child) {
    border-top: 2px solid #777;
    border-bottom: none;
    margin-top: -2px
}

.leaflet-control-scale-line:not(:first-child):not(:last-child) {
    border-bottom: 2px solid #777
}

.leaflet-touch .leaflet-control-attribution, .leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar {
    box-shadow: none
}

.leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar {
    border: 2px solid rgba(0, 0, 0, 0.2);
    background-clip: padding-box
}

.leaflet-popup {
    position: absolute;
    text-align: center;
    margin-bottom: 20px
}

.leaflet-popup-content-wrapper {
    padding: 1px;
    text-align: left;
    border-radius: 12px
}

.leaflet-popup-content {
    margin: 13px 19px;
    line-height: 1.4
}

.leaflet-popup-content p {
    margin: 18px 0
}

.leaflet-popup-tip-container {
    width: 40px;
    height: 20px;
    position: absolute;
    left: 50%;
    margin-left: -20px;
    overflow: hidden;
    pointer-events: none
}

.leaflet-popup-tip {
    width: 17px;
    height: 17px;
    padding: 1px;
    margin: -10px auto 0;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.leaflet-popup-content-wrapper, .leaflet-popup-tip {
    background: white;
    color: #333;
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4)
}

.leaflet-container a.leaflet-popup-close-button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 4px 4px 0 0;
    border: none;
    text-align: center;
    width: 18px;
    height: 14px;
    font: 16px/14px Tahoma, Verdana, sans-serif;
    color: #c3c3c3;
    text-decoration: none;
    font-weight: bold;
    background: transparent
}

.leaflet-container a.leaflet-popup-close-button:hover {
    color: #999
}

.leaflet-popup-scrolled {
    overflow: auto;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd
}

.leaflet-oldie .leaflet-popup-content-wrapper {
    zoom: 1
}

.leaflet-oldie .leaflet-popup-tip {
    width: 24px;
    margin: 0 auto;
    -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
    filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)
}

.leaflet-oldie .leaflet-popup-tip-container {
    margin-top: -1px
}

.leaflet-oldie .leaflet-control-zoom, .leaflet-oldie .leaflet-control-layers, .leaflet-oldie .leaflet-popup-content-wrapper, .leaflet-oldie .leaflet-popup-tip {
    border: 1px solid #999
}

.leaflet-div-icon {
    background: #fff;
    border: 1px solid #666
}

.leaflet-tooltip {
    position: absolute;
    padding: 6px;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 3px;
    color: #222;
    white-space: nowrap;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4)
}

.leaflet-tooltip.leaflet-clickable {
    cursor: pointer;
    pointer-events: auto
}

.leaflet-tooltip-top:before, .leaflet-tooltip-bottom:before, .leaflet-tooltip-left:before, .leaflet-tooltip-right:before {
    position: absolute;
    pointer-events: none;
    border: 6px solid transparent;
    background: transparent;
    content: ""
}

.leaflet-tooltip-bottom {
    margin-top: 6px
}

.leaflet-tooltip-top {
    margin-top: -6px
}

.leaflet-tooltip-bottom:before, .leaflet-tooltip-top:before {
    left: 50%;
    margin-left: -6px
}

.leaflet-tooltip-top:before {
    bottom: 0;
    margin-bottom: -12px;
    border-top-color: #fff
}

.leaflet-tooltip-bottom:before {
    top: 0;
    margin-top: -12px;
    margin-left: -6px;
    border-bottom-color: #fff
}

.leaflet-tooltip-left {
    margin-left: -6px
}

.leaflet-tooltip-right {
    margin-left: 6px
}

.leaflet-tooltip-left:before, .leaflet-tooltip-right:before {
    top: 50%;
    margin-top: -6px
}

.leaflet-tooltip-left:before {
    right: 0;
    margin-right: -12px;
    border-left-color: #fff
}

.leaflet-tooltip-right:before {
    left: 0;
    margin-left: -12px;
    border-right-color: #fff
}

.mapsearch {
    position: absolute;
    left: 0;
    width: 100%;
    top: 100%;
    -ms-transform: translateY(-5px);
    transform: translateY(-5px);
    background: #fff;
    padding: 1.5625rem 0;
    z-index: 5;
    border-radius: 0 0 .25rem .25rem;
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s linear, visibility 0s 0.3s;
    box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.15);
    overflow: hidden
}

.focused .mapsearch {
    transition: opacity 0.2s linear;
    opacity: 1;
    visibility: visible
}

.mapsearch::after {
    content: '';
    width: calc(100% - 1.875rem);
    height: 1px;
    background: #DADADA;
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    margin: auto
}

.mapsearch-content {
    direction: ltr;
    height: calc(100vh - 250px);
    max-height: 31.25rem
}

.noresult .mapsearch-content {
    height: auto
}

.mapsearch-content-in {
    direction: rtl
}

.mapsearch-noresult {
    padding: 1.875rem .9375rem;
    text-align: center;
    color: #4d4d4d;
    font-size: 1.125rem
}

.mapsearch ul {
    padding: 0 1.5625rem 0 1.25rem
}

@media only screen and (max-width: 500px) {
    .mapsearch ul {
        padding: 0 1.5625rem 0 10px
    }
}

.mapsearch .loading {
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 50px;
    pointer-events: none;
    transition: opacity .15s linear
}

.mapsearch.loaded .loading {
    opacity: 0
}

.mapsearch .ss-content {
    overflow-y: scroll
}

.instaqoute {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    max-width: 45.625rem;
    margin: 0 auto
}

@media only screen and (min-width: 601px) {
    .instaqoute {
        opacity: .4;
        -ms-transform: translateX(-30%);
        transform: translateX(-30%);
        transition: transform .3s ease-in-out, opacity .15s linear
    }
}

@media only screen and (max-width: 600px) {
    .instaqoute {
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.swiper-slide-active .instaqoute, .swiper-slide-duplicate-active .instaqoute {
    opacity: 1;
    -ms-transform: translateX(0%);
    transform: translateX(0%)
}

@media only screen and (min-width: 601px) {
    .instaqoute--novideo {
        -ms-transform: scale(0.85);
        transform: scale(0.85)
    }
}

.swiper-slide-active .instaqoute--novideo, .swiper-slide-duplicate-active .instaqoute--novideo {
    -ms-transform: scale(1);
    transform: scale(1)
}

.instaqoute-img {
    position: relative;
    -ms-flex: none;
    flex: none;
    position: relative;
    width: 19.6875rem;
    overflow: hidden;
    max-height: 21.875rem
}

@media only screen and (max-width: 800px) {
    .instaqoute-img {
        width: 250px
    }
}

@media only screen and (min-width: 601px) {
    .instaqoute-img {
        border-radius: .25rem
    }
}

@media only screen and (max-width: 600px) {
    .instaqoute-img {
        width: 100%;
        border-radius: 4px 4px 0 0
    }
}

.instaqoute-img::before {
    content: '';
    display: block;
    padding-top: 100%
}

.instaqoute-img::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 100%;
    width: 100%;
    background: #000;
    opacity: 0;
    transition: opacity .15s linear;
    z-index: 1
}

@media only screen and (min-width: 1051px) {
    .instaqoute-img:hover::after {
        opacity: .3
    }
}

.swiper-slide-active .instaqoute-img {
    border-radius: 0 .25rem .25rem 0
}

@media only screen and (max-width: 600px) {
    .swiper-slide-active .instaqoute-img {
        border-radius: 4px 4px 0 0
    }
}

.instaqoute-img img, .instaqoute-img span {
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: 100%;
    width: 100%;
    border-radius: 0 .25rem .25rem 0
}

@media only screen and (max-width: 600px) {
    .instaqoute-img img, .instaqoute-img span {
        border-radius: 4px 4px 0 0
    }
}

.instaqoute-play {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: 4rem;
    width: 4rem;
    background: linear-gradient(-135deg, #00bee6 0%, #78be1e 180%);
    border-radius: 50%;
    box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.5);
    display: none;
    z-index: 2
}

.video .instaqoute-play {
    display: block
}

.instaqoute-play svg {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: 1.4375rem;
    width: 1.4375rem;
    margin-left: .125rem;
    fill: #fff
}

.instaqoute-content {
    -ms-flex: auto;
    flex: auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch
}

@media only screen and (min-width: 601px) {
    .instaqoute-content {
        overflow: hidden;
        transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955)
    }
}

.instaqoute--novideo .instaqoute-content {
    max-width: 35.125rem;
    padding: 1.75rem 6.375rem 0 0
}

@media only screen and (max-width: 600px) {
    .instaqoute--novideo .instaqoute-content {
        padding: 5.125rem 1rem 0 0
    }
}

.swiper-slide-active .instaqoute-content, .swiper-slide-duplicate-active .instaqoute-content {
    -ms-transform: translateX(0%);
    transform: translateX(0%);
    transition-duration: .8s
}

.instaqoute-textinner {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: start;
    align-items: flex-start
}

@media only screen and (min-width: 601px) {
    .instaqoute-textinner {
        -ms-transform: translateX(100%);
        transform: translateX(100%);
        transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955)
    }
}

.instaqoute--novideo .instaqoute-textinner {
    -ms-transform: none;
    transform: none
}

.swiper-slide-active .instaqoute-textinner, .swiper-slide-duplicate-active .instaqoute-textinner {
    -ms-transform: translateX(0%);
    transform: translateX(0%);
    transition-duration: .7s;
    transition-delay: .3s
}

.instaqoute-bg {
    position: relative;
    background: #fff;
    border-radius: .25rem 0 0 .25rem;
    padding: 1.25rem 2.5rem;
    box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.2);
    -ms-flex: auto;
    flex: auto;
    z-index: 2
}

@media only screen and (max-width: 800px) {
    .instaqoute-bg {
        border-radius: 0 0 0 .25rem
    }
}

.instaqoute--novideo .instaqoute-bg {
    border-radius: .25rem 0 0 .25rem
}

@media only screen and (max-width: 600px) {
    .instaqoute--novideo .instaqoute-bg {
        padding: 1.25rem
    }
}

.instaqoute-btn {
    background: #EBE9E5;
    display: inline-block;
    border-radius: 0 0 0 .25rem;
    padding: .625rem 1.875rem .9375rem;
    color: #666;
    font-size: .9375rem;
    -ms-flex: none;
    flex: none;
    transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.15s linear
}

@media only screen and (min-width: 601px) {
    .instaqoute-btn {
        -ms-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@media only screen and (max-width: 800px) {
    .instaqoute-btn {
        font-size: 13px
    }
}

.instaqoute-btn:hover {
    color: #4d4d4d
}

.swiper-slide-active .instaqoute-btn, .swiper-slide-duplicate-active .instaqoute-btn {
    -ms-transform: translateY(0%);
    transform: translateY(0%);
    transition: transform 0.3s 0.7s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.15s linear
}

.swiper-slide-active .instaqoute--novideo .instaqoute-btn, .swiper-slide-duplicate-active .instaqoute--novideo .instaqoute-btn {
    transition-delay: .3s
}

.instaqoute--novideo .instaqoute-btn {
    color: #373737;
    font-size: .9375rem;
    border-radius: 0 0 .25rem .25rem;
    padding: .625rem 1.25rem .9375rem
}

.instaqoute-btn svg {
    margin-left: .3125rem;
    fill: #666
}

.instaqoute-job {
    display: inline-block;
    margin-right: .625rem
}

.instaqoute-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    margin-bottom: 1.25rem
}

.instaqoute-avatar {
    position: relative;
    -ms-flex: none;
    flex: none;
    height: 5rem;
    width: 5rem;
    margin-left: 1.875rem;
    border-radius: .25rem
}

.instaqoute--novideo .instaqoute-avatar {
    position: absolute;
    height: 8.125rem;
    width: 8.125rem;
    top: -1.75rem;
    right: -6.375rem;
    box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15)
}

@media only screen and (max-width: 600px) {
    .instaqoute--novideo .instaqoute-avatar {
        height: 5.625rem;
        width: 5.625rem;
        top: -5.125rem;
        right: -1rem
    }
}

.instaqoute-avatar::after {
    content: '';
    position: absolute;
    display: block;
    height: 100%;
    width: 100%;
    border-radius: .25rem;
    background: #000;
    opacity: 0;
    transition: opacity .15s linear;
    z-index: 1
}

.instaqoute--novideo .instaqoute-avatar::after {
    display: none
}

@media only screen and (min-width: 1051px) {
    .instaqoute-avatar:hover::after {
        opacity: .3
    }
}

.instaqoute-name {
    color: #373737;
    font-size: 1.0625rem
}

@media only screen and (max-width: 800px) {
    .instaqoute-name {
        font-size: 15px
    }
}

.instaqoute-info {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.instaqoute-text {
    color: #666;
    font-size: .875rem;
    text-align: justify
}

@media only screen and (max-width: 800px) {
    .instaqoute-text {
        font-size: 12px
    }
}

.instaqoute--novideo .instaqoute-text {
    font-size: 1.0625rem
}

@media only screen and (max-width: 800px) {
    .instaqoute--novideo .instaqoute-text {
        font-size: 15px
    }
}

[data-instaqoute] {
    position: relative;
    margin-bottom: 3.125rem
}

[data-instaqoute] .swiper-pagination {
    bottom: auto;
    top: calc(100% + 40px)
}

[data-instaqoute] .swiper-slide {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: auto;
    max-width: 100%
}

@media only screen and (max-width: 800px) {
    [data-instaqoute] .swiper-slide {
        padding: 0 15px
    }
}

[data-instaqoute] .swiper-button-prev, [data-instaqoute] .swiper-button-next {
    border-radius: .25rem
}

@media only screen and (max-width: 800px) {
    [data-instaqoute] .swiper-button-prev, [data-instaqoute] .swiper-button-next {
        display: none
    }
}

[data-instaqoute] .swiper-button-prev::after, [data-instaqoute] .swiper-button-next::after {
    content: '';
    height: 14px;
    width: 14px;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

[data-instaqoute] .swiper-button-prev::after {
    right: 8px;
    border-top: 2px solid #b3b3b3;
    border-right: 2px solid #b3b3b3
}

[data-instaqoute] .swiper-button-next::after {
    left: 7px;
    border-bottom: 2px solid #b3b3b3;
    border-left: 2px solid #b3b3b3
}

@media only screen and (max-width: 500px) {
    .page-job-list .filters-title {
        font-size: 1rem
    }
}

.page-job-list .filters-group {
    padding: 1.625rem 1.4375rem 1.875rem 1.75rem
}

@media only screen and (max-width: 1050px) {
    .page-job-list .filters-group {
        padding: 1.875rem 0 1.75rem 0
    }
}

.page-job-list .filters-group:first-child {
    padding: 1.4375rem 1.4375rem 1.875rem 1.75rem;
    margin-bottom: 0;
    border-radius: 0;
    border-top-right-radius: .25rem;
    border-top-left-radius: .25rem;
    border-bottom: 1px solid #E6E6E6
}

@media only screen and (max-width: 1050px) {
    .page-job-list .filters-group:first-child {
        padding: 0 0 1.75rem 0
    }
}

.page-job-list .filters-group:first-child::after {
    display: none
}

.page-job-list .filters-group:nth-child(2) {
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.page-job-list .filters-group:last-child {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.page-job-list .filters-group li {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center
}

.page-job-list .filters-group li:not(:last-of-type) {
    margin-bottom: .75rem
}

.page-job-list .filters-group li > span {
    font-size: .875rem;
    color: #0078c8
}

.page-job-list .filters-footer {
    border-bottom-left-radius: .25rem;
    border-bottom-right-radius: .25rem
}

.page-job-list .intro__subtitle {
    margin-top: .5rem
}

@media only screen and (max-width: 500px) {
    .page-job-list .intro__subtitle {
        margin-top: .125rem
    }
}

.jobs-wrap {
    background-color: #fff;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.02);
    border-radius: 4px
}

.job-card {
    padding-left: 1.5625rem;
    padding-right: 1.75rem;
    transition: background-color 0.15s ease-in-out;
    position: relative
}

@media only screen and (max-width: 500px) {
    .job-card {
        background-color: #fafafa;
        margin-bottom: 1rem;
        padding: 1.25rem 1.25rem;
        border-radius: 4px;
        min-height: 13rem
    }
}

.job-card::after {
    content: '';
    position: absolute;
    top: -1px;
    right: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity .15s ease-in-out;
    background-color: #f8f8f8
}

@media only screen and (min-width: 801px) {
    .job-card:hover::after {
        opacity: 1
    }

    .job-card:hover .job-card__wrap {
        border-color: transparent
    }

    .job-card:last-child:hover {
        background-color: #f8f8f8
    }
}

.job-card:last-child .job-card__wrap {
    border-bottom: none
}

.job-card__wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 1.375rem;
    padding-bottom: 1.4375rem;
    transition: border-color 0.15s ease-in-out;
    border-bottom: 1px solid #E6E6E6
}

@media only screen and (max-width: 500px) {
    .job-card__wrap {
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-pack: center;
        justify-content: center;
        border-bottom: none;
        padding: 0
    }
}

.job-card__image-wrap {
    z-index: 2;
    -ms-flex: none;
    flex: none;
    width: auto;
    max-width: 87px
}

.job-card__image {
    display: block;
    width: 100%;
    height: auto
}

.job-card__content {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex: 1;
    flex: 1;
    z-index: 2
}

@media only screen and (max-width: 500px) {
    .job-card__content {
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: center;
        align-items: center;
        margin-top: .9375rem
    }
}

.job-card__text {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 2;
    flex: 2;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-right: 1.75rem
}

@media only screen and (max-width: 500px) {
    .job-card__text {
        margin-right: 0;
        -ms-flex-align: center;
        align-items: center
    }
}

.job-card__title {
    color: #373737
}

@media only screen and (max-width: 500px) {
    .job-card__title {
        font-family: IRANSansMedium, IRANSans, tahoma, arial
    }
}

.job-card__desc {
    font-size: .8125rem;
    margin-top: .125rem;
    color: #666
}

@media only screen and (max-width: 500px) {
    .job-card__desc {
        font-size: 1rem;
        color: rgba(55, 55, 55, 0.6)
    }
}

.job-card__apply {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -ms-flex-align: center;
    align-items: center;
    z-index: 2
}

@media only screen and (max-width: 500px) {
    .job-card__apply {
        margin-top: 1rem
    }
}

.job-card__apply .btn {
    min-width: 10rem;
    font-size: .9375rem;
    background: #fff;
    color: #2b2929;
    transition: background 5s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    border: 1px solid #c9c9c9
}

@media only screen and (max-width: 500px) {
    .job-card__apply .btn {
        font-family: IRANSansMedium, IRANSans, tahoma, arial;
        border-color: #0078c8;
        color: #0078C7
    }
}

@media only screen and (min-width: 1051px) {
    .job-card__apply .btn:hover {
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
        background: #0078c8;
        background: linear-gradient(45deg, #0078c8, #0032a0);
        color: #fff
    }
}

.job-modal {
    background-color: #fff;
    border-radius: .25rem;
    box-shadow: 0 .625rem .9375rem rgba(0, 0, 0, 0.07)
}

@media only screen and (max-width: 900px) {
    .job-modal {
        box-shadow: none
    }
}

.job-modal__wrap {
    padding: 2.4375rem 3.4375rem 5.125rem
}

@media only screen and (max-width: 800px) {
    .job-modal__wrap {
        padding: 2.4375rem .9375rem 5.125rem
    }
}

.job-modal__header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding-bottom: 2.5rem;
    border-bottom: 1px solid #E6E6E6
}

@media only screen and (max-width: 500px) {
    .job-modal__header {
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: center;
        align-items: center;
        text-align: center
    }
}

.job-modal__header-wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex: 2;
    flex: 2
}

@media only screen and (max-width: 500px) {
    .job-modal__header-wrap {
        margin-bottom: 20px
    }
}

.job-modal__title {
    font-size: 1.4375rem;
    color: #0078c8
}

.job-modal__tags {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: .625rem
}

@media only screen and (max-width: 500px) {
    .job-modal__tags {
        -ms-flex-pack: center;
        justify-content: center
    }
}

.job-modal__tag {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    height: 2rem;
    line-height: 2rem;
    border-radius: 6.25rem;
    border: 1px solid #E6E6E6;
    padding-right: .8125rem;
    padding-left: 1.3125rem
}

.job-modal__tag:not(:last-child) {
    margin-left: .8125rem
}

.job-modal__tag span {
    font-size: .8125rem;
    color: #373737;
    margin-right: .625rem
}

.job-modal__apply {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -ms-flex: 1;
    flex: 1
}

@media only screen and (max-width: 500px) {
    .job-modal__apply {
        -ms-flex: none;
        flex: none;
        width: 100%
    }
}

.job-modal__apply .btn {
    height: 4rem;
    line-height: 4rem;
    min-width: 12.75rem;
    padding: 0 2.3125rem;
    font-size: 1.125rem
}

@media only screen and (max-width: 500px) {
    .job-modal__apply .btn {
        width: 100%
    }
}

.job-modal__content h1, .job-modal__content h2, .job-modal__content h3, .job-modal__content h4, .job-modal__content h5, .job-modal__content h6 {
    margin-top: 2.1875rem;
    font-size: 1.1875rem;
    color: #373737
}

.job-modal__content p, .job-modal__content ul {
    font-size: .9375rem;
    color: gray;
    margin-top: .625rem
}

.job-modal__content li {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 1.6875rem
}

.job-modal__content li:not(:first-child) {
    margin-top: .125rem
}

.job-modal__content li::before {
    content: '';
    position: absolute;
    right: 0;
    top: .6875rem;
    width: 1rem;
    height: .25rem;
    border-radius: 6.25rem;
    background-color: #E6E6E6
}

.job-modal__content-loading {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    min-height: 18.75rem
}

.job-modal__content-loading .loading {
    margin-top: 4.375rem
}

@media only screen and (max-width: 800px) {
    .page-job-list .job-search {
        border-radius: .25rem;
        box-shadow: 0 5px .9375rem 0 rgba(0, 0, 0, 0.05)
    }

    .page-job-list .job-search .bus.open-bus {
        box-shadow: 0 5px .9375rem 0 rgba(0, 0, 0, 0.08)
    }
}

@media only screen and (max-width: 500px) {
    .page-job-list .job-search {
        border-radius: 0;
        box-shadow: none;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05)
    }
}

.page-job-list .list-filters {
    padding: 1.75rem 1.4375rem 1.125rem 1.75rem
}

@media only screen and (min-width: 1051px) {
    .page-job-list .list-filters {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 1050px) {
    .page-job-list .list-filters {
        padding: 0
    }
}

.page-job-list .list-filters__tags-slider {
    padding: 0
}

@media only screen and (max-width: 1050px) {
    .page-job-list .list-filters__tags-slider {
        padding-top: 1.625rem
    }
}

@media only screen and (max-width: 500px) {
    .page-job-list .list-filters__tags-slider {
        background: #fff;
        padding-right: 1.25rem;
        padding-left: 1.25rem
    }
}

.page-job-list .pagination-p {
    margin-top: 20px;
    padding: 0
}

@media only screen and (max-width: 500px) {
    .page-job-list .pagination-p__content {
        background-color: #fafafa
    }
}

.page-job-list .bg-color {
    background: #F7f7f7
}

@media only screen and (max-width: 500px) {
    .page-job-list .bg-color {
        background: #fff
    }
}

.page-job-list .section-wrap {
    padding-top: 4.875rem;
    padding-bottom: 4.875rem
}

@media only screen and (max-width: 800px) {
    .page-job-list .section-wrap {
        padding-right: 1.25rem;
        padding-left: 1.25rem
    }
}

@media only screen and (max-width: 500px) {
    .page-job-list .section-wrap {
        padding-top: 0
    }
}

.page-job-list .row {
    margin: 0 -10px 0
}

@media only screen and (max-width: 800px) {
    .page-job-list .row {
        margin: 0 -20px 0
    }
}

@media only screen and (max-width: 1050px) {
    .page-job-list .row--job [class*="col-"]:nth-child(2) {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 500px) {
    .page-job-list .row--job [class*="col-"]:nth-child(1) {
        padding: 0;
        margin-bottom: 0
    }

    .page-job-list .row--job [class*="col-"]:nth-child(3) {
        margin-top: 1.625rem
    }
}

.page-job-list [class*="col-"] {
    padding: 0 10px 0;
    margin-bottom: 20px
}

@media only screen and (max-width: 800px) {
    .page-job-list [class*="col-"] {
        padding: 0 20px 0
    }
}

.page-job-list .sort-wrap {
    padding-left: 1.25rem;
    border-radius: 4px
}

.page-job-list .sort-wrap.fixed.tr {
    border-radius: 0
}

@media only screen and (max-width: 730px) {
    .mlj {
        top: 0
    }
}

.mlj-open .mlj {
    transition: all 0.3s linear;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    z-index: 500
}

.mlj-side {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    padding: 5.625rem 8.75rem 4.375rem 5.625rem;
    box-shadow: none
}

@media only screen and (max-width: 1050px) {
    .mlj-side {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        padding: 5.625rem .9375rem
    }
}

.mlj-side-bg {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    position: absolute;
    background-color: #fff;
    box-shadow: .625rem 0 2.1875rem rgba(0, 0, 0, 0.1);
    width: 50%;
    height: 100%;
    top: 0
}

@media only screen and (max-width: 500px) {
    .mlj-side-content {
        padding-top: 0
    }
}

.mlj-wrapper {
    display: -ms-flexbox;
    display: flex;
    max-width: 1440px;
    margin: 0 auto
}

@media only screen and (max-width: 1050px) {
    .mlj-wrapper {
        width: 100%
    }
}

.mlj-wrap {
    height: 100%
}

@media only screen and (max-width: 1050px) {
    .mlj-wrap {
        max-width: 31.25rem;
        width: 100%;
        padding-top: 0;
        margin-left: auto;
        margin-right: auto
    }
}

@media only screen and (max-width: 500px) {
    .mlj-formwrap {
        height: calc(100% - 9.375rem)
    }
}

@media only screen and (max-width: 500px) {
    .mlj-steps {
        margin-bottom: 3.125rem
    }
}

.mlj-steps button {
    z-index: 10
}

.mlj-steps button:not(:last-child) {
    margin-left: .5rem
}

.mlj-steps button.active {
    width: 10rem
}

@media only screen and (max-width: 500px) {
    .mlj-steps button.active {
        width: 2.875rem;
        text-align: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media only screen and (max-width: 500px) {
    .mlj-steps button {
        width: 2.5rem !important;
        height: 2.5rem
    }
}

.mlj-steps button span {
    white-space: nowrap
}

@media only screen and (max-width: 500px) {
    .mlj-steps button span {
        position: absolute;
        left: 50%;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        top: 110%;
        color: gray;
        white-space: nowrap;
        margin-right: 0
    }

    .mlj-steps button:first-child span {
        left: auto;
        right: 0;
        -ms-transform: translateX(0);
        transform: translateX(0)
    }

    .mlj-steps button:last-child span {
        left: 0;
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
}

.mlj-actions {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.mlj-actions button:first-child {
    margin-left: .5rem
}

@media only screen and (min-width: 1051px) {
    .mlj-actions button:last-child:hover svg {
        -ms-transform: translateX(-3px);
        transform: translateX(-3px)
    }
}

.mlj-actions button:last-child div {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.mlj-actions button:last-child span {
    margin-right: auto
}

.mlj-actions button:last-child span.no-margin {
    margin-right: initial
}

.mlj-actions button:last-child svg {
    margin-right: auto;
    transition: transform .15s ease-in-out
}

@media only screen and (max-width: 500px) {
    .mlj-form {
        padding-right: 17px
    }
}

.mlj-form .row {
    margin: 0 -30px -40px
}

@media only screen and (max-width: 500px) {
    .mlj-form .row {
        margin: 0 0 -40px
    }
}

.mlj-form [class*="col-"] {
    padding: 0 30px;
    margin-bottom: 40px
}

@media only screen and (max-width: 500px) {
    .mlj-form [class*="col-"] {
        padding: 0;
        margin-bottom: 20px
    }
}

.mlj .select-arrow {
    width: .6875rem;
    height: .375rem
}

.mlj-result {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: .625rem 1.25rem .625rem .625rem;
    border-radius: 4px;
    background-color: #F2F2F2;
    margin-bottom: 1.25rem
}

.mlj-result:last-of-type {
    margin-bottom: 2.5rem
}

.mlj-result p {
    font-size: 1rem;
    color: #2b2929
}

.mlj-result button {
    -ms-flex-item-align: start;
    align-self: flex-start;
    margin-right: .625rem;
    padding: .625rem;
    font-size: 0;
    transition: transform 0.15s ease-in-out
}

.mlj-result button:hover svg {
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.mlj-result button:active, .mlj-result button.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.mlj-result svg {
    width: .75rem;
    height: .75rem;
    fill: #f22b2b;
    transition: transform 0.3s ease-out
}

.mlj-add {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 1.5625rem;
    margin-bottom: 1.5625rem;
    padding: .625rem 0 .625rem .625rem;
    transition: transform 0.15s ease-in-out
}

.mlj-add:hover svg {
    fill: #078cdc;
    -ms-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

.mlj-add:hover span {
    color: #078cdc
}

.mlj-add:active, .mlj-add.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.mlj-add svg {
    width: 1rem;
    height: 1rem;
    fill: #0078c8;
    transition: fill .15s linear, transform 0.3s ease-out
}

.mlj-add span {
    font-size: 1.0625rem;
    color: #0078c8;
    margin-right: .875rem;
    transition: color .15s linear
}

.mlj-title {
    font-size: 1.125rem;
    color: #2b2929;
    margin-bottom: 1.875rem
}

.mlj-main {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    direction: ltr
}

@media only screen and (max-width: 1050px) {
    .mlj-main {
        position: fixed;
        left: 0;
        width: 500px;
        -ms-transform: translateX(-105%);
        transform: translateX(-105%);
        top: 0;
        bottom: 0;
        transition: transform 0.3s ease-out;
        background-color: #F4F2F2;
        box-shadow: .3125rem 0 .625rem rgba(0, 0, 0, 0.15);
        z-index: 8
    }

    .mlj--openinfo .mlj-main {
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
}

@media only screen and (max-width: 500px) {
    .mlj-main {
        width: 100%
    }
}

.mlj-main-in {
    position: relative;
    direction: rtl;
    height: 100%
}

.mlj-main__wrap {
    padding: 4.5rem 4.375rem 4.0625rem 8.75rem
}

@media only screen and (min-width: 2501px) {
    .mlj-main__wrap {
        padding-left: 4.375rem
    }
}

@media only screen and (max-width: 1200px) {
    .mlj-main__wrap {
        padding-left: 5.625rem
    }
}

@media only screen and (max-width: 1050px) {
    .mlj-main__wrap {
        padding-left: 1.875rem;
        padding-right: 3.125rem
    }
}

.mlj-main__header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-bottom: 2rem;
    border-bottom: 1px solid #E6E6E6
}

.mlj-main__title {
    font-size: 1.6875rem;
    color: #373737
}

.mlj-main__tags {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: .625rem
}

.mlj-main__tag {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    height: 1.75rem;
    line-height: 1.75rem
}

.mlj-main__tag:not(:last-child) {
    margin-left: 1.25rem
}

.mlj-main__tag svg {
    fill: #707070
}

.mlj-main__tag span {
    font-size: 1.0625rem;
    color: gray;
    margin-right: .625rem
}

.mlj-main__content {
    margin-top: 2rem
}

.mlj-btninfo {
    position: fixed;
    left: 15px;
    bottom: 15px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #0078c8;
    box-shadow: 0 .1875rem .625rem rgba(0, 0, 0, 0.15);
    z-index: 50;
    display: none
}

@media only screen and (max-width: 1050px) {
    .mlj-btninfo {
        display: block
    }
}

.mlj-btninfo svg {
    fill: #fff;
    width: 100%;
    height: 100%
}

.mlj #step-comment {
    display: none
}

.mlj #step-comment .show {
    display: block
}

.mlj .step-additional .hide {
    display: none
}

.help {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    overflow: auto;
    background-color: #fff;
    z-index: 210;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    direction: ltr;
    transition: visibility 0s linear 0.4s, opacity 0.4s ease-out, transform 0.7s cubic-bezier(0.075, 0.82, 0.165, 1)
}

.help-open .help {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: visibility 0s linear, opacity 0.4s ease-out
}

.help .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 2;
    pointer-events: none
}

.help.loaded .loading {
    opacity: 0
}

.help-module {
    height: 100vh;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 1.25rem;
    pointer-events: none;
    overflow: hidden;
    padding-right: 7.1875rem
}

@media only screen and (max-width: 800px) {
    .help-module {
        padding-right: 80px
    }
}

@media only screen and (max-width: 600px) {
    .help-module {
        padding-right: 15px
    }
}

.help-wrap.loaded .help-module {
    pointer-events: auto
}

@media only screen and (max-height: 650px) {
    .help-module--categories {
        height: auto;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 2.5rem 1.25rem 3.125rem
    }
}

@media only screen and (max-width: 800px) {
    .help-module--categories {
        height: auto;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 6.25rem 1.25rem 3.125rem
    }
}

@media only screen and (min-width: 801px) and (max-height: 600px) {
    .help-module--input {
        height: auto;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 12.5rem 7.1875rem 12.5rem 1.25rem
    }
}

@media only screen and (max-width: 800px) and (max-height: 520px) {
    .help-module--input {
        height: auto;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 150px 80px 150px 15px
    }
}

@media only screen and (max-width: 600px) {
    .help-module--input {
        height: auto;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 30px 15px 150px
    }
}

.help-prevstep {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    width: 7.1875rem;
    background: #F2F2F2;
    transition: all 0.15s linear
}

@media only screen and (max-width: 800px) {
    .help-prevstep {
        width: 80px
    }
}

@media only screen and (max-width: 600px) {
    .help-prevstep {
        display: none
    }
}

.help-prevstep:hover {
    background: #e5e5e5
}

.help-prevstep svg {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 1.125rem;
    height: 1.625rem;
    fill: #999
}

.help-inner {
    width: 100%;
    max-width: 63.75rem;
    margin: 0 auto;
    direction: rtl;
    padding-right: 15px
}

@media only screen and (max-width: 600px) {
    .help-inner {
        padding-right: 0
    }
}

.help-module--categories .help-inner {
    padding: 0
}

.help-input {
    position: relative;
    display: -ms-flexbox;
    display: flex
}

@media only screen and (max-width: 600px) {
    .help-input {
        display: block
    }
}

.help-input input, .help-input textarea {
    -ms-flex: auto;
    flex: auto;
    font-size: 2.5rem;
    min-width: 0;
    color: #666;
    text-align: right;
    padding-bottom: 1.875rem
}

@media only screen and (max-width: 800px) {
    .help-input input, .help-input textarea {
        font-size: 25px
    }
}

@media only screen and (max-width: 600px) {
    .help-input input, .help-input textarea {
        font-size: 20px;
        width: 100%;
        padding-bottom: 15px
    }
}

@media only screen and (max-width: 500px) {
    .help-input input, .help-input textarea {
        width: 100%;
        font-size: 16px
    }
}

.help-input input {
    padding-left: 1.5625rem
}

@media only screen and (max-width: 600px) {
    .help-input input {
        padding-left: 0
    }
}

@media only screen and (max-width: 500px) {
    .help-input input {
        line-height: 40px;
        padding-left: 15px
    }
}

.help-input input.tel {
    direction: ltr
}

.help-input textarea {
    font-size: 1.25rem;
    resize: none;
    transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    height: 3.75rem !important
}

@media only screen and (max-width: 500px) {
    .help-input textarea {
        margin-bottom: 0;
        font-size: 16px
    }
}

.help-wrap.loaded .help-input textarea {
    height: 11.25rem !important
}

@media only screen and (max-width: 800px) {
    .help-wrap.loaded .help-input textarea {
        height: 8.125rem !important
    }
}

@media only screen and (max-width: 600px) {
    .help-wrap.loaded .help-input textarea {
        height: 7.1875rem !important
    }
}

.help-input .btn {
    -ms-flex: none;
    flex: none;
    font-size: 1.5625rem;
    height: 3.75rem;
    line-height: 3.75rem;
    transition: opacity 0.15s linear
}

.help-wrap.error .help-input .btn:not([data-prevStep]) {
    color: #fff;
    background: #b3b3b3;
    pointer-events: none
}

.help-input .btn svg {
    margin-right: .3125rem;
    fill: #fff
}

.help-input [data-prevStep] svg {
    margin: 0 0 0 .3125rem;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    fill: #666
}

.help-input [data-prevStep] {
    cursor: pointer;
    margin-left: 1.25rem
}

@media only screen and (max-width: 600px) {
    .help-btns {
        position: fixed;
        width: 100%;
        left: 0;
        bottom: 0;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 10px 15px 20px;
        background: #fff;
        z-index: 2
    }
}

@media only screen and (min-width: 601px) {
    .help-module--last .help-btns .btn {
        opacity: 0;
        position: absolute
    }
}

.help-btns .btn.load {
    pointer-events: none
}

@media only screen and (max-width: 600px) {
    .help-btns .btn {
        font-size: 16px;
        height: 50px;
        line-height: 50px;
        min-width: 80px;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-align: center;
        align-items: center;
        padding: 0 10px
    }
}

@media only screen and (max-width: 500px) {
    .help-btns .btn {
        font-size: 14px;
        height: 40px;
        line-height: 40px
    }
}

.help-btns .btn--gray {
    display: none
}

@media only screen and (max-width: 600px) {
    .help-btns .btn--gray {
        display: -ms-flexbox;
        display: flex
    }
}

.help-btns .btn .loading {
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 10px;
    opacity: 0
}

.help-btns .btn.load .loading {
    opacity: 1
}

.help-btns .btn .loading::after {
    width: 20px;
    height: 20px
}

.help-btns .btn.load svg {
    opacity: 0
}

@media only screen and (max-width: 600px) {
    .help-btns .btn svg {
        width: 10px;
        height: 16px
    }
}

@media only screen and (max-width: 500px) {
    .help-btns .btn svg {
        width: 6px;
        height: 12px;
        margin-right: 0
    }
}

.help-placeholder {
    position: absolute;
    bottom: calc(100% + 1.25rem);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    right: 0;
    font-size: 1.125rem;
    color: #666;
    opacity: 0;
    transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s linear, color 0.15s linear;
    pointer-events: none;
    overflow: hidden
}

@media only screen and (max-width: 600px) {
    .help-placeholder {
        font-size: 15px;
        position: relative;
        bottom: auto;
        margin-bottom: 10px
    }
}

@media only screen and (max-width: 500px) {
    .help-placeholder {
        font-size: 13px
    }
}

.help-wrap.loaded .help-placeholder {
    -ms-transform: translateX(0);
    transform: translateX(0);
    opacity: 1
}

.help-wrap.error .help-placeholder {
    color: #ef531a
}

.help-placeholder span {
    display: block;
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1)
}

@media only screen and (max-width: 600px) {
    .help-placeholder span {
        padding-left: 40px
    }
}

.help-wrap.loaded .help-placeholder span {
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.help-subtitle {
    display: block;
    font-size: 1.125rem;
    color: gray;
    min-height: 2.1875rem;
    margin-top: 1.25rem;
    -ms-transform: translate(100%, 0);
    transform: translate(100%, 0);
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.15s linear, transform 0.3s cubic-bezier(0.19, 1, 0.22, 1)
}

@media only screen and (max-width: 600px) {
    .help-subtitle {
        font-size: 14px
    }
}

@media only screen and (max-width: 500px) {
    .help-subtitle {
        font-size: 12px
    }
}

.help-wrap.loaded .help-subtitle {
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1
}

.help-wrap.error.loaded .help-subtitle, .help-wrap.showstates.loaded .help-subtitle {
    -ms-transform: translate(0, 15px);
    transform: translate(0, 15px);
    opacity: 0
}

.help-subtitle span {
    display: block;
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    padding-left: 6.25rem
}

@media only screen and (max-width: 600px) {
    .help-subtitle span {
        padding: 0
    }
}

.help-wrap.loaded .help-subtitle span {
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.help-progress {
    height: 3px;
    position: relative
}

.help-progress::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    top: 1px;
    left: 0;
    background: #ccc
}

.help-progress i {
    position: relative;
    z-index: 1;
    display: block;
    height: 100%;
    border-radius: 4px;
    background: #0078c8;
    transition: all 1s cubic-bezier(0.19, 1, 0.22, 1)
}

.help-wrap.error .help-progress i {
    background: #ef531a
}

.help-states {
    position: relative
}

.help-states > .scrollbar-inner {
    position: absolute;
    top: 1.875rem;
    right: 0;
    width: 100%;
    -ms-transform: translateY(20px);
    transform: translateY(20px);
    opacity: 0;
    pointer-events: none;
    z-index: 5;
    transition: opacity 0.15s linear, transform 0.2s ease-in-out;
    max-width: 18.75rem;
    max-height: 12.5rem;
    background: #fff;
    border-radius: .5rem;
    box-shadow: 0 3px 15px 0 rgba(0, 0, 0, 0.1)
}

@media only screen and (max-width: 800px) {
    .help-states > .scrollbar-inner {
        max-width: 250px;
        max-height: 150px
    }
}

@media only screen and (max-width: 800px) {
    .help-states > .scrollbar-inner {
        max-width: 200px
    }
}

.showstates .scrollbar-inner {
    pointer-events: auto;
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1
}

.help-states .scrollbar-inner {
    height: auto !important
}

.is-desktop .help-states .scroll-content {
    margin-left: -17px !important
}

.help-states ul {
    padding: 10px 12px
}

.help-states li {
    padding: .625rem 2.5rem;
    color: #666;
    font-size: 1.125rem;
    transition: color 0.15s linear;
    cursor: pointer;
    border-right: 1px solid transparent
}

@media only screen and (max-width: 800px) {
    .help-states li {
        font-size: 15px
    }
}

@media only screen and (max-width: 600px) {
    .help-states li {
        font-size: 14px
    }
}

@media only screen and (max-width: 500px) {
    .help-states li {
        font-size: 12px;
        padding: 5px 20px
    }
}

.help-states li:hover {
    color: #0078c8
}

li.active {
    color: #0078c8;
    border-color: #0078c8
}

.help-status {
    position: absolute;
    left: 0;
    top: calc(100% + 1.25rem);
    font-size: 1.125rem;
    color: #666
}

@media only screen and (max-width: 600px) {
    .help-status {
        position: fixed;
        top: auto;
        bottom: 30px;
        left: 50%;
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        z-index: 3
    }
}

@media only screen and (max-width: 500px) {
    .help-status {
        font-size: 13px
    }
}

.help-error, .help-errorpersian {
    position: absolute;
    right: 0;
    top: calc(100% + 1.25rem);
    font-size: 1.125rem;
    color: #ef531a;
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s linear, transform 0.2s ease-in-out;
    width: 100%;
    padding-left: 6.25rem
}

@media only screen and (max-width: 600px) {
    .help-error, .help-errorpersian {
        font-size: 15px
    }
}

@media only screen and (max-width: 500px) {
    .help-error, .help-errorpersian {
        font-size: 13px;
        padding-left: 70px
    }
}

.help-wrap.error .help-error, .help-wrap.error .help-errorpersian {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.help-wrap.error .help-errorpersian {
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
    opacity: 0;
    pointer-events: none
}

.help-wrap.error-persian .help-errorpersian {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.help-close {
    background: #0048ad;
    background: linear-gradient(-135deg, #0048ad 0%, #006dc2 100%);
    position: absolute;
    width: 40px;
    height: 40px;
    left: 7.8125rem;
    top: 1.5625rem;
    border-radius: .25rem;
    z-index: 20
}

@media only screen and (max-width: 1400px) {
    .help-close {
        left: 1.25rem
    }
}

@media only screen and (max-width: 600px) {
    .help-close {
        top: 27px;
        width: 30px;
        height: 30px;
        background: transparent
    }
}

.help-close:active, .help-close.nice-select.open {
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

@media only screen and (min-width: 601px) {
    .help-close:hover {
        box-shadow: 0 5px 7px rgba(0, 0, 0, 0.05)
    }
}

.help-close span {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 15px;
    height: 15px;
    transition: all 0.3s ease-in-out
}

@media only screen and (min-width: 1051px) {
    .help-close:hover span {
        -ms-transform: translate(-50%, -50%) rotate(180deg);
        transform: translate(-50%, -50%) rotate(180deg)
    }
}

.help-close span::before, .help-close span::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 2px;
    top: 50%;
    left: 50%;
    margin-top: -1px;
    margin-left: -10px;
    background-color: #fff;
    border-radius: 2px;
    transition: all 0.3s linear
}

@media only screen and (max-width: 600px) {
    .help-close span::before, .help-close span::after {
        background-color: #bebebe
    }
}

.help-close span::before {
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.help-close span::after {
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.help-title {
    text-align: center;
    color: #666;
    margin-bottom: 5rem;
    -ms-transform: translateY(20px);
    transform: translateY(20px);
    opacity: 0;
    transition: transform 0.2s ease-in-out, opacity 0.15s linear
}

@media only screen and (max-width: 500px) {
    .help-title {
        margin-bottom: 30px
    }
}

.help-wrap.first-load .help-title {
    transition-delay: 0.3s
}

.help-wrap.loaded .help-title {
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1
}

.help-categories {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: stretch;
    align-items: stretch;
    margin: 0 -1.25rem
}

@media only screen and (max-width: 800px) {
    .help-categories {
        margin: 0 -10px
    }
}

@media only screen and (max-width: 500px) {
    .help-categories {
        margin: 0 -5px
    }
}

.help-categories li {
    width: 33.33%;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    margin-bottom: 2.5rem;
    padding: 0 1.25rem;
    -ms-transform: translateY(20px);
    transform: translateY(20px);
    opacity: 0;
    transition: transform 0.2s ease-in-out, opacity 0.15s linear
}

@media only screen and (max-width: 800px) {
    .help-categories li {
        padding: 0 10px;
        margin-bottom: 20px
    }
}

@media only screen and (max-width: 600px) {
    .help-categories li {
        width: 50%
    }
}

@media only screen and (max-width: 500px) {
    .help-categories li {
        padding: 0 5px;
        margin-bottom: 10px
    }
}

.help-categories li:nth-child(1) {
    transition-delay: 0.05s
}

.help-categories li:nth-child(2) {
    transition-delay: 0.1s
}

.help-categories li:nth-child(3) {
    transition-delay: 0.15s
}

.help-categories li:nth-child(4) {
    transition-delay: 0.2s
}

.help-categories li:nth-child(5) {
    transition-delay: 0.25s
}

.help-categories li:nth-child(6) {
    transition-delay: 0.3s
}

.help-categories li:nth-child(7) {
    transition-delay: 0.35s
}

.help-categories li:nth-child(8) {
    transition-delay: 0.4s
}

.help-categories li:nth-child(9) {
    transition-delay: 0.45s
}

.help-categories li:nth-child(10) {
    transition-delay: 0.5s
}

.help-wrap.first-load .help-categories li:nth-child(1) {
    transition-delay: 0.35s
}

.help-wrap.first-load .help-categories li:nth-child(2) {
    transition-delay: 0.4s
}

.help-wrap.first-load .help-categories li:nth-child(3) {
    transition-delay: 0.45s
}

.help-wrap.first-load .help-categories li:nth-child(4) {
    transition-delay: 0.5s
}

.help-wrap.first-load .help-categories li:nth-child(5) {
    transition-delay: 0.55s
}

.help-wrap.first-load .help-categories li:nth-child(6) {
    transition-delay: 0.6s
}

.help-wrap.first-load .help-categories li:nth-child(7) {
    transition-delay: 0.65s
}

.help-wrap.first-load .help-categories li:nth-child(8) {
    transition-delay: 0.7s
}

.help-wrap.first-load .help-categories li:nth-child(9) {
    transition-delay: 0.75s
}

.help-wrap.first-load .help-categories li:nth-child(10) {
    transition-delay: 0.8s
}

.help-wrap.loaded .help-categories li {
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1
}

.help-catg {
    display: none
}

.help-final {
    position: relative;
    opacity: 0;
    transition: opacity 0.15s linear;
    text-align: center
}

.help-wrap.loaded .help-final {
    opacity: 1
}

.help-finalwrap {
    position: absolute;
    left: 50%;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 1.875rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    max-width: 100%
}

@media only screen and (min-width: 801px) and (max-height: 600px) {
    .help-finalwrap {
        position: relative;
        display: inline-block;
        -ms-transform: none;
        transform: none;
        left: auto;
        top: auto;
        margin-top: 1.875rem
    }
}

@media only screen and (max-width: 800px) {
    .help-finalwrap {
        top: 15px
    }
}

@media only screen and (max-width: 800px) and (max-height: 520px) {
    .help-finalwrap {
        position: relative;
        display: inline-block;
        -ms-transform: none;
        transform: none;
        left: auto;
        top: auto;
        margin-top: 30px
    }
}

@media only screen and (max-width: 600px) {
    .help-finalwrap {
        position: relative;
        display: inline-block;
        -ms-transform: none;
        transform: none;
        left: auto;
        top: auto;
        margin-top: 20px
    }
}

@media only screen and (max-width: 500px) {
    .help-finalwrap {
        max-width: 228px;
        margin-top: 0
    }
}

.help-finalbtn {
    width: 100%
}

@media only screen and (max-width: 600px) {
    .help-finalbtn {
        display: none
    }
}

.help-finalbtn .btn {
    position: relative;
    text-align: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.375rem
}

@media only screen and (max-width: 600px) {
    .help-finalbtn .btn {
        font-size: 18px
    }
}

@media only screen and (max-width: 500px) {
    .help-finalbtn .btn {
        font-size: 15px
    }
}

.help-finalbtn.load .btn {
    pointer-events: none
}

.help-finalbtn .btn svg {
    margin-right: .3125rem;
    fill: #fff;
    transition: all 0.3s
}

.help-finalbtn.load .btn svg {
    opacity: 0
}

.help-final [data-prevStep] svg {
    margin: 0 0 0 .3125rem;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    fill: #666
}

.help-finalbtn .btn .loading {
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: .9375rem;
    opacity: 0
}

.help-finalbtn.load .btn .loading {
    opacity: 1
}

.help-captchawrap {
    margin: .625rem 0 .9375rem
}

@media only screen and (max-width: 800px) {
    .help-captchawrap {
        margin-bottom: 5px
    }
}

@media only screen and (max-width: 600px) {
    .help-captchawrap {
        -ms-transform-origin: right;
        transform-origin: right
    }
}

@media only screen and (max-width: 500px) {
    .help-captchawrap {
        -ms-transform: scale(0.75);
        transform: scale(0.75)
    }
}

.help-captchatext {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    margin: auto;
    font-size: 1.125rem;
    color: #373737;
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s linear, transform 0.2s ease-in-out
}

@media only screen and (max-width: 500px) {
    .help-captchatext {
        text-align: right
    }
}

.help-finalwrap.error .help-captchatext {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
    color: #ef531a
}

.page-support .section-footer {
    max-width: 31.25rem;
    margin: 3.125rem auto 0
}

@media only screen and (max-width: 800px) {
    .page-support .section-footer {
        margin-top: 2.5rem
    }
}

@media only screen and (max-width: 500px) {
    .page-support .section-footer {
        margin-top: 1.875rem
    }
}

.page-support .section-footer .h6 {
    margin-top: .625rem
}

.support-layout {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch
}

@media only screen and (max-width: 600px) {
    .support-layout {
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

@media only screen and (min-width: 601px) {
    .support-layout > div {
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%
    }
}

@media only screen and (max-width: 600px) {
    .support-layout > div {
        width: 100%
    }
}

@media only screen and (min-width: 601px) {
    .support-layout > div:nth-child(1) {
        padding-left: .75rem
    }
}

@media only screen and (max-width: 600px) {
    .support-layout > div:nth-child(1) {
        margin-bottom: 15px
    }
}

.support-layout > div:nth-child(2) {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-direction: column;
    flex-direction: column
}

@media only screen and (min-width: 601px) {
    .support-layout > div:nth-child(2) {
        padding-right: .75rem
    }
}

.support-layout > div:nth-child(2) > div {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex: 1 1 50%;
    flex: 1 1 50%
}

@media only screen and (min-width: 601px) {
    .support-layout > div:nth-child(2) > div:nth-child(1) {
        padding-bottom: .75rem
    }
}

@media only screen and (max-width: 600px) {
    .support-layout > div:nth-child(2) > div:nth-child(1) {
        margin-bottom: 15px
    }
}

.support-layout > div:nth-child(2) > div:nth-child(2) {
    padding-top: .75rem;
    padding-bottom: .75rem
}

.support-layout > div:nth-child(2) > div:nth-child(3) {
    padding-top: .75rem
}

.support-faq {
    background-color: #fff;
    height: 100%;
    border-radius: .25rem;
    box-shadow: 0 .1875rem 1.25rem rgba(0, 0, 0, 0.16);
    width: 100%;
    padding: 2.1875rem 1.875rem
}

@media only screen and (max-width: 500px) {
    .support-faq {
        padding: 1.5625rem 1.25rem
    }
}

.support-faq__title {
    position: relative;
    color: #0078c8;
    font-size: 1.25rem;
    margin-bottom: 3.125rem
}

@media only screen and (max-width: 500px) {
    .support-faq__title {
        font-size: 1.125rem
    }
}

.support-faq__title::after {
    content: "";
    position: absolute;
    width: 2.8125rem;
    height: 2px;
    right: 0;
    bottom: -1.5625rem;
    background-color: #0078c8
}

.support-faq ul li:not(:last-child) {
    margin-bottom: .625rem
}

@media only screen and (max-width: 500px) {
    .support-faq ul li:not(:last-child) {
        margin-bottom: .3125rem
    }
}

.support-faq ul a {
    position: relative;
    display: inline-block;
    color: #4d4d4d;
    transition: all 0.1s;
    padding: 5px 1.875rem 5px 5px
}

.support-faq ul a:hover {
    color: #0078c8
}

.support-faq ul a::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 2px;
    right: 0;
    top: 14px;
    background-color: #b3b3b3;
    transition: all 0.1s
}

@media only screen and (max-width: 500px) {
    .support-faq ul a::before {
        top: 10px
    }
}

.support-faq li a:hover::before {
    background-color: #0078c8
}

.support-faq .btn {
    min-width: 10rem;
    margin-top: 1.5625rem
}

@media only screen and (max-width: 500px) {
    .support-faq .btn {
        width: 100%
    }
}

.support-card {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
    -ms-flex-align: center;
    align-items: center;
    border-radius: .25rem;
    box-shadow: 0 .1875rem 1.25rem rgba(0, 0, 0, 0.16);
    padding: 3.125rem 2.5rem
}

html.rtl .support-card {
    text-align: right
}

html.ltr .support-card {
    text-align: left
}

@media only screen and (max-width: 500px) {
    .support-card {
        padding: 2.8125rem 1.5625rem
    }
}

.support-card--contact {
    background: #00bee6;
    background: linear-gradient(45deg, #00bee6 0%, #0078c8 100%)
}

.support-card--service {
    background: #0032a0;
    background: linear-gradient(45deg, #0032a0 0%, #0078c8 100%)
}

.support-card img {
    -ms-flex: 0 0 4.8125rem;
    flex: 0 0 4.8125rem
}

@media only screen and (max-width: 500px) {
    .support-card img {
        -ms-flex: 0 1 3.5rem;
        flex: 0 1 3.5rem;
        max-width: 3.5rem
    }
}

.support-card > div {
    margin-right: 2.5rem
}

@media only screen and (max-width: 500px) {
    .support-card > div {
        margin-right: 1.5625rem
    }
}

.support-card__title {
    color: #fff;
    margin-bottom: 1rem
}

.support-card p {
    color: rgba(255, 255, 255, 0.8);
    font-size: 1.125rem
}

@media only screen and (max-width: 500px) {
    .support-card p {
        font-size: 1rem
    }
}

.support-bg {
    position: absolute;
    opacity: 0.3
}

@media only screen and (max-width: 800px) {
    .support-bg {
        display: none
    }
}

.support-bg--top {
    width: 20rem;
    height: 20rem;
    left: 0;
    top: 3.75rem;
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.support-bg--bottom {
    width: 21.875rem;
    height: 21.875rem;
    right: 0;
    bottom: 3.75rem;
    -ms-transform: translateX(50%);
    transform: translateX(50%)
}

@media only screen and (max-width: 500px) {
    .support-section .section-header img {
        width: 7.5rem
    }
}

.support-section .btn {
    min-width: 11.25rem
}

@media only screen and (max-width: 500px) {
    .support-section .btn {
        min-width: 10rem
    }
}

.faq-list li:not(:last-child) {
    margin-bottom: 1.4375rem
}

.faq-bg {
    position: absolute;
    opacity: 0.3
}

@media only screen and (max-width: 800px) {
    .faq-bg {
        display: none
    }
}

.faq-bg--top {
    width: 21.875rem;
    height: 21.875rem;
    right: 0;
    top: .625rem;
    -ms-transform: translateX(60%);
    transform: translateX(60%)
}

.faq-bg--bottom {
    width: 17.5rem;
    height: 22.5rem;
    left: 0;
    top: 3.125rem;
    -ms-transform: translateX(-70%);
    transform: translateX(-70%)
}

.faq-card {
    background-color: #fff;
    border-radius: .25rem;
    transition: all 0.1s
}

.faq-card:hover, .faq-card.open {
    box-shadow: 0 .625rem 1.25rem rgba(0, 0, 0, 0.1)
}

.faq-card__header {
    padding: 1.5625rem;
    font-size: 1rem
}

@media only screen and (max-width: 500px) {
    .faq-card__header {
        font-size: .9375rem;
        padding: .9375rem
    }
}

.faq-card__header button {
    position: relative;
    width: 100%;
    color: #666;
    transition: all 0.1s
}

html.rtl .faq-card__header button {
    text-align: right;
    padding-left: 1.875rem
}

html.ltr .faq-card__header button {
    text-align: left;
    padding-right: 1.875rem
}

@media only screen and (min-width: 801px) {
    .faq-card__header button:hover {
        color: #0078c8
    }
}

.faq-card.open .faq-card__header button, .faq-card__header button:focus {
    color: #0078c8
}

.faq-card__header button span {
    position: absolute;
    width: 16px;
    height: 16px;
    left: 0;
    top: 4px
}

@media only screen and (max-width: 500px) {
    .faq-card__header button span {
        width: 12px;
        height: 12px
    }
}

.faq-card__header button span::before, .faq-card__header button span::after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 2px;
    margin-top: -1px;
    background-color: #b3b3b3;
    transition: all 0.1s
}

@media only screen and (min-width: 801px) {
    .faq-card__header button:hover span::before, .faq-card__header button:hover span::after {
        background-color: #0078c8
    }
}

.faq-card.open .faq-card__header button span::before, .faq-card.open .faq-card__header button span::after {
    background-color: #0078c8
}

.faq-card__header button:focus ::before, .faq-card__header button:focus ::after {
    background-color: #0078c8
}

.faq-card__header button span::after {
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.faq-card.open .faq-card__header button span::after {
    opacity: 0
}

.faq-card__body {
    display: none;
    text-align: justify;
    padding: 0 1.5625rem 1.5625rem 1.5625rem;
    color: #373737
}

@media only screen and (max-width: 500px) {
    .faq-card__body {
        font-size: .9375rem;
        padding: 0 .9375rem .9375rem .9375rem
    }
}

.faq-card__body a {
    color: #0078c8
}

.faq-card__body a:hover {
    color: #004a7c
}

.page-job .intro__title {
    color: #ffffff;
    text-align: center
}

@media only screen and (max-width: 800px) {
    .page-job .intro__title {
        font-size: 1.25rem
    }
}

.page-job .intro__subtitle {
    color: rgba(255, 255, 255, 0.8);
    text-align: center;
    font-size: 1.0625rem
}

@media only screen and (max-width: 800px) {
    .page-job .intro__subtitle {
        font-size: .6875rem
    }
}

.page-job .section--gallery {
    padding-top: 0
}

.page-job .section--gallery .section-wrap {
    padding-top: 3.125rem
}

@media only screen and (max-width: 800px) {
    .page-job .section--gallery .section-wrap {
        padding: 1.25rem
    }
}

.page-job .section--gallery .gallery {
    margin-top: 0
}

@media only screen and (max-width: 800px) {
    .page-job .section--gallery .gallery-item {
        width: 100%
    }
}

@media only screen and (max-width: 800px) {
    .page-job .section--gallery .gallery-item:nth-of-type(4) a::after {
        padding-top: 100%
    }
}

@media only screen and (max-width: 800px) {
    .page-job .section--gallery .gallery-item:nth-of-type(5) a::after {
        padding-top: 100%
    }
}

.page-job .section-cooperation .section-wrap {
    padding-bottom: 0
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .section-wrap {
        padding-top: 0;
        padding-left: 0;
        padding-right: 0
    }
}

.page-job .section-cooperation .card-video {
    display: -ms-flexbox;
    display: flex;
    position: relative;
    padding: 5rem 4.875rem
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video {
        padding: 0 0 3.125rem;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
    }
}

.page-job .section-cooperation .card-video__preview {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video__preview {
        border-radius: 0;
        height: 19.375rem;
        margin-bottom: 3.125rem
    }
}

.page-job .section-cooperation .card-video__preview::before {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video__preview::before {
        border-radius: 0
    }
}

.page-job .section-cooperation .card-video__preview::after {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video__preview::after {
        border-radius: 0
    }
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video__info {
        padding: 0 2.9375rem
    }
}

.page-job .section-cooperation .card-video__content::after {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video__content::after {
        border-radius: 0
    }
}

.page-job .section-cooperation .card-video__title {
    color: #ffffff
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video__title {
        font-size: 1.1875rem
    }
}

.page-job .section-cooperation .card-video__subtitle {
    color: #ffffff;
    background: transparent
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video__subtitle {
        font-size: .75rem
    }
}

.page-job .section-cooperation .card-video__text {
    text-align: center;
    font-size: .9375rem;
    color: rgba(255, 255, 255, 0.8)
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video__text {
        font-size: .9375rem
    }
}

.page-job .section-cooperation .card-video .videoplayer-fram {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

@media only screen and (max-width: 800px) {
    .page-job .section-cooperation .card-video .videoplayer-fram {
        border-radius: 0
    }
}

.page-job .description {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 800px) {
    .page-job .description {
        -ms-flex-pack: start;
        justify-content: flex-start;
        min-height: 100%
    }
}

.page-job .description__img {
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
    right: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover
}

@media only screen and (max-width: 800px) {
    .page-job .description__img {
        display: none
    }
}

.page-job .description__bg-blue {
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    min-height: 100%;
    background: linear-gradient(to right, #0078C8, #0051B2)
}

@media only screen and (max-width: 800px) {
    .page-job .description__bg-blue {
        width: 100%;
        min-height: 100%;
        top: 0
    }
}

.page-job .description-wrap {
    padding: 7.5rem .9375rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 75rem;
    width: 100%
}

@media only screen and (max-width: 800px) {
    .page-job .description-wrap {
        padding-top: 3.125rem;
        padding-bottom: 3.125rem;
        -ms-flex-pack: start;
        justify-content: flex-start;
        height: 100%;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

@media only screen and (max-width: 500px) {
    .page-job .description-wrap {
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 3.125rem 4.875rem
    }
}

@media only screen and (max-width: 800px) {
    .page-job .description__header .s-header {
        padding-right: 0;
        -ms-flex-align: center;
        align-items: center;
        margin-bottom: 3.125rem
    }
}

.page-job .description__content {
    min-width: 29.375rem;
    max-width: 50%
}

@media only screen and (max-width: 800px) {
    .page-job .description__content {
        max-width: 100%;
        height: 50%;
        min-width: unset
    }
}

.page-job .description__content ul {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.page-job .description__content ul li {
    padding: 2.5rem;
    width: 50%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
    justify-content: flex-end
}

@media only screen and (max-width: 900px) {
    .page-job .description__content ul li {
        padding: 1.25rem
    }
}

@media only screen and (max-width: 800px) {
    .page-job .description__content ul li {
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media only screen and (max-width: 500px) {
    .page-job .description__content ul li {
        padding: 1.25rem;
        width: 100%;
        margin: 0 auto;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.page-job .description__content ul li:nth-child(1), .page-job .description__content ul li:nth-child(2) {
    padding-top: 0
}

@media only screen and (max-width: 500px) {
    .page-job .description__content ul li:nth-child(1), .page-job .description__content ul li:nth-child(2) {
        padding-top: 1.25rem
    }
}

.page-job .description__content ul li:nth-last-child(1), .page-job .description__content ul li:nth-last-child(2) {
    padding-bottom: 0
}

@media only screen and (max-width: 500px) {
    .page-job .description__content ul li:nth-last-child(1), .page-job .description__content ul li:nth-last-child(2) {
        padding-bottom: 1.25rem
    }
}

.page-job .description__content ul li:nth-child(even) {
    padding-left: 0
}

@media only screen and (max-width: 900px) {
    .page-job .description__content ul li:nth-child(even) {
        padding-right: 1.25rem
    }
}

@media only screen and (max-width: 800px) {
    .page-job .description__content ul li:nth-child(even) {
        padding-left: 1.25rem
    }
}

@media only screen and (max-width: 500px) {
    .page-job .description__content ul li:nth-child(even) {
        padding-left: 1.25rem
    }
}

.page-job .description__content ul li:nth-child(odd) {
    padding-right: 0
}

@media only screen and (max-width: 900px) {
    .page-job .description__content ul li:nth-child(odd) {
        padding-right: 1.25rem
    }
}

.page-job .description .card-f__wrap {
    max-width: 11.5625rem
}

.page-job .description .card-f__img {
    margin-bottom: 1.75rem;
    height: 3.9375rem
}

.page-job .section-steps .card-f {
    position: relative;
    z-index: 2;
    max-width: 100%;
    padding: 2.25rem 1.625rem .875rem 1.875rem;
    margin-bottom: 0
}

.page-job .section-steps .card-f__img {
    margin-bottom: 1.1875rem;
    height: 3.75rem
}

.page-job .section-steps .card-f__title {
    margin-bottom: 1.25rem;
    font-size: 1.0625rem;
    color: #373737
}

.page-job .section-steps .card-f__desc {
    text-align: center;
    color: rgba(55, 55, 55, 0.7)
}

.page-job .section-steps .card-f__arrow {
    position: absolute;
    width: 245px;
    height: 510px;
    top: -100px;
    left: -100px;
    z-index: 0
}

@media only screen and (max-width: 1050px) {
    .page-job .section-steps .card-f__arrow {
        display: none
    }
}

@media only screen and (max-width: 500px) {
    .page-job .section-steps .card-f__arrow {
        display: block;
        -ms-transform: rotate(-90deg);
        transform: rotate(-90deg);
        top: auto;
        bottom: -23.125rem;
        left: 0;
        width: 100%;
        height: auto
    }
}

@media only screen and (max-width: 500px) {
    .page-job .section-steps .card-f__arrow::after {
        content: "";
        display: block;
        padding-top: 277%
    }
}

.page-job .section-steps .card-f__arrow svg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.page-job .section-steps .card-f__wrap {
    z-index: 1;
    max-width: 12.25rem
}

@media only screen and (max-width: 800px) {
    .page-job .section-steps .s-header {
        padding-right: 0;
        -ms-flex-align: center;
        align-items: center;
        margin-bottom: 3.125rem
    }
}

.page-job .section-steps [class*="col-"] {
    padding: 0 .625rem;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media only screen and (max-width: 500px) {
    .page-job .section-steps [class*="col-"]:not(:last-child) {
        margin-bottom: 5rem
    }
}

.page-job .section-steps .section-wrap {
    padding-bottom: 6.25rem;
    position: relative
}

.page-job .section-steps .section-wrap--gradient:before {
    content: "";
    display: block;
    background: linear-gradient(to bottom, #fff, transparent);
    width: 100%;
    height: 7.5rem;
    position: absolute;
    top: 5.625rem;
    z-index: 3
}

@media only screen and (max-width: 800px) {
    .page-job .section-steps .section-wrap--gradient:before {
        display: none
    }
}

.page-job .section-steps .section-wrap--gradient:after {
    content: "";
    display: block;
    background: linear-gradient(to top, #fff, transparent);
    width: 100%;
    height: 7.5rem;
    position: absolute;
    bottom: 5px;
    z-index: 3
}

@media only screen and (max-width: 800px) {
    .page-job .section-steps .section-wrap--gradient:after {
        display: none
    }
}

.page-job .section-position .features {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: center;
    justify-content: center
}

.page-job .section-position .features li {
    padding: 10px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-pack: center;
    justify-content: center
}

@media only screen and (min-width: 1051px) {
    .page-job .section-position .features li {
        width: 25%
    }
}

@media only screen and (max-width: 800px) {
    .page-job .section-position .features li {
        width: 33.3333333%
    }
}

@media only screen and (max-width: 600px) {
    .page-job .section-position .features li {
        width: 100%
    }
}

.page-job .section-position .features .card-f {
    width: 100%;
    border-radius: 4px;
    padding: 1.875rem 1.25rem
}

.page-job .section-position .features .card-f:hover {
    background-color: #F6F6F6
}

@media only screen and (max-width: 800px) {
    .page-job .section-position .features .card-f {
        padding: 1.25rem 3rem;
        background-color: #fafafa
    }

    .page-job .section-position .features .card-f:hover {
        background-color: #fafafa
    }
}

.page-job .section-position .features .card-f__img {
    margin-bottom: 1.875rem
}

@media only screen and (max-width: 800px) {
    .page-job .section-position .features .card-f__img {
        margin-bottom: 1.25rem
    }
}

.page-job .section-position .features .card-f__title {
    text-align: center;
    color: #373737
}

.page-job .section-position .features .card-f__desc {
    text-align: center;
    margin-bottom: 1.875rem;
    color: rgba(55, 55, 55, 0.6);
    font-size: 1rem
}

@media only screen and (max-width: 800px) {
    .page-job .section-position .features .card-f__desc {
        margin-bottom: 1.25rem
    }
}

.page-job .section-position .btn--blue {
    background: transparent;
    color: #0078C7;
    border: 1px solid #0078C7;
    border-radius: 4px;
    font-size: .9375rem;
    padding: 0 1.5625rem;
    opacity: 0;
    visibility: hidden
}

@media only screen and (max-width: 800px) {
    .page-job .section-position .btn--blue {
        opacity: 1;
        visibility: visible
    }
}

@media only screen and (min-width: 801px) {
    .section-position .features .card-f:hover .btn--blue {
        opacity: 1;
        visibility: visible;
        background: #0078C7;
        background: linear-gradient(45deg, #0078C7 0%, #0032a0 100%);
        color: #ffffff
    }
}

.page-job .section-position .btn--lg-position {
    height: auto;
    padding: .75rem 1.75rem;
    font-size: 1.125rem
}

@media only screen and (max-width: 800px) {
    .page-job .section-position .btn--lg-position {
        padding: 8px 3.4375rem
    }
}

.page-job .section-resume {
    min-height: 56.25rem;
    padding: 7.125rem 0 8.0625rem
}

@media only screen and (max-width: 800px) {
    .page-job .section-resume {
        padding: 2.1875rem 0 1.875rem;
        min-height: auto
    }
}

.page-job .section-resume--bg-gradient {
    background: linear-gradient(145deg, #161735, #020204)
}

.page-job .section-resume__wrap {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    max-width: 74.375rem;
    padding: 0 15px;
    margin: 0 auto
}

@media only screen and (max-width: 800px) {
    .page-job .section-resume__wrap {
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        -ms-flex-align: center;
        align-items: center
    }
}

.page-job .section-resume__img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0
}

@media only screen and (max-width: 800px) {
    .page-job .section-resume__img {
        position: unset;
        -ms-transform: translateX(10%);
        transform: translateX(10%);
        margin-bottom: 2.5rem
    }
}

.page-job .section-resume__img img {
    width: 100%
}

.page-job .section-resume__content {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-bottom: 3.4375rem;
    z-index: 1;
    max-width: 29.375rem;
    min-height: 41.0625rem
}

@media only screen and (max-width: 800px) {
    .page-job .section-resume__content {
        -ms-flex-align: center;
        align-items: center;
        text-align: center;
        padding: 0 1.25rem;
        min-height: unset
    }
}

.page-job .section-resume__title {
    color: #ffffff;
    margin-bottom: 1.25rem
}

.page-job .section-resume__desc {
    color: rgba(255, 255, 255, 0.8);
    font-size: 1.0625rem;
    margin-bottom: 4.3125rem
}

@media only screen and (max-width: 800px) {
    .page-job .section-resume__desc {
        margin-bottom: 1.25rem
    }
}

.page-job .section-resume .btn-resume {
    font-size: 1.125rem;
    height: auto;
    padding: 9px 3.3125rem
}

@media only screen and (max-width: 800px) {
    .page-job .section-resume .btn-resume {
        width: 100%;
        padding-top: 7px;
        padding-bottom: 7px
    }
}

.job-search {
    background-color: #ffffff;
    padding: 2.25rem 3.4375rem 2.75rem 4rem;
    border-radius: 4px;
    box-shadow: 0 5px .9375rem 0 rgba(0, 0, 0, 0.05);
    width: 100%;
    bottom: 3.4375rem
}

@media only screen and (max-width: 800px) {
    .job-search {
        position: relative;
        padding: 1.25rem;
        border-radius: 0;
        box-shadow: none;
        bottom: unset
    }

    .job-search .bus.open-bus {
        box-shadow: 0 .9375rem .9375rem 0 rgba(0, 0, 0, 0.13)
    }
}

.job-search .search-box__field {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: end;
    align-items: flex-end;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 3.875rem
}

@media only screen and (max-width: 800px) {
    .job-search .search-box__field {
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        margin-bottom: 0
    }
}

.job-search .search-box__field label {
    display: inline-block;
    color: #999;
    font-size: 1.0625rem;
    margin-bottom: 1.4375rem
}

.job-search .search-box__field .input {
    -ms-flex: 0 1 80%;
    flex: 0 1 80%;
    margin-left: 1.8125rem;
    margin-bottom: 0
}

@media only screen and (max-width: 800px) {
    .job-search .search-box__field .input {
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        margin-left: 0;
        margin-bottom: 1.875rem
    }
}

.job-search .search-box__field .input input {
    border-bottom-width: 2px;
    padding: 0;
    font-size: 1.75rem;
    color: #666
}

@media only screen and (max-width: 800px) {
    .job-search .search-box__field .input input {
        font-size: 1.25rem
    }
}

.job-search .search-box__field .input input::placeholder {
    font-size: 1.625rem
}

@media only screen and (max-width: 800px) {
    .job-search .search-box__field .input input::placeholder {
        font-size: 1.125rem
    }
}

@media only screen and (max-width: 800px) {
    .job-search .search-box__field .btn-md-full {
        width: 100%
    }
}

.job-search .bus {
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

@media only screen and (max-width: 800px) {
    .job-search .bus {
        overflow: hidden;
        position: absolute;
        right: 0;
        width: 100%;
        top: 100%;
        max-height: 0;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align: center;
        align-items: center;
        transition: all 0.3s ease-out;
        background-color: #fff
    }

    .job-search .bus.open-bus {
        transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
        max-height: 25rem
    }
}

@media only screen and (max-width: 1050px) {
    .job-search .bus li {
        padding: unset
    }
}

@media only screen and (max-width: 800px) {
    .job-search .bus li {
        max-width: 50%;
        padding: .9375rem 1.25rem;
        -ms-transform: translateY(-10px);
        transform: translateY(-10px);
        transition: transform 0.15s ease-in-out
    }
}

@media only screen and (max-width: 900px) {
    .job-search .bus li:not(:first-child)::before {
        display: none
    }
}

@media only screen and (max-width: 800px) {
    .bus li:last-of-type .card-f {
        padding-left: 0 !important
    }
}

.job-search .bus .card-f__img {
    height: 3.125rem;
    width: 3.125rem
}

.job-search .bus .card-f__wrap {
    width: 8rem
}

.job-search .bus .card-f__title {
    color: #373737
}

.payment {
    text-align: center;
    padding: 6.25rem .9375rem
}

.payment-title {
    color: #4d4d4d
}

.payment-subtitle {
    margin-top: 1.25rem;
    color: #4d4d4d
}

.payment-loading {
    position: relative;
    height: 12.5rem
}

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

.bg-liner {
    background-image: url(..//images/pattern.jpg)
}

.bg-liner h5 {
    margin: 3.4375rem auto 2.1875rem;
    text-align: center
}

.m-b-100 {
    margin-bottom: 6.25rem
}

.color-info {
    color: #1D4F9B
}

.image-404 {
    width: 100%;
    padding: 0 .9375rem
}

.page-campaign .festival-conditions-card {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 14px;
    text-align: center;
    -ms-flex-align: center;
    align-items: center
}

.page-campaign .tab {
    --tab-padding: 1.25rem;
    --tab-bg: rgb(0 0 0 / 70%);
    --tab-active-bg: #fff
}

.page-campaign .tab input {
    display: none
}

.page-campaign .tab input:checked + label {
    background-color: var(--tab-active-bg);
    color: #000
}

.page-campaign .tab input:not(:checked) + label + * {
    display: none
}

.page-campaign .tab label {
    color: #fff;
    cursor: pointer;
    padding: var(--tab-padding)
}

@media (max-width: 575px) {
    .page-campaign .tab label {
        width: 100%
    }
}

.page-campaign .tab-wrapper {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background-color: #004DAF;
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1), 0px 4px 6px -2px rgba(0, 0, 0, 0.05)
}

.page-campaign .tab-content {
    width: 100%;
    padding: var(--tab-padding);
    background-color: var(--tab-active-bg)
}

@media (min-width: 576px) {
    .page-campaign .tab-content {
        -ms-flex-order: 9999;
        order: 9999
    }
}

.page-campaign *, .page-campaign ::after, .page-campaign ::before {
    box-sizing: border-box
}

.page-campaign .demo {
    max-width: 800px
}

.assistant-features .hira-widget-wrap {
    min-height: 120px
}

.assistant-features .hira-widget-wrap .box-gradient-item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 120px;
    background: #111111;
    padding: 0 10px
}

.box-gradient {
    border-radius: 0.5rem;
    background-image: linear-gradient(247.27deg, rgba(255, 255, 255, 0.48) 0%, rgba(255, 255, 255, 0.08) 73.73%);
    padding: 0.07rem
}

.box-gradient-item {
    background: black;
    border-radius: 0.5rem
}

.page-done .header-container {
    background: #000000
}

.page-done .header {
    background-color: #000000
}

.page-done .header .header-submenu ul li.haschild:hover a img {
    filter: brightness(1) invert(1)
}

.page-done .header .header-submenu ul li ul {
    background-color: #000000
}

.page-done .header .header-container .header-nav li span {
    color: white
}

.page-done .header .header-container .header-nav li a {
    color: white
}

.page-done .header .header-logo a::before {
    content: "";
    display: block;
    width: auto;
    height: inherit;

    background-repeat: no-repeat;
    background-position: center;
    background-size: contain
}

.page-done .header .header-logo a img {
    display: none
}

.page-done .header .header-search svg {
    filter: brightness(1) invert(1)
}

.page-done .footer {
    background-color: #000000
}

.page-done .footer .footer-logo a img {
    display: none
}

.page-done .footer .footer-logo a::before {
    content: "";
    display: block;
    width: auto;
    height: inherit;

    background-repeat: no-repeat;
    background-position: center;
    background-size: contain
}

.page-done .footer .footer-wrap .footer-col img {
    filter: brightness(1) invert(1)
}

.page-done .footer .footer-social p {
    color: #ffffff82
}

.page-done .footer .footer-title {
    color: white
}

.page-done .search--focus {
    filter: invert(1)
}

.page-done .search--focus .search-close {
    filter: invert(1)
}

.page-done .search--focus .color-bar {
    filter: invert(1)
}

.page-done .search-in img {
    filter: invert(1)
}

@media screen and (max-width: 768px) {
    .page-done .what-is-done-section .hira-container {
        -ms-flex-flow: column;
        flex-flow: column;
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

/*# sourceMappingURL=main.css.map */
