/* CSS Document */
@font-face {
    font-family: "avian";
	src: url('../fonts/avian.ttf');
}


body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-image: url('../img/fondo1.jpg');
	min-width:100px;
	max-width:100%;
}

/* ------  autoajustar imagenes  ------ */

.container .one.colum,
.container .one.colums {width: 40px;}
.container .two.colums {width: 100px;}
.container .three.colums {width: 160px;}
.container .four.colums {width: 220px;}
.container .five.colums {width: 280px;}
.container .six.colums {width: 340px;}
.container .seven.colums {width: 400px;}
.container .eight.colums {width: 460px;}
.container .nine.colums {width: 520px;}
.container .ten.colums {width: 580px;}

.ten-din-img {width:100%;}

/* ------  autoajustar imagenes  ------ */


.width {
	min-width:100px; /*Anchura minima*/
	max-width:1100px; /*Anchura maxima*/
}

.width2 {
	min-width:100px; /*Anchura minima*/
	max-width:900px; /*Anchura maxima*/
}

.transparent {
	width:1100px;
	background-image: url('../img/transparent.png');
}

.fondo1 {
	background-image: url('../img/patterns1.jpg');
}

.fondo2 {
	background-image: url('../img/patterns2.jpg');
}

.fondo3 {
	background-image: url('../img/patterns3.jpg');
}

.line1 {
	width:auto;
	height:2px;
	margin:8px 15px 8px 15px;
	background-image: url('../img/line1.png');
}

.line2 {
	width:auto;
	height:2px;
	margin:8px 15px 8px 15px;
	background-image: url('../img/line2.png');
}

/* ------  posiciones  ------ */

.left {
	float:left;
}

.right {
	float:right;
}

/* ------  posiciones  ------ */


/* ------  header  ------ */
.header {
	width:100%;
	height:auto;
	background-image: url('../img/fondo2.jpg');
	padding:4px 0px 4px 0px;
	border-bottom: 3px solid #000000;
}


.logo {
	width:145px;
	height:46px;
	background-image: url('../img/logo.png');
	float:left;
}



/* ------  header  ------ */


/* ------  botones  ------ */
.boxboton {
	padding:15px 6px 15px 6px;
}

