@charset "utf-8";

/* CSS Document */

* {margin:0; padding:0;font-family: 'Roboto Condensed', sans-serif;}
html {height:100%;}
body {margin:0;width:100%;height:100%;padding:0;text-align:center;color:#333;font-size:62.5%;}
div.clear {clear:both;}
img{width:100%;height:auto;}


.geral{width:100%;height:100%;overflow:hidden;}

#wrap {position:relative;width:100%;height:100%;background-color:#fff;font-size:1.6em;}

.sair{position:absolute;width:5%;top:4%;right:2%;margin:auto;z-index:3000;cursor:pointer;display:none;}

.iconeAudio{position:absolute;width:6%;top:4%;left:2%;margin:auto;z-index:3000;cursor:pointer;
display:none;
}

#intro{position:relative;height:100%;margin:0 auto;top:50%;transform:translateY(-50%);}
#capa{position:relative;width:100%;height:auto;margin:0 auto;}
.inicio{position:absolute;width:20%;right:0;left:0;bottom:10%;margin:auto;cursor:pointer;}

.pagina{position:relative;height:100%;margin:0 auto;top:50%;transform:translateY(-50%);display:none;}

.imgBase{position:absolute;width:100%;top:0;bottom:0;right:0;left:0;margin:auto;}

#estrelaB{position:absolute;width:10%;height:10%;top:4%;left:16%;cursor:pointer;
/* background-color:blue; */
}
#rosaB{position:absolute;width:10%;height:10%;top:21%;left:17%;cursor:pointer;/* background-color:blue; */
}
#trenoB{position:absolute;width:10%;height:10%;top:36%;left:9%;cursor:pointer;/* background-color:blue; */
}
#azulB{position:absolute;width:10%;height:10%;top:37%;left:24%;cursor:pointer;/* background-color:blue; */
}
#amareloB{position:absolute;width:10%;height:10%;top:59%;left:6%;cursor:pointer;/* background-color:blue; */
}
#renaB{position:absolute;width:10%;height:10%;top:59%;left:24%;cursor:pointer;/* background-color:blue; */
}
#audioOff{position:absolute;width:6%;height:10%;top:88%;left:31%;cursor:pointer;
/* background-color:rgba(255,0,0,.4); */
}
/* .canvas{position:absolute;width:100%;top:0;bottom:0;right:0;left:0;margin:auto;} */

.fundoCartao{position:absolute;width:100%;top:0;bottom:0;right:0;left:0;margin:auto;}

.divMensagem{width:90%;padding:4%;text-align:left;
/* display:none; */
}
.titMensagem{position:relative;margin-top:3%;background-color:#959448;color:#fff;font-weight:bold;padding:5px;border:1px solid #fff;border-radius:0.5em;display:table;}
#textoPessoal{position:relative;width:35%;height:45%;}
#nome{position:relative;width:35%;}
#email{position:relative;width:35%;}
.botoes{position:relative;float:left;margin-right:15px;cursor:pointer;}

.contemCartao{position:relative;float:left;width:50%;height:100%;
display:none;
}
.cartao{position:relative;width:100%;height:100%;}
#fundoCartao{position:absolute;top:0;bottom:0;margin:auto;display:table;}
.cart{display:none;}
#apareceNome{position:relative;width:75%;height:5%;margin:0 auto;top:12%;text-align:left;line-height:1.5em;
/* background-color:red; */
}
#msg{position:relative;width:75%;height:60%;margin:0 auto;top:12%;text-align:left;line-height:1.5em;
/* background-color:blue; */
}
.contemBotoes{margin-top:3%;}

.btnFinal{position:relative;float:right;width:20%;height:15%;padding:10px;border-radius:0.5em 0 0 0.5em;margin:0 auto;top:50%;transform:translateY(-50%);background-color:rgba(255,255,255,.7);
display:none;
}
.botoesFinal{cursor:pointer;}
#btnEnviar{width:auto;height:50%;max-width:80px;}
#btnNovo{width:auto;height:50%;max-width:108px;}

#recomecarC1b{margin-top:4%;}


@media only screen and (orientation:portrait){
  body {height:100vw;transform:rotate(90deg);}
}

@media only screen and (orientation:landscape){
	body {margin:0; padding:0;width:100%;height:100%;text-align:center;color:#333;font-size: 62.5%;}  
}

@media screen and (max-width: 600px) and (orientation: portrait) {
	.divMensagem{padding:2%;}
	.titMensagem{margin-top:1%;}
	#textoPessoal{width:55%;}
	.botoes{margin-right:4%;}
	.btnFinal{width:30%;height:26%;}
}

@media screen and (max-width: 824px) and (orientation: landscape) {
	.divMensagem{padding:2%;}
	.titMensagem{margin-top:1%;}
	#textoPessoal{width:55%;}
	.botoes{margin-right:4%;}
	.btnFinal{width:30%;height:26%;}
}