select {
    text-overflow: clip;
    width: 100%;
    max-width:100%!important;
}

.clickable {
    cursor: pointer;
}


.highlight {
  color:#ffe400;  
}

.info-text
{
  color: #fffd34;
}


#player-list {
    padding: 10px;
    max-width: 600px;
    border: 8px solid #1af7ff;
    box-shadow: inset 4px 4px 0px 0px #000000;
}

#player-controls {
  display:flex;
  flex-wrap:wrap;
}


#score-table {
    margin-bottom:0px;
}
#score-table td {
    border: 0px;
    font-family: "ModeNine", Monaco, monospace;
    color: #ffffff;
    border-top: 0px !important;
    vertical-align: middle !important;
    padding: 0.25rem;

}

.ui-dialog {
    max-width:100%!important;
}

.input-sans {
    font-family:"ModeNine", Monaco, monospace !important;

}

.info-box {
    background-color: RGBA(0,0,0,0.2);
    padding:8px;
    font-family: "ModeNine", Monaco, monospace;
    color:#FFFFFF;
    margin-top:12px;
    margin-bottom:12px;
    font-size:1.1em;
    text-align: center;
    border: 4px solid rgba(21,6,57,0.1);
  }

  .ui-dialog-title
  {
    text-align: center;
  }
  
  .tiny-title {
    font-family: 'Edit Undo Line BRK';
    color: #1af7ff;
    font-size: 1.5em;
    text-align: right;
  }

  .button-separator
  {
    border-left: 4px solid #1af7ff;
    box-shadow: inset 4px 4px 0px 0px #000000;
    margin-right:12px;
    margin-top: 4px;
    margin-bottom:4px;
  }

  .ui-dialog-buttonset
  {
    flex-wrap:wrap;
    display:flex;
    justify-content:space-around;
    float:initial!important;
    padding: .3em .3em .3em .3em!important;

  }

  .muted {
    color:#cfcfcf;

  }



.freetext-input {
  font-family:"ModeNine", Monaco, monospace !important;
  width: 100%;
  font-size:1.1em;
  margin-bottom: 8px;
}


.freetext-input:disabled {
    background:#AAAAAA;
    box-shadow:none;
}

img.imgClue {
  max-width: 100%;
  max-height: 75vh;
  min-width: 100%;
  object-fit: contain;
}


img.imgClueHost {
  max-width: 100%;
  max-height: 125px;
  margin-bottom:8px;
}


/* hover menus */
ul.hover {
    padding:0px;
    margin:0px;
}
ul.dropdown { display: none; position: absolute; margin-top: 0px; padding: 0; background:rgba(21,6,57,1); z-index:1; border: 4px solid #1af7ff; border-bottom:0; box-shadow: inset 2px 2px 0px 0px #000000; max-width:90%;}
ul.dropdown li { list-style-type: none; text-align: left; padding:5px; }
/*ul.dropdown li:nth-child(even) { background:rgba(80,24,102,1); }
ul.dropdown li:nth-child(odd) { background:rgba(21,6,57,1); }*/

ul.dropdown li a { text-decoration: none; padding: 0em 1em; display: block; }
.hoverli {
    list-style-type: none; 

}

.hoverli:hover button {
    background-color: #ffe400!important;
}

ul.dropdown .hoverli {
border-bottom:4px solid #1af7ff;
}

ul.dropdown .hoverli:hover {
    border-left: 5px solid #ffe400;
    padding-left: 0px;
}

/* FORCE FOR SMALL SCREENS */
@media (max-width: 758px)
{

    #header-game-code, #top-right-controls, ul.hover, .hover, .dropdown-hover button {
        width:100%;
    }

    #header-game-code {
        justify-content: center!important;
        padding: 5px;
    }

    

}

.focus-border
{
  border: 12px dashed #fffd34;
  padding: 12px;
}

.focus-text {
  display: none;
}

.nofocus-text {
  display: block;
}

.focus-section:not(.focus-border) {
  /*color:#777777!important;*/
  opacity:0.5;
}

.focus-border > .focus-text {
  display: block;
}

.focus-border > .nofocus-text {
  display: none;
}

#question-navbar {
  width:100%;
  display:flex;
  flex-direction: row;
  flex-wrap:wrap;
  align-items: center;
  justify-content: end;
  gap:10px;

}