.boton {
	width:auto;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bold;
	background-image: url('../img/btn.png');
	background-color:#ff8a00;
	color:#ffffff;
	text-align:left;
	text-decoration:none !important;
	text-shadow:1px -1px 1px #982e00;
	padding:7px 20px 7px 20px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:10px 0px 10px 10px;
	-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
}
.boton:hover { background-color:#ffb400; }
.boton:active { background-color:#ffb400; background-image: url('../img/btn2.png');}


.boton1 {
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bold;
	background-image: url('../img/btn.png');
	background-color:#00d01d;
	color:#ffffff;
	text-align:center;
	text-decoration:none !important;
	text-shadow:1px -1px 1px #006802;
	padding:7px 20px 7px 20px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:10px 0px 10px 10px;
	-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
}
.boton1:hover { background-color:#00e130; }
.boton1:active { background-color:#00e130; background-image: url('../img/btn2.png');}


.form {
	padding:0px 7px 2px 0px;
	margin:0px 7px 2px 0px;
}

.forma {  /* campos de texto */
	width:100%;
	height:auto;
	font-family:Arial, Helvetica, sans-serif;
	text-decoration: none;
	font-size: 20px;
	color:#0066FF;
	background-color:#FFFFFF;
	border: 1px solid #2580f3;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	margin:6px 7px 6px 0px;
	padding:6px 3px 6px 3px;
}


.flecha1 {
	width:15px;
	height:16px;
	background-image: url('../img/flecha1.png');
}


/* ------  BOTONES  ------ */


/* ------  portada  ------ */

.alterno {
	width:221px;
	height:92px;
	background-image: url('../img/b-loteria.png');
	background-repeat:no-repeat;
	float:left;
}

.trans2 {
	width:450px;
	background-image: url('../img/transparent.png');
}

.logo-inicio {
	float:left;
	margin:20px 5px 25px 5px;
}


.welcome {
	font-family:Roboto-Light;
	font-size:25px;
	text-align:center;
	color:#FFCC00;
	margin:15px 0px 15px 0px;
	text-shadow:1px 1px 2px #000000;
}

.texblanco {
	font-family:Avian, Arial, Helvetica, sans-serif;
	font-size:17px;
	color:#ffffff;
	text-shadow:1px 1px 2px #000000;
	text-align:left;
}


.box {
	min-width:260px;
	height:auto;
	background-image: url('../img/fondo3.jpg');
	padding:7px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:20px 6px 20px 6px;
	border: 1px solid #6d6d6d;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	float:right;
}


.boxmensaje {
	width:auto;
	height:auto;
	background-image: url('../img/fondo3.jpg');
	padding:7px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:20px 6px 20px 6px;
	border: 1px solid #6d6d6d;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	float:right;
}


.check1 {
	width:50px;
	height:44px;
	background-image: url('../img/check1.png');
}


.premio1 {
	width:105px;
	height:71px;
	background-image: url('../img/premios.png');
}


/* ------  portada  ------ */


/* ------  tarjetas  ------ */
.tar1 {
	width:270px;
	height:18px;
	background-image: url('../img/tar1.png');
	background-repeat:no-repeat;
	margin:5px;
	font-family:Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-size:20px;
	text-shadow:1px 1px 2px #000000;
	padding:180px 0px 0px 5px;
	float:left;
}

.tar2 {
	width:270px;
	height:18px;
	background-image: url('../img/tar2.png');
	background-repeat:no-repeat;
	margin:5px;
	font-family:Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-size:20px;
	text-shadow:1px 1px 2px #000000;
	padding:180px 0px 0px 5px;
	float:left;
}

.tar3 {
	width:270px;
	height:18px;
	background-image: url('../img/tar3.png');
	background-repeat:no-repeat;
	margin:5px;
	font-family:Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-size:20px;
	text-shadow:1px 1px 2px #000000;
	padding:180px 0px 0px 5px;
	float:left;
}

/* ------  tarjetas  ------ */


/* ------  seccion de juego  ------ */

.concreto { /* fondo en el que se muestran las bolas */
	width:100%;
	height:auto;
	background-image: url('../img/concreto.jpg');
	padding:4px 0px 4px 0px;
	border-bottom: 1px solid #000000;
}



.salida { /* salida de la pelotas */
	width:250px;
	height:170px;
	background-image: url('../img/salida.png');
	float:left;
	margin:0px 5px 0px 5px;
}


.indicador {
	width:32px;
	height:28px;
	background-image: url('../img/indicador.png');
	padding: 4px 0px 0px 0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	color:#FFFFFF;
	text-shadow:1px 1px 2px #000000;
	text-align:center;
	left:1px;
	float:left;
}

/* ------  seccion de juego   ------ */



/* -----  pelotas  ------ */

.pelotas {
	width:100%;
	height:auto;
	background-color:#666666;
	padding:4px 0px 4px 0px;
}


.tubo {
	width:100%;
	height:60px;
	padding:6px 0px 0px 0px;
	background-image: url('../img/tubo.jpg');
}

.corte1 {
	width:18px;
	height:54px;
	background-image: url('../img/corte1.png');
	float:left;
	left:0px;
}

.corte2 {
	width:100%;
	height:54px;
	background-image: url('../img/corte2.png');
	margin:0px 10px 0px 10px;
}

.corte3 {
	width:18px;
	height:54px;
	background-image: url('../img/corte3.png');
	float:right;
	right:0px;
}

.bola1 { /* bolas grandes */
	width:130px;
	height:90px;
	padding: 40px 0px 0px 0px;
	background-image: url('../img/b1.png');
	background-repeat:no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:1px 1px 2px #ffffff;
	font-size:45px;
	font-weight:bold;
	text-align:center;
	color:#000000;
	float:right;
	margin:18px 60px 0px 0px;
}

.bola2 { /* bolas grandes */
	width:130px;
	height:90px;
	padding: 40px 0px 0px 0px;
	background-image: url('../img/b2.png');
	background-repeat:no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:1px 1px 2px #ffffff;
	font-size:45px;
	font-weight:bold;
	text-align:center;
	color:#000000;
	float:right;
	margin:18px 60px 0px 0px;
}

.bola3 { /* bolas grandes */
	width:130px;
	height:90px;
	padding: 40px 0px 0px 0px;
	background-image: url('../img/b3.png');
	background-repeat:no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:1px 1px 2px #ffffff;
	font-size:45px;
	font-weight:bold;
	text-align:center;
	color:#000000;
	float:right;
	margin:18px 60px 0px 0px;
}

.bola4 { /* bolas grandes */
	width:130px;
	height:90px;
	padding: 40px 0px 0px 0px;
	background-image: url('../img/b4.png');
	background-repeat:no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:1px 1px 2px #ffffff;
	font-size:45px;
	font-weight:bold;
	text-align:center;
	color:#000000;
	float:right;
	margin:18px 60px 0px 0px;
}

.resultados {
	width:94%;
	height:60px;
	background-image: url('../img/i-bolas.png');
	background-repeat:no-repeat;
	margin:0px 5px 3px 5px;
	padding:3px;
	background-color:#434343;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 2px solid #1e1e1e;
	overflow:hidden;
	/*float:right;*/
}

.recientes {
	height:20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:#ffffff;
	text-shadow:1px 1px 2px #000000;
	background-image: url('../img/reciente.png');
	background-repeat:no-repeat;
	padding:2px 0px 0px 15px;
	margin-left:6px;
}


.b01 { /* bolas pequeñas */
	width:54px;
	height:40px;
	padding: 14px 0px 0px 0px;
	background-image: url('../img/b01.png');
	background-repeat:no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:1px 1px 2px #ffffff;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	color:#000000;
	margin:3px;
	float:left;
}

.b02 { /* bolas pequeñas */
	width:54px;
	height:40px;
	padding: 14px 0px 0px 0px;
	background-image: url('../img/b02.png');
	background-repeat:no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:1px 1px 2px #ffffff;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	color:#000000;
	margin:3px;
	float:left;
}

.b03 { /* bolas pequeñas */
	width:54px;
	height:40px;
	padding: 14px 0px 0px 0px;
	background-image: url('../img/b03.png');
	background-repeat:no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:1px 1px 2px #ffffff;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	color:#000000;
	margin:3px;
	float:left;
}

.b04 { /* bolas pequeñas */
	width:54px;
	height:40px;
	padding: 14px 0px 0px 0px;
	background-image: url('../img/b04.png');
	background-repeat:no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:1px 1px 2px #ffffff;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	color:#000000;
	margin:3px;
	float:left;
}

/* -----  pelotas  ------ */



/* ------  contenido  ------ */

.contenido {
	width:100%;
	min-height:500px;
}

.areatexto {
	padding:10px 6px 20px 6px;
	background-image: url('../img/fondo1.png');
	background-color:#eeeded;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #ffffff;
	margin:2px;
}

.titulo1 {
	font-family:Roboto-Light, Arial, Helvetica, sans-serif;
	font-size:30px;
	color:#044496;
	text-shadow:1px 1px 2px #f8f8f8;
	text-align:left;
}

.parrafo1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size:17px;
	color:#312f3c;
	text-shadow:1px 1px 1px #f8f8f8;
	margin:5px;
	text-align:left;
}

.parrafo2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size:15px;
	color:#312f3c;
	text-shadow:1px 1px 1px #f8f8f8;
	margin:5px;
	text-align:left;
}

.margen {
	padding:2px 5px 2px 6px;
}

/* ------  contenido  ------ */

/* ------  premio ilustracion   ------- */

.premio {
	width:294px;
	height:109px;
	background-image: url('../img/premio.png');
	margin:5px;
}

.texpremio {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:center;
	color:#ffd440;
	text-shadow:1px 1px 2px #000000;
	padding:20px 0px 0px 110px;
}

/* ------  premio ilustracion   ------- */

/* ------  tarjeta  ------- */

.tarjeta {
	width:294px;
	height:109px;
	background-image: url('../img/tarjeta.png');
	margin:5px;
}

.texcard {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:center;
	color:#ffd440;
	text-shadow:1px 1px 2px #000000;
	padding:5px 0px 0px 110px;
}

.btncard {
	text-align:center;
	padding:10px 0px 0px 110px;
}



/* ------  tarjeta  ------- */


/* -----  Reloj  ----- */

.reloj {
	width:294px;
	height:109px;
	background-image: url('../img/reloj.png');
	margin:5px;
}

.texclock {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:center;
	color:#ffd440;
	text-shadow:1px 1px 2px #000000;
	padding:20px 0px 0px 110px;
}

.contador {
	font-family:Arial, Helvetica, sans-serif;
	font-size:25px;
	font-weight:bold;
	text-align:center;
	color:#FFFFFF;
	text-shadow:1px 1px 2px #000000;
	margin:7px 0px 0px 110px;
}



/* -----  Reloj  ----- */

/* -----  Cartones  -----*/

.cartones {
	width:115px;
	height:70px;
	background-image: url('../img/cartones.png');
	background-repeat:no-repeat;
	margin:3px;
	padding:7px 0px 3px 7px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:35px;
	font-weight:bold;
	text-decoration:none;
	color:#FFFF00;
	text-shadow:2px 2px 3px #000000;
	float:left;
}


.costo {
	width:100px;
	margin:9px 0px 0px 3px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:35px;
	text-decoration:none;
	color:#ffffff;
	text-shadow:1px 1px 2px #000000;
	float:left;
}

.lps {
	margin:9px 5px 0px 3px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	text-decoration:none;
	color:#ffffff;
	text-shadow:1px 1px 2px #000000;
	float:left;
}

.compra {
	width:auto;
	text-decoration:none;
	background-color:#656060;
	padding:3px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:10px;
	border: 2px solid #3d3636;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	float:left;
}
.compra:hover {
	background-color:#54a341;
	border: 2px solid #bfe4b6;
}

.carton2 {
	width:245px;
	height:99px;
	background-color:#908f8f;
	padding:0px 3px 3px 3px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:10px;
	border: 1px solid #231e1e;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	float:left;
}

.carton {
	width:140px;
	height:auto;
	background-color:#908f8f;
	padding:0px 3px 3px 6px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:10px;
	border: 1px solid #231e1e;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
	float:left;
}


.etiqueta {
	width:140px;
	padding:0px 0px 1px 4px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	color:#c6c6c6;
	text-shadow:1px 1px 1px #5d5d5d;
	text-align:left;
}

.lbingo {
	width:24px;
	height:21px;
	padding:4px 0px 0px 1px;
	background-color:#6d6d6d;
	font-family:"Courier New", Courier, monospace;
	font-size:15px;
	font-weight:bold;
	text-align:center;
	color:#FFFFFF;
	text-shadow:1px -1px 1px #323232;
	border: 1px solid #a2a2a2;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	float:left;
}
.lbingo:hover {
	background-color:#9c2e2e;
	border: 1px solid #5d0000;
}

.numero {
	width:24px;
	height:21px;
	padding:4px 0px 0px 1px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bold;
	text-align:center;
	color:#FFFFFF;
	text-shadow:1px 1px 2px #000000;
	border: 1px solid #6d6d6d;
	float:left;
}
.numero:hover {
	background-color:#008ce5;
	border: 1px solid #004571;
}


.espacio {
	width:25px;
	height:25px;
	border: 1px solid #6d6d6d;
	background-color:#a8a7a7;
	float:left;
}


/* -----  Cartones  -----*/






/* ------  footer  ------ */

.footer {
	width:100%;
	background-image: url('../img/footer.jpg');
	padding:8px 0px 4px 0px;
	border-top: 2px solid #000000;
}

.footer-section {
	width:100%;
	
}


.texfooter {
	height:17px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	text-align:center;
	color:#ffe400;
	text-shadow:1px 1px 2px #000000;
}


.credito {
	height:17px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	text-align:center;
	color:#bcbcbc;
	text-shadow:1px 1px 2px #000000;
}

/* ------  footer  ------ */