.table {
            border-collapse: collapse;
            border-spacing: 0;
            width: 100%;
        }

        .table th,
        .table td {
            border: 1px solid #888;
            padding: 5px;
            text-align: center;
            vertical-align: middle;
            position: relative;
            cursor: pointer;
        }

        /* Hover */
        .table td:hover:after {
            content: '';
            position: absolute;
            top: 0px;
            right: 0px;
            bottom: 0px;
            left: 0px;
            border: 3px solid #ffe5c5;
        }

        /* Click */
        .table td.active:after {
            content: '';
            position: absolute;
            background-color:rgba(0, 0, 0, 0.2);
            top: 0px;
            right: 0px;
            bottom: 0px;
            left: 0px;
            border: 3px solid rgb(255, 0, 0) !important;
        }