.stars { background: url('https://img2.iboss.mobi/icons/nd/sprite_stars.png') no-repeat top left; width: 64px; height: 62px; }
.stars.full { background-position: 0 0; transform: scale(.25); margin-left: -48px; display: inline-block; }
.stars.half { background-position: -64px 0; transform: scale(.25); margin-left: -48px; display: inline-block; }
.stars.empty { background-position: -128px 0; transform: scale(.25); margin-left: -48px; display: inline-block; }

.pos-full {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
}

div.pl-stars {
    position: absolute;
    right: 30px;
    top: 2px;
    z-index: 2;
}

img.star {
    vertical-align: middle;
    width: 16px;
    height: auto;
    margin: 1px;
    margin-left: -2px;
}

@keyframes ani_pl_button_key {
    from { background-position: 0px; }
    to { background-position: -200px; }
}

.pl_button_key {
    height: 41px;
    width: 50px;
    background-image: url('https://img0.iboss.mobi/icons/nd/sprite_pl_button_key.png');
    margin: 0 auto;
    margin-top: 10px;
    margin-left: 5px;
    transform: scale(.7);
    filter: brightness(1.1);
    animation: ani_pl_button_key 1s infinite steps(4,end);
}

@keyframes ani_pl_button_arrow {
    from { background-position: 0px; }
    to { background-position: -300px; }
}

@keyframes ani_pl_button_arrow_ {
    from { background-position: 0px; }
    60% { background-position: 0px; }
    to { background-position: -400px; }
}
.pl_button_arrow {
    height: 38px;
    width: 50px;
    background-image: url('https://img0.iboss.mobi/icons/nd/sprite_pl_button_arrow.png');
    margin: 0 auto;
    margin-top: 12px;
    margin-left: 3px;
    transform: scale(.65);
    animation: ani_pl_button_arrow_ 1.9s infinite steps(8,end);
}

@keyframes ani_pl_button_boost {
    0% { transform: rotate(0deg) scale(.6); }
    50% { transform: rotate(180deg) scale(.6); }
    100% { transform: rotate(360deg) scale(.6); }
}

.pl_button_boost {
    height: 50px;
    width: 49px;
    background-image: url('https://img0.iboss.mobi/icons/nd/sprite_button_boost.png');
    margin: 0 auto;
    margin-top: 5px;
    margin-left: 5px;
    animation: ani_pl_button_boost ease 3.2s infinite;
}

@keyframes ani_pl_button_coin {
    from { background-position: 0px; }
    to { background-position: -230px; }
}

.pl_button_coin {
    height: 50px;
    width: 46px;
    background-image: url('https://img0.iboss.mobi/icons/nd/sprite_pl_button_coin.png');
    margin: 0 auto;
    margin-top: -3px;
    margin-left: 6px;
    margin-bottom: -12px;
    transform: scale(.4);
    animation: ani_pl_button_coin 1s infinite steps(5,end);
}

@keyframes ani_pl_under_construction {
    0% { background-position: 0px; }
    45% { background-position: -336px; }
    100% { background-position: -336px; }
}

@keyframes ani_pl_under_construction_2 {
    45% { background-position: 0px; transform: scale(-1, -1); }
    75% { background-position: -336px; transform: scale(-1, -1); }
    100% { background-position: -336px; transform: scale(-1, -1); }
}

.pl_under_construction_work_left {
    height: 100px;
    width: 56px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_under_construction.png');
    margin: 0 auto;
    animation: ani_pl_under_construction 1.2s infinite steps(6,end);
}

.pl_under_construction_work_right {
    height: 100px;
    width: 56px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_under_construction.png');
    margin: 0 auto;
    animation: ani_pl_under_construction_2 1.4s infinite steps(6,end);
}

@keyframes ani_train_suburb_trip {
    from { background-position: 0px; }
    to { background-position: -1711px; }
}

@keyframes ani_train_suburb_start {
    0% { transform: translateX(0px) scaleY(.75); }
    50% { transform: translateX(-3px) scaleY(.75); }
    100% { transform: translateX(600px) scaleY(.75); }
}

