@media screen and (min-width: 1200px) {
    .banner {
        min-height: 760px;
        height: calc(100vh - 43px - 73px);
        background-image: url('../../../low/misc/promo/zeon-new/promo-zeon-head-bg_1920.jpg');
        width: 100%;
        /*background-position: 60%;*/
        background-position: center;
        background-repeat: no-repeat;
        padding-top: 20px;
        /*background-size: cover;*/
    }

    .banner-text {
        display: flex;
        flex-direction: column;
        /*justify-content: space-evenly;*/
        flex-wrap: nowrap;
        height: calc(100vh - 43px - 73px);
    }

    .zeon-new-header h1 {
        /*width: 75%;*/

        font-size: 4.1rem;
    }

    .zeon-new-header ul {
        width: 70%;
        padding-top: 4%;
    }

    .zeon-new-header ul > li {
        font-size: 2.3rem;
    }

    .banner-buttons {
        display: flex;
        justify-content: space-between;
    }

    .banner-buttons > .btn {
        font-size: 2rem;
        padding: 1rem 2.5rem;
        width: 49%;
    }

    .zeon-mid-1-block .zeon-mid-square-box {
        height: 100%;
    }

    .zeon-mid-1-block .zeon-orange-btn {
        margin-bottom: -2rem;
        font-size: 1.7rem;
    }

    .zeon-mid-4-small-block + .zeon-mid-4-small-block {
        border-left: solid 1px white;
    }

    .zeon-mid-4-small-block:first-child {
        text-align: left;
    }

    .zeon-mid-4-small-block:last-child {
        text-align: right;
    }
    .zeon-mid-7-block .zeon-bg-7{
        background-position: 50% 50%;
    }


    div[id$=functions-list] .modal-dialog{
        width: 70%;
    }
    div[id$=functions-list].in{
        display: flex!important;
        justify-content: center;
        align-items: center;
    }

    #form-zeon.in{
        display: flex!important;
        justify-content: center;
        align-items: center;
    }

    /*#form-zeon{
        display: flex;
        justify-content: center;
        align-items: center;
    }*/
    .slider-zeon-reviews .slick-prev:before, .slick-next:before {

        opacity: .75;
        color: #1B85FB !important;

        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    .slider-zeon-clients .slick-prev:before, .slick-next:before {

        opacity: .75;
        color: #1B85FB !important;

        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

@media screen and (min-width: 993px) and (max-width: 1199px) {
    .banner {
        height: calc(100vh - 68px - 152px);
        background-image: url('../../../low/misc/promo/zeon-new/promo-zeon-head-bg_1920.jpg');
        /*background-position: 60%;*/
        background-position: center;
        background-repeat: no-repeat;
        padding-top: 20px;
        background-size: cover;
    }

    .zeon-new-header h1 {
        width: 100%;
        font-size: 4.1rem;
    }

    .zeon-new-header ul {
        width: 100%;
        padding-top: 4%;
    }

    .banner-buttons > .btn {
        padding: 1rem 2.5rem;
    }

    .zeon-mid-1-block .zeon-mid-square-box {
        height: 100%;
    }
    .zeon-mid-4-small-block + .zeon-mid-4-small-block {
        border-left: solid 1px white;
    }

    .zeon-mid-4-small-block:first-child {
        text-align: left;
    }

    .zeon-mid-4-small-block:last-child {
        text-align: right;
    }
    .zeon-mid-7-block .zeon-bg-7{
        background-position: 50% 50%;
    }
    div[id$=functions-list] .modal-dialog{
        width: 70%;
    }
    div[id$=functions-list].in{
        display: flex!important;
        justify-content: center;
        align-items: center;
    }
    .slider-zeon-reviews .slick-prev:before, .slick-next:before {

        opacity: .75;
        color: #1B85FB !important;

        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    .slider-zeon-clients .slick-prev:before, .slick-next:before {

        opacity: .75;
        color: #1B85FB !important;

        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

}

@media screen and (min-width: 640px) and (max-width: 992px) {
    .banner {
        height: calc(100vh - 34px - 224px);
        background-image: url('../../../low/misc/promo/zeon-new/promo-zeon-head-bg_1920.jpg');
        /*background-position: 60%;*/
        background-position: center;
        background-repeat: no-repeat;
        padding-top: 20px;
        background-size: cover;
    }

    .zeon-new-header h1 {
        width: 80%;
        font-size: 4.1rem;
    }

    .zeon-new-header ul {
        width: 100%;
        padding-top: 4%;
    }

    .banner-buttons > .btn {
        padding: 1rem 2.5rem;
    }

    .zeon-mid-1-block .zeon-mid-square-box {
        height: 100%;
    }

    .zeon-mid-4-small-block {
        border-bottom: solid 1px white;
    }

    .zeon-mid-4-small-block:last-child {
        border-bottom: none;
    }
    .zeon-mid-7-block .zeon-bg-7{
        background-position: 0 100%;
    }
    div[id$=functions-list] .modal-dialog{
        width: 90%;
    }
    .slider-zeon-reviews .slick-prev:before, .slick-next:before {

        display: none !important;
    }
    .slider-zeon-clients .slick-prev:before, .slick-next:before {

        display: none !important;
    }
}

@media screen and (max-width: 639px) {
    .banner {
        height: calc(100vh + 15rem); /*calc(100vh - 43px - 95px);*/
        background-image: url('../../../low/misc/promo/zeon-new/promo-zeon-head-bg_1920.jpg');
        /*background-position: 60%;*/
        background-position: center;
        background-repeat: no-repeat;
        padding-top: 20px;
        background-size: cover;
        padding-bottom: 5rem;
    }

    .zeon-new-header h1 {
        width: 100%;
        font-size: 3rem;
    }

    .zeon-new-header h3 {

        font-size: 2rem;
    }

    .zeon-new-header ul {
        padding-top: 4%;
        width: 100%;
    }

    .banner-buttons > .btn {
        padding: 1rem 2.5rem;
        width: 100%;
        font-size: 2rem;
    }

    .zeon-mid-4-small-block {
        border-bottom: solid 1px white;
    }

    .zeon-mid-4-small-block:last-child {
        border-bottom: none;
    }

    .zeon-mid-circle > svg {
        width: 50%;
    }
    .zeon-mid-7-block .zeon-bg-7{
        background-position: 0 100%;
    }
    div[id$=functions-list] .modal-dialog{
        width: 100%;
    }
    .squared-img > svg {
        /*width: calc((100% / 780) * 116px);*/
        /*width: calc((100% / 780) * 116);*/
    }

    /*.squared-img>svg{
        width: 50px;
    }*/
    .slider-zeon-reviews .slick-prev:before, .slick-next:before {

        display: none !important;
    }
    .slider-zeon-clients .slick-prev:before, .slick-next:before {

        display: none !important;
    }
}

/* cyrillic-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Roboto'), local('Roboto-Regular'), url(./fonts/Roboto-others.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Roboto'), local('Roboto-Regular'), url(./fonts/Roboto-others.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* latin-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Roboto'), local('Roboto-Regular'), url(./fonts/Roboto-others.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Roboto'), local('Roboto-Regular'), url(./fonts/Roboto-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
#problems {
    font-family: "Roboto", sans-serif;
}
.zeon-new-header h1 {
    text-align: left;
    text-transform: inherit;
    padding-top: 8%;
    color: black;
}

.zeon-new-header h3 {
    text-align: left;
    color: black;
}

.zeon-new-header ul {
    font-size: 2rem;
    font-weight: bold;
}

.zeon-orange-list-markers {
    list-style: none;
    text-align: left;
}

.zeon-orange-list-markers li::before {
    content: "\2022";
    font-size: 2.5rem;
    color: #ed7a21;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

.btn.zeon-blue-btn {
    background-color: #1581FC;
    border-radius: 28px;
    border: 1px solid #1581FC;
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    /*    font-family: Arial;*/
    /*font-size: 17px;*/
    text-decoration: none;
    /*    text-shadow: 0px 1px 0px #2f6627;*/
}

.btn.zeon-blue-btn:hover {
    background-color: #006dfc;
}

.btn.zeon-blue-btn:active {
    position: relative;
    top: 1px;
}

.btn.zeon-orange-btn {
    background-color: #ed7a21;
    border-radius: 28px;
    border: 1px solid #ed7a21;
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    /*    font-family: Arial;*/
    /*font-size: 17px;*/
    text-decoration: none;
    /*    text-shadow: 0px 1px 0px #2f6627;*/
}

.btn.zeon-orange-btn:hover {
    background-color: #ed6301;
}

.btn.zeon-orange-btn:active {
    position: relative;
    top: 1px;
}

.zeon-row-flex {
    display: flex;
    flex-wrap: wrap;
}

/*.zeon-mid-1-block .zeon-mid-square-box {*/
/*    height: 100%;*/
/*    border: 1px solid #edeeef;*/
/*    border-radius: 3%;*/
/*    box-shadow: 2px 2px 4px 0 #edeeef;*/
/*    padding: 10%;*/
/*    display: flex;*/
/*    align-items: center;*/
/*}*/
.zeon-mid-1-block .zeon-mid-square-box {
    border: 1px solid #edeeef;
    border-radius: 3%;
    box-shadow: 2px 2px 4px 0 #edeeef;
    padding: 10% 10% 0 10%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/*.zeon-mid-2-block .zeon-row-flex {*/
/*    display: flex;*/
/*    flex-wrap: wrap;*/
/*}*/

.zeon-mid-2-block .col-md-6 {
    padding: 1%;
    /*    margin: 2%;
    /    flex: 1;*/
}

.zeon-mid-round-options {
    height: 100%;
    border: 1px solid #edeeef;
    border-radius: 28px;
    box-shadow: 2px 2px 4px 0 #edeeef;
    padding: 3% 3% 3% 4%;
    background: rgba(255, 255, 255, 0.78);
    text-align: left;
}


.zeon-mid-2-block strong::before {
    content: "\2022";
    font-size: 2rem;
    color: #ed7a21;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -0.5em;
}

.zeon-mid-3-block .zeon-block-img {
    margin-bottom: 5%;
    padding: 5% 0 5% 0;

    border: 1px solid #edeeef;
    border-radius: 3%;
    box-shadow: 2px 2px 4px 0 #edeeef;
    /*padding: 5%;
    height: 100%;*/
}

.zeon-mid-3-block .zeon-block-text {
    padding: 3% 0 2% 2%;
}
.zeon-block-text p{
    margin-bottom: 0px;
}
.zeon-mid-4-block, .zeon-mid-8-block {
    background: #E7F1F8;
}

.zeon-mid-4-main {
    background: rgb(21, 129, 251);
    background: linear-gradient(132deg, rgba(21, 129, 251, 1) 0%, rgba(94, 183, 240, 1) 100%);
    border-radius: 1rem;
}

.zeon-mid-4-main .zeon-mid-4-small-block {
    margin: 3% 0 3% 0;
}

.zeon-mid-4-main .zeon-mid-4-first-small-block {
    margin: 3% 0 3% 0;
}

/*.zeon-mid-4-small-block:before {*/
/*    content: " ";*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    bottom: 0;*/
/*    width: 1px;*/
/*    background: #FFFFFF;*/
/*}*/

.zeon-mid-4-main h4 {
    height: 3rem;
    color: #FFFFFF;
    /*    border-left: 1px solid #E7F1F8;*/
}

.zeon-mid-4-main p {
    font-size: 1.6rem;
    color: #FFFFFF;
}

.zeon-mid-5-block .zeon-mid-5-main {
    position: relative;
}

.zeon-mid-5-block .zeon-mid-circle {

}

.zeon-mid-5-block .zeon-circle-infographics {
    position: relative;
    height: 70rem;
}

.zeon-mid-5-block .squared-img {
    width: 116px;
}


.zeon-mid-5-block .zeon-mid-5-text {
    padding: 9% 5% 5% 5%;
    color: #333;
}

/*.zeon-mid-6-block .zeon-row-flex {*/
/*    display: flex;*/
/*    flex-wrap: wrap;*/
/*}*/

.zeon-mid-6-block .zeon-mid-square-box {
    height: 100%;
    border-radius: 3%;
    padding: 2rem 2rem 3rem 2rem;
    background: rgb(21, 129, 252);
    background: linear-gradient(180deg, rgba(21, 129, 252, 1) 0%, rgba(97, 185, 240, 1) 100%);
    text-align: center;
    margin-left: 2%;
    margin-right: 2%;
}

.zeon-mid-6-block .col-md-3 {
    margin-bottom: 3rem;
}

.zeon-mid-6-block .dots {
    width: 2rem;
    color: #ed7a21;
    border-radius: 50%;
    padding-left: 50%;
}

.zeon-mid-6-block .dots {
    width: 2rem;
    color: #ed7a21;
    border-radius: 50%;
    padding-left: 50%;
}

.zeon-mid-6-block h4 {
    color: #FFFFFF;
}
.zeon-mid-7-block .zeon-bg-7{
    padding: 5%;
    background-image:url('../../../low/misc/promo/zeon-new/promo-zeon-small-bg-7.svg');
    background-size: 100%;
    background-repeat: no-repeat;
}

.zeon-mid-7-block .zeon-block-img {
    margin-bottom: 5%;
    padding: 5% 0 5% 0;

    border: 1px solid #edeeef;
    border-radius: 3%;
    box-shadow: 2px 2px 4px 0 #edeeef;
    /*padding: 5%;
    height: 100%;*/
}

/*.zeon-mid-7-block .zeon-mid-round-options {
    height: 100%;
    border: 1px solid #edeeef;
    border-radius: 28px;
    box-shadow: 2px 2px 4px 0 #edeeef;
    padding: 3% 3% 3% 4%;
    background: rgba(255, 255, 255, 0.78);
    text-align: left;
    margin-bottom: 1.3rem;
}*/
/*start*/
.zeon-mid-round-options {
    height: 100%;
    border: 1px solid #edeeef;
    border-radius: 28px;
    box-shadow: 2px 2px 4px 0 #edeeef;
    padding: 3% 3% 3% 4%;
    background: rgba(255, 255, 255, 0.78);
    text-align: left;
    margin-bottom: 1.3rem;
}
.zeon-mid-hid p::before {
    content: "\2022";
    font-size: 2rem;
    color: white;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -0.5em;
}
.hiddiv{
  display:none;
}
.showndiv{
  display:block;
}
.div-orange{
  background-color: #ff7e50;
  color:white;
}
/*End*/
.zeon-mid-7-block .zeon-mid-round-btn{
    height: 100%;
    border: 1px solid #edeeef;
    border-radius: 28px;
    box-shadow: 2px 2px 4px 0 #edeeef;
    padding: 3% 3% 3% 4%;
    background: rgba(255, 255, 255, 0.78);
    text-align: left;
    margin-bottom: 1.3rem;
}
.zeon-mid-7-block .zeon-row-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}


.flex-list {
    display: flex;
    flex-direction: column;

}

.flex-list .flex-row {
    display: flex;
    margin-bottom: 20px;
    justify-content: space-around;
    flex-wrap: wrap;
}

.flex-list .flex-row .flex-item-wrapper {
   /* margin-right: 1%;
    margin-left: 1%;*/
    /*width: 100%;*/
    background-color: yellow;
}

.flex-list .flex-row .flex-item-wrapper:last-child {
    margin-right: 0;
    background-color: transparent;
}

.flex-list .flex-row .flex-item-wrapper .flex-item {
    width: 100%;
    height: 100%;

    display: flex; /* NEW */
    flex-direction: column; /* NEW */
}

.flex-item-stats {
    display: flex;
    justify-content: center;
    color: grey;
    padding-top: 10px;
    align-items: center;
}

.flex-item-stats > * {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.caption {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1; /* NEW */
    font-size: 1.4rem;
}

.caption2 {
    justify-content: space-between;
    font-weight: 500;
}

.zeon-advances-main-headers {
    display: flex;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.zeon-mid-9-block .thumbnail {
    padding-left: 0;
}

.zeon-markers {
    display: flex;
    text-align: left;
    justify-content: space-between;
    margin-bottom: 1%;
    margin-top: 1%;
}

.zeon-markers-svg {
    -webkit-border-top-right-radius: 30px;
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-topright: 30px;
    -moz-border-radius-bottomright: 30px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    background-color: #1F88F9;
    padding-left: 2rem;
    display: flex;
    align-items: center;
}

.zeon-mid-9-block .zeon-plus-link {
    /*background-color: darkslateblue;*/
    margin-left: 2rem;
}

.zeon-plus-orange-white {
    background-color: #ed6301;
    border: 1px solid #e4e4e6;
    border-radius: 100%;
    box-shadow: 1px 1px 3px 0 #bfbfbf;

}

.zeon-plus-orange-white:before {
    color: white;
}

.zeon-plus-white-orange {
    background-color: #FFFFFF;
    border-radius: 100%;
    /*border: 1px solid #e4e4e6;

    box-shadow: 1px 3px 3px 0px #bfbfbf;*/

}

.zeon-plus-white-orange:before {
    color: #ed6301;
}

.zeon-blue-btn {
    background-color: #1F88F9;
}

.zeon-blue-btn strong {
    color: white;
}

.zeon-mid-10-block .zeon-row-flex {
    /*flex-direction: column;*/
    align-items: stretch;
    align-content: stretch;
    justify-content: center;
}


.zeon-mid-10-block .zeon-mid-square-box {
    height: 100%;
    /*width: 500px;*/
    border: 2px solid #D1E6F7;
    border-radius: 4%;
    /*box-shadow: 2px 2px 4px 0px #edeeef;*/
    padding: 5%;
    background: rgba(255, 255, 255, 0.87);
}

/*.zeon-mid-11-block .slick-prev:before, .slick-next:before {

    opacity: .75;
    color: #1B85FB !important;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}*/


.submit-success-zeon{
    background-color: rgba(255,255,255, 0.9);
    border-radius: 0.7rem;
    padding: 4% 1% 3% 1%;
}
.submit-success-zeon h3, h4{
    /*color: rgba(21, 129, 252, 1) !important;*/
}
/*.modal .zeon-markers {*/
/*    display: flex;*/
/*    text-align: left;*/
/*    justify-content: space-between;*/
/*    margin-bottom: 3%;*/
/*}*/
/*.modal .zeon-markers-svg {*/
/*    -webkit-border-top-right-radius: 30px;*/
/*    -webkit-border-bottom-right-radius: 30px;*/
/*    -moz-border-radius-topright: 30px;*/
/*    -moz-border-radius-bottomright: 30px;*/
/*    border-top-right-radius: 30px;*/
/*    border-bottom-right-radius: 30px;*/
/*    background-color: #ed7a21;*/
/*    padding-left: 2rem;*/
/*    display: flex;*/
/*    align-items: center;*/
/*}*/

/*ToolTip CSS */

:root {
    /*--bg: #353539;*/
    --bg: #ed7a21;
    --text: #fff;
    --opacity: .9;
    --shadow: rgba(0, 0, 0, .35);
    --dink: 5px;
    --ani: 150ms cubic-bezier(.5, 0, .6, 1.3) 1ms forwards;
}

@keyframes tips-vert {
    to {
        opacity: var(--opacity);
        transform: translate(-50%, 0);
    }
}

@keyframes tips-horz {
    to {
        opacity: var(--opacity);
        transform: translate(0, -50%);
    }
}

@keyframes tips-diag-right {
    to {
        opacity: var(--opacity);
        transform: translate(-1em, 0);
    }
}

@keyframes tips-diag-left {
    to {
        opacity: var(--opacity);
        transform: translate(1em, 0);
    }
}

[tooltip] {
    position: relative;
}

[tooltip]::before, [tooltip]::after {
    text-transform: none;
    line-height: 1;
    font-size: 1em;
    user-select: none;
    pointer-events: none;
    position: absolute;
    display: none;
    opacity: 0;
}

[tooltip]::before {
    content: "";
    border: var(--dink) solid transparent;
    z-index: 1001;
}

[tooltip]::after {
    content: attr(tooltip);
    font-family: Helvetica, sans-serif;
    text-align: center;
    min-width: 3em;
    max-width: 21em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 1ch 1.5ch;
    border-radius: 0.3em;
    box-shadow: 0 1em 2em -0.5em var(--shadow);
    background: var(--bg);
    color: var(--text);
    z-index: 1000;
}

[tooltip]:hover::before, [tooltip]:hover::after {
    display: block;
}

[tooltip]:not([flow])::before,
[tooltip][flow^=up]::before {
    bottom: 100%;
    border-bottom-width: 0;
    border-top-color: var(--bg);
}

[tooltip]:not([flow])::after,
[tooltip][flow^=up]::after {
    bottom: calc(100% + var(--dink));
}

[tooltip]:not([flow])::before, [tooltip]:not([flow])::after,
[tooltip][flow^=up]::before,
[tooltip][flow^=up]::after {
    left: 50%;
    transform: translate(-50%, 0.5em);
}

[tooltip][flow^=down]::before {
    top: 100%;
    border-top-width: 0;
    border-bottom-color: var(--bg);
}

[tooltip][flow^=down]::after {
    top: calc(100% + var(--dink));
}

[tooltip][flow^=down]::before, [tooltip][flow^=down]::after {
    left: 50%;
    transform: translate(-50%, -0.5em);
}

[tooltip][flow$=-left]::after {
    right: 50%;
    left: auto;
}

[tooltip][flow=up-left]::after {
    transform: translate(1.5em, 0.5em);
}

[tooltip][flow=down-left]::after {
    transform: translate(1.5em, -0.5em);
}

[tooltip][flow=up-right]::after {
    transform: translate(-1.5em, 0.5em);
}

[tooltip][flow=down-right]::after {
    transform: translate(-1.5em, -0.5em);
}

[tooltip][flow=left]::before {
    top: 50%;
    border-right-width: 0;
    border-left-color: var(--bg);
    left: calc(0em - var(--dink));
    transform: translate(0.5em, -50%);
}

[tooltip][flow=left]::after {
    top: 50%;
    right: calc(100% + var(--dink));
    transform: translate(0.5em, -50%);
}

[tooltip][flow=right]::before {
    top: 50%;
    border-left-width: 0;
    border-right-color: var(--bg);
    right: calc(0em - var(--dink));
    transform: translate(-0.5em, -50%);
}

[tooltip][flow=right]::after {
    top: 50%;
    left: calc(100% + var(--dink));
    transform: translate(-0.5em, -50%);
}

[tooltip]:not([flow]):hover::before, [tooltip]:not([flow]):hover::after,
[tooltip][flow^=up]:hover::before,
[tooltip][flow^=up]:hover::after,
[tooltip][flow^=down]:hover::before,
[tooltip][flow^=down]:hover::after {
    animation: tips-vert var(--ani);
}

[tooltip][flow$=-right]:hover::after {
    animation: tips-diag-right var(--ani);
}

[tooltip][flow$=-left]:hover::after {
    animation: tips-diag-left var(--ani);
}

[tooltip][flow=left]:hover::before, [tooltip][flow=left]:hover::after,
[tooltip][flow=right]:hover::before,
[tooltip][flow=right]:hover::after {
    animation: tips-horz var(--ani);
}

[tooltip=""]::after, [tooltip=""]::before {
    display: none !important;
}

/*ToolTip CSS end*/


/*.zeon-mid-6-block .pipka::before {*/
/*    content: "";*/
/*    display: inline-block;*/
/*    vertical-align: middle;*/
/*}*/
/*.zeon-mid-2-block {*/
/*     background-image:url('{IMG}low/misc/promo/zeon-new/promo-zeon-bg2.png');*/
/*     background-position: 60%;*/
/*     padding-top: 20px;*/
/*     height: 75rem;*/
/*}*/