@charset "utf-8";
/* CSS Document */
#page {
	background:url(img/fons-web.png) top center no-repeat; height:auto 
}

#content,#header,#footer { max-width:600px; margin:0 auto 0 auto;  }

#header { text-align:center; }
#header img { vertical-align:middle; margin:5px 10px 5px 0px; height:40px; }
#header h1 { margin:0px; display:inline; font-size:24px; line-height:24px; vertical-align:middle }

#content h2 { margin-top:0px; }
a { text-decoration:none; color:#000 }

.login { 
	text-align:left;
	width:80%; height:90%; display:block;
	max-width:300px;
	padding:10px 30px 30px 30px;
	background-color:#eee;
	border:1px solid #ccc;
	border-radius: 5px;
	margin:1% auto 1% auto;
}

.login img { width:70%; margin:1% auto 5% auto; display:block }
.login a { text-decoration:underline; color:#4cb900; font-weight:normal }
.login a:visited { text-decoration:underline; color:#4cb900; }
.login a:hover { text-decoration:underline; color:#004650; }

.ui-block-a div { margin:0px 0px 5px 0px; }
.ui-block-b div { margin:0px 5px 5px 5px; }
.ui-block-c div { margin:0px 0px 5px 0px; }

.ui-block-a div ,
.ui-block-b div ,
.ui-block-c div { text-align:center; height:90px;  }

.ui-block-a div img,
.ui-block-b div img,
.ui-block-c div img{  width:48px; margin-top:15px; }

.ui-icon-mi-nuevo:after {
    background-image: url("img/nuevo1.png");
    /* Make your icon fit */
    background-size: 32px 32px;
}

.OnOff { float:right; }

li.act a { background:url(../img/act.png) no-repeat; background-position: 0px 40%; padding-left:30px}
li.inact a { background:url(../img/inact.png) no-repeat;  background-position: 0px 40%; padding-left:30px   }

li table td img { float:right; border:none; margin:0px; vertical-align:middle }

ul.collapsible  { padding:0px; }
ul.collapsible li h2 { margin:0px; }
ul.collapsible li { margin:0px; }

.ui-li-static.ui-collapsible > .ui-collapsible-heading {
    margin: 0;
}
.ui-li-static.ui-collapsible {
    padding: 0;
}
.ui-li-static.ui-collapsible > .ui-collapsible-heading > .ui-btn {
    border-top-width: 0;
}
.ui-li-static.ui-collapsible > .ui-collapsible-heading.ui-collapsible-heading-collapsed > .ui-btn,
.ui-li-static.ui-collapsible > .ui-collapsible-content {
    border-bottom-width: 0;
}

li img {margin:10px; border:1px solid #666}

#us-no, #us-existe,#faltan-campos, #error {
	border: 1px solid #F00;
	border-radius:5px; 
	color:#F00; display:none;
	margin:20px 0px 20px 0px;
	padding:10px; background:#e5e5e5;
}

.mybox { border:1px solid #999; background:#FFF; border-radius:5px; margin-top:15px }

.ofertas { border:1px solid #999; background:#FFF; text-align:center }
.ofertas a { text-align:center; }
.ofertas img { width:100%; margin:0px; padding:0px}

.tarjeta { text-align:center;}
.tarjeta p { margin:5px 0px 5px 0px; }


.box-oferta {
	border:1px solid #CCC;
	border-radius: 5px;
	background:#FFF;
	display:block; clear:both;
	height:180px
}
.box-oferta div { }
.box-oferta img { height:150px; border:none; float:left; margin-top:10px }
.box-oferta div.grupo {display:block; width:45%; position:absolute; left:45%; margin-top:10px}
.box-oferta div.articulo { text-align:right; clear:both; overflow:visible; white-space: normal;}
.box-oferta div.formato { text-align:right; clear:both; overflow:visible; white-space: normal;}
.box-oferta div.fecha { text-align:right; clear:both; overflow:visible; white-space: normal; color:#4cb900;}
.box-oferta div.precio { color:#F00; text-align:right; clear:both; margin-top:5%; margin-bottom:5%; 
	font-size:52px; font-weight:bolder;
	border:1px solid #4cb900; border-radius:5px;  
	padding:2px 10px 2px 5px; float:right; min-width:150px;
	border:none; padding:0px
	 }
.box-oferta sup { font-size:28px;}

.tienda img { width:100%; }

ul.table2 { list-style:none; margin:0px; padding:0px; font-weight:normal; }
ul.table2 li { list-style:none; display:inline-block; width:50% }

ul.table3 { list-style:none; margin:0px; padding:0px; font-weight:normal; }
ul.table3 li { list-style:none; display:inline-block; width:33% }
 
.ticket { border:1px solid #ccc; border-radius:5px; background:#ffffff; text-align:center }
.ticket table { margin:20px; width:90%; text-align:left }
.ticket img { height:100px;}
.ticket ul { line-height:25px; border-bottom:1px solid #eee; }
.ticket ul, .ticket ul li { list-style:none; margin:0px; padding:0px; font-size:12px; }
.ticket ul li { display:inline-block; width:20% ; text-align:left}
.ticket ul li:first-child { display:block; width:100% }
.ticket ul li:nth-child(2) { width:35% }
.ticket ul li:nth-child(3) { width:5% }
.ticket ul li:nth-child(4) { text-align:right}
.ticket ul li:nth-child(5) { text-align:right}
.ticket ul li:last-child { text-align:right;}
.ticket ul:last-child { border:none;  }
.ticket .total { font-size:18px; font-weight:bold; }
.ticket .total span { font-size:12px; font-weight:bold; display:block; clear:both }
.ticket .ivas ul  { border:none; line-height:normal; font-size:11px; width:100%}
.ticket .ivas ul li { display:inline-block; width:33%; text-align:center }
.ticket .ivas ul li:first-child { text-align:left }
.ticket .ivas ul li:last-child { text-align:right }

.requerido { border:#F00; }

img.tarjeta { max-width:80%; }

#icon-ean:after { background: url(../img/ean.png) 50% 50% no-repeat; background-size: 20px 20px; }

div.negro { background:#333; }
div.blanco { background:#FFF; }
div.centro { margin:0 auto 0 auto; text-align:center }

div.tarjeta  { 

}

.recicla { padding:10px 15px 10px 100px; background:url(../img/papel-cero.png) 15px no-repeat #fff}

div.tickets { margin-top: 10px; }
div.gastado p, div.recibido p { font-size:20px; margin-bottom:0px }
div.gastado, div.recibido, div.usuarios { margin-bottom:0px; padding:0px; }
div.gastado div, div.recibido div, div.usuarios div { text-align:right; color:#000; margin-bottom:0px; height:65px }

div.gastado div { background:url(../img/monedas.png) 10px no-repeat; }
div.recibido div { background:url(../img/recibido.png) 10px no-repeat; }
div.usuarios div { background:url(../img/usuarios.png) 10px no-repeat; }
div.tickets div { background:url(../img/tickets.png) 10px no-repeat; text-align:center; color:#000}
div.tickets div a { width:50%; margin-left:25%}
div.gplay { display:none; }
div.gplay div div { margin:10px }
div.gplay div a { text-align:center; width:100%; display:block }

.estadisticas .tickets div {text-align:right; }
.estadisticas ul span { float:right; border:1px solid #ccc; min-width:60px; padding:2px; text-align:right; border-radius:3px; background:#eee }