@media (min-width: 800px){
#app-contenedor{/*Contenedor general*/
    width:800px;
    height:780px;
    margin: 0 auto;
}

#app-b0{/*Fondo*/
    width:100%;
    height:100%;
    background-image:url('../img/pattern.jpg');
}

#app-b1{/*Encabezado*/
    width:100%;
    height:80px;
    text-align:center;
    position:relative;
    top:10px;
}

#app-b2{
    width:100%;
    height:275px;
}

#app-b3{
    width:100%;
    height:5px;
    background-color: #BA3107;
}

#app-b4{
    width:100%;
    height:500px;
    background-color:#F7F7F7;
}

#app-b5{
    width:100%;
    height:50px;
    background-color:#F7F7F7;
    margin:0px;
}

#app-b1-1{
    width:100%;
    height: 80px;
    text-align:center;
    top: 50%;
    left:50%;
    -ms-transform: translate(5%,0%);
    -webkit-transform: translate(5%,0%);
    transform: translate(5%,0%);
}

#app-b2-1{
    width:419px;
    height: 160px;
    text-align:center;
    top: 50%;
    left:50%;
    -ms-transform: translate(53%,0%);
    -webkit-transform: translate(53%,0%);
    transform: translate(53%,0%);
}

#helperFicha1{
    width:80px;
    height:80px;
}

.div-icono{
    width:73px;
    height:73px;
    position:relative;
    float:left;
}

.div-titulo{
    width:550px;
    height:80px;
    float:left;
    text-align:left;
}

.txt-titulo{
    color:#C43501;
    font-family:Arial, Helvetica, sans-serif;
    font-size:25px;    
}

.txt-instrucciones{
    color:#222;
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;    
}

.div-contenedorFlecha{
    width:44px;
    height:160px;
    position:relative;
    float:left;
}

.div-flecha{
    width:44px;
    height:77px;
    position:relative;
    float:left;
    top: 0%;
    left:0%;
    -ms-transform: translate(0%,60%);
    -webkit-transform: translate(0%,60%);
    transform: translate(0%,60%);
    cursor:pointer;
}

.div-flecha:hover{
    width:33px;
    height:77px;
    position:relative;
    float:left;
    background-color:rgba(0,0,0,.1);
    cursor:pointer;
}

.div-ficha{
    width:250px;
    height:160px;
    background-image:url('../img/pieza1.png');
    background-size: 100% 100%;
    position:relative;
    top: 0%;
    left:0%;
    -ms-transform:scale(0.85,0.85) translate(0%,0%);
    -webkit-transform: scale(0.85,0.85) translate(0%,0%);
    transform: scale(0.85,0.85) translate(0%,0%);
}
.div-contenedorFicha{
    width:250px;
    height:160px;
    position:relative;
    float:left;
}
.div-contenidoFicha{
    width:250px;
    height:50px;
    text-align:center;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
    color:#000;
    position:relative;
    float:left;
    top: 0px;
    left:0px;
    -ms-transform: translate(0%,50%);
    -webkit-transform: translate(0%,50%);
    transform: translate(0%,50%);
}

.div-cubreFicha{
    width:250px;
    height:160px;
    position:absolute;
    float:left;
    top: 0px;
    left:0px;
    cursor:move;
}

.div-indicador-off{
    width:15px;
    height:15px;
    background-color:#BBB;
    border-radius:10px;
    float:left;
    margin:5px;
    cursor:pointer;
}

.div-navegacion{
    width:200px;
    height:25px;
    position:relative;
    top:0%;
    left:50%;
    -ms-transform: translate(-50%,0%);
    -webkit-transform: translate(-50%,0%);
    transform: translate(-50%,0%);
}

.div-contenedores{
    width:500px;
    height:500px;
    position:relative;
    left:150px;
    float:left;
}

.div-marcoContenedores{
    width:130px;
    height:110px;
    position:relative;
    float:left;
}

.boton{
    width:150px;
    height:30px;
    color:#fff;
    text-align:center;
    font-size:13px;
    font-family:Arial, Helvetica, sans-serif;
    border-radius:5px;
    background-color:#BA3107;
    position:relative;
    top:0%;
    left:45%;
    -ms-transform: translate(-50%,-30%);
    -webkit-transform: translate(-50%,-30%);
    transform: translate(-50%,-30%);
    cursor:pointer;
}

