/* static/styles/initial.scss */
html {
  height: 100%;
  width: 100%;
}
body {
  overflow: hidden;
  height: 100%;
  width: 100%;
  background-color: black;
  margin: 0;
  padding: 0;
  border: 0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body * {
  box-sizing: border-box;
}
body > canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.line {
  height: 0.05em;
  margin: 0.6em 0;
  background-color: #666666;
}
.yellow-text {
  color: #FFC000;
}
.gray-text {
  color: #9B9B9B;
}
.popup-wrapper {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.72);
  z-index: 100000;
}
.popup-wrapper button {
  cursor: pointer;
}
.popup {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 1456px;
  border-radius: 50px;
  transform: scale(0.5);
  transform-origin: 0 0;
  background-color: black;
  color: white;
  font-family: "PF DinDisplay Pro", serif;
  font-weight: bold;
  font-size: 55px;
  overflow: hidden;
}
.popup .title {
  height: 160px;
  line-height: 160px;
  padding: 0;
  font-size: 60px;
  text-align: center;
  text-transform: uppercase;
  color: white;
  background-color: #252525;
}
.popup .close {
  z-index: 1;
  position: absolute;
  top: 37px;
  right: 35px;
  width: 75px;
  height: 75px;
  cursor: pointer;
}
.popup .content {
  padding: 30px 160px 100px;
}
.common-buttons,
.short-buttons,
.long-short-buttons,
.long-buttons,
.more-buttons,
.three-buttons,
.buttons {
  text-align: center;
}
.common-buttons .text-block,
.short-buttons .text-block,
.long-short-buttons .text-block,
.long-buttons .text-block,
.more-buttons .text-block,
.three-buttons .text-block,
.buttons .text-block {
  margin: 60px 0;
}
.common-buttons .text-block p,
.short-buttons .text-block p,
.long-short-buttons .text-block p,
.long-buttons .text-block p,
.more-buttons .text-block p,
.three-buttons .text-block p,
.buttons .text-block p {
  margin: 0;
}
.common-buttons button,
.short-buttons button,
.long-short-buttons button,
.long-buttons button,
.more-buttons button,
.three-buttons button,
.buttons button {
  display: inline-block;
  width: 400px;
  height: 130px;
  background-color: black;
  border: 14px solid white;
  border-radius: 36px;
  font-size: 55px;
  color: white;
}
.without-buttons {
  text-align: center;
}
.without-buttons .content {
  padding-top: 100px;
}
.with-borders {
  border: 5px solid #252525;
}
.buttons button {
  margin: 30px 80px 0 80px;
}
.three-buttons {
  width: 1956px;
}
.three-buttons button {
  margin-top: 30px;
}
.three-buttons button:nth-child(3) {
  margin: 0 210px;
}
.more-buttons {
  width: 1956px;
}
.more-buttons button {
  margin: 30px 60px 0;
}
.long-buttons button {
  width: 100%;
  margin: 15px 0;
}
.long-short-buttons button {
  width: 48%;
  margin: 0;
  font-size: 60px;
  height: 160px;
}
.long-short-buttons button:nth-of-type(1) {
  width: 100%;
  margin: 10px 0;
}
.long-short-buttons button:nth-of-type(2) {
  border: 6px solid #3d3d3e;
  margin-right: 2%;
  margin-top: 50px;
}
.long-short-buttons button:nth-of-type(3) {
  border: 6px solid #3d3d3e;
  margin-left: 2%;
  margin-top: 50px;
}
.short-buttons button {
  width: 48%;
  margin: 0;
  font-size: 60px;
  height: 160px;
}
.short-buttons button:nth-of-type(1) {
  margin-right: 2%;
  margin-top: 50px;
}
.short-buttons button:nth-of-type(2) {
  margin-left: 2%;
  margin-top: 50px;
}
#error-popup {
  box-shadow: 10px 10px 100px rgba(255, 255, 255, 0.15);
  text-align: center;
}
#error-popup .content {
  border: 1px solid #252525;
  border-bottom-left-radius: 65px;
  border-bottom-right-radius: 65px;
}
.select-with-arrow,
#session-timer .selector .selected-value,
#session-timer select {
  width: 400px;
  height: 130px;
  border: 14px solid white;
  border-radius: 36px;
  color: white;
  background-position: 90% 50%;
  background-repeat: no-repeat;
  background-color: black;
  background-size: 40px;
  background-image: url("data:image/svg+xml;charset=utf-8,     <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 40'>       <polygon points='0,0 60,0 30,40' style='fill:white;'/>     </svg>");
}
.popup {
  overflow: visible;
}
#session-timer {
  box-shadow: 10px 10px 100px rgba(255, 255, 255, 0.15);
}
#session-timer select {
  padding-left: 10px;
  text-align: center;
  font: 55px PF DinDisplay Pro;
  margin: 30px 0 0 0;
  -webkit-appearance: none;
  -moz-appearance: none;
}
#session-timer select option {
  font-size: 15px;
}
#session-timer select.selected {
  font: 20px PF DinDisplay Pro;
}
#session-timer .selector {
  margin-right: -40px;
  display: inline-block;
}
#session-timer .selector .selected-value {
  line-height: 105px;
}
#session-timer .selector .select-list {
  position: absolute;
  z-index: 1;
  width: 400px;
  max-height: 460px;
  border: 4px solid #252525;
  display: flex;
  overflow-y: auto;
  flex-direction: column;
  cursor: pointer;
  background: white;
  color: black;
}
#session-timer .selector .select-list div {
  padding: 10px 0;
}
#session-timer .selector .select-list div:hover {
  background-color: #252525;
  color: white;
}
#session-timer .selector .hidden {
  display: none;
}
#session-timer:not(.two-buttons) button:last-child {
  width: 840px;
  margin: 30px 0 30px 0px;
}
#session-timer.two-buttons.buttons button {
  margin: 0 auto 30px;
  display: block;
}
#rewindContainer {
  z-index: 10001;
  position: fixed;
  left: 20px;
  bottom: 20px;
  width: 200px;
  height: 50px;
  font-size: 0;
  opacity: 0.5;
}
#rewindContainer.hidden {
  display: none;
}
#rewindContainer > div {
  display: inline-block;
}
#rewindContainer #pause {
  background: url(../images/stop.png) 0 0 no-repeat;
}
.desktop #rewindContainer #pause:hover {
  background: url(../images/stop_hover.png) 0 0 no-repeat;
}
#rewindContainer #play {
  background: url(../images/play.png) 0 0 no-repeat;
}
.desktop #rewindContainer #play:hover {
  background: url(../images/play_hover.png) 0 0 no-repeat;
}
#rewindContainer #rewind {
  background: url(../images/rewind.png) 0 0 no-repeat;
}
.desktop #rewindContainer #rewind:hover {
  background: url(../images/rewind_hover.png) 0 0 no-repeat;
}
#rewindContainer #forward {
  background: url(../images/forward.png) 0 0 no-repeat;
}
.desktop #rewindContainer #forward:hover {
  background: url(../images/forward_hover.png) 0 0 no-repeat;
}
#rewindContainer #slow {
  transform: rotate(180deg);
  background: url(../images/forward.png) 0 0 no-repeat;
}
.desktop #rewindContainer #slow:hover {
  background: url(../images/forward_hover.png) 0 0 no-repeat;
}
#rewindContainer #pause,
#rewindContainer #play,
#rewindContainer #rewind,
#rewindContainer #forward,
#rewindContainer #slow {
  width: 50px;
  height: 50px;
  cursor: pointer;
  background-size: 100%;
}
.desktop #rewindContainer #pause:hover,
.desktop #rewindContainer #play:hover,
.desktop #rewindContainer #rewind:hover,
.desktop #rewindContainer #forward:hover,
.desktop #rewindContainer #slow:hover {
  background-size: 100%;
}
#rewindContainer #rewindControls > div {
  display: none;
}
#rewindContainer #rewindControls > div.active {
  display: inline-block;
}
.animate,
#cheatMenu #pages #matrix #reelset .symbol,
#cheatMenu #pages #matrix #realReelset .symbol,
#cheatMenu #pages #reelsetMatrix #reelset .symbol,
#cheatMenu #pages #reelsetMatrix #realReelset .symbol,
.button-styles,
#cheatMenu #sessions #clearSessionBtn,
#cheatMenu #sessions fieldset #submitSessionBtn,
#cheatMenu #sessions #editSession #editSessionBtn,
#cheatMenu #sessions #editSession #cancelBtn,
#cheatMenu #customFilters > div,
#cheatMenu #offlineFilters > div,
#cheatMenu #winFilters > div,
#cheatMenu #menu li,
#cheatMenu #menu #toggleStats,
#cheatMenu #menu #toggleRewind,
#cheatMenu #menu #replayLastSpin,
#resetButton,
.buttonContainer > div {
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.animate:hover,
#cheatMenu #pages #matrix #reelset .symbol:hover,
#cheatMenu #pages #matrix #realReelset .symbol:hover,
#cheatMenu #pages #reelsetMatrix #reelset .symbol:hover,
#cheatMenu #pages #reelsetMatrix #realReelset .symbol:hover,
.button-styles:hover,
#cheatMenu #sessions #clearSessionBtn:hover,
#cheatMenu #sessions fieldset #submitSessionBtn:hover,
#cheatMenu #sessions #editSession #editSessionBtn:hover,
#cheatMenu #sessions #editSession #cancelBtn:hover,
#cheatMenu #customFilters > div:hover,
#cheatMenu #offlineFilters > div:hover,
#cheatMenu #winFilters > div:hover,
#cheatMenu #menu li:hover,
#cheatMenu #menu #toggleStats:hover,
#cheatMenu #menu #toggleRewind:hover,
#cheatMenu #menu #replayLastSpin:hover,
#resetButton:hover,
.buttonContainer > div:hover {
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.border,
#cheatMenu #pages #matrix #reelset .symbol,
#cheatMenu #pages #matrix #realReelset .symbol,
#cheatMenu #pages #reelsetMatrix #reelset .symbol,
#cheatMenu #pages #reelsetMatrix #realReelset .symbol,
#cheatMenu #pages #info #console,
#cheatMenu #pages #info #gameInfo,
.button-styles,
#cheatMenu #sessions #clearSessionBtn,
#cheatMenu #sessions fieldset #submitSessionBtn,
#cheatMenu #sessions #editSession #editSessionBtn,
#cheatMenu #sessions #editSession #cancelBtn,
#cheatMenu #customFilters > div,
#cheatMenu #offlineFilters > div,
#cheatMenu #winFilters > div,
#cheatMenu #menu li,
#cheatMenu #menu #toggleStats,
#cheatMenu #menu #toggleRewind,
#cheatMenu #menu #replayLastSpin,
#resetButton,
.buttonContainer > div {
  border: 2px solid #2e3142;
  border-radius: 4px;
}
.titleStuff,
#cheatMenu .smallTitle,
#cheatMenu .title {
  margin: 0 !important;
  padding: 20px 20px 20px 0;
  cursor: pointer;
  font-size: 35px;
  text-align: center;
}
.button-styles,
#cheatMenu #sessions #clearSessionBtn,
#cheatMenu #sessions fieldset #submitSessionBtn,
#cheatMenu #sessions #editSession #editSessionBtn,
#cheatMenu #sessions #editSession #cancelBtn,
#cheatMenu #customFilters > div,
#cheatMenu #offlineFilters > div,
#cheatMenu #winFilters > div,
#cheatMenu #menu li,
#cheatMenu #menu #toggleStats,
#cheatMenu #menu #toggleRewind,
#cheatMenu #menu #replayLastSpin,
#resetButton,
.buttonContainer > div {
  cursor: pointer;
  color: #9fa2b5;
  background: #2e3142;
  text-transform: capitalize;
}
.desktop .button-styles:hover,
.desktop #cheatMenu #sessions #clearSessionBtn:hover,
#cheatMenu #sessions .desktop #clearSessionBtn:hover,
.desktop #cheatMenu #sessions fieldset #submitSessionBtn:hover,
#cheatMenu #sessions fieldset .desktop #submitSessionBtn:hover,
.desktop #cheatMenu #sessions #editSession #editSessionBtn:hover,
#cheatMenu #sessions #editSession .desktop #editSessionBtn:hover,
.desktop #cheatMenu #sessions #editSession #cancelBtn:hover,
#cheatMenu #sessions #editSession .desktop #cancelBtn:hover,
.desktop #cheatMenu #customFilters > div:hover,
#cheatMenu .desktop #customFilters > div:hover,
.desktop #cheatMenu #offlineFilters > div:hover,
#cheatMenu .desktop #offlineFilters > div:hover,
.desktop #cheatMenu #winFilters > div:hover,
#cheatMenu .desktop #winFilters > div:hover,
.desktop #cheatMenu #menu li:hover,
#cheatMenu #menu .desktop li:hover,
.desktop #cheatMenu #menu #toggleStats:hover,
#cheatMenu #menu .desktop #toggleStats:hover,
.desktop #cheatMenu #menu #toggleRewind:hover,
#cheatMenu #menu .desktop #toggleRewind:hover,
.desktop #cheatMenu #menu #replayLastSpin:hover,
#cheatMenu #menu .desktop #replayLastSpin:hover,
.desktop #resetButton:hover,
.desktop .buttonContainer > div:hover {
  color: #fff;
}
.form-styles,
#cheatMenu #sessions #saveSession,
#cheatMenu #sessions #editSession {
  padding: 20px 0;
  border-top: 2px solid #2e3142;
  border-bottom: 2px solid #2e3142;
  text-align: center;
  font-size: 0;
}
.form-styles > *,
#cheatMenu #sessions #saveSession > *,
#cheatMenu #sessions #editSession > * {
  font-size: 15px;
}
.buttonContainer > div {
  width: 160px;
  height: 60px;
  padding: 18px 20px 20px;
  display: inline-block;
  font-size: 20px;
  vertical-align: top;
  text-align: center;
}
.desktop .buttonContainer > div:hover {
  background-color: #fe4545;
  color: #fff;
}
#resetButton {
  padding: 3px 10px;
  display: inline-block;
}
.desktop #resetButton:hover {
  background-color: #fe4545;
  color: #fff;
}
#stopPositions {
  width: 85%;
  margin: 30px auto;
}
#stopPositions input.error {
  background-color: red;
}
body.canSelect {
  -webkit-touch-callout: initial;
  -webkit-user-select: initial;
  -khtml-user-select: initial;
  -moz-user-select: initial;
  -ms-user-select: initial;
  user-select: initial;
}
#cheatMenu {
  height: 100%;
  z-index: 100001;
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  color: #fff;
  background: rgba(27, 29, 39, 0.8);
  overflow: auto;
}
.desktop #cheatMenu {
  position: absolute;
}
#cheatMenu.active {
  display: inline-block;
}
#cheatMenu .title {
  background: url(../images/close_icon.png) calc(100% - 16px) 50% no-repeat, #2e3142;
  background-size: 25px 25px;
}
#cheatMenu .smallTitle {
  margin-top: 25px;
  border-top: 1px solid #2e3142;
}
#cheatMenu #return {
  z-index: 10;
  position: absolute;
  width: 70px;
  height: 80px;
  background: url(../images/back_icon.png) 20px 50% no-repeat;
  background-size: auto 25px;
  cursor: pointer;
}
#cheatMenu #menu {
  width: 300px;
  margin: 0;
  padding: 0;
  display: none;
  list-style-type: none;
}
#cheatMenu #menu .buttons-container {
  font-size: 0;
}
#cheatMenu #menu #toggleStats,
#cheatMenu #menu #toggleRewind,
#cheatMenu #menu #replayLastSpin {
  width: 120px;
  height: 50px;
  margin: 15px;
  padding: 15px 0px;
  display: inline-block;
  font-size: 15px;
  text-align: center;
}
#cheatMenu #menu #toggleStats.active,
#cheatMenu #menu #toggleRewind.active,
#cheatMenu #menu #replayLastSpin.active {
  background-color: #fe4545;
  color: #fff;
}
#cheatMenu #menu + #return {
  display: block;
}
#cheatMenu #menu.active {
  display: block;
}
#cheatMenu #menu.active + #return {
  display: none;
}
#cheatMenu #menu li {
  margin: 10px 15px;
  padding: 15px;
  font-size: 20px;
}
#cheatMenu #pages > div {
  display: none;
}
#cheatMenu #pages > div.active {
  width: 375px;
  display: inline-block;
}
.desktop #cheatMenu #pages > div.active {
  width: 575px;
}
#cheatMenu #pages p {
  margin: 0;
}
#cheatMenu #pages #info {
  width: 375px;
}
#cheatMenu #pages #info > div {
  margin: 15px;
}
#cheatMenu #pages #info #saveBtn {
  margin-left: 20px;
  padding: 8px 20px;
}
#cheatMenu #pages #info #gameInfo {
  padding: 10px;
  overflow: auto;
  background-color: #15151e;
}
#cheatMenu #pages #info #console {
  max-height: 300px;
  padding: 10px 0;
  overflow: auto;
  background-color: #15151e;
}
#cheatMenu #pages #info #console p {
  padding: 0 10px;
  border-top: 1px dotted #2e3142;
}
#cheatMenu #pages #info #console p:last-child {
  border-bottom: 1px dotted #2e3142;
}
#cheatMenu #pages #info #console .warning {
  color: #FFC000;
}
#cheatMenu #pages #info #console .error {
  color: #fe4545;
}
#cheatMenu #pages #matrix #reelset,
#cheatMenu #pages #matrix #realReelset,
#cheatMenu #pages #reelsetMatrix #reelset,
#cheatMenu #pages #reelsetMatrix #realReelset {
  margin-top: 30px;
  text-align: center;
}
#cheatMenu #pages #matrix #reelset .reel,
#cheatMenu #pages #matrix #realReelset .reel,
#cheatMenu #pages #reelsetMatrix #reelset .reel,
#cheatMenu #pages #reelsetMatrix #realReelset .reel {
  margin: 0 2%;
  display: inline-block;
}
#cheatMenu #pages #matrix #reelset .symbol,
#cheatMenu #pages #matrix #realReelset .symbol,
#cheatMenu #pages #reelsetMatrix #reelset .symbol,
#cheatMenu #pages #reelsetMatrix #realReelset .symbol {
  position: relative;
  width: 100%;
  margin: 10px 0;
  display: inline-block;
  cursor: pointer;
  overflow: hidden;
  background-color: #2e3142;
}
.desktop #cheatMenu #pages #matrix #reelset .symbol:hover,
.desktop #cheatMenu #pages #matrix #realReelset .symbol:hover,
.desktop #cheatMenu #pages #reelsetMatrix #reelset .symbol:hover,
.desktop #cheatMenu #pages #reelsetMatrix #realReelset .symbol:hover {
  border: 2px solid #fff;
}
#cheatMenu #pages #matrix #reelset .symbol div,
#cheatMenu #pages #matrix #realReelset .symbol div,
#cheatMenu #pages #reelsetMatrix #reelset .symbol div,
#cheatMenu #pages #reelsetMatrix #realReelset .symbol div {
  display: none;
  background: url(../images/question_icon.png) 50% no-repeat;
  background-size: 75%;
}
#cheatMenu #pages #matrix #reelset .symbol div.picked,
#cheatMenu #pages #matrix #realReelset .symbol div.picked,
#cheatMenu #pages #reelsetMatrix #reelset .symbol div.picked,
#cheatMenu #pages #reelsetMatrix #realReelset .symbol div.picked {
  display: block;
}
#cheatMenu #pages #matrix #reelset .symbol img,
#cheatMenu #pages #matrix #realReelset .symbol img,
#cheatMenu #pages #reelsetMatrix #reelset .symbol img,
#cheatMenu #pages #reelsetMatrix #realReelset .symbol img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: auto;
  margin: auto;
  display: none;
}
#cheatMenu #pages #matrix #reelset .symbol img.picked,
#cheatMenu #pages #matrix #realReelset .symbol img.picked,
#cheatMenu #pages #reelsetMatrix #reelset .symbol img.picked,
#cheatMenu #pages #reelsetMatrix #realReelset .symbol img.picked {
  display: initial;
}
#cheatMenu #pages #matrix #reelset.reels-5 .reel,
#cheatMenu #pages #matrix #realReelset.reels-5 .reel,
#cheatMenu #pages #reelsetMatrix #reelset.reels-5 .reel,
#cheatMenu #pages #reelsetMatrix #realReelset.reels-5 .reel {
  width: 14%;
}
#cheatMenu #pages #matrix #reelset.reels-5 .symbol,
#cheatMenu #pages #matrix #realReelset.reels-5 .symbol,
#cheatMenu #pages #reelsetMatrix #reelset.reels-5 .symbol,
#cheatMenu #pages #reelsetMatrix #realReelset.reels-5 .symbol {
  height: 53px;
}
#cheatMenu #pages #matrix #reelset.reels-5 .symbol div,
#cheatMenu #pages #matrix #realReelset.reels-5 .symbol div,
#cheatMenu #pages #reelsetMatrix #reelset.reels-5 .symbol div,
#cheatMenu #pages #reelsetMatrix #realReelset.reels-5 .symbol div {
  height: 49px;
}
.desktop #cheatMenu #pages #matrix #reelset.reels-5 .symbol,
.desktop #cheatMenu #pages #matrix #realReelset.reels-5 .symbol,
.desktop #cheatMenu #pages #reelsetMatrix #reelset.reels-5 .symbol,
.desktop #cheatMenu #pages #reelsetMatrix #realReelset.reels-5 .symbol {
  height: 80px;
}
.desktop #cheatMenu #pages #matrix #reelset.reels-5 .symbol div,
.desktop #cheatMenu #pages #matrix #realReelset.reels-5 .symbol div,
.desktop #cheatMenu #pages #reelsetMatrix #reelset.reels-5 .symbol div,
.desktop #cheatMenu #pages #reelsetMatrix #realReelset.reels-5 .symbol div {
  height: 76px;
}
#cheatMenu #pages #matrix #reelset.reels-6 .reel,
#cheatMenu #pages #matrix #realReelset.reels-6 .reel,
#cheatMenu #pages #reelsetMatrix #reelset.reels-6 .reel,
#cheatMenu #pages #reelsetMatrix #realReelset.reels-6 .reel {
  width: 12%;
}
#cheatMenu #pages #matrix #reelset.reels-6 .symbol,
#cheatMenu #pages #matrix #realReelset.reels-6 .symbol,
#cheatMenu #pages #reelsetMatrix #reelset.reels-6 .symbol,
#cheatMenu #pages #reelsetMatrix #realReelset.reels-6 .symbol {
  height: 40px;
}
#cheatMenu #pages #matrix #reelset.reels-6 .symbol div,
#cheatMenu #pages #matrix #realReelset.reels-6 .symbol div,
#cheatMenu #pages #reelsetMatrix #reelset.reels-6 .symbol div,
#cheatMenu #pages #reelsetMatrix #realReelset.reels-6 .symbol div {
  height: 36px;
}
.desktop #cheatMenu #pages #matrix #reelset.reels-6 .symbol,
.desktop #cheatMenu #pages #matrix #realReelset.reels-6 .symbol,
.desktop #cheatMenu #pages #reelsetMatrix #reelset.reels-6 .symbol,
.desktop #cheatMenu #pages #reelsetMatrix #realReelset.reels-6 .symbol {
  height: 60px;
}
.desktop #cheatMenu #pages #matrix #reelset.reels-6 .symbol div,
.desktop #cheatMenu #pages #matrix #realReelset.reels-6 .symbol div,
.desktop #cheatMenu #pages #reelsetMatrix #reelset.reels-6 .symbol div,
.desktop #cheatMenu #pages #reelsetMatrix #realReelset.reels-6 .symbol div {
  height: 56px;
}
#cheatMenu #pages #matrix .buttonContainer,
#cheatMenu #pages #reelsetMatrix .buttonContainer {
  text-align: center;
}
#cheatMenu #pages #matrix .buttonContainer > div,
#cheatMenu #pages #reelsetMatrix .buttonContainer > div {
  margin: 20px 10px;
}
#cheatMenu #customFilters,
#cheatMenu #offlineFilters,
#cheatMenu #winFilters {
  margin: 10px;
}
#cheatMenu #customFilters > div,
#cheatMenu #offlineFilters > div,
#cheatMenu #winFilters > div {
  margin: 5px;
  padding: 10px;
  display: inline-block;
}
#cheatMenu #customFilters > div.active,
#cheatMenu #offlineFilters > div.active,
#cheatMenu #winFilters > div.active {
  background-color: #fe4545;
  color: #fff;
}
.desktop #cheatMenu #customFilters > div:not(.active):hover,
.desktop #cheatMenu #offlineFilters > div:not(.active):hover,
.desktop #cheatMenu #winFilters > div:not(.active):hover {
  background-color: #fd7d7d;
  color: #fff;
}
#cheatMenu #sessions .content {
  margin: 30px 10px;
}
#cheatMenu #sessions #editSession {
  border-bottom: 0;
}
#cheatMenu #sessions #editSession #editSessionBtn,
#cheatMenu #sessions #editSession #cancelBtn {
  padding: 8px 20px;
  font-weight: bold;
}
.desktop #cheatMenu #sessions #editSession #editSessionBtn:hover,
.desktop #cheatMenu #sessions #editSession #cancelBtn:hover {
  background-color: #fe4545;
  color: #fff;
}
#cheatMenu #sessions fieldset {
  width: 33.3333333333%;
  margin: 0;
  padding: 0 10px 0 0;
  border: 0;
  display: inline-block;
}
#cheatMenu #sessions fieldset > * {
  padding: 5px 0;
  line-height: 100%;
}
#cheatMenu #sessions fieldset #submitSessionBtn {
  padding: 8px 20px;
  font-weight: bold;
}
.desktop #cheatMenu #sessions fieldset #submitSessionBtn:hover {
  background-color: #fe4545;
  color: #fff;
}
#cheatMenu #sessions .sessionsList {
  padding: 0;
}
#cheatMenu #sessions .sessionItem {
  min-height: 40px;
  padding: 0 10px;
  border-bottom: 1px dotted white;
  line-height: 40px;
  font-size: 20px;
  list-style-type: none;
  color: #9fa2b5;
}
.desktop #cheatMenu #sessions .sessionItem:hover,
.desktop #cheatMenu #sessions .sessionItem.chosen {
  color: #fff;
  background: #2e3142;
}
#cheatMenu #sessions .sessionItem div {
  display: inline-block;
  vertical-align: top;
}
#cheatMenu #sessions .sessionItem .sessionName {
  width: calc(100% - 140px);
  cursor: pointer;
}
#cheatMenu #sessions .sessionItem .sessionRounds {
  width: 40px;
  text-align: center;
}
#cheatMenu #sessions .sessionItem:last-child {
  border-bottom: none;
}
#cheatMenu #sessions .delete,
#cheatMenu #sessions .edit {
  width: 40px;
  height: 40px;
  display: inline-block;
  cursor: pointer;
  background: url(../images/close_icon.png) 10px 10px no-repeat;
  background-size: 20px 20px;
}
#cheatMenu #sessions .delete:hover,
#cheatMenu #sessions .edit:hover {
  background: url(../images/close_icon.png) 8px 8px no-repeat;
  background-size: 24px 24px;
}
#cheatMenu #sessions .edit {
  background: url(../images/edit.png) 10px 10px no-repeat;
  background-size: 20px 20px;
}
#cheatMenu #sessions .edit:hover {
  background: url(../images/edit.png) 8px 8px no-repeat;
  background-size: 24px 24px;
}
#cheatMenu #sessions .hide {
  display: none !important;
}
#cheatMenu #sessions form + div {
  text-align: right;
}
#cheatMenu #sessions #clearSessionBtn {
  margin-top: 30px;
  padding: 15px 25px;
  display: inline-block;
  font-size: 20px;
}
.desktop #cheatMenu #sessions #clearSessionBtn:hover {
  background-color: #fe4545;
  color: #fff;
}
#chosenFilters {
  position: fixed;
  top: 0;
  right: 0;
  margin-right: 10px;
}
#chosenFilters p {
  margin: 0;
  color: #fff;
  cursor: pointer;
}
#buttonContainer-sound-tools > div {
  margin: 4px;
  font-size: 16px;
}
#select-sound-files-group {
  margin: 8px;
}
#dropContainer {
  border: 1px solid white;
  height: 100px;
  text-align: center;
  line-height: 6;
  margin-bottom: 8px;
}
#select-sound-file-group {
  display: flex;
}
#select-sound-file-group #sound-select {
  min-width: 100px;
  flex-grow: 2;
  margin: 8px;
}
#select-sound-file-group #file-input {
  margin: 8px;
}
#buttonContainer-sound-tools {
  display: flex;
  align-items: center;
  align-content: space-between;
  justify-content: space-between;
  margin: 15px;
}
#input-group-range-stereo-pan .input-group-range {
  display: flex;
  flex-direction: row;
}
#input-group-range-stereo-pan .input-group-range .pan-level-label {
  width: 100px;
  text-align: center;
  font-size: 30px;
}
#input-group-range-stereo-pan .input-group-range input {
  flex-grow: 1;
}
#input-group-range-volume-level .input-group-range {
  display: flex;
  flex-direction: row;
}
#input-group-range-volume-level .input-group-range input {
  flex-grow: 1;
  margin-left: 27px;
}
#input-group-range-volume-level .input-group-range #volume-level-value {
  width: 100px;
  text-align: center;
  font-size: 30px;
}
.range-title {
  font-size: 35px;
  text-align: center;
  padding: 4px;
}
.search-root {
  display: none;
  margin-bottom: 40px;
}
.search-root input,
.search-root button {
  color: #fff;
  border: none;
  outline: none;
  background: none;
}
.content mark {
  background: yellow;
}
.content mark.current {
  background: orange;
}
#matrix .symbol,
#reelsetMatrix .symbol,
#reelset .symbol,
#realReelset .symbol {
  margin: 0 !important;
}
#matrix .symbol.disabled,
#reelsetMatrix .symbol.disabled,
#reelset .symbol.disabled,
#realReelset .symbol.disabled {
  cursor: default;
  opacity: 0.5;
}
#matrix .symbol.disabled:hover,
#reelsetMatrix .symbol.disabled:hover,
#reelset .symbol.disabled:hover,
#realReelset .symbol.disabled:hover {
  border: 2px solid #2e3142;
}
#matrix .symbol div,
#reelsetMatrix .symbol div,
#reelset .symbol div,
#realReelset .symbol div {
  display: none;
  background: url(../images/question_icon.png) 50% no-repeat;
  background-size: 75%;
}
#matrix .symbol div.picked,
#reelsetMatrix .symbol div.picked,
#reelset .symbol div.picked,
#realReelset .symbol div.picked {
  display: block;
}
#innerSymbol,
#addRow {
  width: 85%;
  margin: 0 auto;
}
#innerSymbol > div,
#addRow > div {
  display: inline-block;
  vertical-align: middle;
}
#innerSymbol .symbol,
#addRow .symbol {
  position: relative;
  margin-top: 2px;
  width: 80px;
  height: 80px;
  border: 2px solid #2e3142;
  border-radius: 4px;
  cursor: pointer;
  background-color: #2e3142;
}
#innerSymbol .symbol:hover,
#addRow .symbol:hover {
  border: 2px solid #fff;
}
#innerSymbol .symbol div,
#addRow .symbol div {
  height: 80px;
  padding-right: 10px;
  display: none;
  background: url(../images/question_icon.png) 50% no-repeat;
  background-size: 75%;
}
#innerSymbol .symbol img,
#addRow .symbol img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: auto;
  margin: auto;
  display: none;
}
#innerSymbol .symbol .picked,
#addRow .symbol .picked {
  display: block;
}
#addRow > div {
  display: block;
  vertical-align: middle;
}
#addRow .symbol {
  display: inline-block;
  width: 20px;
  height: 20px;
}
#addRow .symbol div {
  height: 20px;
  background: url(../images/close_icon.png) 50% no-repeat;
  background-size: 50%;
}
#reelsABC {
  width: 85%;
  margin: 20px auto;
}
#reelsABC > div {
  display: block;
  vertical-align: middle;
}
#reelsABC > * {
  display: inline-block;
  vertical-align: middle;
}
#applyButton.disabled:hover {
  color: #9fa2b5;
  background: #2e3142;
  cursor: default;
}
#errorContainer {
  width: 85%;
  height: 30px;
  margin: 0 auto;
  visibility: hidden;
  line-height: 30px;
  color: red;
}
#errorContainer.show {
  visibility: visible;
}
/*! For license information please see initial.css.LEGAL.txt */
/*# sourceMappingURL=initial.css.map */