.pl-train.suburb.start {
    height: 64px;
    width: 342px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_suburb.png');
    margin: 0 auto;
    animation: ani_train_suburb_trip .3s forwards steps(5,end), ani_train_suburb_start .8s linear forwards;
}

.pl-train.suburb.trip, .depo-train.suburb.trip {
    height: 64px;
    width: 342px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_suburb.png');
    margin: 0 auto;
}

@keyframes ani_train_speed_trip {
    from { background-position: 0px; }
    to { background-position: -1710px; }
}

@keyframes ani_train_speed_start {
    0% { transform: translateX(0px) scaleY(.75); }
    15% { transform: translateX(-3px) scaleY(.75); }
    100% { transform: translateX(600px) scaleY(.75); }
}

.pl-train.speed.start {
    height: 64px;
    width: 342px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_speed.png');
    margin: 0 auto;
    animation: ani_train_speed_trip .3s forwards steps(5,end), ani_train_speed_start .8s linear forwards;
}

.pl-train.speed.trip, .depo-train.speed.trip {
    height: 64px;
    width: 342px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_speed.png');
    margin: 0 auto;
    margin-left: -50px;
}

@keyframes ani_train_longdistance_trip {
    from { background-position: 0px; }
    to { background-position: -1368px; }
}

@keyframes ani_train_longdistance_start {
    0% { transform: translateX(0px) scaleY(.75); }
    65% { transform: translateX(-3px) scaleY(.75); }
    100% { transform: translateX(600px) scaleY(.75); }
}

.pl-train.longdistance.trip, .depo-train.longdistance.trip {
    height: 64px;
    width: 342px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_longdistance.png');
    margin: 0 auto;
    margin-left: -40px;
}

.pl-train.longdistance.start {
    height: 64px;
    width: 342px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_longdistance.png');
    margin: 0 auto;
    margin-left: -40px;
    animation: ani_train_longdistance_trip .3s forwards steps(4,end), ani_train_longdistance_start .8s linear forwards;
}

@keyframes ani_train_cargo_trip {
    from { background-position: 0px; }
    to { background-position: -1500px; }
}

.pl-train.cargo.trip, .depo-train.cargo.trip {
    height: 64px;
    width: 300px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_cargo.png');
    margin: 0 auto;
    animation: ani_train_cargo_trip .6s steps(5,end) 3 forwards;
}

.pl-train.cargo.start {
    height: 64px;
    width: 300px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_cargo.png');
    margin: 0 auto;
    animation: ani_train_cargo_trip .3s forwards steps(5,end), ani_train_cargo_start .8s linear forwards;
}


@keyframes ani_train_intercity_trip {
    from { background-position: -396px; }
    to { background-position: -396px; }
}

.pl-train.intercity.trip, .depo-train.intercity.trip {
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_intercity.png');
    height: 64px;
    width: 396px;
    margin: 0 auto;
    margin-left: -40px;
    animation: ani_train_intercity_trip .6s forwards;
}

.pl-train.intercity.start {
    height: 64px;
    width: 396px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_intercity.png');
    margin: 0 auto;
    animation: ani_train_intercity_start 1s linear forwards;
}

@keyframes ani_train_cargo_start {
    0% { transform: translateX(0px) scaleY(.75); }
    55% { transform: translateX(-3px) scaleY(.75); }
    100% { transform: translateX(600px) scaleY(.75); }
}

@keyframes ani_train_intercity_start {
    0% { transform: translateX(0px) scaleY(.75); }
    10% { transform: translateX(-10px) translateY(-10px) scale(.75, .85); }
    25% { transform: translateX(-10px) translateY(-5px) scale(.75, .85); }
    35% { transform: translateX(30px) scaleY(.75); }
    100% { transform: translateX(600px) scaleY(.75); }
}

@keyframes ani_pl_bg_scrolling {
    0% { transform: translateX(0); }
    100% { transform: translateX(-396px); }
}

@keyframes ani_pl_railway_scrolling {
    0% { transform: translateX(0); }
    100% { transform: translateX(-311px); }
}

