body {
    background: #555555;
}

.box {
    position: absolute;
    text-align: center;
    width: 240px;
    min-height: 265px;
    left: 50%;
    top: 50%;
    padding: 40px 15px 40px 15px;
    background-color: white;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    box-shadow: 0 0 5px #555555;
    -moz-box-shadow: 0 0 5px #555555;
    -webkit-box-shadow: 0 0 5px #555555;
}

    .box,
    .box * {
        cursor: pointer;
    }

        .box .triangle-box {
        }

            .box .triangle-box img {
                width: 120px;
                padding: 15px;
                border: 3px solid #4d4d4d;
                border-radius: 100px;
                -moz-border-radius: 100px;
                -webkit-border-radius: 100px;
                animation: shadow-heart 6s ease-in-out infinite;
                -moz-animation: shadow-heart 6s ease-in-out infinite;
                -webkit-animation: shadow-heart 6s ease-in-out infinite;
            }

                .box .triangle-box img.start {
                    background: lightgreen;
                }

                .box .triangle-box img.stop {
                    background: red;
                }

                .box .triangle-box img:hover {
                }

        .box .btn {
            margin-top: 40px;
            margin-bottom: 10px;
            padding: 5px 15px;
            background-color: #555555;
            color: white;
        }

        .box .lblReactTime {
            margin-top: 20px;
            margin-bottom: -30px;
            font-size: 35px;
        }


        .box img.stop,
        .box img.wait,
        .box.stop img.start {
            display: none;
        }

        .box img.wait {
            position: absolute;
            border: unset;
            width: 28px;
            right: 5px;
            top: 8px;
            padding: 0;
            animation: unset;
            -moz-animation: unset;
            -webkit-animation: unset;
        }

        .box.wait img.wait {
            display: inline-block;
        }

        .box.stop img.stop {
            display: inline-block;
        }

.lblTitle {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    color: white;
    font-size: 31px;
    font-weight: bold;
    transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
}

.lblHelp {
    position: absolute;
    width: 100%;
    left: 0;
    top: 100%;
    color: white;
}

.d-none {
    display: none !important;
}


@keyframes shadow-heart {
    0%, 20%, 40%, 60%, 80% {
        box-shadow: 0 0 10px 5px #a7a7a7;
        -moz-box-shadow: 0 0 10px 5px #a7a7a7;
        -webkit-box-shadow: 0 0 10px 5px #a7a7a7;
    }

    10%, 30%, 50%, 70%, 90% {
        box-shadow: unset;
        -moz-box-shadow: unset;
        -webkit-box-shadow: unset;
    }
}