body {
    font-family: londrina_solidregular;
}
/*--------------------------------------------------------------------------------*/
/*páginas*/
#PgInicio {
    background-image: url(../img/bg-inicio.png);
}

#PgAbertura {
    background-image: url(../img/bg-praia-blur.png);
}

#PgCidade {
    background-image: url(../img/bg-cidade.png);
}

#PgEstrada {
}

#bgEstrada {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 2048px;
    height: 768px;
    background-image: url(../img/bg-estrada.png);
}

#PgPraia {
    background-image: url(../img/bg-praia.png);
}

/*--------------------------------------------------------------------------------*/
/*titulos*/
#titulo {
    position: absolute;
    top: 43px;
    left: 210px;
    font-size: 52px;
    background-image: url(../img/titulo.png);
    width: 607px;
    height: 363px;
}

#txtTutorial {
    position: absolute;
    top: 201px;
    left: 202px;
    font-size: 29px;
    text-align: center;
    line-height: 39px;
    color: #603913;
    width: 643px;
}

#txtPopup {
    position: absolute;
    top: 60px;
    left: 102px;
    font-size: 48px;
    text-align: center;
    line-height: 123px;
    color: #603913;
}

/*--------------------------------------------------------------------------------*/
/*botões*/

.bt {
    cursor: pointer;
}

#btIniciar {
    background-image: url(../img/bt/bt-iniciar.png);
    position: absolute;
    top: 608px;
    left: 400px;
    width: 225px;
    height: 122px;
}

#btIniciar:active {
    background-position: 233px 0px;
}

#btComecar {
    background-image: url(../img/bt/bt-iniciar.png);
    position: absolute;
    top: 518px;
    left: 407px;
    width: 225px;
    height: 122px;
}

#btComecar:active {
    background-position: 233px 0px;
}

#btContinuar {
    position: absolute;
    top: 305px;
    left: 388px;
    width: 118px;
    height: 97px;
    background: url(../img/bt/bt-ok.png) no-repeat;
}

#btContinuar:active {
    background-position: 100%;
}

#btVoltar {
    position: absolute;
    top: 352px;
    left: 233px;
    width: 221px;
    height: 118px;
    background-image: url(../img/bt/bt-voltar.png);
}

#btVoltar:active {
    background-position: 100%;
    width: 228px;
    top: 352px;
    left: 233px;
}

#btSetaDir{
    position: absolute;
    top: 375px;
    left: 913px;
    width: 83px;
    height: 80px;
    background-image: url(../img/bt/bt-seta-dir.png);
}

#btSetaEsq{
    position: absolute;
    top: 375px;
    left: 33px;
    width: 83px;
    height: 80px;
    background-image: url(../img/bt/bt-seta-esq.png);
}

#btSetaDir:active, #btSetaEsq:active{
    background-position: 100%;
}

/*--------------------------------------------------------------------------------*/
/*popUps*/

#fume {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 1024px;
    height: 768px;
    background-image: url(../img/mask.png);
}

#popup {
    position: absolute;
    top: 180px;
    left: 110px;
    width: 800px;
    height: 362px;
    background-image: url(../img/popup3.png);
    background-repeat: no-repeat;
}

#popupAbertura {
    position: absolute;
    top: 150px;
    left: 180px;
    width: 688px;
    height: 435px;
    background-image: url(../img/popup1.png);
}


.medidas {
    position: absolute;
    top: 100px;
    left: 312px;
    font-size: 30px;
    line-height: 41px;
    width: 444px;
    color: #603913;
}

.unids {
    color: white;
    font-size: 32px;
}

#tituloObj {
    position: absolute;
    top: 24px;
    left: 317px;
    font-size: 57px;
    color: white;
    -webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: #603913;
}
/*#tituloObjShadow{
    position: absolute;
    top: 24px;
    left: 327px;
    font-size: 47px;
    color: #603913;
    font-family: londrina_shadowregular;
}*/

#objClick {
    position: absolute;
    top: 50px;
    left: 15px;
    width: 250px;
    height: 220px;
    text-align: center;
    /* border: solid 5px #EFEFEF; */
}