div.pl-main {
    width: 100%;
    height: 100px;
    border: 3px solid #085a84;
    box-sizing: border-box;
    position: relative;
    margin-top: 20px;
}

div.pl-background-main {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    overflow: hidden;
}

div.pl-title {
    height: 17px;
    width: 56%;
    position: absolute;
    top: -17px;
    right: 0px;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    padding-top: 2px;
}

div.pl-title span {
    padding-left: 15px;
}

@media screen and (max-width: 419px) {
    div.pl-title {
        height: 17px;
        width: 65%;
        position: absolute;
        top: -17px;
        right: 0px;
        font-size: 11px;
        font-weight: bold;
        text-align: center;
        padding-top: 3px;
    }
}

@media screen and (max-width: 320px) {
    div.pl-title {
        height: 17px;
        width: 70%;
        position: absolute;
        top: -17px;
        right: 0px;
        font-size: 10px;
        font-weight: bold;
        text-align: center;
        padding-top: 3px;
    }
}

div.pl-railway {
    background: url('https://img1.iboss.mobi/icons/nd/pl_railway.png') repeat-x;
    background-size: 100% 100%;
    height: 15px;
    width: 700px;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
}
div.pl-railway.cargo.move {
    animation: ani_pl_railway_scrolling 5s linear infinite;
}
div.pl-railway.intercity.move, div.pl-railway.longdistance.move, div.pl-railway.suburb.move {
    animation: ani_pl_railway_scrolling 2s linear infinite;
}
div.pl-railway.speed.move {
    animation: ani_pl_railway_scrolling 1s linear infinite;
}

div.pl-title.cargo {
    background: url('https://img1.iboss.mobi/icons/nd/pl_title_cargo.png') no-repeat center;
    background-size: 100% 100%;
}
div.pl-title.intercity {
    background: url('https://img1.iboss.mobi/icons/nd/pl_title_intercity.png') no-repeat center;
    background-size: 100% 100%;
}
div.pl-title.longdistance {
    background: url('https://img1.iboss.mobi/icons/nd/pl_title_longdistance.png') no-repeat center;
    background-size: 100% 100%;
}
div.pl-title.speed {
    background: url('https://img1.iboss.mobi/icons/nd/pl_title_speed.png') no-repeat center;
    background-size: 100% 100%;
}
div.pl-title.suburb {
    background: url('https://img1.iboss.mobi/icons/nd/pl_title_suburb.png') no-repeat center;
    background-size: 100% 100%;
}
div.pl-decor-right {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 60%;
    height: 15px;
    background: url('https://img1.iboss.mobi/icons/nd/pl_decor_right.png') no-repeat center;
    background-size: 100% 100%;
    z-index: 1;
}
div.pl-settings-back {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 25px;
    height: 25px;
    background:
        url('https://img1.iboss.mobi/icons/nd/pl_settings.png') center / 13px no-repeat,
        url('https://img1.iboss.mobi/icons/nd/pl_decor_back.png') center / 100% no-repeat;
    filter: drop-shadow(1px 1px 1px black);
    z-index: 3;
    cursor: pointer;
}
div.pl-train-back {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 25px;
    height: 25px;
    background: url('https://img1.iboss.mobi/icons/nd/pl_decor_train.png') center / 11px no-repeat,
    url('https://img1.iboss.mobi/icons/nd/pl_decor_back.png') center / 100% no-repeat;
    filter: drop-shadow(1px 1px 2px black);
    z-index: 3;
}
div.pl-train-back.cargo {
    background: url('https://img1.iboss.mobi/icons/nd/pl_decor_train.png') center / 11px no-repeat,
    url('https://img1.iboss.mobi/icons/nd/pl_decor_cargo.png?v=1') center / 100% no-repeat;
}
div.pl-train-back.speed {
    background: url('https://img1.iboss.mobi/icons/nd/pl_decor_train.png') center / 11px no-repeat,
    url('https://img1.iboss.mobi/icons/nd/pl_decor_speed.png?v=1') center / 100% no-repeat;
}
div.pl-train-back.longdistance {
    background: url('https://img1.iboss.mobi/icons/nd/pl_decor_train.png') center / 11px no-repeat,
    url('https://img1.iboss.mobi/icons/nd/pl_decor_longdistance.png?v=1') center / 100% no-repeat;
}
div.pl-train-back.intercity {
    background: url('https://img1.iboss.mobi/icons/nd/pl_decor_train.png') center / 11px no-repeat,
    url('https://img1.iboss.mobi/icons/nd/pl_decor_intercity.png?v=1') center / 100% no-repeat;
}
div.pl-train-back.suburb {
    background: url('https://img1.iboss.mobi/icons/nd/pl_decor_train.png') center / 11px no-repeat,
    url('https://img1.iboss.mobi/icons/nd/pl_decor_suburb.png?v=1') center / 100% no-repeat;
}
.pl-button {
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 50px;
    height: 50px;
    background: url('https://img1.iboss.mobi/icons/nd/pl_button_back.png') no-repeat center;
    background-size: 100% 100%;
    z-index: 3;
    font-size: 11px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}
