body { margin: 50px 50px 0 50px; width: 1200px; } html { background-color: #262626; color: #f1f1f1; font-family: Calibri; } #gameID { margin: 10px 0 10px 0; } body button { width: 500px; padding: 12px 8px 12px 0px; float: left; display: block; margin: auto; font-size: 18px; color: #f1f1f1; background-color: #f44336; border-style: none; border-radius: 4px; cursor: pointer; margin-top: 10px; } img { border-radius: 4px; } ul { margin: 0; padding: 0; width: 500px; list-style-type: none; } ul li { cursor: pointer; position: relative; padding: 12px 8px 12px 40px; background: #ffefef; color: #262626; font-size: 18px; transition: 0.2s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } ul li::before { content: ''; position: absolute; border-color: #a6a6a6; border-style: solid; border-width: 1.5px 1.5px 1.5px 1.5px; border-radius: 4px; top: 14.5px; left: 12px; height: 15px; width: 15px; } ul li:nth-child(odd) { background: #fdfdfd; } ul li:hover { /*background: #ddd;*/ background: #565656; color: #ffffff; } ul li.checked { background: #565656; color: #fff; } ul li.checked::before { content: ''; position: absolute; border-color: #fff; border-style: solid; border-width: 1.5px 1.5px 1.5px 1.5px; border-radius: 4px; top: 14.5px; left: 12px; height: 15px; width: 15px; background-color: #ffffff; } .selectionHeader { background-color: #f44336; padding: 12px 8px 12px 10px; color: white; width: 500px; font-size: 16px; border-style: none; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .framed { margin: 30px 0 10px 0; padding: 0px 12px 12px 12px; border-color: #fff; border-style: solid; border-width: 1px; border-radius: 4px; width: 500px; /*min-height: 300px;*/ }