#objClick img {
    max-width: 245px;
    max-height: 220px;
    /*    position:absolute;
    top:50%;
    left:50%;
    margin-top:-50px;
    margin-left:-50px;*/
    margin-top: 20%;
    text-align: center;
}

/*--------------------------------------------------------------------------------*/
/*objetos*/

.objetos {
    position: absolute;
    background-repeat: no-repeat;

}

.objetos:hover {
    cursor: pointer;

}

/*.piscar{
    -webkit-animation-name: spaceboots;
    -webkit-animation-duration: 0.8s;
    -webkit-transform-origin:50% 50%;
    -webkit-animation-delay: 2s;
   -webkit-animation-play-state: ;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
}

@-webkit-keyframes spaceboots {
    0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
    10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
    20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
    30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
    40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
    50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
    60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
    70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
    80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
    90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
    100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}*/

.piscar{
    
}

#objMala {
    top: 562px;
    left: 866px;
    width: 104px;
    height: 167px;
    background-image: url(../img/obj-mala.png);
    background-repeat: no-repeat;
}

#objCao {
    top: 523px;
    left: 83px;
    width: 148px;
    height: 141px;
    background-image: url(../img/obj-cao.png);
    background-repeat: no-repeat;
}

#objCarro {
    top: 447px;
    left: 364px;
    width: 498px;
    height: 305px;
    background-image: url(../img/obj-carro.png);
    background-repeat: no-repeat;
}

#objCasa, #objCasaClicked {
    top: 141px;
    left: 217px;
    width: 619px;
    height: 405px;
    background-image: url(../img/obj-casa.png);
    background-repeat: no-repeat;
}

#objPai {
    top: 400px;
    left: 192px;
    width: 145px;
    height: 282px;
    background-image: url(../img/obj-pai.png);
    background-repeat: no-repeat;
}
/*----------------------------------*/

#objArvore {
    top: 90px;
    left: 1030px;
    width: 225px;
    height: 252px;
    background-image: url(../img/obj-arvore.png);
    background-repeat: no-repeat;
}

#objCarroAmarelo {
    top: 292px;
    left: 448px;
    width: 253px;
    height: 183px;
    background-image: url(../img/obj-carroamarelo-frente-parado.png);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    background-repeat: no-repeat;
}

#objCarroAzul {
    top: 250px;
    left: 1526px;
    width: 121px;
    height: 93px;
    background-image: url(../img/obj-carroazul.png);
    background-repeat: no-repeat;

}


#objMoto {
    top: 188px;
    left: 1625px;
    width: 94px;
    height: 131px;
    background-image: url(../img/obj-moto-frente.png);
    background-repeat: no-repeat;
}

#objSerra {
    top: 64px;
    left: 1615px;
    width: 366px;
    height: 222px;
    background-image: url(../img/obj-serra.png);
    background-repeat: no-repeat;
}

#objEstrada {
    top: 207px;
    left: 192px;
    width: 1619px;
    height: 349px;
    background-image: url(../img/obj-estrada.png);
    background-repeat: no-repeat;
}

/*----------------------------------*/
#objMar {
    top: 174px;
    left: -7px;
    width: 492px;
    height: 122px;
    background-image: url(../img/obj-mar.png);
    background-repeat: no-repeat;
}

#objCoco {
    top: 322px;
    left: 644px;
    width: 94px;
    height: 113px;
    background-image: url(../img/obj-coco.png);
    background-repeat: no-repeat;
}

#objGarrafinha {
    top: 330px;
    left: 775px;
    width: 55px;
    height: 107px;
    background-image: url(../img/obj-garrafinha.png);
    background-repeat: no-repeat;
}

#objGuardaSol {
    top: 316px;
    left: 127px;
    width: 324px;
    height: 365px;
    background-image: url(../img/obj-guardasol.png);
    background-repeat: no-repeat;
}

#objMenino {
    top: 462px;
    left: 357px;
    width: 134px;
    height: 172px;
    background-image: url(../img/obj-menino.png);
    background-repeat: no-repeat;
}

.nr {
    background-repeat: no-repeat;
}