*{margin:0px;text-decoration: none;border: 0;font-family:Helvetica Neue LT Std,Helvetica;}
body {background: #EEE6CD;}

#conteudo {width: 553px;text-align: center;margin: 0 auto;position: relative;}
.jogo{ width:553px;height:768px;background-image:url(../imagens/fundo_interno.png);position:relative;display:none;}
.intro{ width:553px;height:768px;background-image:url(../imagens/fundo2.png);position:relative;}
.help{ width:553px;height:768px;background-image:url(../imagens/fundo2.png);position:relative;display:none;}
.titulo{position:absolute;top:201px;left:58px;}
.botao_intro{position:absolute; cursor: pointer; animation-name: nivel; animation-duration: 4s;animation-iteration-count: infinite; animation-direction:alternate; transition: 2s ease-in-ease-out}
.botao_intro:hover{animation-name:none;}
.botao_menu{position:absolute; cursor:pointer; animation-name: none; animation-duration: 4s;animation-iteration-count: infinite; animation-direction:alternate; transition: 2s ease-in-ease-out}
.botao_menu:hover{animation-name:botao;}
.botao_menu.sair{left:504px;top:10px;}
.botao_menu.ajuda{left:461px;top:10px;}
.botao_menu.voltar{left:418px;top:10px;}
#facil{top:449px;left:84px;}
#dificil{top:410px;left:287px;}

.jogo .titulo{left:10px;top:10px;}
.titulo img{width:315px;height:102px;}
.popup{display:none;left: 80px;position: absolute;top: 220px;z-index: 10;}
#repetir{cursor:pointer;}
#sair{cursor:pointer;}

.help .titulo{left:10px;top:10px;}
.texto{position:absolute;left:160px;top:190px;width:370px;text-align:left;font-size:16px;font-family:Times New Roman}
.desenho_ajuda{position:absolute;left:15px;top:210px;}

.cartas{position:absolute;left:40px;top:222px;}
.template{display:none;}

/* The animation code */
@keyframes nivel {
    0%   {transform: rotate(0deg);}
	33%   {transform: rotate(3deg);}
    66%  {transform: rotate(0deg);}
	100%   {transform: rotate(-3deg);}
}

@keyframes botao {
    0%   {transform: scale(1,1);}
	33%   {transform: scale(1.1,1.1);}
    66%  {transform: scale(1,1);}
	100%   {transform: scale(1.1,1.1);}
}








.panel.flip .action {
  display: none;
}

.panel {
	padding-right: 26px;
	padding-bottom: 22px;
	width: 102px;
	height: 102px;
	position: relative;
	float: left;
	perspective: 600px;
	display:none;
}

.panel .front {
  z-index: 900;
  width: inherit;
  height: inherit;
  transform: rotateX(0deg) rotateY(0deg);
  transform-style: preserve-3d;
  backface-visibility: hidden;
  transition: all .4s ease-in-out;
}

.panel.flip .front {
  transform: rotateY(180deg);
}

.panel .back {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 800;
  width: inherit;
  height: inherit;
  transform: rotateY(-180deg);
  transform-style: preserve-3d;
  backface-visibility: hidden;
  transition: all .4s ease-in-out;
}

.panel.flip .back {
  z-index: 1000;
  transform: rotateX(0deg) rotateY(0deg);
}