.pl-button span {
    margin-left: 5px;
}
div.pl-background {
    height: 100px;
    width: 790px;
}
div.pl-background.cargo {
    background: url('https://img1.iboss.mobi/icons/nd/pl_background.jpg') repeat-x;
}
div.pl-background.cargo.move {
    animation: ani_pl_bg_scrolling 24s linear infinite;
}
div.pl-background.intercity.move, div.pl-background.suburb.move, div.pl-background.longdistance.move {
    animation: ani_pl_bg_scrolling 15s linear infinite;
}
div.pl-background.intercity-2.move, div.pl-background.suburb-2.move {
    animation: ani_pl_bg_scrolling 5s linear infinite;
}
div.pl-background.speed.move {
    animation: ani_pl_bg_scrolling 3s linear infinite;
}
div.pl-background.intercity {
    background: url('https://img1.iboss.mobi/icons/nd/pl_background_intercity.png') repeat-x;
    background-size: 100% 100%;
}
div.pl-background.intercity-2 {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    background: url('https://img1.iboss.mobi/icons/nd/pl_background_intercity_2.png') repeat-x;
    background-size: 100% 100%;
}
div.pl-background.longdistance {
    background: url('https://img1.iboss.mobi/icons/nd/pl_background_longdistance.jpg') repeat-x;
    background-size: 100% 100%;
}
div.pl-background.speed {
    background: url('https://img1.iboss.mobi/icons/nd/pl_background_speed.jpg') repeat-x;
    background-size: 100% 100%;
}
div.pl-background.suburb {
    background: url('https://img1.iboss.mobi/icons/nd/pl_background_suburb.jpg') repeat-x;
    background-size: 100% 100%;
}
div.pl-background.suburb-2 {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    background: url('https://img1.iboss.mobi/icons/nd/pl_background_suburb_2.png') repeat-x;
    background-size: 100% 100%;
}
div.pl-background.depo {
    width: 100%;
    height: 100%;
    background: url('https://img1.iboss.mobi/icons/nd/depo_background.png') repeat-x;
    background-size: 100% 100%;
}
div.pl-train {
    position: absolute;
    bottom: 7px;
    left: -100px;
    transform: scaleY(.75);
}
div.pl-progress {
    position: absolute;
    top: 3px;
    left: 23px;
    width: 25%;
    height: 15px;
    background: url('https://img1.iboss.mobi/icons/nd/pl_progress_bar.png') no-repeat center;
    background-size: 100% 100%;
    z-index: 2;
}
div.pl-progress div.prc {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    width: 0%;
    background: url('https://img1.iboss.mobi/icons/nd/pl_progress_bar_green.png') no-repeat center;
    background-size: 100% 100%;
    z-index: 2;
}

@keyframes ani_depo_sparks {
    0% { opacity: 0; }
    4% { opacity: 0; }
    5% { opacity: 1; }
    6% { opacity: 0; }
    8% { opacity: 0; }
    9% { opacity: 1; }
    10% { opacity: 0; }
    12% { opacity: 0; }
    13% { opacity: 1; }
    14% { opacity: 0; }
    100% { opacity: 0; }
}

