* {
    font-family: "GenSenRounded","MicroSoft JhengHei",sans-serif !important;
    scroll-behavior: smooth;
}

html {
    scroll-behavior: smooth
}

.background-bottom {
    padding-top: 35px;
    background-repeat: no-repeat;
    background-image: url('../img/bg_bottom.svg');
    background-position: center bottom -380px;
}

@media screen and (max-width: 1024px) {
    .background-bottom {
        padding-top: 47px;
        background-position: center bottom -500px;
    }
}

@media screen and (max-width: 640px) {
    .background-bottom {
        padding-top: 58px;
        background-position: center bottom -450px;
    }
}

/* float animation image */
.float-img {
    animation-name: floating;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.cloud-float {
    animation-name: floating-reverse;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

/* float animation image */
.float-reverse-img {
    animation-name: floating-reverse;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.animation-left-up {
    animation-name: move-left-up;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.animation-left-down {
    animation-name: move-left-down;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}