 html {
	font-family: Arial;
    width: 100%;
    height: 100%;
}

body {
    width: 100%;
	height: 100%;
	overflow: hidden;
	margin: 0;
}

.cabecera{
	width: 100%;
	height: 80px;
	background-color: #0D1E50;
}

#login_logo{
	padding-bottom: 2em;
}

#login_texto{
	padding-bottom: 2em;
	color: #0D1E50;
}

.pie{
	display: grid;
	grid-template-columns: 30% 2fr 2fr 30%;
	grid-template-rows: 1fr;
	width:800px;
	background-color: #FFFFFF;
	text-align: center;
	height: 80px;
	font-size: 10px;
	color: #0D1E50;
}

#DropZOne {
	border: 2px dashed #6f6969;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border-radius: 5px;
   padding: 25px;
   text-align: left;
   font: 20pt bold 'Vollkorn';
   color: #7e7b7b;
   font-size: 12px;
   height: 25px;

}

#visualizadorContenido{
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;

	align-items: center;
	justify-items: center;

	border-radius: 15px;
	background-color: white;

	width: 95%; 
	height: 95%;
}

#visualizador{
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;

	align-items: center;
	justify-items: center;

	border-radius: 15px;
	background-color: white;

	width: 95%; 
	height: 95%;
}

#visualizadorContenedor{
	display: none;
	grid-template-columns: 1fr;
	grid-template-rows: auto;
	align-items: center;
	justify-items: center;

	width: 99%;
	height: 98%;
	position: absolute;
	opacity: 0.90;
	z-index: 1002;
}


.contenedor{
	display: grid;
	grid-auto-columns: 1fr;
	grid-template-rows: auto 1fr auto;
	justify-items: center;

	width: 100%;
	height: 100%;
	background-color: #FFFFFF;
}


.columnas-3{
	display: grid;
    grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: 1fr;

	overflow: auto;
}

.columnas-2{
	display: grid;
    grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr;

	overflow: auto;
}

.columna{
	display: grid;
	justify-items: center;

	overflow: auto;

	width: 100%;
	height: 100%;
}

.bloque{
	width: 95%;
}

.menu{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 40px 10px auto;

	grid-template-areas:
		"cabecera"
		"separador"
		"contenido";

	width: 98%;
	margin-bottom: 2em;
}

.menu-cabecera{
	grid-area: cabecera;

	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto;

	align-items: center;

	width: 100%;
	color: green;
	text-align: left;
}

.separador{
	grid-area: separador;

	display: grid;
	align-items: center;

	width: 100%;
	height: 1px;
	background-color: #2856DF;
}

.menu-contenido{
	/*
	grid-area: contenido;

	display: grid;
	width: 100%;

	margin-bottom: 10px;
	padding-bottom: 2em;
	align-content: center;
	text-align: left;
	*/
}

.menu-contenido-justificado{
	grid-area: contenido;
	width: 100%;

	display: grid;
	justify-items: right;

	padding-bottom: 2em;
}

#popUpContenido{
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;

	align-items: center;
	justify-items: center;

	margin: 2em;
}

#popUp{
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	align-items: center;
	justify-items: center;

	border-radius: 15px;
	background-color: white;
}

#popUpContenedor{
	display: none;
	grid-template-columns: auto;
	grid-template-rows: auto;
	align-items: center;
	justify-items: center;

	width: 99%;
	height: 98%;
	position: absolute;
	opacity: 0.90;
	z-index: 1002;
}

#manto{
	display: none;
	grid-template-columns: auto;
	grid-template-rows: auto;
	align-items: center;
	justify-items: center;

	background-color: black;
	width: 99%;
	height: 98%;
	position: absolute;
	opacity: 0.90;
	z-index: 1001;
}

.botonera{
	display: grid;
	grid-template-columns: auto auto;
	grid-template-rows: auto;
	justify-items: center;
	align-items: center;
	/*width: 200px;*/
}

.boton-azul{
	justify-items: center;
	display: grid;
	align-items: center;

	color:white;
	width: 120px;
	height: 55px;
	background-color: #0D1E50;
	font-size: 18px;
}

.boton-gris{
	justify-items: center;
	display: grid;
	align-items: center;

	color:white;
	width: 200px;
	height: 55px;
	background-color: #626366;
	font-size: 18px;
}

.boton-rojo{
	justify-items: center;
	display: grid;
	align-items: center;

	color:white;
	width: 120px;
	height: 55px;
	background-color: #FA5858;
	font-size: 18px;
}

.boton-gris{
	justify-items: center;
	display: grid;
	align-items: center;

	color:white;
	width: 120px;
	height: 55px;
	background-color: #A1A1A1;
	font-size: 18px;
}

.boton-verde{
	justify-items: center;
	display: grid;
	align-items: center;

	color:white;
	width: 120px;
	height: 55px;
	background-color: rgb(113,186,102);
	font-size: 18px;
}

#main-container{
  margin: auto 20px;
  /*max-width: 900px;*/
  height: 100%;
  /*overflow: hidden;*/
}

.block-2columnas{
  /*background-color: steelblue;*/
  width: 64%;
  /*height: 150px;*/
  float: left;
  margin: .1%;
  box-sizing: border-box;
}

.block-l-2columnas{
  /*background-color: steelblue;*/
  width: 35%;
  /*height: 150px;*/
  float: left;
  margin: .1%;
  box-sizing: border-box;
} 

.block{
  /*background-color: steelblue;*/
  width: 59.33%;
  /*height: 150px;*/
  float: left;
  margin: .1%;
  box-sizing: border-box;
}

.block-l{
  /*background-color: steelblue;*/
  width: 20%;
  /*height: 150px;*/
  float: left;
  margin: .1%;
  box-sizing: border-box;
}
  
@media screen and (max-width:1365px){
  .block{
    /*background-color: blue;*/
    width: 69%;
  	}

  	.block-l{
    /*background-color: blue;*/
    width: 30%;
  	}


    .block-l:last-child{
      width: 69%;
      /*background-color: darkgreen;*/
      clear: both;
      float:right;
  	}
  }
  @media screen and (max-width:320px){
    .block{
      width: 98%
    }
    .block-l{
      width: 98%
    }
  }

.titulo_tabla{
	color: gray;
	font-size: 12;
}

.titulo_1{
	font-size: 18pt;
	color: #0f0f79;
}

.titulo_2{
	font-size: 16pt;
	color: #0f0f79;
}

.titulo_3{
	font-size: 14pt;
	color: #0f0f79;
}

.titulo_4{
	font-size: 12pt;
	color: #0f0f79;
}

.titulo_5{
	font-size: 10pt;
	color: #0f0f79;
}

.breadcrump{
	color: #7F888E; 
	text-decoration: none; 
}

.separador_tabla{
	grid-area: separador;

	display: grid;
	align-items: center;

	width: 100%;
	height: 1px;
	background-color: green;
}

.menu-cabecera_100{
	grid-area: cabecera;

	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto;

	align-items: center;

	width: 100%;
	color: #536253;
	text-align: left;
}