div.depo-sparks {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    opacity: 0;
    background-image: url('https://img2.iboss.mobi/icons/nd/depo_sparks.png');
    background-size: 100% 100%;
    animation: ani_depo_sparks 5s linear infinite;
}

@keyframes ani_depo_light_left {
    0% { opacity: 0; }
    1% { opacity: 0; }
    5% { opacity: .5; }
    15% { opacity: 0; }
    100% { opacity: 0; }
}

div.depo-light-left {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    opacity: 0;
    background-image: url('https://img2.iboss.mobi/icons/nd/depo_light_left.png');
    background-size: 100% 100%;
    animation: ani_depo_light_left 3s linear infinite;
    z-index: 2;
}

@keyframes ani_depo_light_right {
    0% { opacity: 0; }
    1% { opacity: 0; }
    6% { opacity: 0; }
    10% { opacity: 0; }
    15% { opacity: 1; }
    25% { opacity: 1; }
    30% { opacity: 0; }
    100% { opacity: 0; }
}

div.depo-light-right {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    opacity: 0;
    background-image: url('https://img2.iboss.mobi/icons/nd/depo_light_right.png');
    background-size: 100% 100%;
    animation: ani_depo_sparks 5s linear infinite;
}

div.depo-platform {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-image: url('https://img2.iboss.mobi/icons/nd/depo_platform.png');
    background-size: 100% 100%;
}

div.depo-train {
    position: absolute;
    top: 50%;
    left: 50%;
    right: 50%;
    bottom: 50%;
    margin: 0px auto;
    transform: translate(-52%, -50%) scale(.75);
    z-index: 1;
}

div.depo-train.speed.trip {
    transform: translate(-58%, -50%) scaleX(.85) scaleY(.75);
}
div.depo-train.longdistance.trip, div.depo-train.intercity.trip, div.depo-train.speed.trip {
    margin-left: 0px;
}

@media screen and (max-width: 380px) {
    div.depo-train { transform: translate(-54%, -46%) scale(.67); }
    div.depo-train.speed.trip { transform: translate(-58%, -44%) scaleX(.75) scaleY(.65); }
}
@media screen and (max-width: 380px) {
    div.depo-train { transform: translate(-56%, -44%) scale(.65); }
}

.depo-delay-cargo {
    animation-delay: 0s !important;
}
.depo-delay-suburb {
    animation-delay: .5s !important;
}
.depo-delay-intercity {
    animation-delay: 1s !important;
}
.depo-delay-speed {
    animation-delay: 1.5s !important;
}
.depo-delay-longdistance {
    animation-delay: 2s !important;
}
@keyframes ani_depo_header {
    from { background-position: 0px; }
    to { background-position: -1170px; }
}
div.depo-header {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    width: 390px;
    height: 220px;
    background-image: url('https://img2.iboss.mobi/icons/nd/sprite_depo_mehanik.png');
    animation: ani_depo_header 5s infinite steps(3,end);
}
div.depo-progress-timer, div.pl-progress-timer {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 3;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    transition: 1s;
}
div.depo-front-update {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-image: url('https://img2.iboss.mobi/icons/nd/depo_front_update.png');
    background-size: 100% 100%;
    z-index: 2;
    cursor: pointer;
}

div.service-item {
    position: relative;
    border: 5px solid #085a84;
    border-radius: 5px;
    margin: 1px;
}
img.icon-service { 
    width: 100%;
    height: auto;
    margin-bottom: 15px;
}

img.icon-service.shadow {
    filter: brightness(0.5);
}

div.service-item .footer {
    position: absolute;
    bottom: 15px;
    left: 0px;
    right: 0px;
    height: 20px;
    background-color: rgba(10, 10, 10, 0.5);
}

div.service-item .header {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 20px;
}

div.service-item .header .title {
    display: inline-block;
    font-size: 10px;
    font-weight: bold;
    padding: 5px 5px 5px 5px;
    background-color: #085a84;
    border-radius: 7px;
    text-transform: uppercase;
    position: absolute;
    top: -2px;
    left: -5px;
}

