.site_button {
    height: 50px;
    width: 160px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(82, 203, 203, 1);
    border-radius: 6px;
    font-size: 16px;
    color: #000;
    font-weight: 600;
    position: relative;
    border: none !important;
    transition: 0.6s !important;
    cursor: pointer;
}

.site_tw_btn {
    display: flex;
}

.site_tw_btn a:first-child {
    margin-right: 12px;
}

.site_button:after {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    background: rgba(0, 149, 149, 1);
    bottom: -4px;
    z-index: -1;
    border-radius: 6px;
}

.site_button::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 75%;
    /* background: url('data:image/svg+xml,<svg width="120" height="50" viewBox="0 0 120 50" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 6C0 2.68629 2.68629 0 6 0H120C120 0 82 10.9976 56.5 22.193C43.5726 27.8686 21.7288 41.2379 9.32961 49.0455C5.29896 51.5835 0 48.6947 0 43.9315V6Z" fill="%2384DADA"/></svg>') no-repeat; */
    background: #84DADA;
    left: 0;
    z-index: 0;
    top: 0;
    background-size: 100% 100%;
    transition: 0.6s !important;
    clip-path: polygon(0% 12%, 0% 12%, 0.065% 10.054%, 0.255% 8.207%, 0.558% 6.485%, 0.965% 4.913%, 1.464% 3.515%, 2.047% 2.315%, 2.702% 1.339%, 3.42% 0.612%, 4.189% 0.157%, 5% 0%, 100% 0%, 100% 0%, 99.092% 0.638%, 96.537% 2.467%, 92.586% 5.356%, 87.493% 9.175%, 81.51% 13.796%, 74.89% 19.089%, 67.885% 24.924%, 60.747% 31.172%, 53.729% 37.702%, 47.083% 44.386%, 47.083% 44.386%, 43.644% 48.226%, 39.85% 52.831%, 35.795% 58.041%, 31.569% 63.697%, 27.264% 69.64%, 22.972% 75.71%, 18.786% 81.75%, 14.796% 87.599%, 11.095% 93.099%, 7.775% 98.091%, 7.775% 98.091%, 6.741% 99.295%, 5.676% 99.891%, 4.614% 99.921%, 3.587% 99.427%, 2.628% 98.453%, 1.769% 97.041%, 1.045% 95.233%, 0.486% 93.072%, 0.127% 90.601%, 0% 87.863%, 0% 12%);
}

.site_button span {
    z-index: 1;
}










.site_button:hover span {
    animation: MoveScaleUpInitial 0.3s forwards, MoveScaleUpEnd 0.3s forwards 0.3s;
}

.site_button:hover .hover_con::before,
.hdr_book_appointment_box_inner:hover .hover_con:before {
    transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
    transition: transform 0.4s cubic-bezier(0.1, 0, 0.3, 1);
}

.site_button:hover .hover_con:after,
.hdr_book_appointment_box_inner:hover .hover_con:after {
    transform: translate3d(0, 0, 0);
    transition-duration: 0.05s;
    transition-delay: 0.4s;
    transition-timing-function: linear;
}

.hover_con:before {
    content: '';
    background: rgb(0 35 69);
    width: 120%;
    height: 0;
    top: -110%;
    left: -10%;
    border-radius: 50%;
    position: absolute;
    padding-bottom: 120%;
    transform: translate3d(0, 68%, 0) scale3d(0, 0, 0);
}

.hover_con {
    position: absolute;
    width: 100% !important;
    height: 100%;
    overflow: hidden;
    border-radius: 6px;
}

.hover_con:after {
    border-radius: 6px;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgb(0 35 69);
    transform: translate3d(0, -100%, 0);
    transition: transform 0.4s cubic-bezier(0.1, 0, 0.3, 1);
    left: 0;
}

.site_button:hover span,
.hdr_book_appointment_box_inner:hover span {
    color: #fff;
}

.whit_bg .site_button {
    background: #fff;
}

.whit_bg .site_button:before,
.whit_bg .site_button:after {
    display: none;
}

@keyframes MoveScaleUpInitial {
    to {
        transform: translate3d(0, -105%, 0) scale3d(1, 2, 1);
        opacity: 0;
    }
}

@keyframes MoveScaleUpEnd {
    from {
        transform: translate3d(0, 100%, 0) scale3d(1, 2, 1);
        opacity: 0;
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}




@media all and (min-width: 320px) and (max-width: 767px) {
    .site_button {
        height: 38px;
        width: 135px;
        font-size: 14px;
    }

    .site_button::before {
        width: 68%;
    }

    .site_tw_btn a:first-child {
        margin-right: 10px;
    }
}

@media all and (min-width: 768px) and (max-width: 980px) {
    .site_button {
        height: 40px;
        width: 140px;
        font-size: 14px;
    }

    .site_button::before {
        width: 68%;
    }

    .site_tw_btn a:first-child {
        margin-right: 10px;
    }
}

@media only screen and (min-width: 981px) and (max-width: 1024px) {
    .site_button {
        height: 42px;
        width: 150px;
        font-size: 15px;
    }

    .site_button::before {
        width: 68%;
    }

    .site_tw_btn a:first-child {
        margin-right: 10px;
    }
}

@media all and (min-width: 1025px) and (max-width: 1140px) {
    .site_button {
        height: 45px;
        width: 155px;
        font-size: 15px;
    }

    .site_button::before {
        width: 70%;
    }

    .site_tw_btn a:first-child {
        margin-right: 10px;
    }
}

@media all and (min-width: 1141px) and (max-width: 1280px) {
    .site_button {
        height: 45px;
        width: 155px;
        font-size: 15px;
    }

    .site_button::before {
        width: 70%;
    }
}

@media all and (min-width: 1281px) and (max-width: 1440px) {}

@media all and (min-width: 1441px) and (max-width: 1680px) {}

@media all and (min-width: 1681px) and (max-width: 1880px) {}