
        .notification.active {
            position: relative;
        }
        .notification.active:after {
            content: "";
            border-radius: 100%;
            background: #ff7b6e;
            width: 8px;
            height: 8px;
            display: block;
            position: absolute;
            top: 4px;
            right: 4px;
        }
        .selected {
            border: 3px solid #ff7b6e !important;
        }
        .tile-container {
            display: flex;
        }
        .tile-row {
            display: flex;
            align-items: center;
            justify-content: space-around;
            width: 100%;
        }
        .tile-head {
            width: 30%;
        }
        .tile-child.available {
            background: #ffdc69;
            color: #000;
            cursor: pointer;
        }
        .tile-child.unavailable {
            color: #aaa;
            background: #f0f0f0;
            cursor: not-allowed;
        }
        .tile-child {
            font-size: 15px;
            padding: 16px 12px;
            border-radius: 8px;
            font-size: 15px;
			text-align: center;
        }
        @media only screen and (max-width: 530px) {
            .tile-container {
                display: block;
                text-align: center;
            }
            .tile-head {
                width: 100%;
                padding-bottom: 10px;
            }
        }
        @media only screen and (min-width: 260px) and (max-width: 410px) {
            .tile-child {
                padding: 3%;
                word-break: break-word;
                margin: 1%;
				font-size: 9px;
            }
        }
        @media only screen and (max-width: 260px) {
            .tile-row {
                flex-wrap: wrap;
            }
            .tile-child { margin: 4px 0; font-size: 9px;}
        }
