* {
outline: none;
margin: 0;
padding: 0;
font: 15px/18px Arial, Helvetica, sans-serif;
}

#abre {
	background: url(../imagens/capa.jpg) repeat scroll 0 0 transparent;
	height: 466px;
	position: relative;
	cursor: pointer;
}

#abre .abre-text{
	position: absolute;
	top: 232px;
	left: 52px;
	color: white;
	width: 834px;
	font-size: 12px;	
}
#game{
	display:none;
}

#abre p {
	font-size: 12px;
	margin-bottom: 9px;	
}

a.veja {
    background: url("https://www.terra.com.br/economia/infograficos/15-passos-para-virar-milionario/img/veja-mais.gif") repeat scroll 0 0 transparent;
    display: block;
    float: left;
    height: 24px;
    margin-top: 0;
    text-indent: -5000px;
    width: 67px;
}

a.veja:hover {
	background-position: 0 -30px;	
}

body {
margin: 50px auto;
position: relative;
}

.open-gate-left, .open-gate-right {
width: 468px;
height: 464px;
background-image: url(../imagens/open-gate.png?v2);
position: absolute;
z-index: 999992;
}
.open-gate-left {
left:0px;
top:0px;
}

.open-gate-right {
right:0px;
top:0px;
}

.overlayer {
background-image:
}


#game {
width: 934px;
height: 464px;
overflow: hidden;
position: relative;
margin: 20px auto;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: 1px solid #ccc;
overflow: hidden;
background-color: #F9F9F9;
behavior: url(PIE.htc);
background: url("../imagens/background.jpg?dev001") repeat scroll 0 0 transparent;
}



#placar {
background: url("../imagens/background-placar.png") repeat scroll 0 bottom transparent;
border: 1px solid #CCCCCC;
border-bottom-left-radius: 15px;
border-bottom-right-radius: 15px;
height: 62px;
overflow: hidden;
padding: 10px;
position: absolute;
right: 197px;
top: -102px;
width: 549px;
z-index: 99991;
behavior: url(PIE.htc);
}

#placar .versus{
position:absolute;
left: 44%;
top: 5px;

}

#game #placar .titulo {
color: #FFF;
border-bottom: 1px solid #ccc;
}

#game #placar .titulo {
float: left;
width: 125px;
margin-bottom: 15px;
}

#game #placar .tutorial {
background-color: #FFF;
-webkit-border-radius: 22px;
-moz-border-radius: 22px;
border-radius: 22px;
color: #999;
float: right;
font-size: 15px;
height: 20px;
padding: 2px 6px;
text-align: center;
width: 12px;
cursor: pointer;
behavior: url(PIE.htc);
}

#game #placar .tutorial:hover {
background-color: #ccc;
color: #333;
}

#game #placar .resultados {
float: left;
width: 100%;
height: 30px;
}

#game #placar .resultados .voce, #game #placar .resultados .oponente {
float: right;
width: 65px;
margin-right: 10px;
}




#game #placar .resultados .oponente {
margin-right: 0;
float: left;

}
#game #placar .resultados .oponente .texto{

top:17px;
left:100px;

}
#game #placar .resultados .voce .numero{
position: absolute;
right: 97px;
text-align: left;
top: 36px;
width: 75px;

}
#game #placar .resultados .voce .texto{
top: 17px;
right: 46px;

}

#game #placar .resultados .texto {
color: #999;
top: 16px;
position: absolute;
}

#game #placar .resultados .numero {
color: #FFF;
top:41px;
}

#game .cartas {
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
background-color: transparent;
height: 464px;
z-index: 5;
width: 269px;
opacity: 0.25;
behavior: url(PIE.htc);
}

#game .direita {
background: url("../imagens/background.png?v3") repeat-x scroll 290px 71px transparent;
position: absolute;
right: 173px;
top: 0;
}

#game .esquerda{
background: url("../imagens/background.png?v3") repeat-x scroll -8px 71px transparent;
left: 152px;
position: absolute;
top: 0;
}

#game .carta_da_vez {
z-index: 6;

}

#game #monte {
background: url("../imagens/monte.png?v1s") repeat scroll 0 0 transparent;
color: #999999;
font-size: 40px;
height: 63px;
left: 751px;
padding: 27px 10px 0 11px;
position: absolute;
top: -11px;
width: 82px;
z-index: 1;
}

#game .carta_da_vez {
position: absolute;
/top: 100px;/
width: 206px;
}

#game #voce {
background: url("../imagens/background.png?v32") repeat-x scroll -7px -6px;
background-color: transparent!important;
height: 365px;
padding: 21px 0 0 25px;
right: 151px;
top: 77px;
width: 261px;
display: none;
}