div.service-item .header .settings {
    position: absolute;
    top: 0px;
    right: 0px;
    height: 23px;
    width: 23px;
    background: url('https://img1.iboss.mobi/icons/nd/pl_settings.png') center / cover;
    filter: drop-shadow(1px 1px 2px black);
    cursor: pointer;
}

div.service-item .progress {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 15px;
    width: 100%;
    background: url('https://img1.iboss.mobi/icons/nd/pl_progress_bar.png') center / cover;
}
div.service-item .progress .prc {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 15px;
    width: 100%;
    background: url('https://img1.iboss.mobi/icons/nd/pl_progress_bar_green.png') center / cover;
    z-index: 1;
}
div.service-item .progress span {
    display: block;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    z-index: 2;
}
div.service-stars {
    text-align: center;
}
div.service-stars img.star {
    width: 12px;
    height: auto;
    margin: 0px;
    display: inline-block;
}
div.service-item .profit {
    position: absolute;
    top: 45%;
    left: 0px;
    right: 0px;
    text-align: center;
    transform: translateY(-50%);
    font-weight: bold;
    cursor: pointer;
}
div.service-coin {
    display: inline-block;
    height: 50px;
    width: 46px;
    background-image: url('https://img1.iboss.mobi/icons/nd/sprite_pl_button_coin.png');
    transform: scale(.65);
    animation: ani_pl_button_coin 1s infinite steps(5, end);
    vertical-align: middle;
    margin-top: -5px;
    margin-right: -5px;
}
div.service-item .update {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 1;
    background: url('https://img2.iboss.mobi/icons/nd/service_upgrade.png') center / cover no-repeat;
    cursor: pointer;
}

