.product {
    padding: 7px;
    margin: 10px 0px 0px 10px;
    transition: 0.3s;
}

#gal {
    transition: 0.3s;
    position: relative;
    z-index: 0;
}

#gal:hover {
    transform: scale(1.2);
    z-index: 1;
    box-shadow: 1px 1px 10px rgba(200, 200, 200, 0.4);
}

.product:hover {
    background: rgba(255, 0, 0, 0.1)
}

.bg-light {
    background: rgba(200, 200, 200, 0.4)
}

#animate {
    transition: 0.3;
    color: rgba(200, 100, 60, 1);
    animation: 2s infinite animate !important;
}

@keyframes animate {
    0% {
        opacity: 0.5;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0.5;
    }


}

#email {
    transition: 0.3s !important;
}

#email:hover {
    background-color: rgba(200, 10, 10, 0.1) !important;
    color: rgba(200, 10, 10, 1) !important;
}

#email:focus {
    background-color: rgba(200, 10, 10, 0.1) !important;
    color: rgba(200, 10, 10, 1) !important;
}

#name {
    transition: 0.3s !important;
}

#name:hover {
    background-color: rgba(200, 10, 10, 0.1) !important;
    color: rgba(200, 10, 10, 1) !important;
}

#name:focus {
    background-color: rgba(200, 10, 10, 0.1) !important;
    color: rgba(200, 10, 10, 1) !important;
}

#message {
    transition: 0.3s !important;
}

#message:hover {
    background-color: rgba(200, 10, 10, 0.1) !important;
    color: rgba(200, 10, 10, 1) !important;
}

#message:focus {
    background-color: rgba(200, 10, 10, 0.1) !important;
    color: rgba(200, 10, 10, 1) !important;
}