﻿
.card img {
            height: 200px;
            object-fit: cover;
        }
        .carousel-inner .row {
            margin: 0;
        }
        .card {
            margin: 10px;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }
        .carousel-control-prev,
        .carousel-control-next {
            width: 5%;
            background: rgba(0,0,0,0.2);
        }
        
        @media (max-width: 767.98px) {
            #carouselPC {
                display: none;
            }
            #carouselMobile {
                display: block;
            }
        }
        
        @media (min-width: 768px) {
            #carouselMobile {
                display: none;
            }
            #carouselPC {
                display: block;
            }
        }

.contact {
    display: none;
}

@media only screen and (max-width: 1024px) {
    .contact {
        position: sticky;
        display: flex;
        align-items: center;
        bottom: 0;
        right: 0;
        font-size: 22px;
        height: 50px;
        z-index: 1000;
    }

    .contact > a {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        color: #fff;
        text-decoration: none;
    }

    .contact > a.call {
        background-color: #CF1322;
        width: 55%;
    }

    .contact > a.call img {
        width: 20px;
        margin-right: 10px;
    }

    .contact > a.callback {
        background-color: #FA8C16;
        width: 45%;
    }

    .contact > a.callback img {
        width: 40px;
        margin-right: 10px;
    }
}

.link-phone {
    z-index: 9999;
    bottom: 115px;
    right: 10px;
    position: fixed;
}

.link-zalo {
    z-index: 9999;
    bottom: 190px;
    right: 10px;
    position: fixed;
}
.animation {
    will-change: transform;
    display: inline-block;
    animation: icon-luc-lac .5s alternate infinite;
}
  @keyframes icon-luc-lac {
    0%, 50%, 100% { transform: rotate(0); }
    10%, 30% { transform: rotate(-4deg); }
    20%, 40% { transform: rotate(4deg); }
  }
  .shake-button {
    animation: shake 0.8s infinite;
}

@keyframes shake {
    0% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(5px, 0) rotate(5deg); }
    50% { transform: translate(-5px, 0) rotate(-5deg); }
    75% { transform: translate(5px, 0) rotate(5deg); }
    100% { transform: translate(0, 0) rotate(0deg); }
}