div.tutor-bg-container {
    background: #c6f2ff;
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 19000;
}
.tutor-cloud {
    width: 300px;
    height: 140px;
    position: fixed;
    opacity: 1;
    background: url('https://img2.iboss.mobi/icons/nd/tutor/cloud.png') 0 0 no-repeat;
    background-size: auto 100%;
}
.tutor-cloud.c1 {
    z-index: 20004;
    top: 97%;
    left: 50%;
    animation: ani-tutor-cl1 6s linear forwards;
}
.tutor-cloud.c2 {
    z-index: 20003;
    top: 60%;
    left: 50%;
    animation: ani-tutor-cl2 6s linear forwards;
}
.tutor-cloud.c3 {
    z-index: 20002;
    top: 53%;
    left: 50%;
    animation: ani-tutor-cl3 6s linear forwards;
}
.tutor-cloud.c4 {
    z-index: 20002;
    top: 40%;
    left: 40%;
    animation: ani-tutor-cl4 6s linear forwards;
}
.tutor-cloud.c5 {
    z-index: 20003;
    top: 20%;
    left: 0%;
    animation: ani-tutor-cl5 6s linear forwards;
}
.tutor-cloud.c6 {
    z-index: 20003;
    top: 20%;
    right: 0%;
    animation: ani-tutor-cl6 6s linear forwards;
}
@keyframes ani-tutor-cl1 {
    from {
        transform: scale(3.5) translate(-20%, 0px);
    }
    10% {
        transform: scale(3.5) translate(-20%, 0px);
    }
    75% {
        transform: scale(3.5) translate(-15%, 0px);
    }
    to {
        transform: scale(3.5) translate(-15%, -110vh);
    }
}
@keyframes ani-tutor-cl2 {
    from {
        transform: scale(3) translate(-50%, 0%);
    }
    10% {
        transform: scale(3) translate(-50%, 0%);
    }
    75% {
        transform: scale(3) translate(-80%, 5%);
    }
    to {
        transform: scale(3) translate(-80%, -110vh);
    }
}
@keyframes ani-tutor-cl3 {
    from {
        transform: scale(2.8) translate(0%, 0%);
    }
    10% {
        transform: scale(2.8) translate(0%, 0%);
    }
    75% {
        transform: scale(2.8) translate(30%, -15%);
    }
    to {
        transform: scale(2.8) translate(30%, -110vh);
    }
}
@keyframes ani-tutor-cl4 {
    from {
        opacity: 0.5;
        transform: scale(1.5) translate(-20%, 0px);
    }
    10% {
        opacity: 0.5;
        transform: scale(1.5) translate(-20%, 0px);
    }
    75% {
        opacity: 0.5;
        transform: scale(1.5) translate(-120%, 0px);
    }
    to {
        opacity: 0.5;
        transform: scale(1.5) translate(-120%, -110vh);
    }
}
@keyframes ani-tutor-cl5 {
    from {
        opacity: 0.75;
        transform: scale(3.8) translate(-50%, 0px);
    }
    10% {
        opacity: 0.75;
        transform: scale(3.8) translate(-50%, 0px);
    }
    75% {
        opacity: 0.65;
        transform: scale(3.8) translate(-25%, 0px);
    }
    to {
        opacity: 0.65;
        transform: scale(3.8) translate(-25%, -110vh);
    }
}
@keyframes ani-tutor-cl6 {
    from {
        opacity: 0.85;
        transform: scale(4) translate(50%, 0px);
    }
    10% {
        opacity: 0.85;
        transform: scale(4) translate(50%, 0px);
    }
    75% {
        opacity: 0.85;
        transform: scale(4) translate(25%, 0px);
    }
    to {
        opacity: 0.85;
        transform: scale(4) translate(25%, -110vh);
    }
}
@media screen and (max-width: 1100px) {
@keyframes ani-tutor-cl5 {
    from { transform: translate(-100%, 0px); }
    to { transform: translate(-100%, 0px); }
}
@keyframes ani-tutor-cl6 {
    from { transform: translate(100%, 0px); }
    to { transform: translate(100%, 0px); }
}
}
@keyframes ani-tutor-sun {
    from { transform: translate(-50%, -50%); }
    5% { transform: translate(-50%, -50%); }
    75% { transform: translate(40%, -30%); }
    to { transform: translate(40%, -250vh); }
}
.tutor-sun {
    width: 340px;
    height: 355px;
    position: fixed;
    z-index: 20000;
    opacity: 1;
    background: url('https://img2.iboss.mobi/icons/nd/tutor/sun.png') 0 0 no-repeat;
    background-size: auto 100%;
    top: 40%;
    left: 50%;
    animation: ani-tutor-sun 6s linear forwards;
}
@keyframes ani-tutor-logo {
    from {
        opacity: 0;
    }
    20% {
        opacity: 0;
        transform: translate(-50%, -50%);
    }
    45% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.1) rotate(4deg);
    }
    55% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1) rotate(4deg);
    }
    75% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1) rotate(4deg);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -110vh) rotate(4deg) scale(1);
    }
}
.tutor-logo {
    width: 270px;
    height: 114px;
    position: fixed;
    z-index: 20010;
    opacity: 0;
    background: url('https://img2.iboss.mobi/icons/nd/tutor/logo-iboss.png') 0 0 no-repeat;
    background-size: auto 100%;
    top: 20%;
    left: 50%;
    animation: ani-tutor-logo 6s linear forwards;
}

@keyframes ani-tutor-rays {
	from {
		opacity: 0;
	}
	20% {
		opacity: 0;
		transform: translate(-50%, -50%);
	}
	45% {
		opacity: 1;
		transform: translate(-50%, -50%) rotate(35deg);
	}
	72% {
		opacity: 1;
		transform: translate(-50%, -50%) rotate(70deg);
	}
	75% {
		opacity: 0;
		transform: translate(-50%, -50%) rotate(75deg);
	}
	to {
		opacity: 0;
		transform: translate(-50%, -110vh);
	}
}
.tutor-rays {
    width: 467px;
    height: 396px;
    position: fixed;
    z-index: 20009;
    opacity: 0;
    background: url('https://img2.iboss.mobi/icons/nd/tutor/rays.png') 0 0 no-repeat;
    background-size: auto 100%;
    top: 20%;
    left: 50%;
    animation: ani-tutor-rays 6s linear forwards;
}