#question-section, #options-section,#notes-text,#answer-section {
  margin-bottom:15px;
}

.answer-toggle[aria-pressed=false] {
  background: #AAAAAA;
  color: #000;
}

.answer-toggle[aria-pressed=true] {
  background: #ffe400;
  color: #000;
}

.btn-answer {
  font-family:"ModeNine", Monaco, monospace !important;
  width: 100%;
  background: #EEEEEE;
  color: #000;
  margin-top:4px;
  margin-bottom:22px;
  font-size:1.2em;  
  text-align: center;
}

.freetext-answer {
  font-family:"ModeNine", Monaco, monospace !important;
  width: 100%!important;
  font-size:1.3em;
}


.freetext-answer::placeholder {
  font-size:.7em;
  color: #333;
}

.freetext-answer:disabled {
  background:#AAAAAA;
  box-shadow:none;
}

.marking-box {
  background-color: RGBA(0,0,0,0.2);
  padding:8px;
  border: 4px solid rgba(21,6,57,0.1);

}

.collapse-margins:empty {
    margin:0!important;
}

/*creator styles*/
.accordion-header {
  background:none;
  border:none;
  outline:none;
  padding:0px !important;
}


.accordion-content {
  background:none;
  border:none;
  outline:none;
  padding:0px !important;
}


.creator-choice
{
  display:flex;padding-right:16px;margin-bottom: 8px;
}

.creator-choice-input
{
   flex-grow:1;
}

.creator-question-row {
  background-color: rgba(0, 0,0, 0.2);
  border: 4px solid rgba(21,6,57,0.1);
  margin-bottom: 25px;
}

.icon-button {
  color:#17a3a8;
  /*border: 0.08em solid #1af7ff;*/
  background-color: rgba(0, 0,0, 0.2);
  border-radius: 0.1em;
  padding: 0.2em 0.25em 0.15em;
  margin-left:10px;
  /*position:absolute;
  right:0em;*/
/*  top:1em;*/

}

.icon-button:hover {
color:#1af7ff;
/*border: 0.08em solid #ffe400;*/
background-color: rgba(0, 0,0, 0.2);
border-radius: 0.1em;
padding: 0.2em 0.25em 0.15em;
}

.icon-button:active {
color:#1af7ff;
/*border: 0.08em solid #ffe400;*/
background-color: rgba(255,255,255, 0.2);
border-radius: 0.1em;
padding: 0.2em 0.25em 0.15em;
}

.question-icon-buttons {
  color: #fffd34;
}

label
{
  margin-bottom:0px;
  color:#FFFD34;
  user-select: none; /* supported by Chrome and Opera */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
}


/*END creator styles*/

.mapPano {
height:50vh;
width:100%;
}

.mapInput {
height:40vh;
width:100%;
}

.gmnoprint, .gm-style-cc, .gm-style a {
display:none!important;
pointer-events: none!important;
}

select
{
  margin-bottom: 8px;
  padding: 4px 8px;
}
7
.image-hidden {
  opacity:0.5;
}

.hidden-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none; /* Initially hidden */
  align-items: center;
  justify-content: center;
  /*background: rgba(0, 0, 0, 0.5); /* Semi-transparent overlay */
  color: white;
  font-size: 3em;
}

.image-hidden + .hidden-overlay {
  display: flex; /* Show overlay if the previous sibling image has the class */
}

/* tags */

.tags-look .tagify__dropdown__item{
  display: inline-block;
  vertical-align: middle;
  border-radius: 3px;
  padding: .3em .5em;
  border: 1px solid #CCC;
  background: #F3F3F3;
  margin: .2em;
  font-size: .85em;
  color: black;
  transition: 0s;
}

.tags-look .tagify__dropdown__item--active{
  border-color: black;
}

.tags-look .tagify__dropdown__item:hover{
  background: lightyellow;
  border-color: gold;
}

.tags-look .tagify__dropdown__item--hidden {
  max-width: 0;
  max-height: initial;
  padding: .3em 0;
  margin: .2em 0;
  white-space: nowrap;
  text-indent: -20px;
  border: 0;
}

.tagify__tag__removeBtn {
  width:20px!important;
  height:20px!important;
  font-size: 2.5rem;
}

.question-attribute, select.question-attribute option  {
  font-size: initial;
}