/* 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-bingo.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;
}

.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  ------ */

/* ------  tombola  ------ */

.tombolas {
	width:100%;
	height:auto;
	background-image: url('../img/fondo1.jpg');
	padding:4px 0px 4px 0px;
}



.tombola {
	width:195px;
	height:189px;
	background-image: url('../img/tombola.png');
	float:left;
	border: 1px solid #6d6d6d;
}


.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;
}

/* ------  tombola  ------ */


/* -----  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 {
	width:37px;
	height:41px;
	padding: 13px 0px 0px 17px;
	background-image: url('../img/bola1.png');
	background-repeat:no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:1px 1px 2px #000000;
	font-size:24px;
	font-weight:bold;
	color:#FFFFFF;
	float:right;
}


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



/* ------  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  ----- */



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

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

.texclock {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	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;
	color:#FFFFFF;
	text-shadow:1px 1px 2px #000000;
	margin:7px 0px 0px 110px;
}



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


/* ------  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  ------ */


/* -----  compra de numeros -----*/
.billete {
	width:275px;
	height:auto;
	background-color:#999999;
	padding:5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:5px;
	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:left;
}

.compra {
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
	color:#ffec14;
	text-shadow:1px 1px 2px #000000;
	background-image: url('../img/compra.png');
	background-repeat:no-repeat;
	padding: 0px 0px 3px 6px;
}


.numero {
	height:28px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:28px;
	font-weight:bold;
	text-align:center;
	color:#FFFFFF;
	text-shadow:1px 1px 2px #000000;
}




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

.caja {
	width:41px;
	height:50px;
	padding:1px;
	border: 1px solid #8b8a8a;
	text-align:center;
	float:left;
}

.caja:hover {
	background-image: url('../img/caja.png');
	background-color:#008ce5;
}

.btncompra {
	width:43px;
	height:50px;
	padding:1px;
	background-image: url('../img/btn-comprar1.png');
	text-decoration:none;
	text-align:center;
	margin-left:2px;
	float:left;
}

.btncompra:hover {
	background-image: url('../img/btn-comprar2.png');
}
/* -----  compra de numeros -----*/



/* ------  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  ------ */