#game #oponente {
background: url("../imagens/background.png?v522") repeat-x scroll -7px -5px transparent;
background-color: transparent!important;
height: 365px;
padding: 21px 0 0 25px;
left: 151px;
top: 76px;
width: 261px;
display: none;
}


#game .carta_da_vez .atributos .atr1 td,
#game .carta_da_vez .atributos .atr2 td,
#game .carta_da_vez .atributos .atr3 td,
#game .carta_da_vez .atributos .atr4 td,
#game .carta_da_vez .atributos .atr5 td {
font-size: 11px;
padding-right: 6px;
}

#game .carta_da_vez .atributos {
width: 198px;
}

#game .carta_da_vez .atributos table tbody tr td {
font-size: 11px;
padding: 0 5px 6px;

}

#game .carta_da_vez .titulo {
font-weight: bold;
padding-bottom: 10px;
clear: both;
font-size: 13px;
}


#game .carta_da_vez .imagem {
float: left;
margin-bottom /*\**/: 10px\9;
margin-bottom: 10px;

}

#voce .atributos table tbody tr:hover {
cursor: pointer;
background-color: #FFC;
}

.da_vez {
opacity: 1 !important;
display: none;
}

.monte_animated {
background: url("../imagens/monte_animated.gif") no-repeat scroll -4px 18px transparent !important;
bottom: -17px !important;
height: 47px !important;
left: 46% !important;
padding: 34px 13px 8px 18px !important;
width: 46px !important;

}



.tutorial-div {
background-color: #FFFFFF;
background-image: url("../imagens/instucoes.png?v2");
background-position: -11px -7px;
height: 464px;
opacity: 0.9;
position: absolute;
width: 100%;
z-index: 999993;
display: none;
cursor: pointer;
}


#placar .numero{
font-size:65px;
}
#placar .numero span{
font-size:30px;
color:#333;
position:absolute;
top:46px;
left:100px;

}

#placar .voce{
position: absolute;
top: 0;
right: 40px;

}
#placar div.resultados div.voce div.numero span{
left: 81px;
top: 10px;

}

#placar .oponente .numero{
color:#990000!important;
}

#placar .voce .numero{
color:#006600!important;
}

#placar .oponente .texto, #placar .voce .texto{
font-size:20px;
color:#999;
}

.cartas-escondidas-esquerda, .cartas-escondidas-direita, .cartas-escondidas-bolo{
display:none!important;
float:left;
}
.atributos tr.tr-escolhida{
background:#F1AD7E;
}

.html5 {
background-image: url("../imagens/html5.png?v2");
height: 48px;
left: 70%;
position: absolute;
top: 88%;
width: 35px;
}

.start-game {
z-index: 999993;
position: absolute;
left:0px;
top: 0px;
width: 644px;
height: 464px;
}

.start-game img {
left: 46%;
position: absolute;
top: 5%;
}

.start-game .start-button {
background-image: url("../imagens/jogar.png?v2");
height: 83px;
left: 55%;
position: absolute;
top: 57%;
width: 236px;
cursor: pointer;
}

.start-game .highlight {
background-image: url(../imagens/jogar_highlight.png?v2);
}

.no-bg{
width: 261px;
height: 365px;
background: url(../imagens/no-bg.png?v2) repeat-x scroll -7px -6px transparent!important;

overflow:hidden;
}
#acao {
background-image: url("../imagens/acao-bg.png?v2");
height: 464px;
position: absolute;
width: 100%;
display:none;
z-index: 99991;
progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF,endColorstr=#FFFFFFFF);
}

#acao_final {
background-image: url("../imagens/acao-bg-final.png?v2");
height: 464px;
position: absolute;
width: 100%;
display:none;
z-index: 99991;
cursor:pointer;
}



.suavez-img-bg {
left: 238px;
position: absolute;
top: 16px;
}

.suavez-img {
left: 330px;
position: absolute;
top: 96px;
}

.minhavez-img {
left: 290px;
position: absolute;
top: 96px;
}

.voceganhou-img {
left: 250px;
position: absolute;
top: 80px;
}

.voce-perdeu-img {
left: 250px;
position: absolute;
top: 80px;
}

.empatamos-img {
left: 270px;
position: absolute;
top: 80px;
}
.instrucoes {
background: url("../imagens/instrucoes-button.png?v2") no-repeat scroll 0 0 transparent;
height: 22px;
left: 66%;
z-index:1;
position: absolute;
top: 74%;
width: 80px;
cursor: pointer;
}

.voceganhou-img {
left: 250px;
position: absolute;
top: 100px;
}

.voce-perdeu-img {
left: 250px;
position: absolute;
top: 100px;
}

.empatamos-img {
left: 270px;
position: absolute;
top: 100px;
}

.gameover-img {
left: 370px;
position: absolute;
top: 100px;
}

