@import url('/index/utp/styles/sloi.css');
@import url('/index/utp/styles/left-block.css');
@import url('/index/utp/styles/right-block.css');
@import url('/ui/prices/indexPrices.css');
.utp {
    content: "";
    clear: both;
    width: 100%;
    display: flex;
    position: relative;
    background-repeat: no-repeat;
    animation: fullBg 15s;
    animation-iteration-count: infinite;
    background-size: cover;
}
@media(min-width:1100px) {
    .utp {
        height: 680px;
    }
}
@media(min-width:760px) and (max-width:1099px) {
    .utp {
        height: 320px;
    }
}
@media(min-width:760px) {
    .utp {
        justify-content: space-between;
        align-items: stretch;
        background-image: url('/index/utp/img/full-bg.webp');
    }
    @keyframes fullBg {
    0% {background-size: 127%;}
    10% {background-size: 130%;}
    20% {background-size: 133%;}
    30% {background-size: 136%;}
    40% {background-size: 139%;}
    50% {background-size: 142%;}
    60% {background-size: 139%;}
    70% {background-size: 136%;}
    80% {background-size: 133%;}
    90% {background-size: 130%;}
    100% {background-size: 127%;}
    }
}
@media(max-width:759px) {
    .utp {
        flex-direction: column;
        height:680px;
        background-image: url('/index/utp/img/bg-mob.webp');
        transition: 1s;
    }
    @keyframes fullBg {
    0% {background-size: 127%;}
    10% {background-size: 130%;}
    20% {background-size: 133%;}
    30% {background-size: 136%;}
    40% {background-size: 139%;}
    50% {background-size: 142%;}
    60% {background-size: 139%;}
    70% {background-size: 136%;}
    80% {background-size: 133%;}
    90% {background-size: 130%;}
    100% {background-size: 127%;}
    }
}