body {
  margin: 0;
  padding: 0;
  background: #666;
  font-family: "Arial", arial, sans-serif;
}

#section_game {
  width: 1101px;
  height: 620px;
  margin: 0px auto;
  border: 0px solid #333;
  text-align: left;
  position: relative;
  overflow: hidden;
  background-repeat: no-repeat;
}

/* entrada */
#labelAno {
  margin-left: 794px;
  margin-top: 31px;
  font-size: 28px;
  color: #387ca2;
  width: 132px;
}

#labelDescricao {
  position: absolute;
  left: 308px;
  top: 137px;
  width: 500px;
  font-size: 28px;
  color: #18296a;
  text-align: left;
}

#labelTitulo {
  position: absolute;
  left: 308px;
  top: 69px;
  width: 516px;
  font-size: 32px;
  font-weight: bold;
  color: #18296a;
  text-align: left;
}

#start-scene {
  margin-top: 0px;
  background: url(../images/entrada_fundo.jpg) no-repeat;
}

.imagemEntrada {
  left: 0px;
  top: 0px;
  position: absolute;
}
/* fim de entrada */

.btcanvas {
  width: 145px;
  height: 145px;
  display: block;
  margin: auto;
  text-indent: 120%;
  white-space: nowrap;
  overflow: hidden;
  background-repeat: no-repeat;
}
.btcanvas:hover {
  background-position: 0 -145px;
}
.btcanvas:active {
  background-position: 0 0;
}

.btLabelSquare,
.btLabelRounded,
.btLabelRoundedGd {
  background: #fff;
  color: #18296a;
  font-size: 30px;
  text-align: center;
  text-decoration: none;
  padding-top: 20px;
  font-weight: bold;
}

.btLabelRounded,
.btLabelRoundedGd {
  border-radius: 15px;
}

.btLabelSquare:hover,
.btLabelRounded:hover,
.btLabelRoundedGd:hover {
  background: #ffffff55;
  color: #18296a;
}

.btLabelRoundedGd {
  width: 375px;
  height: 50px;
}
.btLabelRounded {
  width: 168px;
  height: 50px;
}

#btGoGame {
  position: absolute;
  left: 308px;
  top: 438px;
  -webkit-transition: none;
}

#btPlaySound {
  position: absolute;
  left: 500px;
  top: 438px;
  -webkit-transition: none;
  /* width:120px; */
}

.scene {
  background: #666;
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-transition: all 0.4s ease-out;
  -moz-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
}

.scene.out {
  top: -150%;
}
.scene.in {
  top: 0;
}

#divTop {
  background: url(../images/top.jpg) no-repeat;
  height: 127px;
  margin-left: 0px;
  margin-top: 0px;
}

#divTop #labelTitulo {
  position: absolute;
  left: 174px;
  top: 42px;
  width: 424px;
  font-size: 22px;
  color: #fff;
  text-align: left;
}

#divBase {
  background: url(../images/base.jpg) no-repeat;
  width: 100%;
  height: 55px;
  position: absolute;
  left: 0px;
  top: 713px;
}

#divToptempo,
#divToppontos {
  width: 118px;
  height: 112px;
  position: absolute;
  color: #fff;
  font-size: 24px;
  text-align: center;
  padding-top: 45px;
}
#divToptempo {
  background-image: url(../images/tempo.png);
  left: 764px;
  top: 10px;
}
#divToppontos {
  background-image: url(../images/pontos.png);
  left: 894px;
  top: 10px;
}

#divToppontosGP {
  position: absolute;
  color: #e4b21b;
  font-size: 16px;
  text-align: center;
  left: 980px;
  top: 50px;
}

#divWindow {
  background: url(../images/caixaA.png) no-repeat;
  width: 100%;
  height: 586px;
  position: absolute;
  left: 0px;
  top: 127px;
  -webkit-transition: all 0.2s ease-out;
}

#divFinal {
  width: 1101px;
  height: 620px;
  position: absolute;
  -webkit-transition: all 0.2s ease-out;
}

.btcanvasBase {
  width: 40px;
  height: 40px;
  display: block;
  text-indent: 120%;
  white-space: nowrap;
  overflow: hidden;
  background-repeat: no-repeat;
}
.btcanvasBase:hover {
  background-position: 0 -40px;
}
.btcanvasBase:active {
  background-position: 0 0;
}

#btAjuda,
#btSom,
#btMenu {
  position: absolute;
  -webkit-transition: none;
  top: 8px;
}
#btAjuda {
  background-image: url(../images/btajuda.png);
  left: 870px;
}

#btSom {
  background-image: url(../images/btsom.png);
  left: 918px;
}

#btMenu {
  background-image: url(../images/btmenu.png);
  left: 966px;
}

#btRepetir {
  position: absolute;
  -webkit-transition: none;
  left: calc(203px + 137px);
  top: 376px;
  width: 302px;
}
#btPlaySoundFinal {
  position: absolute;
  -webkit-transition: none;
  left: calc(203px + 137px);
  top: 455px;
  width: 302px;
}

#img_ajudaPersona {
  position: absolute;
  left: 0px;
  top: 127px;
}
#img_ajudaExpl {
  position: absolute;
  left: 520px;
  top: 368px;
}

#labelFinal {
  position: absolute;
  left: calc(222px + 137px);
  top: 128px;
  color: #18296a;
  font-size: 24px;
  width: 269px;
}

#divWindow #btCloseWindow {
  position: absolute;
  -webkit-transition: none;
  left: 756px;
  top: 116px;
  background-image: url(../images/btfechar.png);
  cursor: pointer;
}

#divWindow #labelExplicacao {
  position: absolute;
  left: 400px;
  top: 122px;
  width: 300px;
  color: #fff;
  font-size: 16px;
}

#divWindow #imgAnime {
  position: absolute;
  left: 400px;
  top: 223px;
}