@font-face {
  font-family: 'Calibri';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/l/font?kit=J7afnpV-BGlaFfdAhLEY6w&skey=a1029226f80653a8&v=v11) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

html {
    font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
}

label {
    color: black;
}

#consent-text {
    overflow-y: scroll;
    height: 400px;
    border: solid 1px;
    padding: 4px;
    background-color: #eee;
}

#container {
    padding-bottom: 1em;
}

#game {
    max-width: 724px;
    margin: 3em auto;
}

#chart {
    display: block;
    margin: 1em;
    width: 300px;
}

#results {
    font-size: 24px;
    width: 100%;
}

#answer_block {
    color: #f44336 ;
}

#theguess_form {
    display: inline-block;
}

.psup-guess {
    width: 6em !important;
    display: inline;
    color: #26a69a;
    font-size: 24px;
}

#answer_block {
    display: none;
}

#after_game {
    display: none;
}

#tutorial {
    width: 100%;
    font-size: 18px;
    display: none;
}

#submitting, #submitsuccess, #submitfailure {
    display: none;
}

#errorBlock {
    padding: 1em;
}

#trialsettings {
    margin-top: 6em;
}

#newgame {
    background-color: #EA7C3B;
}

#treatment_num, #control_num {
    font-weight: bold;
}

/****************************
* From video game part
*****************************/

.abstract_fig {
    width: 100%;
}

#superiority_estimate {
  width: 10em;
  display: inline-block;
}

select {
    width: 100px;
}

.centered {
    text-align: center;
}

.bold {
    font-weight: bold;
}

.normal-line {
    line-height: normal;
}

.bodyrow {
    float: none;
    margin: 0 auto;
}

.bodybox {
    border-width: 1px;
    border-style: solid;
    float: left;
}

.blurry-text {
    color: transparent;
    text-shadow: 0 0 7px rgba(0,0,0,0.5);
}

.form-inline {
  margin-bottom: 1em;
}


#plot {
    width: 100%;
    height: 350px;
    overflow: hidden;
    text-align: center;
}

iframe {
    position: relative;
    top: -50px
}

label.error {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
  padding:1px 20px 1px 20px;
  float: none;
  vertical-align: top;
  display: block;
}

.error-message {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
  padding:1px 20px 1px 20px;
}

.form-group {
    margin-bottom: 5px;
}
/* ul{ */
/*     list-style-type: none; */
/* } */

/* li { */
/*     border: 1px solid black; */
/*     margin: 5px; */
/* } */

.slider.slider-horizontal{
    width: 100%
}

.lds-ring {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
  }
  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid #cef;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #cef transparent transparent transparent;
  }
  .lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
  }
  .lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
  }
  .lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
  }
  @keyframes lds-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }