@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
@import url('fontello.css');
@import url('style_merida.css');

* {
	margin:0;
	padding:0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.container_imagen {
  position: relative;
  width: 50%;
}
.container_grafica {
  position: relative;
  width: 98%;
}
.container_foto {
  position: relative;
  width: 50%;
}
.container_grafica_azul {
  position: relative;
  width: 100%;
}

.textimg {
  white-space: nowrap; 
  color: white;
  font-size: 37px;
  position: absolute;
  overflow: hidden;
  top: 50%;
  left: 60%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}

.textimg_por {
  white-space: nowrap; 
  color: white;
  font-size: 12px;
  font-style: italic;
  position: absolute;
  overflow: hidden;
  top: 90%;
  left: 60%;
}

.imageco {
  display: block;
  width: 100%;
  height: auto;
}

.imageco_azul {
  display: block;
  width: 100%;
  height: auto;
}

.text_grafica {
    white-space: nowrap;
    color: white;
    font-size: 18px;
	font-style: italic;
    position: absolute;
    overflow: hidden;
    top: 22%;
    left: 5%;
}
.text_por_verificar {
    white-space: nowrap;
    color: white;
    font-size: 18px;
	font-style: italic;
    position: absolute;
    overflow: hidden;
    top: 22%;
    left: 55%;
}

.text_por_grafica {
  white-space: nowrap; 
  color: black;
  font-size: 20px;
  font-style: italic;
  position: absolute; 
  overflow: hidden;
  align-items: center;
  justify-content: center;
  top: 16%;
  left: 79%;
}
.text_mayorimporte_grafica {
  white-space: nowrap; 
  color: white;
  font-size: 12px;
  position: absolute;
  overflow: hidden;
  top: 70%;
  left: 59%;
}
.text_mayorid_grafica {
  white-space: nowrap; 
  color: white;
  font-size: 12px;
  position: absolute;
  overflow: hidden;
  top: 53%;
  left: 29%;
}

 
.text_solicitudes_azul {
    white-space: nowrap;
    color: white;
    font-size: 24px;
	font-style: italic;
	font-weight: bold;
    position: absolute;
    overflow: hidden;
    top: 5%;
    left: 3%;
}
.text_totalrecparasol_azul {
    white-space: nowrap;
    color: white;
    font-size: 24px;
	font-style: italic;
	font-weight: bold;
    position: absolute;
    overflow: hidden;
    top: 15%;
    left: 3%;
}
.text_masalta_azul {
    white-space: nowrap;
    color: white;
    font-size: 18px;
	font-style: italic;
	font-weight: bold;
    position: absolute;
    overflow: hidden;
    top: 37%;
    left: 3%;
}
.text_mayorimporte_azul {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 48%;
	left: 3%;
}
.text_mayorid_azul {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 56%;
	left: 3%;
}
.text_mayorcliente_azul {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 64%;
	left: 3%;
}
.text_estatus_azul {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 72%;
	left: 3%;
}
.text_por_azul {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 80%;
	left: 3%;
}


.text_masalta_azul2 {
    white-space: nowrap;
    color: white;
    font-size: 18px;
	font-style: italic;
	font-weight: bold;
    position: absolute;
    overflow: hidden;
    top: 37%;
    left: 41%;
}
.text_mayorimporte_azul2 {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 48%;
	left: 41%;
}
.text_mayorid_azul2 {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 56%;
	left: 41%;
}
.text_mayorcliente_azul2 {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 64%;
	left: 41%;
}
.text_estatus_azul2 {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 72%;
	left: 41%;
}
.text_por_azul2 {
	white-space: nowrap; 
	color: white;
	font-size: 14px;
	font-style: italic;
	position: absolute;
	overflow: hidden;
	top: 80%;
	left: 41%;
}

body {
	/*background-image: url(../imagenes/fondo.png);*/
	font-family: 'Open Sans', sans-serif;
}

.menu_bar {
	display:none;
}
  
header {
	width:100%;
}
 
header nav {
	/*background:#3F3833;*/
	background:#000040;
	z-index:1000;
	max-width:100%;
	width:98%;
	margin:3px auto;
}


header nav ul {
	/*overflow:hidden;*/
	list-style:none;
}
 
header nav ul li {
	display:inline-block;
	position: relative;
}

header nav ul li:hover {
	background: #00006A;
}

header nav ul li a {
	color:#fff;
	padding:8px;
	display:block;
	text-decoration:none;
	font-size:14px;
}

header nav ul li a span {
	margin-right:7px;
}
 
header nav ul li:hover .children{
	display:block;
}

header nav ul li a:hover {
	color: yellow;
}

header nav ul li .children{
	display: none;
	background:#00006A;
	/*background:#DE7E39;*/
	position:absolute;
	width: 150%;
	z-index:1000;
}
header nav ul li .children li{
	display:block;
	overflow:hidden;
	border-bottom: 1px; 
	solid rgba(255,255,255,.5);
}

header nav ul li .children li a{
	display:block;
}

header nav ul li .children li a span{
 	float: right;
	position:relative;
	top:3px;
	margin-right:0;
	margin-left:7px;
}

header nav ul li .caret{
	position:relative;
	top:1px;
	margin-left:7px;
	margin-right:0px;
}

.redondeado {
   border-radius: 3px;
   border: 1px solid #39c;
   height:25px;
   margin:2px;
 }
 
.contenedor{
	width:98%;
	margin:auto;
	text-align:center;
	padding-top:150px;
}
 


.auto{
   text-transform:uppercase;
   border-radius: 3px;
   border: 1px solid #39c;
   width: 500px;
   padding: 5px;
}

.Button {
	-moz-box-shadow:inset 0px 1px 0px 0px #F4F4F4;
	-webkit-box-shadow:inset 0px 1px 0px 0px #F4F4F4;
	box-shadow:inset 0px 1px 0px 0px #F4F4F4;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #F4F4F4), color-stop(1, #F4F4F4));
	background:-moz-linear-gradient(top, #F4F4F4 5%, #F4F4F4 100%);
	background:-webkit-linear-gradient(top, #F4F4F4 5%, #00477a 100%);
	background:-o-linear-gradient(top, #F4F4F4 5%, #F4F4F4 100%);
	background:-ms-linear-gradient(top, #F4F4F4 5%, #F4F4F4 100%);
	background:linear-gradient(to bottom, #F4F4F4 5%, #F4F4F4 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#F4F4F4', endColorstr='#F4F4F4',GradientType=0);
	background-color:#F4F4F4;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	border:1px solid #CDCDCD;
	display:inline-block;
	cursor:pointer;
	color:#887575;
	font-family:Calibri;
	font-size:16px;
	padding:4px 3px;
	text-decoration:none;
	text-shadow:3px 2px 2px #F4F4F4;
}
.Button:hover {
	-moz-box-shadow:inset 0px 1px 0px 0px #CDCDCD;
	-webkit-box-shadow:inset 0px 1px 0px 0px #CDCDCD;
	box-shadow:inset 0px 1px 0px 0px #CDCDCD;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #CDCDCD), color-stop(1, #CDCDCD));
	background:-moz-linear-gradient(top, #CDCDCD 5%, #CDCDCD 100%);
	background:-webkit-linear-gradient(top, #CDCDCD 5%, #00477a 100%);
	background:-o-linear-gradient(top, #CDCDCD 5%, #CDCDCD 100%);
	background:-ms-linear-gradient(top, #CDCDCD 5%, #CDCDCD 100%);
	background:linear-gradient(to bottom, #CDCDCD 5%, #CDCDCD 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#CDCDCD', endColorstr='#CDCDCD',GradientType=0);
	background-color:#CDCDCD;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	border:1px solid #CDCDCD;
	display:inline-block;
	cursor:pointer;
	color:#FFF;
	font-family:Calibri;
	font-size:16px;
	padding:4px 3px;
	text-decoration:none;
	text-shadow:3px 2px 2px #CDCDCD;
}



@media screen and (max-width:1024px ) {
	body{
		padding-top:80px;
	}
	
	.menu_bar {
		display:block;
		width:100%;
		position:fixed;
		top:0;
		/*background:#3F3833;*/
		background:#000040;
	}
	
	.menu_bar .bt-menu{
		display:block;
		padding:20px;
		color:#FFFFFF;
		/*color:#FF0000;*/
		overflow:hidden;
		font-size:23px;
		font-weight:bold;
		text-decoration:none;
	}
	
	.menu_bar span {
		float:right;
		font-size:40px;
	}
	
	header nav {
		width:80%;
		height: calc(100% - 80px);
		position:fixed;
		right:100%;
		margin:0;
		overflow:scroll;
	}
	
	header nav ul li{
		display: block;
		border-bottom:1px solid rgba(255,255,255,.5);		
	}
	
	header nav ul li a{
		display: block;
	}
	
	header nav ul li:hover .children{
		display:none;
	}
	
	header nav ul li .children{
		width: 100%;
		position:relative;
	}
 
 	header nav ul li .children li a{
		margin-left:20px;
	} 
	
	header nav ul li .caret{
		float:right;
	}
	
	.contenedor{
		width:98%;
		margin:auto;
		text-align:center;
		padding-top:100px;
	}
	.auto{
	   width: 270px;
	   padding: 5px;
	}
}