/*Hoja de estilos del desarrollo de un desafio en el juego*/
/*Propiedad de cualquier imagen*/
img {
    height: 100%;
}
/* #fila1 contiene los elementos */
#fila1 {
    height: 11%;
    margin: 0px;
    padding: 0px;
}
#fila2 {
    position: relative;
    height: 22.6%;
    margin: 0px;
    padding: 0px;
    background: url('../img/gris.jpg') center no-repeat;
    background-size: cover;
    overflow: hidden;
}
#fila3 {
    position: relative;
    height: 11%;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
}
#fila4 {
    height: 11%;
    margin: 0px;
    padding: 0px;
}
#fila5 {
    height: 11%;
    margin: 0px;
    padding: 0px;
}
#fila6 {
    height: 11%;
    margin: 0px;
    padding: 0px;
}
#fila7 {
    height: 11%;
    margin: 0px;
    padding: 0px;
}
#fila8 {
    height: 11%;
    margin: 0px;
    padding: 0px;
}
/* Contenedores de los componentes del juego */

#cbbackMenu {
    position: relative;
    height: 100%;
    width: 15%;
    float: left;
    -webkit-box-shadow: inset 0px 0px 0px 1px white;
    -moz-box-shadow: inset 0px 0px 0px 1px white;
    box-shadow: inset 0px 0px 0px 1px white;
    background: #000000;
}
#cTiempo {
    position: relative;
    height: 100%;
    width: 55%;
    float: left;
    -webkit-box-shadow: inset 0px 0px 0px 1px white;
    -moz-box-shadow: inset 0px 0px 0px 1px white;
    box-shadow: inset 0px 0px 0px 1px white;
    background: #000000;
}
#cPuntaje {
    position: relative;
    height: 100%;
    width: 30%;
    float: left;
    background: #FF4000;
    -webkit-box-shadow: inset 0px 0px 0px 1px white;
    -moz-box-shadow: inset 0px 0px 0px 1px white;
    box-shadow: inset 0px 0px 0px 1px white;
}
#cEntrada {
    position: relative;
    height: 100%;
    width: 90%;
    float: left;
    -webkit-box-shadow: inset 0px 0px 0px 1px white;
    -moz-box-shadow: inset 0px 0px 0px 1px white;
    box-shadow: inset 0px 0px 0px 1px white;
    background: #001830;
    overflow-y: hidden;
    overflow-x: auto;
}
#cStatus {
    height: 100%;
    width: 10%;
    float: left;
    -webkit-box-shadow: inset 0px 0px 0px 1px white;
    -moz-box-shadow: inset 0px 0px 0px 1px white;
    box-shadow: inset 0px 0px 0px 1px white;
    background: #6080A0;
}
#cb7 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cb8 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cb9 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cb4 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cb5 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cb6 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cb1 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cb2 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cb3 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cb0 {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cbComa {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cbBorrar {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #002850;
}
#cbRetroceder {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #005090;
}
#cPrActual {
    height: 100%;
    width: 33.33%;
    float: left;
    -webkit-box-shadow: inset 0px 0px 0px 1px white;
    -moz-box-shadow: inset 0px 0px 0px 1px white;
    box-shadow: inset 0px 0px 0px 2px white;
    background: #005090;
}
#cbAvanzar {
    height: 100%;
    width: 33.33%;
    float: left;
    background: #005090;
}
/* Contenedores auxiliares */

#cCentradoTiempo {
    position: absolute;
    height: 60%;
    width: 90%;
    padding: 0px;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}
#cCentradoPrActual {
    height: 100%;
    width: 100%;
    margin: auto;
}
/* Componentes del juego */

#bbackMenu {
    background: url('../img/back.png') center no-repeat;
    background-size: contain;
    height: 100%;
    width: 100%;
    float: left;
    border: none;
}
#m1 {
    background-size: contain;
    height: 100%;
    width: 14.28%;
    float: left;
}
#m2 {
    background-size: contain;
    height: 100%;
    width: 14.28%;
    float: left;
}
#dospuntos {
    background: url('../img/dospuntos.png') center no-repeat;
    background-size: contain;
    height: 100%;
    width: 14.28%;
    float: left;
}
#s1 {
    background-size: contain;
    height: 100%;
    width: 14.28%;
    float: left;
}
#s2 {
    background-size: contain;
    height: 100%;
    width: 14.28%;
    float: left;
}
#coma {
    background: url('../img/coma.png') center no-repeat;
    background-size: contain;
    height: 100%;
    width: 14.28%;
    float: left;
}
#s3 {
    background-size: contain;
    height: 100%;
    width: 14.28%;
    float: left;
}
#puntaje {
    position: absolute;
    width: 98%;
    height: 60%;
    padding: 0px;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    margin: auto;
}
#pregunta {
    position: absolute;
    width: 95%;
    padding: 0px;
    left: 0px;
    right: 0px;
    margin: auto;
    font: 30px Arial, Helvetica, sans-serif;
}
#entrada {
    position: absolute;
    width: 85%;
    padding: 0px;
    left: 0px;
    right: 0px;
    margin: auto;
    font: bold 30px"Courier New", Courier, monospace;
    color: #30D0FF;
    text-shadow: 1px 1px #202020;
}
#status {
    height: 100%;
    width: 100%;
    background-size: contain;
}
#b7 {
    background: url('../img/7.png') center no-repeat;
    background-size: contain;
}
#b8 {
    background: url('../img/8.png') center no-repeat;
    background-size: contain;
}
#b9 {
    background: url('../img/9.png') center no-repeat;
    background-size: contain;
}
#b4 {
    background: url('../img/4.png') center no-repeat;
    background-size: contain;
}
#b5 {
    background: url('../img/5.png') center no-repeat;
    background-size: contain;
}
#b6 {
    background: url('../img/6.png') center no-repeat;
    background-size: contain;
}
#b1 {
    background: url('../img/1.png') center no-repeat;
    background-size: contain;
}
#b2 {
    background: url('../img/2.png') center no-repeat;
    background-size: contain;
}
#b3 {
    background: url('../img/3.png') center no-repeat;
    background-size: contain;
}
#b0 {
    background: url('../img/0.png') center no-repeat;
    background-size: contain;
}
#bComa {
    background: url('../img/coma.png') center no-repeat;
    background-size: contain;
}
#bBorrar {
    background: url('../img/borrar.png') center no-repeat;
    background-size: contain;
}
#bRetroceder {
    /* background: url('../img/retroceder.png') center no-repeat; */
    background-size: contain;
}
#numPr0 {
    height: 100%;
    width: 5%;
    float: left;
}
#numPr1 {
    background-size: contain;
    height: 100%;
    width: 18%;
    float: left;
}
#numPr2 {
    background-size: contain;
    height: 100%;
    width: 18%;
    float: left;
}
#barra {
    background: url('../img/barra.png') center no-repeat;
    background-size: contain;
    height: 100%;
    width: 18%;
    float: left;
}
#cantPr1 {
    background-size: contain;
    height: 100%;
    width: 18%;
    float: left;
}
#cantPr2 {
    background-size: contain;
    height: 100%;
    width: 18%;
    float: left;
}
#bAvanzar {
    /* background: url('../img/avanzar.png') center no-repeat; */
    background-size: contain;
}