.vocevenceu-img {
left: 343px;
position: absolute;
top: 159px;
}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;

vertical-align: baseline;
}
body {
line-height: 1;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
section, article, aside, header, footer, nav, dialog, figure {
display:block;
}


.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
a { color: #1e90ff; }
.container {
width: 900px;
margin: 0 auto;
}
.container header {
font-family: 'ChunkFive Regular', Arial, sans-serif;
font-size: 6em;
color: #527699;
margin: 25px 0;
text-shadow: 2px 2px 1px #aabfd4;
}
.container header .subtitle {
font-size: 0.3em;
color: #aabfd4;
height: 100%;
vertical-align: top;
padding-left: 15px;
text-shadow: none;
}
.container header .subtitle .version {
font-size: 0.75em;
font-family: Helvetica, Tahoma, Verdana, sans-serif;
padding-left: 15px;
vertical-align: top;
}
.container header div.aboutMe {
font: 12px/15px Helvetica, Tahoma, Verdana, sans-serif;
text-shadow: 1px 1px 1px #ffffff;
margin-top: 5px;
}
.container article.main {
float: left;
width: 70%;
}
.container article.main p {
font-size: 1.3em;
color: #999999;
margin: 5px 0 20px;
}
.container article.main p pre {
font-family: monospace;
font-size: 15px;
margin: 10px;
display: block;
color: #333333;
}
.container article.main .usage { margin-top: 50px; }
.container aside {
float: right;
width: 25%;
}
.container aside #dependencies { margin-bottom: 25px; }
.container aside #license {
font-size: 1.1em;
color: #666666;
margin-bottom: 25px;
}
.container aside #compat {
font-size: 1.1em;
color: #666666;
margin-bottom: 25px;
}
.container aside #thanksTo {
margin-bottom: 25px;
font-size: 1.1em;
color: #999999;
line-height: 1.5em;
}
.container aside #thanksTo .others { color: #1e90ff; }
.container aside #notes {
color: #999999;
font-size: 0.9em;
line-height: 1.5em;
margin-bottom: 25px;
}
.container footer {
clear: both;
margin: 25px 0;
}
.container h3 {
font-family: 'ChunkFive Regular', Tahoma, Helvetica;
font-size: 2em;
color: #aabfd4;
font-weight: normal;
text-transform: uppercase;
padding-top: 20px;
text-shadow: 1px 1px 1px #ffffff;
}
.container ul.options strong {
font-family: monospace;
font-size: 1.2em;
}
.container li {
list-style: none;
font-size: 1.2em;
margin: 7px 0;
}
.container li strong { display: block; }
#flipbox {
width: 500px;
height: 200px;
line-height: 200px;
background-color: #ff9000;
font-family: 'ChunkFive Regular', Tahoma, Helvetica;
font-size: 2.5em;
color: #ffffff;
text-align: center;
}
#flipPad {
margin: 15px 0;
width: 500px;
text-align: center;
}
#flipPad a {
padding: 5px 15px;
background: #1e90ff;
border: 2px solid #1e90ff;
border-radius: 2px;
color: #ffffff;
font-weight: bold;
text-decoration: none;
font-size: 1em;
font-family: Helvetica, Tahoma, Verdana, sans-serif;
line-height: 30px;
height: 30px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-moz-box-shadow: 1px 1px 2px #999999;
-webkit-box-shadow: 1px 1px 2px #999999;
-webkit-transition-duration: 1s;
behavior: url(PIE.htc);
}
#flipPad a:hover {
background-color: #ff9000;
border: 2px solid #ff9000;
}
#flipPad .revert {
background-color: #ff9000;
border: 2px solid #ff9000;
display: none;
}
.downloadBtn {
display: block;
font-size: 2em;
margin: 0 auto;
padding: 10px 25px;
background: #1e90ff;
color: #ffffff;
text-align: center;
text-decoration: none;
font-family: 'ChunkFive Regular', Tahoma, Helvetica;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-moz-box-shadow: 1px 1px 2px #999999;
-webkit-box-shadow: 1px 1px 2px #999999;
-webkit-transition-duration: 1s;
behavior: url(PIE.htc);
}
.downloadBtn:hover { background-color: #ff9000; }
.downloadGithub {
display: block;
text-align: right;
margin: 3px 3px 25px 0;
}
.retweet { margin-top: 30px; }
.tweetThis {
position: fixed;
bottom: 0;
right: 5px;
text-decoration: none;
}
.tweetThis span {
display: none;
position: absolute;
right: 32px;
bottom: 32px;
padding: 5px;
background: #ffffff;
text-decoration: none;
font-weight: bold;
font-size: 1.2em;
border: 2px solid #ff9000;
white-space: no-wrap;
}
.tweetThis:hover span { display: block; }

//ie8