﻿/* ============================================================ */
.wrapper {
    display: flex;
    height: 20vh;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.wrapper3 {
    display: flex;
    height: 20vh;
    flex-direction: column;
    justify-content: center;
    /*    align-items: center;*/
}

.button2 {
    border: 1px transparent;
    -webkit-border-radius: 40px;
    border-radius: 10px;
    color: #eeeeee;
    cursor: pointer;
    display: inline-block;
    font-family: Arial;
    font-size: 20px;
    padding: 8px 30px;
    text-align: center;
    text-decoration: none;
    margin-left: 20px;
    -webkit-animation: glowing 1300ms infinite;
    -moz-animation: glowing 1300ms infinite;
    -o-animation: glowing 1300ms infinite;
    animation: glowing 1300ms infinite;
}

.button1 {
    border: 1px transparent;
    -webkit-border-radius: 40px;
    border-radius: 10px;
    color: #eeeeee;
    cursor: pointer;
    display: inline-block;
    font-family: Arial;
    font-size: 20px;
    padding: 8px 30px;
    text-align: center;
    text-decoration: none;
    margin-left: 20px;
    -webkit-animation: glowing1 1300ms infinite;
    -moz-animation: glowing1 1300ms infinite;
    -o-animation: glowing1 1300ms infinite;
    animation: glowing1 1300ms infinite;
}

.button3 {
    border: 1px transparent;
    -webkit-border-radius: 40px;
    border-radius: 10px;
    color: #ffff;
    cursor: pointer;
    
    font-size: 16px;
    padding: 10px 10px 10px 10px;
    text-align: center;
    text-decoration: none;
    margin-left: 10px;    
    -webkit-animation: glowing3 1300ms infinite;
    -moz-animation: glowing3 1300ms infinite;
    -o-animation: glowing3 1300ms infinite;
    animation: glowing3 1300ms infinite;
}

@-webkit-keyframes glowing {
    0% {
        background-color: #ff0000;
        -webkit-box-shadow: 0 0 3px #ff0000;
    }

    50% {
        background-color: #770000;
        -webkit-box-shadow: 0 0 15px #770000;
    }

    100% {
        background-color: #ff0000;
        -webkit-box-shadow: 0 0 3px #ff0000;
    }
}

@keyframes glowing {
    0% {
        background-color: #ff0000;
        box-shadow: 0 0 3px #0091b2;
    }

    50% {
        background-color: #770000;
        box-shadow: 0 0 15px #770000;
    }

    100% {
        background-color: #ff0000;
        box-shadow: 0 0 3px #ff0000;
    }
}



@-webkit-keyframes glowing1 {
    0% {
        background-color: #007700;
        -webkit-box-shadow: 0 0 3px #007700;
    }

    50% {
        background-color: #007700#007700; 
        -webkit-box-shadow: 0 0 15px #770000;
    }

    100% {
        background-color: #007700;
        -webkit-box-shadow: 0 0 3px #007700;
    }
}

@keyframes glowing1 {
    0% {
        background-color: #00aa00;
        box-shadow: 0 0 3px #0091b2;
    }

    50% {
        background-color: #00cc00;
        box-shadow: 0 0 15px #00cc00;
    }

    100% {
        background-color: #00aa00;
        box-shadow: 0 0 3px #0091b2;
    }
}






@-webkit-keyframes glowing {
    0% {
        background-color: #000000;
        -webkit-box-shadow: 0 0 3px #007700;
    }

    50% {
        background-color: #007700#007700;
        -webkit-box-shadow: 0 0 15px #770000;
    }

    100% {
        background-color: #007700;
        -webkit-box-shadow: 0 0 3px #007700;
    }
}

@keyframes glowing3 {
    0% {
        background-color: #007700;
        box-shadow: 0 0 3px #007700;
    }

    50% {
        background-color: #007700;
        box-shadow: 0 0 10px #00cc00;
    }

    100% {
        background-color: #007700;
        box-shadow: 0 0 3px #007700;
    }
}
