@charset "utf-8";
/* CSS Document */

h1 {
	text-align: left;
	display: block;
	font-size: 2em;
	margin-top: 0.67em;
	margin-bottom: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	color: #00509f;
	font-family: 'Courier New', Courier, monospace;
}

h2 {
	text-align: left;
	display: block;
	font-size: 1.2em;
	font-weight: bold;
	color: #000;
	font-family: 'Courier New', Courier, monospace;
}
	
h3 {
	text-align: left;
	font-size: 1em;
	font-weight: bold;
	color: #26aa60;
	font-family: 'Courier New', Courier, monospace;
}

h4 {
	text-align: left;
	display: block;
	font-size: 1em;
	font-weight: bold;
	color: #000;
	font-family: 'Courier New', Courier, monospace;
}

i {
	display: block;
	font-style: italic;
	font-family: verdana,arial,helvética, sans-serif;
	text-align: right;
}

b {
	font-family: verdana,arial,helvética, sans-serif;
}

p {
	font-size: 18px;
	text-align: left;
	font-family: verdana,arial,helvética, sans-serif;
}
	
body {
	padding: 0;
	margin: 0;
	font-family: verdana,arial,helvética, sans-serif;
}

	

a {
	text-decoration: none	
}

p > img {
	max-width:100%;
	width:auto;
	height:auto;
}
	
imagen > img{
	width:300px;
	text-align: left;
}

header {
		display: block;
		margin: 4px;
		padding: 5px;
		min-height: 100px;
		text-align: center;
		}

header > img {
	width:223px;
	height:147px;
}
	
footer {
		max-width: 960px;
		margin: 0 auto;
		display: block;
		min-height: 30px;
		border-top: 0.5em solid #46c2e5;
		font-size:1em;
		color:#000;
		padding-top: 10px;
		padding-right: 0;
		padding-bottom: 10px;
		padding-left: 0;
		text-align: center;
		font-style: normal;
		}

#main 	{
		min-height: 400px;
		max-width: 960px;
		padding: 0px;
		margin: 0 auto;
		display: -webkit-flex;
		display:         flex;
		-webkit-flex-flow: row;
		flex-flow: row;
		}

#main > article {
text-align: center;
margin: 4px;
padding: 5px;
justify-content:center;
align-items: center;
-webkit-flex: 3 1 60%;
        flex: 3 1 60%;
-webkit-order: 2;
        order: 2;
}
	
#contenedor .bloque{
    display: inline-block;  /* Es esencial para que se muestren los bloques en línea */
    width:300px;
    margin:4px 4px 14px ;
	text-align: center;
}

#contenedor .bloque > img{
	border: 1px solid #8888bb;
	border-radius: 7pt; 
}

#contenedor .bloque > a img{
	border: 1px solid #8888bb;
	border-radius: 7pt; 
}
	
#menu
{
background-color:#231f20;
top:0;
margin-bottom: 0px;
color:#ffffff;
height: 40px;
border-bottom: 1px solid #OOO;/* borde inferior de la barra*/
width:100%;
position:fixed; 
z-index:101; 
}
	
#menu ul,#menu li
{
margin:0 auto;
padding:0 0;
list-style:none;
}

#menu ul
{
height:45px;
width:100%; /* ancho del menú, ajustar para centrarlo*/
}
	
#menu li
{
float:left;
display:inline;
position:relative;
font: 14px tahoma, sans-serif;/*tamaño y fuente del texto */
}
	
#menu a
{
display: block;
line-height: 40px;
padding: 0 14px;
text-decoration: uppercase;
color: #FFF;/*color del texto*/
text-transform: uppercase;/*letras mayúsculas*/
letter-spacing: 1.5px;/*espacio entre letras*/
}

#menu li a:hover
{
color: #000;/*color del texto al pasar el ratón*/
text-decoration: none;
-webkit-transition: all .1s ease-in-out;
-moz-transition: all .1s ease-in-out;
-ms-transition: all .1s ease-in-out;
-o-transition: all .1s ease-in-out;
transition: all .1s ease-in-out;
background: #E9E9E9;/*color del fondo de la categoria al pasar el ratón*/
}

#menu input
{
display:none;
margin:0 0;
padding:0 0;
width:200px;
height:30px;
opacity:0;
cursor:pointer
}

#menu label
{
font: 25px  Arial, sans-serif ;
font-weight: bold;
display:none;
width:35px;
height:35px;
line-height:43px;
text-align:center;
}