@keyframes ani-tutor-station {
	from {
		opacity: 1;
		transform: translate(-50%, 0px);
	}
	20% {
		opacity: 1;
		transform: translate(-50%, -70vh) scale(1.1);
	}
	45%, 87% {
		opacity: 1;
		filter: none;
		transform: translate(-50%, -75vh) scale(1.5);
	}
	to {
		opacity: 1;
		filter: blur(2px);
		transform: translate(-50%, -75vh) scale(1.5);
	}
}
.tutor-station {
    width: 100%;
    height: 77vh;
    position: fixed;
    z-index: 20010;
    opacity: 1;
    background: url('https://img2.iboss.mobi/icons/nd/tutor/station.png') center no-repeat;
    background-size: cover;
    bottom: -75vh;
    left: 50%;
    animation: ani-tutor-station 3.5s linear forwards 4.5s;
}

.tutor-forest {
    width: 100%;
    height: 65vh;
    position: fixed;
    z-index: 20009;
    opacity: 0;
    background: url('https://img2.iboss.mobi/icons/nd/tutor/forest.png') center no-repeat;
    background-size: cover;
    bottom: -48vh;
    left: 50%;
    animation: ani-tutor-station 3.5s linear forwards 4.5s;
}

@keyframes ani-tutor-girl {
    from {
        opacity: 0;
        transform: translate(10%, 0px);
    }
    50% {
        opacity: 1;
        transform: translate(-20%, 0px);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0px);
    }
}
.tutor-girl-nd {
    width: 581px;
    height: 830px;
    max-height: 70vh;
    max-width: 110vw;
    position: fixed;
    z-index: 20011;
    opacity: 0;
    background: url('https://img2.iboss.mobi/icons/nd/tutor/girl.png') center no-repeat;
    background-size: contain;
    bottom: 0px;
    left: 50%;
    animation: ani-tutor-girl 1.5s linear forwards 7s;
}
@keyframes ani-tutor-bubble {
    from {
        opacity: 0;
        transform: translate(-100%, 0px);
    }
    50% {
        opacity: 1;
        transform: translate(-75%, 0px);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0px);
    }
}
.tutor-girl-nd.bubble {
    z-index: 20012;
    background: url('https://img2.iboss.mobi/icons/nd/tutor/bubble.png') center no-repeat;
    background-size: contain;
    animation: ani-tutor-bubble 1s linear forwards 8s;
}

div.kassa {
    position: relative;
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    max-height: 52vh;
}
@media screen and (max-width: 400px) {
    div.kassa { font-size: 14px; }
}
@media screen and (max-width: 360px) {
    div.kassa { font-size: 12px; }
}
@media screen and (max-width: 290px) {
    div.kassa { font-size: 11px; }
    div.kassa-button { font-size: 20px !important; }
}
div.kassa img.cashier {
    width: 100%;
    height: auto;
    padding: 0px;
    margin: 0px;
}
div.kassa .title {
    position: absolute;
    height: 7.3333%;
    top: 0px;
    left: 0px;
    right: 0px;
    text-align: center;
    font-weight: bold;
}
div.kassa img.info {
    position: absolute;
    left: 0px;
    bottom: -1px;
    width: 55.5555%;
    height: auto;
    z-index: 10;
}
div.kassa div.info-label {
    position: absolute;
    bottom: 1px;
    left: 13%;
    z-index: 11;
    font-weight: bold;
}
a.kassa-button {
    display: block;
    background: #93e521;
    width: calc(100% - 10px);
    height: 45px;
    text-align: center;
    margin: 0 auto;
    border: 5px outset #93e52152;
    font-weight: bold;
    font-size: 22px;
    line-height: 45px;
}
a.kassa-button.wait {
    background: #60e2df;
    border: 5px inset #60e2df;
}
div.kassa-coin {
    display: inline-block;
    height: 50px;
    width: 46px;
    background-image: url(https://img1.iboss.mobi/icons/nd/sprite_pl_button_coin.png);
    transform: scale(.55);
    animation: ani_pl_button_coin 1s infinite steps(5, end);
    vertical-align: middle;
    margin-top: -5px;
    margin-right: -5px;
}
div.kassa img.visitor {
    height: 77%;
    width: auto;
    transition: transform 2s;
    position: absolute;
    right: 0%;
    bottom: 0px;
    z-index: 5;
}