/*
# Copyright (c) 2013-2022: Alexis Puente Montiel   < pica (a) picalibre.org >
# Licensed according to GNU AGPL version 3.0.
# It is libre/free software; you can use, redistribute and/or modify it according to the terms of GNU AGPL as published by GNU, version 3.0, 19 November 2007.
# It is distributed in the hope that it will be useful, but without any warranty. Read GNU AGPL version 3.0 for additional details.
# A copy of GNU AGPL version 3.0 is available on Internet as text at https://www.gnu.org/licenses/agpl-3.0.txt and as HTML at https://www.gnu.org/licenses/agpl-3.0-standalone.html ).
*/

/*
https://www.w3schools.com/cssref/css_selectors.asp
tag {}
#id {}		Identificador único
.class {}	Categoría repetible. Varias clases para una etiqueta: <tag class="class1 class2 ... classN">
tag#id.class.class2.class3 {}	Aditivo (poco usado)
tag #id .class {}		Anidado
#id tag.class, .class2 {}	Aplicar mismo CSS a varias combinaciones diferentes

https://www.w3schools.com/css/css_positioning.asp
position: static;
position: relative;
position: fixed;
position: absolute;
position: sticky;
*/

body {
	background: #a0aa6d;
}

body:before, body:after {
	content: "";
	position: fixed;
	left: 0;
	right: 0;
	background: #a0aa6d;
}
body:before {
	height: 16px;
	top: 0;
}
body:after {
	height: 12px;
	bottom: 0;
}

#container {
	width: 90%;
	margin: auto;
	background: #e9eccf;
	border-right: 15px solid #e9eccf;
/*	box-shadow: inset 0px 0px 0px 15px #e9eccf;	*/
}

#fixed_header {
	position: fixed;
	width: 90%;
}

#fixed_nav {
	position: fixed;
/*	height: calc(100% - 2rem);	*/
	height: calc(100% - 4rem);
	width: 15%;
}

#fixed_footer {
	position: fixed;
	width: 90%;
	bottom: 0;
}

header {
	height: 2.5rem;
	margin-left: 15%;
	background: #005214;
	color: #00ff00;
	padding: 10px;
	font-size: xx-large;
	text-align: right;
	overflow: auto;
}

header a {
	text-decoration: none;
	color: inherit;
}

footer {
	bottom: 0;
	left: 0;
	right: 0;
	border-top: 1px solid #a0aa6d;
	background: #e9eccf;
	padding: 5px;
	border-bottom: 1rem solid #e9eccf;
	height: 1.75rem;
	overflow: auto;
	font-size: small;
	text-align: center;
}

footer a {
	text-decoration: none;
	color: inherit;
}

nav {
	height: 100%;
	background: #ffe495;
/*	border-right: 1px solid #005214;	*/
}

nav #PicaLogo {
	height: 2.5rem;
	background: #005214;
	color: #00ff00;
	padding: 10px;
	font-size: xx-large;
	text-align: center;
/*	overflow: hidden;	*/
}

nav img {
	width: 100%;
}

nav a {
	text-decoration: none;
	color: inherit;
}

nav .menu, nav .submenu {
	list-style-type: none;
}
nav .menu {
	font-size: small;
	padding: 0px 10px 0px 10px;
	height: calc(85% - 13.5rem);
	overflow: auto;
}
nav .item {
	display: block;
	width: 100%;
}
nav .submenu {
	display: none;
	width: calc(100% - 1em);
	padding: 0.5em 0 0.5em 1em;
}
nav .menu li {
	padding: 0.5em 0em;
}
nav .icono-submenu::after {
	content: " ▼";
}
nav .active .item {
	display: block;
}
nav .submenu-active .submenu {
	display: block;
}

.toggle {
	display: none;
}

main {
	position: static;
	padding: 3.5rem 0rem 3rem calc(17% + 1rem);
}

#img-bg {
	text-align: center;
}

#img-bg img {
	height: 50%;
	width: 50%;
	max-height: 1654px;
	max-width: 1654px;
	text-align: center;
}

table {
	display: block; 
	overflow: auto;
}

td {
	padding: 0em 1em;
}

main .date {
	font-size: small;
	text-align: end;
	margin-bottom: 2rem;
}

main {
	text-align: justify;
}

/*
main code {
/*	font-family: "DejaVu Sans Mono", monospace;	*/
/*	padding: arriba derecha abajo izquierda;	*/
/*	padding: 2px 5px 2px 5px;
	font-weight: bold;
	color: #ffffff;
	background: #000000;
	overflow: auto;
}
*/

main kbd {
	padding: 0px 3px 0px 3px;
	background: #eeeeee;
	border: 3px solid;
	border-color: #bdbdbd #6e6e6e #6e6e6e #bdbdbd;
	overflow: auto;
}

main pre {
	padding: 10px;
	background: #fffabf;
	border: 2px solid #b1b1b1;
	overflow: auto;
}

main code {
	padding: 1px 5px 1px 5px;
	background: #fffabf;
	border: 1px solid #b1b1b1;
	overflow: auto;
	font-weight: bold;
}

main samp {
	padding: 1px 5px 1px 5px;
	background: #fffabf;
	border: 1px solid #b1b1b1;
	overflow: auto;
	font-style: italic;
}

main button {
	font-size: small;
}

img {
	height: auto;
}

main .gr {
	display: block;
	width: 99%;
	padding: 0px 0px 0px 0px;
	overflow: auto;
}

main .med {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 50%;
/*	text-align: center;	*/
	overflow: auto;
}

main .peq {
	padding: 10px 10px 10px 10px;
	width: 46%;
/*	text-align: center;	*/
	overflow: auto;
}

/* CSS3, "media queries" desde mediados de 2009 */
/* https://www.w3.org/TR/mediaqueries-3/#units */
/* https://www.w3.org/TR/mediaqueries/#resolution */
/* @media only screen and (min-resolution: 64dpcm) { */
@media only screen and (orientation: portrait) {

main {
	padding: 0px 0px 3rem 15px;
}

header {
	margin-left: calc(4rem - 5px);
	font-size: 4vw;
}

#fixed_nav {
	position: static;
	width: calc(100% + 15px);
}

nav {
	padding: 0px;
	background: transparent;
}

nav #PicaLogo {
	display: none;
}

nav img {
	width: calc(4rem - 5px);
	position: fixed;
/*	z-index: -1;	*/
}

nav .menu {
	font-size: medium;
	height: 100%;
}
nav .item {
	display: none;
	background: #ffe495;
}
nav .item::before {
	content: "\00a0\00a0";
	white-space: pre;
}
nav .submenu {
	width: calc(90% - 1em);
}
nav form {
	padding: 0 0 1rem 1rem;
}

.toggle {
	display: block;
	position: relative;
	font-size: xx-large;
}
/*
.toggle {
	display: inline-block;
	padding: 0px 10px;
	border-radius: 3rem;
	background-color: #ffe495;
}
*/

.toggle .active {
	display: none;
}

}