#menu label span
{
width:150px;
font: 14px  Arial, sans-serif; /*tamaño y fuente del texto "menu" */
position:absolute;
left:35px;
font-weight: bold;
line-height: 40px;
letter-spacing:0.5px;
}

#menu ul.menus
{
height: auto;
overflow: hidden;
width: 170px;
background: #F1F1F1;/*color del fondo del submenu*/
position: absolute;
z-index: 99;
display: none;
border: 1px solid #E9E9E9;
}

#menu ul.menus li
{
display: block;
width: 100%;
font: 14px  Arial, sans-serif;/*tamaño y fuente del  texto del submenu*/
text-transform: uppercase;
border-bottom: 1px solid #E9E9E9;
}

#menu ul.menus li:last-child
{
border-bottom:none;
}

#menu ul.menus a
{
color: #333;/*color del  texto del submenu*/
line-height: 35px;
}

#menu li:hover ul.menus
{
display:block
}

#menu ul.menus a:hover
{
background: #E9E9E9;/*color del  fondo del submenu al pasar el ratón*/
color: #000;/*color del  texto del submenu al pasar el ratón*/
-webkit-transition: all .1s ease-in-out;
-moz-transition: all .1s ease-in-out;
-ms-transition: all .1s ease-in-out;
-o-transition: all .1s ease-in-out;
transition: all .1s ease-in-out;
}


#main > aside {
	margin-top: 0px;
   padding-left: 10px;
	   padding-right: 10px;
   border: 2px solid #C0C0C0;
border-radius: 7pt;
   -webkit-flex: 1 6 20%;
           flex: 1 6 20%;
   -webkit-order: 3;
           order: 3;
 height: 100%;
   }

#main > aside > titulo1
{	text-align: left;
	display: block;
	font-size: 1.7em;
	margin-top: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	text-transform: uppercase;/*letras mayúsculas*/
	color: #FFF;
	background: #2A6EBB;
}

#main > aside > titulo
{	text-align: left;
	display: block;
	font-size: 1.3em;
	margin-top: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	text-transform: uppercase;/*letras mayúsculas*/
	border-bottom: 1px solid #4D6CAC;
}
#main > aside > a titulo 
{	text-align: left;
	display: block;
	font-size: 1.3em;
	margin-top: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	text-transform: uppercase;/*letras mayúsculas*/
	border-bottom: 1px solid #4D6CAC;
}

#main > aside > subtitulo
{	text-align: left;
	display: block;
	font-size: 1em;
	margin-top: 0.67em;
	margin-bottom: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	color: #000;
	font-family: 'Courier New', Courier, monospace;
}

#main > aside > a subtitulo 
{	text-align: left;
	display: block;
	font-size: 1em;
	margin-top: 0.67em;
	margin-bottom: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	color: #000;
	font-family: 'Courier New', Courier, monospace;
}

#main > aside > a:hover subtitulo 
{	
	color: #2A6EBB;
}



#main > article > titulo1
{	text-align: left;
	display: block;
	font-size: 1.7em;
	margin-top: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	text-transform: uppercase;/*letras mayúsculas*/
	color: #FFF;
	background: #2A6EBB;
}

#main > article > titulo
{	text-align: left;
	display: block;
	font-size: 1.3em;
	margin-top: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	text-transform: uppercase;/*letras mayúsculas*/
	border-bottom: 1px solid #4D6CAC;
}
#main > article > a titulo 
{	text-align: left;
	display: block;
	font-size: 1.3em;
	margin-top: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	text-transform: uppercase;/*letras mayúsculas*/
	border-bottom: 1px solid #4D6CAC;
}

#main > article > subtitulo
{	text-align: left;
	display: block;
	font-size: 1em;
	margin-top: 0.67em;
	margin-bottom: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	color: #000;
	font-family: 'Courier New', Courier, monospace;
}

#main > article > a subtitulo 
{	text-align: left;
	display: block;
	font-size: 1em;
	margin-top: 0.67em;
	margin-bottom: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;
	color: #000;
	font-family: 'Courier New', Courier, monospace;
}

#main > article > a:hover subtitulo 
{	
	color: #2A6EBB;
}

        #main > nav {
            margin: 4px;
            padding: 5px;



            -webkit-flex: 1 6 20%;
            flex: 1 6 20%;
            -webkit-order: 1;
            order: 1;
        }