@font-face{font-family:'Urbanist';font-style:normal;font-weight:400;src:local(''),url(../fonts/urbanist-v1-latin-regular.woff2) format('woff2'),url(../fonts/urbanist-v1-latin-regular.woff) format('woff'),url(../fonts/urbanist-v1-latin-regular.ttf) format('truetype')}
body{font-family:'Urbanist',sans-serif;margin:0;}
body#homepage{background-color:#4682b4;}
#topBar{margin:0 auto;background-color:#4682b4;font-size:24px;padding:5px 0;text-align:center;}
#topBarContent{margin:0 auto;height:40px;line-height:40px;text-align:center;display:flex;justify-content:space-between;max-width:50%;color:#fff;}
#topBarContent a{color:#fff;}
#siteName{font-weight:700;}
body#homepage > main > div {margin:0 auto 30px;padding:10px 25px;color:#000;background-color:#fff;width:66%;border-radius:10px;font-size:24px;}
#divInfo{display:none;font-size:20px;background-color:#eee;}
#divInfo,#settingsContainerAdvanced,#settingsContainerBasic,#buttonsContainer,#settingsContainerFont{margin:10px;padding:10px;color:#000;text-align:center;border-radius:10px;}
#settingsContainerAdvanced,#settingsContainerBasic{font-size:24px;background-color:#B0E0E6;}
#buttonsContainer{font-size:24px;background-color:#B0E6D1;}
#settingsContainerFont{background-color:#B0E6D1;}
#divInfo>p{margin:5px;}
.pSmallInfo{font-size:12px;}
#btnReloadGame,#btnSkipTurn,#btnModalHelp,#btnPrint,#btnStartGame{width:200px;font-size:18px;}
#btnModalAbout,#btnToggleSettings,#btnConfigGen,#btnEnableContextMenu{margin-top:10px;margin-bottom:5px;padding:5px 50px;font-size:18px;}
fieldset{margin-bottom:20px;}
fieldset div,fieldset span{margin-bottom:5px;}
#inputNumChoices,#inputNumAnswerChoices{width:100px;height:32px;text-align:center;font-size:28px;margin-bottom:5px;}
#gameWindow{width:100%;margin:auto;text-align:center;}
a,.blue{color:#4682b4;text-decoration:none;}
a:hover{color:#B47846}
.red{color:#B4464B;}


#scoreContainer{margin:10px;padding:5px 0 10px;background-color:#b4eb7c;font-size:52px;color:#fff;text-align:center;border-radius:10px;}
.playerScore{display:inline;padding:5px;border:solid 2px #b4eb7c;}
.scoreNumber{font-size:46px;font-weight:thin;font-family:"Courier New", monospace;}
.scoreDivider{ 
    -webkit-text-stroke: 2px black;
    text-stroke: 2px black;
}
.currentTurn{background-color:#b37ceb;border:solid 2px #fff;border-radius:20px;}
#txtScore{font-size:28px;margin-bottom:3px;}
#divQuestionContainer{margin:0 auto 10px;padding:10px 100px;display:inline-block;border-radius:10px;background-color:#fff;}
.modal{display:none;position:fixed;z-index:1;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.7);}
.modal-content{background-color:#fff;margin:5% auto;padding:10px;border:1px solid #000;width:80%;border-radius:10px;font-size:20px;}
.configGen_list{margin:0;}
.configGen_list li{list-style-type: none;}
#gameQuestion, #selectedLettersContainer, #confirmAnswerContainer, #nextButton{font-size:78px;text-align:center;}
.divChoiceBox, .confirmAnswerBox, #nextButton{display:inline-block;margin-right:5px;margin-bottom:5px;border:solid 2px #000;border-radius:10px;background-color:#fff;
    vertical-align: top;
}
.correctAnswer{background-color:#7ceb7c;color:#fff;border-radius:10px;}
.incorrectAnswer{background-color:#eb7c7c;color:#fff;border-radius:10px;}
.spanChoiceBoxText {text-align:center;display:block;padding:10px;}
img{border-top-left-radius:10px;border-top-right-radius:10px;}
p.cardMatchingWordOnly{
    width: 370px;
    height: 235px;
    background-color: #fff;
    color: #000;
    font-size: 100px;
    text-align: center;
    visibility: hidden;
    vertical-align: middle;
    display: table-cell; 
    padding-bottom: 4px;
}
.cardMatchingWordOnly, .gameMatchingImage {
    border-radius: 10px;
}
.important{
    font-weight:bold;
    color:#C70039;
    
}
.modal-content p, .modal-content ul, .modal-content fieldset{margin: 0 0 3px;}
#configGen_output{
    text-decoration: underline;
}
#divConfig input[type="text"] {
    height: 32px;
	font-size: 18px;
}
#queryMatchesCount {
    color: black;
    margin: 0 5px 0;
}
#gamelinks > ul {
    list-style-type: decimal;
}
#gamelinks li a {
    text-decoration: underline;
}



.switch {
  display: inline-block;
  height: 18px;
  position: relative;
  width: 32px;
}

.switch input {
  display:none;
}

.slider {
  background-color: #ccc;
  bottom: 0;
  cursor: pointer;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: .2s;
}

.slider:before {
  background-color: #fff;
  bottom: 2px;
  content: "";
  height: 14px;
  left: 2px;
  position: absolute;
  transition: .2s;
  width: 14px;
}

input:checked + .slider {
  background-color: #66bb6a;
}

input:checked + .slider:before {
  transform: translateX(14px);
}

.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

/* .letterContainer{border:solid 2px #fff;border-radius:20px;} */
.correctSpelling{border:solid 2px #000;}
.confirmAnswerBox{padding: 10px 48px;}
.correctLetter{color:#7ceb7c;}
.incorrectLetter{color:#eb7c7c;}
#confirmAnswerBoxYes{background-color:#7ceb7c;color:#fff;}
#confirmAnswerBoxNo{background-color:#eb7c7c;color:#fff;}
#nextButton{background-color:#7cb4eb;color:#fff;border:solid 2px #000;padding: 10px 48px}
#congratulations{
  position:fixed;
  bottom:20px;
  right:20px;
  max-width: 30%;
  max-height: 30%;
}
#canvasContainer{
  width: 100%;
  height: 100%;
}
#divQuestionContainerCanvasGame{
  background-color: #fff;
  text-align: center;
  position: fixed;
  left: 50%;
  transform: translate(-50%, 0);
  font-size: 64px;
}