.banner {
    position: relative;
    overflow: hidden;
}

.banner_BG {
    width: 100%;
}

.banner_man {
    position: absolute;
    bottom: -45%;
    left: -7.5%;
    width: 45%;
    transition: .5s;
    opacity: 0;
}

.show .banner_man {
    bottom: 5%;
    opacity: 1;
}


.banner_woman {
    position: absolute;
    bottom: -45%;
    right: -7.5%;
    width: 45%;
    transition: .5s;
    opacity: 0;
}

.show .banner_woman {
    bottom: 5%;
    opacity: 1;
}

.banner_man_emoji {
    position: absolute;
    bottom: 20%;
    left: -5%;
    width: 15%;
    transition: .5s;
    opacity: 0;
}

.show .banner_man_emoji {
    left: 5%;
    opacity: 1;
    animation-name: pulse;
    animation-duration: 1s;
    animation-delay: .5s;
    animation-iteration-count: infinite;
}

.banner_woman_emoji {
    position: absolute;
    bottom: 40%;
    right: -3%;
    width: 15%;
    transition: .5s;
    opacity: 0;
}

.show .banner_woman_emoji {
    right: 7%;
    opacity: 1;
    animation-name: pulse;
    animation-duration: 1s;
    animation-delay: .5s;
    animation-iteration-count: infinite;
}


.banner_title {
    position: absolute;
    top: -40%;
    left: 29%;
    width: 42%;
    transition: .5s;
    opacity: 0;
}

.show .banner_title {
    top: 10%;
    opacity: 1;
    animation-name: bounce;
    animation-duration: 3s;
    animation-delay: 1s;
    animation-iteration-count: infinite;
}

.banner_subtitle {
    position: absolute;
    top: 52.5%;
    left: 35%;
    width: 30%;
    transition: .5s;
    opacity: 0;
}

.show .banner_subtitle {
    top: 42.5%;
    opacity: 1;
}

.rotate_top {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}


@media screen and (max-width: 1024px) {

    .banner_BG {
        width: 170%;
        margin: 0 -35%;
    }

    .banner_man {
        position: absolute;
        bottom: -65%;
        left: -20%;
        width: 60%;
        transition: .5s;
        opacity: 0;
    }
    
    .show .banner_man {
        bottom: 0;
        opacity: 1;
    }
    
    
    .banner_woman {
        position: absolute;
        bottom: -55%;
        right: -17.5%;
        width: 60%;
        transition: .5s;
        opacity: 0;
    }
    
    .show .banner_woman {
        bottom: 0;
        opacity: 1;
    }
    
    .banner_man_emoji {
        position: absolute;
        bottom: 5%;
        left: -32.5%;
        width: 25%;
        transition: .5s;
        opacity: 0;
    }
    
    .show .banner_man_emoji {
        left: -2.5%;
        opacity: 1;
        animation-name: pulse;
        animation-duration: 1s;
        animation-delay: .5s;
        animation-iteration-count: infinite;
    }
    
    .banner_woman_emoji {
        position: absolute;
        bottom: 25%;
        right: -33.5%;
        width: 25%;
        transition: .5s;
        opacity: 0;
    }
    
    .show .banner_woman_emoji {
        right: -3.5%;
        opacity: 1;
        animation-name: pulse;
        animation-duration: 1s;
        animation-delay: .5s;
        animation-iteration-count: infinite;
    }
    
    
    .banner_title {
        position: absolute;
        top: -40%;
        left: 12%;
        width: 76%;
        transition: .5s;
        opacity: 0;
    }
    
    .show .banner_title {
        top: 10%;
        opacity: 1;
        animation-name: bounce;
        animation-duration: 3s;
        animation-delay: 1s;
        animation-iteration-count: infinite;
    }
    
    .banner_subtitle {
        position: absolute;
        top: 55%;
        left: 27.5%;
        width: 45%;
        transition: .5s;
        opacity: 0;
    }
    
    .show .banner_subtitle {
        top: 45%;
        opacity: 1;
    }


}