/*
*Theme Name:     Oceanpearl Child Theme
*Theme URI: 	 https://phuquococeanpearlhotel.com
*Description:    Oceanpearl child theme for user customization
*Author:         Jack Lam
*Author URI:     http://www.phuquococeanpearlhotel.com
*License: 		 GNU General Public License v2 or later
*License URI: 	 http://www.gnu.org/licenses/gpl-2.0.html
*Tags: 			 full-width-template, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, rtl-language-support, sticky-post, threaded-comments, translation-ready
*Template:       oceanpearl
*Text Domain: 	 oceanpearl-child
*Version:        1.0
*/

 /** Add your styles below **/
.menu_button span {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    display: inherit;
    animation: typing 4s steps(20, end) infinite, blink-caret 0.5s step-end infinite alternate;
}

@keyframes typing {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}

@keyframes blink-caret {
    to {
        border-color: transparent;
    }
}


.posts .post-excerpt { text-align: justify; }
header .elementor-widget-cs_logo img{
    /*filter: brightness(0) invert(1);*/
}
.tour_base-price {
    font-size: 1.125rem;
    font-weight: 500;
}
.similar-rooms .featured-img>a{
    --img-ratio: 150%;
}
.cs-gallery.variable-width .cs-gallery-item {
    border-left: 4px solid #fff;
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}
@-webkit-keyframes flash {

    0%,
    100%,
    50% {
        opacity: 1
    }

    25%,
    75% {
        opacity: 0
    }
}

@keyframes flash {

    0%,
    100%,
    50% {
        opacity: 1
    }

    25%,
    75% {
        opacity: 0
    }
}

.flash {
    -webkit-animation-name: flash;
    animation-name: flash
}

@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg)
    }

    40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg)
    }

    60% {
        -webkit-transform: rotate3d(0, 0, 1, 5deg);
        transform: rotate3d(0, 0, 1, 5deg)
    }

    80% {
        -webkit-transform: rotate3d(0, 0, 1, -5deg);
        transform: rotate3d(0, 0, 1, -5deg)
    }

    100% {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 0deg)
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg)
    }

    40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg)
    }

    60% {
        -webkit-transform: rotate3d(0, 0, 1, 5deg);
        transform: rotate3d(0, 0, 1, 5deg)
    }

    80% {
        -webkit-transform: rotate3d(0, 0, 1, -5deg);
        transform: rotate3d(0, 0, 1, -5deg)
    }

    100% {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 0deg)
    }
}

.swing {
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
}

.booknow{
    position: fixed;
    top: 100px;
    right: 0;
    z-index: 100;
    visibility: visible;
    animation-duration: 1s;
    animation-name: fadeInRight;
}
.see-more {
    background: linear-gradient(90deg, #c6aa6a, #A38C56) !important;
    display: inline-block;
    position: relative;
    border-radius: 5px;
    padding: 10px;
    text-transform: uppercase;
}
.footer__book {
    padding: 8px 30px;
    position: relative;
    right: 20px;
    margin-bottom: 5px;
    color: #fff;
    font-size: 27px;
}
 .booknow {
        bottom: 40%;
        top: auto;
 }
.footer__book {
        padding: 10px;
        animation: flash 2s linear infinite, swing 1s linear infinite;
}
.footer_form{

}

.wpcf7-form .footer_form input[type="submit"] {
    width: 100%;
    position: absolute;
    z-index: 3;
    top: 0;
    right: 0;
    width: 100px;
    padding: 0;
    border: none;
    color: inherit;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}
.zalo_social a{
    background-image: url(images/zalo.png);
    background-size: cover;
    opacity: 0.8;
}
.zalo_social a:before{
    opacity: 0;
}
@media only screen and (max-width: 767px){
    .booknow {
        bottom: 250px;
    }
    .footer__book {
        font-size: 18px;
    }
}