.btn-act{
    height: 32px;
    width: 204px;
    padding: 10px;
    border-radius: 10px;
}

.btn-act{
        font-size: 17px;
    font-weight: bold;
}

.flex{
    display: flex;
}
.flex-jc-ar{
    justify-content: space-around;
}.flex-jc-b{
    justify-content: space-between;
}.flex-jc-c{
    justify-content: center;
}

.flex-ai-c{
    align-items: center;
}

.flex-wrap{
    flex-wrap: wrap;
}

.bg-orange{
    background-color: #E07727;
}

.txt-white{
    color:#fff;
}

.about-cover{
    background-image: url('../img/desert_sea.jpg');
    background-size: cover;
}

.vh-1{
    height: 1vh;
}
.vh-10{
    height: 10vh;
}.vh-30{
    height: 30vh;
}.vh-40{
    height: 40vh;
}
.vh-50{
    height: 50vh;
}
.vh-70{
    height: 70vh;
}

.text-center{
    text-align: center;
}

/* .service-card{
      padding: 20px;
    background-color: #1B5D00;
    border-radius: 10px;
    margin: 20px;
    max-width: 380px;
} */

.mt-30{
    margin-top: 30px !important;
}


.card {
    /* Define dimensions and placement (optional) */
    width: 500px;
    margin: 20px auto;

    /* Basic Card Styling */
    background-color: #ffffff; /* White background */
    border-radius: 8px; /* Rounded corners */
    padding: 20px; /* Inner spacing */

    /* Make the card stand out */
    text-align: center;
    font-family: Arial, sans-serif;

    /* Soft, Modern Shadow */
    box-shadow:
        0 4px 8px rgba(0, 0, 0, 0.1),  /* Primary, soft shadow */
        0 6px 20px rgba(0, 0, 0, 0.05); /* Lighter, broader shadow for depth */

        transition: box-shadow 0.3s ease-in-out, transform 0.3s ease-in-out;
}




/* On hover, increase the shadow and slightly move the card up */
.card:hover {
    /* Deeper, more noticeable shadow */
    box-shadow:
        0 8px 16px rgba(0, 0, 0, 0.2),
        0 12px 40px rgba(0, 0, 0, 0.1);

    /* Optional: Slight upward lift */
    transform: translateY(-5px);
}

.tag-button {
    /* Color and Background */
    background-color: #ff8c00; /* A vibrant orange */
    color: #ffffff; /* White text for contrast */

    /* Padding and Layout */
    display: inline-block; /* Allows padding and width/height, but wraps content */
    padding: 6px 12px; /* Vertical and horizontal spacing */

    /* Shape and Appearance */
    border-radius: 4px; /* Slightly rounded corners */
    font-family: Arial, sans-serif; /* Readable font */
    font-size: 14px; /* Appropriate size for a tag/button */
    font-weight: bold; /* Makes the text stand out */
    text-transform: uppercase; /* Optional: Makes it look more official */

    /* Cursor indication (Optional: for a button feel) */
    cursor: pointer;

     /* Shadow and Transition for depth and smooth effect */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}


.tag-button:hover {
    /* Slightly darker orange on hover */
    background-color: #e67e22;
    /* Optional: Slight lift effect */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}


.top-cover{
    height: 10vh;
    background-image: url("../img/safari2.jpg");
    background-size: cover;
}

.car-class{
    height: 250px;
    width: 600px;
}

.car-class-1{
    background-image: url('../img/polo-1.webp');
    background-size: cover;
}.car-class-2{
    background-image: url('../img/sedan.webp');
    background-size: cover;
}.car-class-3{
    background-image: url('../img/suv-mini.jpg');
    background-size: cover;
}.car-class-4{
    background-image: url('../img/suv.webp');
    background-size: cover;
}.car-class-5{
    background-image: url('../img/pickup.webp');
    background-size: cover;
}.car-class-6{
    background-image: url('../img/pickup-util.webp');
    background-size: cover;
}