Template:Mquizc/style.css

.options {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    margin: 1rem auto;
}

.op {
    text-align: center;
    cursor: pointer;
    transition: box-shadow 0.2s ease-in-out;
    padding: 5px 10px;
}

.op:hover {
	box-shadow: rgba(255,255,255,0.4) 0px 0px 2px 2px;
}

.op img {
    padding: 10px;
}

.cOption {
	display: none;
	text-align: center;
    margin-bottom: 1rem;
    padding: 5px;
}

.red {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAIAAAACDbGyAAAACXBIWXMAAAsTAAALEwEAmpwYAAAGomlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNy4xLWMwMDAgNzkuYTg3MzFiOSwgMjAyMS8wOS8wOS0wMDozNzozOCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnN0RXZ0PSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VFdmVudCMiIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE5IChXaW5kb3dzKSIgeG1wOkNyZWF0ZURhdGU9IjIwMjItMDEtMTZUMTM6NTk6MDIrMDg6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDIyLTAxLTE2VDE2OjEwOjQ3KzA4OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDIyLTAxLTE2VDE2OjEwOjQ3KzA4OjAwIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjI3MDY1OGZlLTMwZDAtOTI0Ni05MDU3LWRjNDFiOTliMGVkOSIgeG1wTU06RG9jdW1lbnRJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOjUxZWYzNzAwLTk1YjgtMWM0MC1iODZiLWVmZTg5NzcwNTRiZiIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjgzMzUwNDAxQ0RDQzExRUE5OUNCQ0Q5NDA3ODk4RUE5IiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjgzMzUwM0ZFQ0RDQzExRUE5OUNCQ0Q5NDA3ODk4RUE5IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjgzMzUwM0ZGQ0RDQzExRUE5OUNCQ0Q5NDA3ODk4RUE5Ii8+IDx4bXBNTTpIaXN0b3J5PiA8cmRmOlNlcT4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOmQyMGM5ZTcxLTFjZjQtMmE0NS1iOGY4LTY1MzA5NThjNzI5ZiIgc3RFdnQ6d2hlbj0iMjAyMi0wMS0xNlQxNjoxMDo0NyswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIDIzLjAgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDoyNzA2NThmZS0zMGQwLTkyNDYtOTA1Ny1kYzQxYjk5YjBlZDkiIHN0RXZ0OndoZW49IjIwMjItMDEtMTZUMTY6MTA6NDcrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCAyMy4wIChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6idQhwAAAAIElEQVQIHWOYaWx8MjwcjhiQOUA5BmQOQh6uiwGZA0QAZpkiSL37raIAAAAASUVORK5CYII=');
    border: 1.5px solid #5f1b1b;
    border-radius: 1px;
}

.show {
    display: block;
}