﻿.highlight {
    border: 2px solid transparent; /* Add a transparent border */
    animation: glow 1s infinite alternate; /* Apply the glow animation */
}

@keyframes glow {
    0% {
        box-shadow: 0 0 5px 3px yellow; /* Start with a small shadow */
    }

    100% {
        box-shadow: 0 0 20px 10px yellow; /* End with a larger shadow */
    }
}

.suggest-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /*height: 250px;*/
}

.suggest-button-row {
    display: flex;
    justify-content: center;
    margin: 10px 0;
}

.suggest-button {
    text-align: center;
    font-size: 12px;
    padding: 5px;
    width: 250px;
    height: 150px;
    margin: 10px 20px;
    border-radius: 3px;
    box-shadow: 1px 1px 3px #999999;
    cursor: pointer;
    border: 1px solid lightgrey;
    background-color: #fffffe;
    position: relative;
}

    .suggest-button:hover {
        /*background-color: #f0f0f0; */
        box-shadow: 3px 3px 12px #999999;
    }

.suggest-image-container {
    max-width: 100% !important; /* Ensure the image never exceeds the width of its container */
    height: auto !important; /* Maintain the aspect ratio of the image */
}

.suggest-top-span {
    font-weight: bold;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    color: #2f4f4f;
}

.suggest-bottom-span {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    color: black;
}

.suggest-image-div {
}

.suggest-image {
    height: 80px;
    margin-top: 28px;
}

