body {
    text-align: center;
    font-family: "Helvetica Neue", Arial, sans-serif;
    background-color: #252528;
    color: white;
    line-height: 2em;
}
h1 {
    color: fuchsia;
    -webkit-text-stroke: 1px #252528;
    text-shadow: 0 0 8px fuchsia;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
input[size] {
    font-size: 1em;
    padding: 4px;
}
table {
    margin: auto;
    border-collapse: collapse;
}
th {
    text-transform: capitalize;
    color: aquamarine;
}
td,th {
    padding: 0 10px;
}
td:nth-child(1),
th:nth-child(1) {
    width: 40px;
}
td:nth-child(2),
th:nth-child(2) {
    width: 80px;
    max-width: 80px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
td:nth-child(3),
th:nth-child(3) {
    width: 85px;
}
td:nth-child(4),
th:nth-child(4) {
    width: 50px;
}
td:nth-child(5),
th:nth-child(5) {
    width: 210px;
    max-width: 210px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
tr {
    display: block;
    border-bottom: 3px solid;
    border-image-slice: 1;
    border-image-source: 
        linear-gradient(
            45deg, 
            fuchsia, 
            aquamarine
        );
}

.success .guess-form,
.success .number-range {
    display: none;
}
.button {
    margin: 10px;
    padding: 5px;
    display: inline-block;
    text-decoration: none;
    color: #252528;
    border-radius: 5px;
    border: 1px solid;
    font-size: 1em;    
}
.button_cta {
    border: 1px solid;
    background-color: aquamarine;
    /*box-shadow: 5px 5px 8px #888888;*/
    font-size: 1em;
    display: initial;
}
.button_plain {
    /*padding-top: 0;
    padding-bottom: 0; */
    color: white;
    background-color: transparent;
}
.success .reset {
    background-color: aquamarine;
    box-shadow: 0 0 8px aquamarine;
    color: #252528;
}
/*img {
    border: 10px solid black;
    border-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='100' height='100' viewBox='0 0 100 100' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3ClinearGradient id='g' x1='0%25' y1='0%25' x2='0%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23cffffe' /%3E%3Cstop offset='25%25' stop-color='%23f9f7d9' /%3E%3Cstop offset='50%25' stop-color='%23fce2ce' /%3E%3Cstop offset='100%25' stop-color='%23ffc1f3' /%3E%3C/linearGradient%3E %3Cpath d='M1.5 1.5 l97 0l0 97l-97 0 l0 -97' stroke-linecap='square' stroke='url(%23g)' stroke-width='3'/%3E %3C/svg%3E") 1;
	border-image: repeating-radial-gradient(
			circle at 10px,
			turquoise,
			pink 2px,
			greenyellow 4px,
			pink 2px
		)
		1;
}*/

.number-range .full-bar {
    width: 200px;
    display: inline-block;
    height: 20px;
    line-height: initial;
    text-align: initial;
    position: relative;
}
.number-range .border {
    border: 1px solid white;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    position:absolute;
    left:0;
}
.number-range .bar {
    display: inline-block;
    height: 100%;
}
.number-range .ruler {
    position: absolute;
    left: 1px;
    top: 9px;
    width: 100%;
}
.number-range .ruler-marks {
    width: calc(10% - 1px);
    display: inline-block;
    border-right: 1px solid white;
    height: 3px;
}

.number-range .ruler .ruler-marks:first-child {
    border-left: 1px solid white;
    width: calc(10% - 2px);
}