html, body { 
                width: 100%; 
                height: 100%; 
                margin: 0; 
                padding: 0; 
            } 
body{color:#4D4D4D;background:#fff;}
a{
	/*text-decoration:none;*/
}
header{
	height:40px;
}
#logo{
	float:left;height:34px;
}
#tit{
	float:left;
	font-size:18px;
	margin:18px 0 0 5px;	
}
#buscador{
	float:right;	
	margin-right:10px;
}
#buscador input[name='palabra'], #buscador select[name='layer']{
	width:150px;height:26px;
	border:1px solid #ccc;	
	background:#fff;
}

/*estilos para los botones de herramientas*/
#tools{	
	clear:both;	
	background:#E5E6E4;
	width:100%;	
	border-top:solid #ccc 1px;
}
#tools input[type=radio] { 
position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
#tools input[type=radio] + img {
	 -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
  cursor: pointer;
  margin:2px 0 0 5px;
}
#tools input[type=radio]:checked + img {
  /* outline: 2px solid #55f;*/
   -webkit-filter: none; /* Safari 6.0 - 9.0 */
    filter: none;
}

#viewport{
	width:100%;height: 80%;
	border-top:solid #ccc 1px;
}
.map{
clear:both;
	float:left;
	width: 70%;height: 100%;
	}
.map_small{
	display:none;
}
.info{
	float:left;
	width: 30%; height: 100%;
	overflow:auto;
	padding:3px;
	border-left:solid #ccc 1px;
	}
.info_large{
	width: 100%;height:86%;
	float:none; position:absolute;
	top:40px;left:0px;overflow: hidden; 
}
/* 
#infobutton {	
    display: none;	
    }
   
 .closebutton{
	display:none;
 }
*/
.closebutton_show{
	display:block;
	background-image: url("../img/close.png");
	width: 32px; height: 32px;
	position:absolute;
	top:42px;right:2px;
	cursor:pointer;
}
#resultados{
	font-size:11px;line-height:20px;padding:3px;
}
#instrucciones{
	padding:5px;
	line-height:26px;
}
footer{
	border-top:solid #ccc 1px;
}
footer img{
	height:20px;
}
#contactform{
	float:right;margin-right:10px;
}
h5{ /*titulo de capa en template*/
	background:#165FEF;
	color:#fff;
	font-weight:bold;
}
table.ms_template{
	width:100%;
	
}
table.ms_template th{
	
}
table.ms_template .tag{
	font-weight:bold;
	vertical-align: top;
}

/*******************************
*****       OVERRIDES         ********
*******************************/ 

.layer-switcher {
    top: 1.5em;
}
/* Set the maximum height of the layerswitcher when it's shown */
.layer-switcher.shown {
    max-height: 300px;
}
.layer-switcher .panel{
	padding: 1em 1em 0 0;
}
	
/*estilos para el poppup*/
 .ol-popup {
        position: absolute;
        background-color: white;
        box-shadow: 0 1px 4px rgba(0,0,0,0.2);
        padding: 15px;
        border-radius: 10px;
        border: 1px solid #cccccc;
        bottom: 12px;
        left: -50px;
        min-width: 160px;
      }
.ol-popup:after, .ol-popup:before {
        top: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
      }
.ol-popup:after {
        border-top-color: white;
        border-width: 10px;
        left: 48px;
        margin-left: -10px;
      }
.ol-popup:before {
        border-top-color: #cccccc;
        border-width: 11px;hellepin
        left: 48px;
        margin-left: -11px;
      }
.ol-popup-closer {
        text-decoration: none;
        position: absolute;
        top: 2px;
        right: 8px;
      }
.ol-popup-closer:after {
        content: "✖";
}

/*estilos para measure*/
.ol-tooltip {
        position: relative;
        background: rgba(0, 0, 0, 0.5);
        border-radius: 4px;
        color: white;
        padding: 4px 8px;
        opacity: 0.7;
        white-space: nowrap;
        font-size: 12px;
      }
.ol-tooltip-measure {
        opacity: 1;
        font-weight: bold;
      }
.ol-tooltip-static {
        background-color: #ffcc33;
        color: black;
        border: 1px solid white;
      }
.ol-tooltip-measure:before,
.ol-tooltip-static:before {
        border-top: 6px solid rgba(0, 0, 0, 0.5);
        border-right: 6px solid transparent;
        border-left: 6px solid transparent;
        content: "";
        position: absolute;
        bottom: -6px;
        margin-left: -7px;
        left: 50%;
      }
.ol-tooltip-static:before {
        border-top-color: #ffcc33;
      }
  
 
/*estilos para controles fuera del mapa*/
/*
 * .ol-zoom-extent button {
    position: absolute;
    top: 30px;
} 
 
*/


@media screen and (max-width: 600px) {
	
	
	html, body {margin: 0; height: 100%; overflow: hidden}
	
	#tit{
		font-size:14px;	
	}	
	#buscador input[name='palabra'], #buscador select[name='layer']{
	width:100px;
	}
	#viewport{
		height: 74%;
}
	.map{		display:block;
		width: 100%;height: 100%;
		}
	.map_small{
	display:block;
		height:60%;
	}
	.map_potree{
		height:8%;
	}
	.info{
		display:none;
		width: 100%;	
	}
	.info_large{	
	 display:block;position: relative;
	top:0%;height:50%;overflow:auto;
		 /*position: absolute;
        animation: moveabout 5s ease-in-out ;*/
	 }	
	.info_potree{
		display:block;
		width: 100%;height:86%;
		float:none; position:absolute;
		top:40px;left:0px;overflow: hidden; 	 
		 /*display:block;
			width: 100%;height:92%;padding:0;*/
	}
	.infobutton {	
	    display: block;
	    background-image: url("../img/c-up.png");	
		width: 32px; height: 32px;
		position:absolute;
		bottom:20px;right:10px;
		cursor:pointer;z-index:1000;
	}
	
	.infobutton_down {		    
	    background-image: url("../img/c-down.png");	
	    position:fixed;bottom:20px;right:10px;
	   /*	 top:50%;
	display: block;
	 * width: 32px; height: 32px;
		position:absolute;
		bottom:50%;right:10px;
		cursor:pointer;* */
	}
	footer{}
	#contactform{float:none;}	  
}