<!DOCTYPE html>
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
	<title>IM Administraci&oacute;n SAS v2.1</title>	
<!--	<link href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" rel="stylesheet" />-->
	<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
	<link href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" rel="stylesheet" />
	<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
	<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
    <script src="recursos/modernizr/modernizr-custom.js"></script>    	
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBO-jel9u_DaIqJ87vZXho1QjA2JSMrjHM&"></script>
	<script src="index.js?102"></script>
	<script src="js/paginas/pagina_log.js?4883"></script>
	<script src="js/paginas/pagina_menu.js?4883"></script>
	<script src="js/paginas/pagina_menu_geo.js?28483"></script>
	<script src="js/paginas/pagina_esta.js?4883"></script>
	<script src="js/paginas/pagina_utiles.js?8483"></script>
	<script src="js/paginas/pagina_geo.js?84283"></script>
	<script src="js/paginas/pagina_geo_movil.js?221"></script>
	<script src="js/mapa/mapa.js?8422383"></script>	
	<script src="recursos/utm2ll.js"></script>

<style type="text/css">
html, body, h1, h2, h3, h4, h5, h6 {
  font-family: "Montserrat", sans-serif;
.w3-comic {
  font-family: "Comic Sans MS", sans-serif;
}
.w3-tahoma {
  font-family: "Tahoma, Geneva", sans-serif;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 30px white inset;
}



</style>


<script>
function conmuto_menu() {
	var a = document.getElementById("datos_info");
	
    var x = document.getElementById("botones_menu_superior");
    var y = document.getElementById("map3");
    if (x.className.indexOf("w3-show") == -1) {
    	y.className = y.className.replace("w3-show", "w3-hide");
        x.className = x.className.replace("w3-hide", "w3-show");
    } else { 
        x.className = x.className.replace("w3-show", "w3-hide");
        y.className = y.className.replace("w3-hide", "w3-show");
    }
    a.className = a.className.replace("w3-show", "w3-hide");  

}
function oculto_menu() {
	var a = document.getElementById("datos_info");
	
    var x = document.getElementById("botones_menu_superior");
        var y = document.getElementById("map3");
        x.className = x.className.replace("w3-show", "w3-hide");
        y.className = y.className.replace("w3-hide", "w3-show");
        a.className = a.className.replace("w3-show", "w3-hide");  

}
function muestro_menu() {
    var x = document.getElementById("botones_menu_superior");
    var y = document.getElementById("map3");
    var a = document.getElementById("datos_info");

    a.className = a.className.replace("w3-show", "w3-hide");  

    	y.className = y.className.replace("w3-show", "w3-hide");
        x.className = x.className.replace("w3-hide", "w3-show");
}
function conmuto_datos() {
	var a = document.getElementById("botones_menu_superior");
        a.className = a.className.replace("w3-show", "w3-hide");
    var x = document.getElementById("datos_info");

            var y = document.getElementById("map3");
    if (x.className.indexOf("w3-show") == -1) {
    	y.className = y.className.replace("w3-show", "w3-hide");
        x.className = x.className.replace("w3-hide", "w3-show");

    } else { 
        x.className = x.className.replace("w3-show", "w3-hide");
        y.className = y.className.replace("w3-hide", "w3-show");

    }

}
function muestro_datos() {
		var a = document.getElementById("botones_menu_superior");
        a.className = a.className.replace("w3-show", "w3-hide");
    var x = document.getElementById("datos_info");
            var y = document.getElementById("map3");
  
    	y.className = y.className.replace("w3-show", "w3-hide");
        x.className = x.className.replace("w3-hide", "w3-show");
}
function oculto_datos() {
		var a = document.getElementById("botones_menu_superior");
        a.className = a.className.replace("w3-show", "w3-hide");
    var x = document.getElementById("datos_info");
            var y = document.getElementById("map3");
        x.className = x.className.replace("w3-show", "w3-hide");
        y.className = y.className.replace("w3-hide", "w3-show");
}

</script>

<style type="text/css">#map{position: absolute; top: 150px; right: 0; bottom: 0; left: 0;}</style>
<style type="text/css">#map2{position: absolute; top: 60px; right: 0; bottom: 0; left: 0;}</style>
<style type="text/css">#map3{position: absolute; top: 60px; right: 0; bottom: 60px; left: 0;}</style>
</head>
<Body>

















	










<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<div data-role="page" id="pagina_log">


<div class="w3-card-4 w3-white w3-margin">
<div class="w3-row w3-white">
  <div class="w3-quarter w3-panel w3-padding-8 w3-white w3-left" style="height:40px">
    <img src="logos/IM_logo_fondo_negro.jpg" style="width:40px">
  </div>
   <div class="w3-rest w3-panel w3-padding-8 w3-white w3-left" style="height:40px">
	<b><p class="w3-medium  w3-left-align w3-margin-left">IM Administraci&oacute;n SAS</p></b>
   </div>
</div>
</div>


<div class="w3-row w3-white w3-margin">
<div class="w3-card-4 w3-white w3-padding-16" style="max-width:450px">

<div class="w3-row w3-margin" style="max-width:400px">
	<div class="w3-col-1"><i class="fa fa-user" style="font-size:18px"></i></div>
	<div class="w3-col-11 w3-margin-left"><input class="w3-input w3-border-bottom" type="text" id="pl_2" name="pl_2">
	<label>Usuario</label>
	</div>
</div>

<div class="w3-row w3-margin" style="max-width:400px">
	<div class="w3-col-1"><i class="fa fa-key" style="font-size:18px"></i></div>
	<div class="w3-col-11 w3-margin-left"><input class="w3-input" type="password" id="pl_3" name="pl_3" >
	<label>Clave</label>
	</div>
</div>
<div class="w3-row w3-padding-24" style="max-width:400px">
<button  id="pl_4" name="pl_4" class="w3-button w3-white w3-padding-16 w3-border w3-right w3-margin-right w3-hover-khaki" style="width:140px">
  <div class="w3-rest w3-right w3-large">
  	Ingresar
  </div>
  <div class="w3-quarter w3-right" >
  <i class="fa fa-share-square-o" style="font-size:16px"></i>
  </div>
  </button>
</div>

	
	
	
</div>	
</div>


<div data-role="popup" id="pop1" style="width:300px">
<div data-role="header">
  <div class="w3-quarter w3-panel w3-padding-8 w3-left" style="height:30px">
    <img src="logos/IM_logo_fondo_negro.jpg" style="width:30px">
  </div>
<h2>Mensaje</h2>
</div>
<div class="ui-content" data-role="main">
<div>
<h5 class ="w3-center"></h5>
</div>
</div>
</div>


</div>
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->
<!--Pagina principal de ingreso -->


	<!--Pagina menu -->
	<!--Pagina menu -->
	<!--Pagina menu -->
	<!--Pagina menu -->
	<!--Pagina menu -->
	<!--Pagina menu -->
	<div data-role="page" id="pagina_menu">
		
		<div class="w3-row w3-black">
			<div class="w3-col w3-container w3-padding-8 w3-black w3-right" style="height:60px">
				<img src="logos/IM_logo_fondo_negro.jpg" style="width:40px">
			</div>

		</div>

		<div class="ui-content" role="main">
			<fieldset>
				<div class="w3-row">
					<button  id="pm_1" class="w3-button w3-light-gray w3-padding-16 w3-mobile w3-border w3-right" style="width:100%">
						<div class="w3-rest w3-right w3-large">
							GEORREFERENCIACIONES
						</div>
						<div class="w3-quarter  w3-left" >
							<i class="fa fa-map-o" style="font-size:28px"></i>
						</div>	
					</button>
				</div>
				<div class="w3-row">
					<button  id="pm_2" class="w3-button w3-light-gray w3-padding-16 w3-mobile w3-border w3-right" style="width:100%">
						<div class="w3-rest w3-right w3-large">
							ASOCIACIONES
						</div>
						<div class="w3-quarter w3-left" >
							<i class="fa fa-exchange" style="font-size:28px"></i>
						</div>
					</button>
				</div>
				<div class="w3-row">
					<button  id="pm_3" class="w3-button w3-light-gray w3-padding-16 w3-mobile w3-border w3-right" style="width:100%">
						<div class="w3-rest w3-right w3-large">
							ESTADISTICAS
						</div>
						<div class="w3-quarter w3-left" >
							<i class="fa fa-line-chart" style="font-size:28px"></i>
						</div>
					</button>
				</div>
				<div class="w3-row">
					<button  id="pm_4" class="w3-button w3-blue-grey w3-padding-16 w3-mobile w3-border w3-right" style="width:100%">
						<div class="w3-rest w3-right w3-large">
							Salir
						</div>
						<div class="w3-quarter w3-left" >
							<i class="fa fa-share-square-o" style="font-size:28px"></i>
						</div>
					</button>
				</div>

			</fieldset>
		</div>
	</div>
	<!--Pagina menu -->
	<!--Pagina menu -->
	<!--Pagina menu -->
	<!--Pagina menu -->
	<!--Pagina menu -->
	<!--Pagina menu -->














	<!--Pagina menu geo-->
	<!--Pagina menu geo-->
	<!--Pagina menu geo-->
	<!--Pagina menu geo-->
	<!--Pagina menu geo-->
	<!--Pagina menu geo-->
	<div data-role="page" id="pagina_menu_geo">
		<div class="w3-row w3-black">
		
				
		
			<div class="w3-col w3-container w3-padding-8 w3-black w3-right" style="height:60px">
				<img src="logos/IM_logo_fondo_negro.jpg" style="width:40px">
			</div>

		</div>

		<div class="ui-content" role="main">
			<fieldset>
				<div class="w3-row">
					<button  id="pmgeo_1" class="w3-button w3-light-gray w3-padding-16 w3-mobile w3-border w3-right" style="width:100%">
						<div class="w3-rest w3-right w3-large">
							      PC
						</div>
						<div class="w3-quarter  w3-left" >
							<i class="fa fa-desktop" style="font-size:28px"></i>
						</div>
					</button>
				</div>
				<div class="w3-row">
					<button  id="pmgeo_2" class="w3-button w3-light-gray w3-padding-16 w3-mobile w3-border w3-right" style="width:100%">
						<div class="w3-rest w3-right w3-large">
							TABLET
						</div>
						<div class="w3-quarter w3-left" >
							<i class="fa fa-tablet" style="font-size:28px"></i>
						</div>
					</button>
				</div>
				<div class="w3-row">
					<button  id="pmgeo_3" class="w3-button w3-light-gray w3-padding-16 w3-mobile w3-border w3-right" style="width:100%">
						<div class="w3-rest w3-right w3-large">
							NOMENCLADOR
						</div>
						<div class="w3-quarter w3-left" >
							<i class="fa fa-square-o" style="font-size:28px"></i>
						</div>
					</button>
				</div>
				<div class="w3-row">
					<button  id="pmgeo_4" class="w3-button w3-blue-grey w3-padding-16 w3-mobile w3-border w3-right" style="width:100%">
						<div class="w3-rest w3-right w3-large">
							Salir
						</div>
						<div class="w3-quarter w3-left" >
							<i class="fa fa-share-square-o" style="font-size:28px"></i>
						</div>
					</button>
				</div>

			</fieldset>
		</div>
	</div>
	<!--Pagina menu geo-->
	<!--Pagina menu geo-->
	<!--Pagina menu geo-->
	<!--Pagina menu geo-->
	<!--Pagina menu geo-->
	<!--Pagina menu geo-->

	





























<!--Pagina estadisticas -->
<div data-role="page" id="pagina_esta">
	<div class="w3-bar w3-black">
		<div class="w3-bar-item w3-container w3-black" style="width:45x;height:80px">
		<button id="pest_volver" class="w3-button w3-border-0 w3-hover-grey w3-black w3-round-large" style="width:40px;height:50px">
			<div class="w3-row w3-left" style="width:18px">
				<i class="fa fa-angle-left"  style="font-size:25px; color:#ffffff"></i>
			</div>
		</button>
	  	</div>
	  <div class="w3-bar-item w3-container w3-black" style="width:45x;height:80px">
	    <img src="logos/IM_logo_fondo_negro.jpg" style="width:30px; margin-top: 10px">
	  </div>
	  <div class="w3-bar-item w3-black" style="height:60px; width:40%">
	      <label class="w3-left-align w3-large w3-padding-16" style="margin-top: 1px; margin-left: 3px">Estad&iacute;sticas SAS</label>
	  </div>
	  <div class="w3-bar-item w3-black" style="height:60px; width:30%">
	      <label id="fechatext" name="fechatext" class="w3-left-align w3-large w3-padding-16" style="margin-top: 1px; margin-left: 3px">Agosto 2018</label>
	  </div>
	  <div class="w3-bar-item w3-black w3-rest w3-right w3-margin-right" style="height:70px;min-width: 100px">	
	  <div class="w3-row">
	      <div class="w3-half w3-left">
	 	<button id="pest_1" class="w3-button w3-border-0 w3-hover-grey w3-black w3-round-large" style="width:40px;height:50px">
		  	<div class="w3-row w3-left" style="width:18px">
		  		<i class="fa fa-arrow-left"  style="font-size:25px; color:#ffffff"></i>
		  	</div>
		</button>    
		</div>
		<div class="w3-half w3-rigth">
		<button id="pest_2" class="w3-button w3-border-0 w3-hover-grey w3-black w3-round-large" style="width:40px;height:50px">
		  	<div class="w3-row" style="width:18px">
		  		<i class="fa fa-arrow-right" style="font-size:25px; color:#ffffff"></i>
		  	</div>
		</button>
		</div>
	  </div>

	 </div>
	</div> 




<div class="w3-cell-row">
<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_3" name="pest_3">
<header class="w3-container w3-blue w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Servicios de Saneamiento</h3>
  <button id= "pest_bdato1" class="w3-button w3-blue w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato1" style="margin-left: 23px">0</h2>
</div>
</div>
</div>
<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_4" name="pest_4">
<header class="w3-container w3-blue w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Bloqueados</h3>
  <button id= "pest_bdato2" class="w3-button w3-blue w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato2" style="margin-left: 23px">0</h2>
</div>
</div>
</div>
</div>



<div class="w3-cell-row">
<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_5" name="pest_5">
<header class="w3-container w3-blue w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Unidades Ocupacionales con TS</h3>
  <button id= "pest_bdato3" class="w3-button w3-blue w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato3" style="margin-left: 23px">0</h2>
</div>
</div>
</div>
<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_6" name="pest_6">
<header class="w3-container w3-blue w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Unidades Ocupacionales sin TS</h3>
  <button id= "pest_bdato4" class="w3-button w3-blue w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato4" style="margin-left: 23px">0</h2>
</div>
</div>
</div>
</div>

<div class="w3-cell-row">
<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_7" name="pest_7">
<header class="w3-container w3-blue w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Unidades Ocupacionales sin TS en zona saneada</h3>
  <button id= "pest_bdato5" class="w3-button w3-blue w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato5" style="margin-left: 23px">0</h2>
</div>
</div>
</div>
<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_8" name="pest_8">
<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Total de cuentas OSE</h3>
  <button id= "pest_bdato6" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato6" style="margin-left: 23px">0</h2>
</div>
</div>
</div>

</div>




<div class="w3-cell-row">

<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_9" name="pest_9">
<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Cuentas cortadas</h3>
  <button id= "pest_bdato7" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato7" style="margin-left: 23px">0</h2>
</div>
</div>
</div>

<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_10" name="pest_10">
<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Cuentas OSE con TS</h3>
  <button id= "pest_bdato8" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato8" style="margin-left: 23px">0</h2>
</div>
</div>
</div>



</div>


<div class="w3-cell-row">

<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_11" name="pest_11">
<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Cuentas cortadas con TS</h3>
  <button id= "pest_bdato9" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato9" style="margin-left: 23px">0</h2>
</div>
</div>
</div>
<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_12" name="pest_12">
<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Cuentas OSE sin TS</h3>
  <button id= "pest_bdato10" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato10" style="margin-left: 23px">0</h2>
</div>
</div>
</div>



</div>

<div class="w3-cell-row">

<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_13" name="pest_13">
<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Cuentas OSE sin Geolocalizaci&oacute;n</h3>
  <button id= "pest_bdato11" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato11" style="margin-left: 23px">0</h2>
</div>
</div>
</div>

<div class="w3-container w3-cell w3-half">
<div class="w3-card-4 w3-round-xlarge" id="pest_13" name="pest_13">
<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
  <h3 class="w3-cell">Cuentas OSE sin TS Geolocalizadas en Zona Saneada</h3>
  <button id= "pest_bdato12" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
  	  	<div class="w3-row" style="width:12px">
	  		<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
	  	</div>
  </button>
</header>
<div class="w3-row">
<h2 id= "pest_dato12" style="margin-left: 23px">0</h2>
</div>
</div>
</div>


	<div class="w3-container w3-cell w3-half">
		<div class="w3-card-4 w3-round-xlarge" id="pest_14" name="pest_14">
			<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
				<h3 class="w3-cell">Cuentas OSE Geolocalizadas en Zona No Saneada</h3>
				<button id= "pest_bdato13" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
					<div class="w3-row" style="width:12px">
						<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
					</div>
				</button>
			</header>
			<div class="w3-row">
				<h2 id= "pest_dato13" style="margin-left: 23px">0</h2>
			</div>
		</div>
	</div>
	
	<div class="w3-container w3-cell w3-half">
		<div class="w3-card-4 w3-round-xlarge" id="pest_15" name="pest_15">
			<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
				<h3 class="w3-cell">Cuentas OSE sin calle identificada</h3>
				<button id= "pest_bdato14" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
					<div class="w3-row" style="width:12px">
						<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
					</div>
				</button>
			</header>
			<div class="w3-row">
				<h2 id= "pest_dato14" style="margin-left: 23px">0</h2>
			</div>
		</div>
	</div>
	
	<div class="w3-container w3-cell w3-half">
		<div class="w3-card-4 w3-round-xlarge" id="pest_16" name="pest_16">
			<header class="w3-container w3-green w3-round-xlarge w3-cell-row">
				<h3 class="w3-cell">Cuentas OSE fuera zona saneada por calle</h3>
				<button id= "pest_bdato15" class="w3-button w3-green w3-cell w3-right" style="width: 45px">
					<div class="w3-row" style="width:12px">
						<i class="fa fa-info"  style="font-size:16px; color:#ffffff"></i>
					</div>
				</button>
			</header>
			<div class="w3-row">
				<h2 id= "pest_dato15" style="margin-left: 23px">0</h2>
			</div>
		</div>
	</div>




</div>

<div data-role="popup" id="pop2" style="width:300px">
<div data-role="header">
  <div class="w3-quarter w3-panel w3-padding-8 w3-left" style="height:30px">
    <img src="logos/IM_logo_fondo_negro.jpg" style="width:30px">
  </div>
<h2>Mensaje</h2>
</div>
<div class="ui-content" data-role="main">
<div>
<h5 class ="w3-center"></h5>
</div>
</div>
</div>


</div>

<!--Pagina estadisticas -->





<!--Pagina utiles -->
<div data-role="page" id="pagina_utiles">

	<div class="w3-bar w3-black">
		<div class="w3-bar-item w3-container w3-black" style="width:45x;height:80px">
			<button id="putiles_volver" class="w3-button w3-black" style="width:60px;height:40px ;margin-left:10px">
				<div class="w3-row" style="width:22px">
					<i class="fa fa-angle-left" style="font-size:22px"></i>
				</div>
			</button>
		</div>
	  <div class="w3-bar-item w3-container w3-black" style="width:45x;height:80px">
	    <img src="logos/IM_logo_fondo_negro.jpg" style="width:30px; margin-top: 10px">
	  </div>
	  <div class="w3-bar-item w3-black" style="height:60px; width:40%">
	      <label class="w3-left-align w3-large" style="margin-top: 1px; margin-left: 3px">Utilidades SAS</label>
	  </div>

	  </div> 

<div class="w3-row w3-green">
  <div class="w3-col w3-green w3-left" style="width:50%;height:60px">

  <div class="w3-col w3-green w3-center w3-margin-left" style="width:40px;height:60px">
      <label style="margin-top: 15px; margin-right: 4px">RUTA</label>
  </div>
  <div class="w3-col w3-green w3-margin-left" style="height:60px;width:120px">
      <input id="puti_3" type="text" class="w3-input" style="height:40px;text-align: right">
  </div>   
  <div class="w3-col w3-green" style="height:60px;width:60px">
  	<button id="puti_4" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
  	<div class="w3-row" style="width:22px">
  		<i class="fa fa-search" style="font-size:22px"></i>
  	</div>
  </button>
  </div> 
    <div class="w3-col w3-green" style="height:60px;width:60px">
  	<button id="puti_7" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
  	<div class="w3-row" style="width:22px">
  		<i class="fa fa-map" style="font-size:22px"></i>
  	</div>
  </button>
  </div> 
    <div class="w3-col w3-green" style="height:60px;width:60px">
  	<button id="puti_8" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
  	<div class="w3-row" style="width:22px">
  		<i class="fa fa-map-o" style="font-size:22px"></i>
  	</div>
  </button>
  </div>   
  
   
   
   
   
</div>

  <div class="w3-col w3-blue w3-left" style="width:50%;height:60px">
  <div class="w3-col w3-blue w3-center w3-margin-left" style="width:80px;height:60px">
      <label style="margin-top: 15px; margin-right: 14px">SINONIMO</label>
  </div>
  <div class="w3-col w3-blue w3-margin-left" style="height:60px;width:220px">
      <input id="puti_5" type="text" class="w3-input" style="height:40px;text-align: right">
  </div>   
  <div class="w3-col w3-blue" style="height:60px;width:60px">
  	<button id="puti_6" class="w3-button w3-blue w3-round-large" style="width:60px;height:40px ;margin-left:10px">
  	<div class="w3-row" style="width:22px">
  		<i class="fa fa-search" style="font-size:22px"></i>
  	</div>
  </button>
  </div> 
  </div> 
  </div> 

  <div class="w3-row" style="width:100%;height:800px">
  <div id="map" class="w3-col w3-left" style="width:50%;height:800px">
  </div> 
  <div id="lista" class="w3-col w3-right" style="width:50%;height:800px">
  
<div class="w3-container w3-responsive" style="height:800px" >
<table id = "tabla" class="w3-table-all">


</table>
</div>
  
  
  </div>
</div>


<div data-role="popup" id="pop3" style="width:300px">
<div data-role="header">
  <div class="w3-quarter w3-panel w3-padding-8 w3-left" style="height:30px">
    <img src="logos/IM_logo_fondo_negro.jpg" style="width:30px">
  </div>
<h2>Mensaje</h2>
</div>
<div class="ui-content" data-role="main">
<div>
<h5 class ="w3-center"></h5>
</div>
</div>
</div>
</div>

<!--Pagina utiles -->






	<!--Pagina geo -->
	<div data-role="page" id="pagina_geo">
		<div class="w3-row w3-green">
			<div class="w3-col w3-green" style="width:100%;height:60px">
				<div class="w3-col w3-green" style="height:60px;width:60px">
					<button id="pgeo_volver" class="w3-button w3-green" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-angle-left" style="font-size:22px"></i>
						</div>
					</button>
				</div>
				<div class="w3-col w3-green" style="height:60px;width:60px">
					<button id="geo1" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-plus" style="font-size:22px"></i>
						</div>
					</button>
				</div>
				<div class="w3-col w3-green" style="height:60px;width:60px">
					<button id="geo2" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-map" style="font-size:22px"></i>
						</div>
					</button>
				</div>
				<div class="w3-col w3-green" style="height:60px;width:60px">
					<button id="geo3" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-home" style="font-size:22px"></i>
						</div>
					</button>
				</div>
				<div class="w3-col w3-green" style="height:60px;width:60px">
					<button id="geo4" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-circle-o" style="font-size:22px"></i>
						</div>
					</button>
				</div>
				<div class="w3-col w3-green" style="height:60px;width:60px">
					<button id="geo15" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-empire" style="font-size:22px"></i>
						</div>
					</button>
				</div>
				<div class="w3-col w3-green" style="height:60px;width:60px">
					<button id="geo16" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-eraser" style="font-size:22px"></i>
						</div>
					</button>
				</div>



				<div id='geo_reporte_ver' class="w3-show w3-col w3-green" style="height:60px;width:60px">
					<button id="geo_reporte" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-file-excel-o" style="font-size:22px"></i>
						</div>
					</button>
				</div>
				<div id='geo_reporte2_ver' class="w3-show w3-col w3-green" style="height:60px;width:60px">
					<button id="geo_reporte2" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-line-chart" style="font-size:22px"></i>
						</div>
					</button>
				</div>



				<div class="w3-col w3-right w3-green" style="height:60px;width:360px">
					<div class="w3-row w3-green">
						<div class="w3-col w3-green w3-left" style="height:60px;width:60px">
							<button id="geo5" class="w3-button w3-green w3-round-large" style="width:60px;height:40px ;margin-left:10px">
								<div class="w3-row" style="width:22px">
									<i class="fa fa-map-marker" style="font-size:22px"></i>
								</div>
							</button>
						</div>

						<div class="w3-col w3-green w3-left" style="height:60px;width:240px">
							<label id="geo_usuario" class="w3-text-white w3-right-align" style="margin-top: 20px; margin-left: 3px;margin-right: 4px">Usuario</label>
						</div>
						<div class="w3-col w3-green w3-right" style="height:60px;width:60px">
							<div class="w3-row" style="width:22px;margin-top:15px">
								<i class="fa fa-user-circle" style="font-size:32px"></i>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="w3-row w3-green" style="width:100%;height:800px">
			<div id="map2" class="w3-half">
			</div>
			<div class="w3-half w3-right w3-green">
				<div class="w3-row" id="panorama"  style="height:400px"></div>
				<div class="w3-row w3-green" style="height:110px">
					<table id="datos_ose" class="w3-table">
						<tr>
							<th>Direcci&oacute;n OSE</th>
						</tr>
						<tr>
							<td>Unidades:</td>
							<td>Tarifa:</td>
							<td>Promedio:</td>
						</tr>
						<tr>
							<td>Titular:</td>
						</tr>
					</table>
				</div>
				<div class="w3-row w3-white w3-responsive" style="height:250px">
					<table id= "datos_im" class="w3-table w3-bordered">
						<tr>
							<th>Padr&oacute;n:</th>
							<td>Puerta:      Apto:</td>
						</tr>
						<tr>
							<td>Titular:</td>
						</tr>
						<ul></ul>

					</table>
				</div>
			</div>

		</div>


		<div class="w3-bottom">
			<div class="w3-bar w3-red">
				<div class="w3-row w3-black">
					<div class="w3-quarter w3-padding w3-black">
						<select  id="geo6" name="geo6" >
							<option value="" disabled selected>Tipo</option>
							<option  value="1" >Encontrado</option>
							<option  value="2" >Encontrado dudoso</option>
							<option  value="3" >No encontrado</option>
							<option  value="4" >Ose ocupada</option>
							<option  value="5" >No existe padron</option>
						</select>
					</div>
					<div class="w3-half w3-black" style="height:55px">
						<div class="w3-row" style="width:100%;height:45px">
							<div class="w3-quarter w3-right-align" style="margin-right: 3px">
								<p>Observaciones:</p>
							</div>
							<div class="w3-rest">
								<input id="geo7" name="geo7" class="w3-input" type="text">
							</div>
						</div>
					</div>
					<div class="w3-quarter w3-black w3-padding " style="height:55px">
						<button  id="geo8" name="geo8" class="w3-button w3-half w3-red w3-mobile w3-border w3-left" style="width:70%;height:50px">
							<div class="w3-rest w3-right w3-large">
								Ingresar
							</div>
							<div class="w3-quarter w3-left" >
								<i class="fa fa-floppy-o" style="font-size:32px"></i>
							</div>
						</button>

						<!--
						<button  id="geo9" name="geo8" class="w3-button w3-quarter w3-green w3-mobile w3-border" style="width:15%;height:50px">
						<div class="w3-quarter w3-left" >
						<i class="fa fa-sign-out" style="font-size:32px"></i>
						</div>
						</button>
						-->
						<button  id="geo10" name="geo8" class="w3-button w3-quarter w3-grey w3-mobile w3-border w3-right" style="width:15%;height:50px">
							<div class="w3-quarter w3-center" >
								<i class="fa fa-question-circle" style="font-size:32px"></i>
							</div>
						</button>
					</div>




				</div>
			</div>
		</div>=

		<div data-role="popup" id="pop4" style="width:600px">
			<div data-role="header">
				<div class="w3-quarter w3-panel w3-padding-8 w3-left" style="height:30px">
					<img src="logos/IM_logo_fondo_negro.jpg" style="width:30px">
				</div>
				<h2>Mensaje</h2>
			</div>
			<div class="ui-content" data-role="main">
				<div>
					<h5 class ="w3-center"></h5>
				</div>
			</div>
		</div>



		<div data-role="popup" id="pop5" class="ui-content" style="width:1200px">
			<a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right"></a>
			<video width="1160" height="520" controls>
				<source src="medios/ayuda_sasgeo1.mp4" type="video/mp4">
			</video>
		</div>
	</div>



	<!--Pagina geo -->


	



	<!--Pagina geo movil-->
	<div data-role="page" id="pagina_geo_movil">
	
<div class="w3-container w3-blue-grey" style="position: fixed;top:0;width: 100%;height:60px">
	<div class="w3-row w3-blue-grey" style="width:100%;height:60px;margin-left:3px">
		<div class="w3-col w3-blue-grey" style="height:60px;width:50px">
			<button id="pgeom_volver" class="w3-button w3-blue-grey w3-border-0" style="width:45px;height:40px ;margin-left:2px">
			<div class="w3-row" style="width:20px">
					<i class="fa fa-angle-left" style="font-size:20px"></i>
			</div>
			</button>
		</div>

<div class="w3-dropdown w3-col w3-blue-grey" style="height:60px;width:55px">
<button id="pgeom_barra" onclick="conmuto_menu()" class="w3-button w3-blue-grey w3-round-large w3-border-0" style="width:50px;height:40px;margin-left:6px">
						<div class="w3-row" style="text-align: left">
							<i class="fa fa-bars" style="font-size:20px"></i>
						</div>
</button>
<div id="botones_menu_superior" class="w3-dropdown-content w3-hide w3-bar-block w3-round-small w3-blue-grey" style="height:1px;width:1px">			
	<div class="w3-row w3-blue-grey" style="height:45px;width:60px">
			<button id="pgeom_geo1" class="w3-button w3-blue-grey w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-plus" style="font-size:22px"></i>
						</div>
			</button>
	</div>
	<div class="w3-row w3-blue-grey" style="height:45px;width:60px">
		<button id="pgeom_geo2" class="w3-button w3-blue-grey w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-map" style="font-size:22px"></i>
						</div>
		</button>
	</div>
	<div class="w3-row w3-blue-grey" style="height:45px;width:60px">
		<button id="pgeom_geo3" class="w3-button w3-blue-grey w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-home" style="font-size:22px"></i>
						</div>
		</button>
	</div>
	<div class="w3-row w3-blue-grey" style="height:45px;width:60px">
		<button id="pgeom_geo4" class="w3-button w3-blue-grey w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-circle-o" style="font-size:22px"></i>
						</div>
		</button>
	</div>
	<div class="w3-row w3-blue-grey" style="height:45px;width:60px">
		<button id="pgeom_geo15" class="w3-button w3-blue-grey w3-round-large" style="width:60px;height:40px ;margin-left:10px">
					<div class="w3-row" style="width:22px">
							<i class="fa fa-empire" style="font-size:22px"></i>
					</div>
		</button>
	</div>
<div class="w3-row w3-blue-grey" style="height:45px;width:60px">
	<button id="pgeom_geo16" class="w3-button w3-blue-grey w3-round-large" style="width:60px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-eraser" style="font-size:22px"></i>
						</div>
	</button>
</div>
</div>
</div>

<div class="w3-col w3-right w3-blue-grey" style="height:60px;width:80px">			
<p id="pgeom_usuario" style="margin-left:6px">Usuario</p>
</div>

				<div class="w3-col w3-right w3-blue-grey" style="height:60px;width:50px">
					<button id="pgeom_usuario" class="w3-button w3-blue-grey w3-border-0" style="width:49px;height:40px ;margin-right:6px">
						<div class="w3-row w3-center" style="width:20px">
							<i class="fa fa-user-circle" style="font-size:20px"></i>
						</div>
					</button>		
				</div>

				</div>
</div>




<div  id="datos_info" class="w3-hide w3-white" style="width:100%">
  	<div class="w3-container w3-white" style="height:35px;margin-top: 70px"> 
	<table id="pgeom_datos_ose" class="w3-table">
						<tr>
							<th>Datos OSE</th>
						</tr>
	</table>    
	<table id="pgeom_datos_im" class="w3-table">
						<tr>
							<th>Datos IM</th>
						</tr>
	</table>      
		  </div>
  
</div>






<div id="map3" class="w3-row w3-show w3-sand">

</div>





<div class="w3-container w3-black" style="position: fixed;bottom:0;width: 100%;height:60px">
<div class="w3-row w3-black" style="width:100%;height:60px">
<div class="w3-col w3-black" style="height:60px;width:35px">
<p style="text-algin:left;margin-left:5px">Info</p>
</div>
				<div class="w3-col w3-black" style="height:60px;width:55px;margin-left:5px">
					<button id="pgeom_datos_ose" onclick="conmuto_datos()" class="w3-button w3-black w3-border-0" style="width:50px;height:40px ;margin-left:10px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-chevron-up" style="font-size:22px"></i>
						</div>
					</button>
				</div>
				
				<div class="w3-col w3-black" style="height:60px;width:55px;margin-left:30px">
					<button id="pgeom_no_encontrado" class="w3-button w3-black w3-border-0 w3-hover-black" style="width:50px;height:40px ;margin-left:6px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-times" style="font-size:22px;color:#e3e916"></i>
						</div>
					</button>
				</div>	
				
				<div class="w3-col w3-black" style="height:60px;width:55px;margin-left:30px">
					<button id="pgeom_olvidar" class="w3-button w3-black w3-border-0 w3-hover-black" style="width:50px;height:40px ;margin-left:6px">
						<div class="w3-row" style="width:22px">
							<i class="fa fa-refresh" style="font-size:22px;color:#3a9ec5"></i>
						</div>
					</button>
				</div>
						
				<div class="w3-col w3-right w3-black" style="height:60px;width:55px">
					<button id="pgeom_salvar" class="w3-button w3-black w3-border-0 w3-hover-black" style="width:50px;height:40px ;margin-left:6px">
						<div class="w3-row" style="width:26px">
							<i class="fa fa-floppy-o" style="font-size:26px;color:#42e718"></i>
						</div>
					</button>
				</div>
 </div>   
</div> 






<div data-role="popup" id="pop6" style="width:300px">
			<div data-role="header">
				<div class="w3-quarter w3-panel w3-padding-8 w3-left" style="height:30px">
					<img src="logos/IM_logo_fondo_negro.jpg" style="width:30px">
				</div>
				<h2>Mensaje</h2>
			</div>
			<div class="ui-content" data-role="main">
				<div>
					<h5 class ="w3-center"></h5>
				</div>
			</div>
</div>



<div data-role="popup" id="pop7" class="ui-content" style="width:1200px">
		<a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right"></a>
			<video width="1160" height="520" controls>
				<source src="medios/ayuda_sasgeo1.mp4" type="video/mp4">
			</video>
	</div>
</div>



	<!--Pagina geo movil -->

	







</body>
</html>



  





  