.boton:hover{
    width:150px;
    height:30px;
    color:#fff;
    text-align:center;
    font-size:13px;
    font-family:Arial, Helvetica, sans-serif;
    border-radius:5px;
    background-color:#EF3737;
    position:relative;
    top:0%;
    left:45%;
    -ms-transform: translate(-50%,0%);
    -webkit-transform: translate(-50%,0%);
    transform: translate(-50%,0%);
    cursor:pointer;
}

.boton2{
    width:60px;
    height:20px;
    color:#fff;
    text-align:center;
    font-size:13px;
    font-family:Arial, Helvetica, sans-serif;
    border-radius:5px;
    background-color:#BA3107;
    position:relative;
    top:0%;
    left:70%;
    -ms-transform: translate(-50%,-30%);
    -webkit-transform: translate(-50%,-30%);
    transform: translate(-50%,-30%);
    cursor:pointer;
}

.boton2:hover{
    width:60px;
    height:20px;
    color:#fff;
    text-align:center;
    font-size:13px;
    font-family:Arial, Helvetica, sans-serif;
    border-radius:5px;
    background-color:#EF3737;
    position:relative;
    top:0%;
    left:70%;
    -ms-transform: translate(-50%,0%);
    -webkit-transform: translate(-50%,0%);
    transform: translate(-50%,0%);
    cursor:pointer;
}

.div-cont-1{
    width:100px;
    height:60px;
    border-radius:50px;
    border:0px solid #BA3107;
    position:relative;
    float:left;
}

.center{
    width:500px;
    height:500px;
    /*border-radius:50px;*/
    border:1px solid #BA3107;
    position:relative;
    float:left;
}

.imagen{
    position:relative;
    top:0%;
    left:0%;
    -ms-transform: scale(0.8,0.8) translate(0%,0%);
    -webkit-transform: scale(0.8,0.8) translate(0%,0%);
    transform: scale(0.8,0.8) translate(0%,0%);
}

.linea{
    position:relative;
    float:left;
    top:50%;
    left:0%;
    -ms-transform: translate(-5%,-10%);
    -webkit-transform: translate(-5%,-10%);
    transform: translate(-5%,-10%);
}

.div-blqContenedor{
    width:100px;
    height:80px;
    text-align:center;
    position:relative;
    float:left;
    margin:10px;
}

.txt-contenedor{
    color:#BA3107;
    text-align:left;
    font-family:Arial, Helvetica, sans-serif;
    font-weight:bold;
    font-size:13px;
}

#app-notificacionImg{
    font-family:Arial, Helvetica, sans-serif;
    font-size:22px;
    color:#720E0E;
    text-align:center;
    position:relative;
    top:30px;
}

#app-notificacionTxt{
    font-family:Arial, Helvetica, sans-serif;
    font-size:22px;
    color:#720E0E;
    position:absolute;
    top:30px;
    left:35px;
}
.circle-container {
    position: relative;
    width: 500px;
    height: 500px;
    padding: 0em;
    background-image:url('../img/mesa.png');
    background-size:100% 100%;
    /*2.8em = 2em*1.4 (2em = half the width of a link with img, 1.4 = sqrt(2))*/
    border: dashed 0px;
    border-radius: 50%;
    margin: 0em auto 0;
}
.circle-container div {
    display: block;
    position: absolute;
    top: 205px; left: 175px;
    width: 150px; height: 90px;
    /*margin: -2em;*/
}
.circle-container img { display: block; width: 100%; }
.center { transform:; }
.deg0 { transform: translate(225px) rotate(90deg); } /* 12em = half the width of the wrapper */
.deg45 { transform: rotate(45deg) translate(225px) rotate(90deg); }
.deg90 { transform: rotate(90deg) translate(225px) rotate(90deg); }
.deg135 { transform: rotate(135deg) translate(225px) rotate(90deg); }
.deg180 { transform: translate(-225px) rotate(-90deg); }
.deg225 { transform: rotate(225deg) translate(225px) rotate(90deg); }
.deg270 { transform: rotate(270deg) translate(225px) rotate(90deg); }
.deg315 { transform: rotate(315deg) translate(225px) rotate(90deg); }
}