@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed&display=swap');


html, body, #map_canvas {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Roboto Condensed', Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: medium;
    background: #fff;
}
      .controls {
        margin-top: 16px;
        border: 1px solid transparent;
        border-radius: 2px 0 0 2px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        height: 32px;
        outline: none;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
      }

a:link, a:visited, a:hover, a:active {
	color: #2A7693;
	text-decoration: none;
}

abbr{
  border-bottom: none !important;
  cursor: inherit !important;
  text-decoration: none !important;
}

#map {
    position: relative;
	height: 100%;
}

#info {
	position: absolute;
    top: 15px;
    left:70%;
	z-index: 10;
	background: white;
	width:300px;
	height:50px;
}

#LaySel {
	position: absolute;
    top: 13px;
    right: 42px;
	z-index: 10;

}

#download {
	position: absolute;
    bottom: 5px;
    right: 5px;
	z-index: 10;
	background: white;
	font-size: small;
}

#copyright {
	position: absolute;
    top: 15px;
    right: 170px;
	z-index: 10;
	height:10px;
		font-size: small;
	/* background: white; */
}

#layercontrol {
    
    width: 410px;
    height: 600px;
    position: absolute;
    top: 105px;
    left:0.5%;
	z-index: 100;
	padding-top:5px;
    padding-bottom:5px;
    padding-left: 10px;
	padding-right: 5px;
	background-color: rgba(255,255,255,0.9);
	/* display: none; */
	overflow:none;
	/* box-shadow: 5px 5px 5px #888888; */
	border:6px solid;
	border-color: #333399;
	border-radius: 20px;
	-moz-border-radius: 20px; /* firefox */
    -webkit-border-radius: 20px; /* safari, chrome */
	
}

#layercontrol  table 
{
    padding: 0; 
    margin: 0;
}

#credits {
font-size: small;
text-align: left;
    position: relative;
    bottom: 5px;
		padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
	padding-right: 5px;
}

#credits_ext {
    font-size: small;
    height: 85%;
    position: absolute;
    top: 5%;
    left:500px;
	right: 5%;
	padding-top:5px;
    padding-bottom:5px;
    padding-left: 5px;
	padding-right: 5px;
	background-color: rgba(230,230,230,0.7);
	display: none;
}



#layersWMS {
	font-size: x-small;
	position: absolute;
	width: 390px;
    z-index: 10;
	overflow: auto;
	bottom: 55px;
	top: 365px;
}

#layersWMSINT {
	font-size: small;
	position: absolute;
	top: 340px;
}

#banner {	    position: absolute;
    top: 0.5%;
	left: 0.5%;
    }

      #pac-input {
	    position: absolute;
        background-color: #fff;
        z-index: 30;
        font-size: 15px;
        font-weight: 300;
        left: 420px;
        padding: 0 11px 0 13px;
        text-overflow: ellipsis;
        width: 300px;
      }

      #pac-input:focus {
        border-color: #4d90fe;
      }

      .pac-container {
        font-family: Roboto;
      }

      #type-selector {
        color: #fff;
        background-color: #4d90fe;
        padding: 5px 11px 0px 11px;
      }

      #type-selector label {
        font-family: Roboto;
        font-size: 13px;
        font-weight: 300;
      }
	  
 #map .ol-zoom {
        top: 38px;
        left: auto;
        right: 8px;
      }
	  
 #map .ol-attribution {
    top: 5px;
    right: 162px;
	z-index: 10;
	height:10px;
	display:none;
      }


	  	  
  #map .ol-zoomslider {
		display: none;
      }

 .ol-popup {
        position: absolute;
        background-color: white;
        -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
        filter: drop-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: 280px;
      }
      .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;
        left: 48px;
        margin-left: -11px;
      }
      .ol-popup-closer {
        text-decoration: none;
        position: absolute;
        top: 2px;
        right: 8px;
      }
      .ol-popup-closer:after {
        content: "X";
      }	  
	  
      .map:-moz-full-screen {
        height: 100%;
      }
      .map:-webkit-full-screen {
        height: 100%;
      }
      .map:-ms-fullscreen {
        height: 100%;
      }
      .map:fullscreen {
        height: 100%;
      }
      .ol-rotate {
        top: 3em;
      }
	  
#cit_ext {
    font-size: medium;
    height: 665px;
	width: 750px;
	min-Height: 600;
    position: absolute;
    top: 80px;
	right: 200px;
    /* margin-top: -300px; */
    /* margin-left: -200px; */
	z-index: 100;
	padding-top:5px;
    padding-bottom:5px;
    padding-left: 15px;
	padding-right: 15px;
	background-color: rgba(255,255,255,0.9);
	/* display: none; */
	overflow:auto;
	/* box-shadow: 5px 5px 5px #888888; */
	border:6px solid;
	border-color: #333399;
	border-radius: 20px;
	-moz-border-radius: 20px; /* firefox */
    -webkit-border-radius: 20px; /* safari, chrome */
}
#biblio {
    font-size: medium;
    height: 665px;
	width: 750px;
    position: absolute;
    top: 80px;
	right: 200px;
    /* margin-top: -300px; */
    /* margin-left: -200px; */
	z-index: 100;
	padding-top:5px;
    padding-bottom:5px;
    padding-left: 15px;
	padding-right: 15px;
	background-color: rgba(255,255,255,0.9);
	display: none;
	overflow:auto;
	/* box-shadow: 5px 5px 5px #888888; */
	border:6px solid;
	border-color: #333399;
	border-radius: 20px;
	-moz-border-radius: 20px; /* firefox */
    -webkit-border-radius: 20px; /* safari, chrome */
}
#method {
    font-size: medium;
    height: 665px;
	width: 750px;
    position: absolute;
    top: 80px;
	right: 200px;
    /* margin-top: -300px; */
    /* margin-left: -200px; */
	z-index: 100;
	padding-top:5px;
    padding-bottom:5px;
    padding-left: 15px;
	padding-right: 15px;
	background-color: rgba(255,255,255,0.9);
	display: none;
	overflow:auto;
	/* box-shadow: 5px 5px 5px #888888; */
	border:6px solid;
	border-color: #333399;
	border-radius: 20px;
	-moz-border-radius: 20px; /* firefox */
    -webkit-border-radius: 20px; /* safari, chrome */
}

.close{
	position: absolute;
	width: 30px;
	height: 30px;
	text-indent: -1000em;
	background: url(../img/close.png) no-repeat;
	top: - 0.5em;
	right: 0.5em;
}

.ui-resizable-s {
    cursor: s-resize;
    height: 7px;
    width: 100%;
    bottom: 1px !important;
    left: 0px;
}