/* RESET */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }body {line-height: 1; }ol, ul {list-style: none; }blockquote, q {quotes: none; }blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none; }:focus {outline: 0; }ins {text-decoration: none; }del {text-decoration: line-through; }table {border-collapse: collapse; border-spacing: 0; } * {padding: 0; margin: 0; border: 0; }

* {
	margin: 0;
	padding: 0;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, 
pre, form, fieldset, input, textarea, p, blockquote, th, td { 
	padding:0;
	margin:0; }

fieldset, img { border:0 }

ol, ul, li { list-style:none }

:focus { outline:none }

:root {
	--amarillo: #F5DA81;
	--naranja: #ff9e15;
	--naranja2: #FF8000;
	--rojo: #e94e3c;
	--azul: #142a4a;
	--negro: #111;
	--gris: #dedede;
	--blanco: #fff;
	--cielo: #01A9DB;
	--verde: #298A08;
	--morado: #3e1151;
	--rosa: #CC2EFA;
	--alternate: #FEE9FB;
	--hover: #FEB1F1;
	--lila: #BCA9F5;
	--fiuxa: #8904B1;
}

html{
	background: #fff;
}

body,
input,
textarea,
select {
	font-family: 'Open Sans', sans-serif;
}

.izqueirda, .left { float:left; }
.derecha, .right { float:right; }
.centro, .center { text-align: center; }
.clear { clear: both; }
.inline { display: inline-block; }
.ocultar { display: none; }
.ocultar a { color: var(--blanco); }

header {
	display:none;
	}

h1 {
	display:none;
	}

h2 {
	text-align: center;
	}

.content {
	width: 960px;
	margin: 20px auto 20px;
}

form {
	margin-bottom: 20px;
}

input[type=file] {
	padding: 10px;
	margin-bottom: 20px;
	display: block;
	border: none;
	border-radius: 6px;
	outline: none;
	color: var(--blanco);
	background: var(--naranja);
}

button {
	display: inline-block;
	position: relative;
	padding: 10px 30px;
	margin-bottom: 10px;
	color: #ffffff;
	border-radius: 6px;
	-webkit-transition: 0.3s;
	transition: 0.3s;
	background-color: var(--cielo);
	z-index: 1;
	-webkit-box-shadow: 0 2px 0 0 rgba(189, 189, 189, 0.5), 0 4px 0 0 rgba(189, 189, 189, 0.5);
	box-shadow: 0 2px 0 0 rgba(189, 189, 189, 0.5), 0 4px 0 0 rgba(189, 189, 189, 0.5);
	-webkit-transform: translateY(0);
	transform: translateY(0);
	border: none;
	text-transform: uppercase;
}
	button:hover { 
		top: 3px;
		background-color: var(--morado);
		background-image: -webkit-gradient(linear,left top,left bottom,color-stop(10%,var(--morado)),to(var(--morado)));
		background-image: linear-gradient(var(--morado) 10%,var(--morado) 100%);
		-webkit-box-shadow: none; 
		-moz-box-shadow: none; 
		box-shadow: none;
	}

.tabla {
	display: grid;
	grid-template-columns: repeat(4, 1fr); /*repeat(auto-fill, minmax(130px, 1fr)); /*repeat(4, 1fr); */
	grid-auto-rows: 170px; /*minmax(200px, auto);*/
	grid-gap: 20px;
}

.tabla-item {
	position: relative;
	border: 3px solid var(--rosa);
	border-radius: 10px;
	padding: 10px;
}

.logo {
	display: block;
}

.nombre {
	display: inline-block;
	font-size: 12px;
	line-height: 15px;
	float: left;
	width: 95px;
	height: 95px;
	overflow: hidden;
	margin-bottom: 5px;
}

.costos {
	display: inline-block;
	float: right;
}

.nota { font-size: 10px; }

.grande {
	font-size: 40px;
	font-weight: bold;
	margin-bottom: 10px;
}
.grande sup {
	font-size: 20px;
	vertical-align: top;
}

.chico {
	font-size: 26px;
	font-weight: bold;
}
.chico sup {
	font-size: 14px;
	vertical-align: top;
}

.codigo {
	width: 100%;
	height: 46px;
	overflow: hidden;
	text-align: center;
}