.sex_button {background: none;color: inherit;border: none;padding: 0;position: absolute;font: inherit;cursor: pointer;outline: inherit;background: #1e1e1e;text-align: center;text-transform: uppercase;transition: 0.5s;background-size: 200% auto;color: white;padding: 3vh 4vh;box-shadow: 0 0 20px #0000004f;border-radius: 1.5vh;font-size: 2.7vh;display: block;border: 0.1vh #ffffff69 solid;}

.fuck_button {text-wrap: nowrap;}

.fuck_faster_button {text-wrap: nowrap;left: 18vh;}


.cum_button {text-wrap: nowrap;top: 12vh;}

.clicked_fuck_button {
background-image: linear-gradient(to right, #FF512F 0%, #DD2476 51%, #FF512F 100%);
}

.animation_mode {
position: absolute;
width: inherit;
height: inherit;
display: none;
}

.phrase_box, .phrase_box_second {display:none;position: absolute;background-color: #ffffff;font-size: 3vh;color: black;padding: 2vh;width: max-content;border-radius: 1vh;max-width: 35vh;text-align: center;/* border: 0.3vh #00000036 solid; *//* text-shadow: 0.2vh 0.2vh 1vh black; */}

.bla_bla_button {top: 12vh;text-wrap: nowrap;left: 18vh;}

.active_animation_button {
background-image: linear-gradient(to right, #4CB8C4 0%, #3CD3AD  51%, #4CB8C4  100%);
color: white;
}


.sex_button:hover {
background-position: right center; /* change the direction of the change here */
color: #fff;
text-decoration: none;
}

.clicked_cum_button {
color:black;  
background-image: linear-gradient(to right, #ECE9E6 0%, #FFFFFF  51%, #ECE9E6  100%);
           
         
}

.clicked_cum_button:hover{
    color:black;
}

.phrase_box.arrow-bottom-left::after, .phrase_box_second.arrow-bottom-left::after {
    content: '';
    position: absolute;
    bottom: -3.25vh;
    left: 2vh;
    border-width: 1.7vh;
    border-style: solid;
    border-color: white transparent transparent transparent;
}

.phrase_box.arrow-top-right::after, .phrase_box_second.arrow-top-right::after {
    content: '';
    position: absolute;
    top: -3.25vh;
    right: 2vh;
    border-width: 1.7vh;
    border-style: solid;
    border-color: transparent transparent white transparent;
}

.phrase_box.arrow-bottom-right::after, .phrase_box_second.arrow-bottom-right::after {
    content: '';
    position: absolute;
    bottom: -3.25vh; 
    right: 2vh;
    border-width: 1.7vh;
    border-style: solid;
    border-color: white transparent transparent transparent;
}

.phrase_box.arrow-top-left::after, .phrase_box_second.arrow-top-left::after {
    content: '';
    position: absolute;
    top: -3.25vh;
    left: 2vh;
    border-width: 1.7vh;
    border-style: solid;
    border-color: transparent transparent white transparent;
}


.animation_mode_container {
    position: absolute;
    top: 75vh;
    right: 174vh;
}

.right_animation_buttons {
    position: absolute;
    top: 75vh;
    right: 47vh;
}

.double_animation_buttons {
    top: 88vh;
    left: 3vh;
    display: inline-flex;
}

.double_animation_buttons > button {
  position: relative; /* или absolute, если требуется */
  top: 0;
  left: 0;
}



.double_animation_buttons > button:nth-child(2) {
  margin-left: 2vh;
}

.double_animation_buttons > button:nth-child(3){
  margin-left: 88vh;
}
.double_animation_buttons > button:nth-child(4){
  margin-left: 2vh;
}

.center_long {
    top: 89vh;
    left: 45vh;
    display: inline-flex;
}

.center_long > button {
  position: relative; /* или absolute, если требуется */
  top: 0;
  left: 0;
}

.center_long > button:not(:first-child) {
  margin-left: 2vh;
}
.animation_mode.animation_display {
    display: block; /* Или другой подходящий display, когда кнопки должны быть видны */
}


.sprites .animation_transform {
    transform: scale(1.0);
}

.scaled_back_effect {
    transform: scale(1.01);
}
@keyframes flyAndFall {
    0% {
        opacity: 1;
        transform: scale(0.5);
    }
    50% {
        opacity: 1;
        transform: translate(var(--dx), var(--dy)) scale(var(--scale));
    }
    100% {
        opacity: 0;
        transform: translate(var(--dx), calc(var(--dy) + 20vh)) scale(0.5); /* Дополнительное падение на 20vh */
    }
}

.heart {
    position: absolute;
    font-size: 5vh; /* Размер сердечка */
    animation: flyAndFall 6s ease-out forwards; /* Увеличенное время анимации до 6 секунд для медленного эффекта */
}


.heart-container {
    position: absolute;

}