body {
}

.glowingbutton {
    background-color: #004A7F;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border: none;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-family: Arial;
    font-size: 15px;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    animation: glowing 1500ms infinite;
    opacity: 0.9; /* Initial transparency */
}

@keyframes glowing {
    0% {
        background-color: #B20000;
        box-shadow: 0 0 3px #B20000;
    }

    50% {
        background-color: #FF0000;
        box-shadow: 0 0 40px #FF0000;
    }

    100% {
        background-color: #B20000;
        box-shadow: 0 0 3px #B20000;
    }
}

.blinking-star-button {
    color: #FFFFFF;
    background-image: url('../images/star-1363286_640.png'); /* Replace with your star image URL */
    background-size: contain; /* Adjust the size of the star image */
    background-size: 150px 80px;
    background-repeat: no-repeat; /* Prevent the image from repeating */
    background-position: center; /* Center the image within the button */
    border: none; /* Remove default border */
    background-color: transparent; /* Make the button background transparent */
    padding: 10px 10px; /* Adjust padding as needed */
    cursor: pointer; /* Show pointer cursor on hover */
    outline: none; /* Remove outline on focus */
    animation: blink 1s infinite; /* Apply the blinking animation */
    font-family: Arial;
    font-size: 12px;
    width: 150px;
    height: 80px;
}

/* Keyframes for the blinking effect */
@keyframes blink {
    0%, 100% {
        opacity: 1; /* Fully visible at start and end */
    }

    50% {
        opacity: 0; /* Fully transparent in the middle */
    }
}

.link :hover {
    color: #D4AF37;
}