@charset "utf-8";

@font-face {
  font-family: 'Fontice-IconsFont';
  src:  url('../fonts/Fontice-IconsFont.eot?3up95z');
  src:  url('../fonts/Fontice-IconsFont.eot?3up95z#iefix') format('embedded-opentype'),
    url('../fonts/Fontice-IconsFont.ttf?3up95z') format('truetype'),
    url('../fonts/Fontice-IconsFont.woff?3up95z') format('woff'),
    url('../fonts/Fontice-IconsFont.svg?3up95z#Fontice-IconsFont') format('svg');
  font-weight: normal;
  font-style: normal;
}

body {
/*
	display: flex;
	flex-direction: column;
*/
	max-width: inherit;
	min-height: 100vh;
	margin: 0;
	padding: 0;
}

header, footer {
	text-align: center;
	padding: 0.5ex 0;
	display: none;
}

main {
	display: flex;
	flex-flow: row wrap;
	margin: 0;
	padding: 0;
}

main > * {
	flex: 1 100%;
}

header#top {
	display: block;
}

header nav {
	display: inline-block;
}

header form {
	display: inline-block;
}

header nav ul {
	display: flex;
	font-size: 10pt;
	list-style: none;
	margin: 0;
	padding: 0 6px;
}

header nav ul li {
	 margin: 12px 0px;
}

header nav ul li + li:before {
	content: "\00a0\00a0|\00a0\00a0"
}

@media all and (min-width: 600px) {
  section { flex: 1 auto; }
}

@media all and (min-width: 800px) {
  section#left  { order: 1; }
  section#right { order: 2; }

  section#left, section#right {
    padding: 0;
  }
}

section#left {
	margin: 0 6px 0 12px;
}

section#right {
	margin: 0 12px 0 6px;
}

section div h2 {
	text-align: center;
	margin: 1.67ex 0 0.33ex 0;
}

section div table {
	width: 100%;
}

input, textarea, select, button {
	border: 1px solid black;
	border-radius: 4px;
	margin: 4px 0;
	padding: 6px;
}

input[type="submit"], input[type="reset"], button {
	cursor: pointer;
	display: inline;
	padding: 6pt 18pt;
	text-align: center;
}

input[type="submit"][disabled], input[type="reset"][disabled], button[disabled],
input[type="submit"][disabled]:hover, input[type="reset"][disabled]:hover, button[disabled]:hover {
	cursor: not-allowed
}

p.error {
	color: FireBrick;
	clear: both;
	display: none;
}

fieldset {
	background: white;
	border: 2px solid black;
	border-radius: 6px;
	padding: 8px 16px;
}

fieldset label {
	display: block;
}

fieldset label input {
	display: block;
	width: 96%;
}

fieldset button {
	display: block;
	width: 100%;
	margin: 16px auto 8px auto;
}

form#selector {
	width: 100%;
}

form#selector fieldset {
	border: none;
	background: none;
}

form#selector fieldset input,
form#selector fieldset label {
	display: inline;
}

form#selector input {
	width: 150px;
}

form.login fieldset {
	background: White;
	border: 2px solid black;
	border-radius: 6px;
	padding: 8px 16px;
}

@media(max-width : 450px) {
	fieldset { width: 320px; }
}

table {
	border: 0;
	border-collapse: separate;
	border-spacing: 0;
	box-sizing: border-box;
	text-align: left;
	vertical-align: baseline
}

tbody tr:first-child > td,
tbody tr:first-child > th {
	border-top: 2px solid #808080;
}

tbody tr:last-child > td,
tbody tr:last-child > th {
	border-bottom: 2px solid #808080;
}

tbody tr.foot td {
	font-weight: bold;
}

th, td {
	padding: 0 4px !important;
}

td.qty, td.id,
td.dt, tbody th.dt {
	white-space: nowrap;
}

td.ars, td.pos,
th.ars, th.pos {
	color: black;
}
td.usd, th.usd,
td.efv, th.efv {
	color: #090;
}
td.neg, th.neg {
	color: #900;
}

thead th, thead td,
tfoot th, tfoot td {
	font-weight: bold;
}

tbody th,
th.right, td.right {
	text-align: right;
}
th.qty, td.qty, td.id {
	text-align: right !important;
}

td.center, th.center,
thead th, thead td,
tfoot th, tfoot td {
	text-align: center;
}

td.left, th.left {
	text-align: left;
}

td.border-left, th.border-left {
	border-left: 2.16px solid #ccc;
}

td.border-right, th.border-right {
	border-right: 2.16px solid #ccc;
}

th[rowspan]:not([rowspan="1"]) {
	vertical-align: bottom;
}

thead th.sort_up:before { content: "▲"; }
thead th.sort_down:before { content: "▼"; }
thead th:hover { cursor: default; }
thead th[data-sort]:hover { cursor: pointer; }

.modal {
	z-index: 100;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background-color: rgb(0, 0, 0);
	background-color: rgba(0, 0, 0, 0.7);
	display: none;
}

.modal form.login {
	width: 400px;
	margin: 120px auto 0 auto;
}

.modal form.login fieldset label {
	display: block;
}

.modal form.login fieldset label > input {
	display: block;
	width: 96%;
	margin-right: 0;
}

.modal form.login fieldset button {
	display: block;
	width: 100%;
	margin: 16px auto 8px auto;
}

div.alert {
	display: none;
	background-color: White;
	width: 480px;
	margin: 120px auto 0 auto;
	border: 1px solid DarkBlue;
	border-radius: 4px;
	padding: 4px 4px;
}

div.alert div.alert-title {
	float: left;
	width: 456px;
	height: 24px;
	color: White;
	background-color: DarkBlue;
}

@media(max-width : 450px) {
	div.alert { max-width: 320px; }
	div.alert div.alert-title { max-width: 296px; }
}

.modal div.alert div.alert-close {
	float: right;
	width: 22px;
	height: 22px;
	font-size: 14px;
	text-align: center;
	border: 1px solid DarkBlue;
}

.modal div.alert div.alert-close:hover { cursor: pointer; }

.modal div.alert div.alert-title:before {
	content: "\e9fe";
	font-family: "Fontice-IconsFont" !important;
	font-size: 16px;
	padding: 0 6px 0 3px;
}

.modal div.alert div.alert-title:after {
	vertical-align: top;
	content: "Info";
}

.modal div.alert div.alert-pane {
	clear: both;
	min-height: 180px;
	font-size: 10pt;
}

.modal div.alert.error,
.modal div.alert.error div.alert-close {
	border-color: FireBrick;
}

.modal div.alert.error div.alert-title {
	background-color: FireBrick;
}

.modal div.alert.error div.alert-title:before {
	content: "\e9ad";
}

.modal div.alert.error div.alert-title:after {
	content: "Error";
}

.modal div.alert.warn,
.modal div.alert.warn div.alert-close {
	border-color: Goldenrod;
}

.modal div.alert.warn div.alert-title {
	background-color: Goldenrod;
}

.modal div.alert.warn div.alert-title:before {
	content: "\e9ae";
}

.modal div.alert.warn div.alert-title:after {
	content: "Atención";
}

.modal div.spinner {
	display: none;
	width: 100%;
	height: 100%;
	background-image: url('../img/spinner.gif');
	background-position: center;
	background-repeat: no-repeat;
}
