html,body,div,span,h1,h2,h3,p,img,nav,section {
     border:0;
     font-size:100%;
     font:inherit;
     vertical-align:baseline;


}


html,
body {
  height: 100%;
  margin: 0
}

body {
     background-color:#fff;
     -webkit-text-size-adjust:none;
     background:#171717;
     font-family:Raleway, Helvetica, sans-serif;
     font-size:13pt;
     font-weight:400;
     line-height:1.65em;
     color:#474747;
	text-align: center;
}


.main_structure {
  display: flex;
  flex-flow: column;
  min-height: 100%;
  align-items:stretch;
  justify-content:space-around;
      
}

.main_structure .row {
}

.main_structure .row.header {
  flex: 0 1 auto;
  /* The above is shorthand for:
  flex-grow: 0,
  flex-shrink: 1,
  flex-basis: auto
  */
  height:auto;
}

.main_structure .row.content {
  flex: 1 1 auto;
}

.main_structure .row.footer {
  flex-grow: 0;
  flex-shrink: 1;;
  
  background-color:#444;
  color: #cdced0;
  flex-basis:40%;
}


.main_structure .light_1 {
	background-color:#EEE;
	}
	
	.main_structure .light_2 {
	background-color:#CCC;
	}



.main_structure .red_error {
	background-color:#C77;
	}
	

.main_structure .green_success {
	background-color:#d1ffb0;
	}
	

.main_structure .lefttext {
	text-align: left;
}




h1,h2,h3 {
     font-weight:700;
}

a {
     color:#000;
}

a:hover {
     text-decoration:none;
}



header h2 {
     color:#474747;
}




#mainlogo {
     max-height:300px;

     padding-top:1em;
}

#mainlogo img {
     max-height:300px;
     max-width:350px;
     width:100%;

}




.lozbutton {
     background:#555;
     border-radius:8px;
     text-decoration:none;
     font-size:1.1em;
     position:relative;
     display:inline-block;
     margin-top:2em;
     color:#FFF;
     cursor:pointer;
     padding:1em 1.5em;
}

#nav {
     background:#272727;
}

#nav > ul {
     text-align:center;
     margin:0;
     padding:0;
}

#nav > ul > li {
     display:inline-block;
     margin-right:-4px;
     border-right:1px solid;
     list-style:none;
     border-color:rgba(255,255,255,.1);
}

#nav > ul > li:hover {
     background-color:#444;
}

#nav > ul > li:last-child {
     padding-right:0;
     border-right:none;
}

#nav > ul > li > a,#nav > ul > li > span {
     display:inline-block;
     letter-spacing:.06em;
     text-decoration:none;
     text-transform:uppercase;
     font-size:1.1em;
     outline:0;
     color:#FFF;
     padding:1em .8em;
}


#navPanel {
     backface-visibility:hidden;
     transition:0 .25s ease-in-out 0;
     z-index:10000;
     position:fixed;
     overflow-y:auto;
     top:0;
     left:0;
     width:180px;
     height:100%;
}




#mapid { height: 500px; width:auto;}

.leaflet-container a.leaflet-popup-close-button {
     color: #111 !important;
}






/* STANDARD FLEX CONTAINER FIXED NUMBERS MANUAL CONTROL*/
.flex-container1{
      display:flex;
      align-items:stretch;
      justify-content:space-around;
      flex-direction:row;
      /*
      align-items:flex-start;
      align-items:flex-end;
      align-items:center;
      
      flex-direction:column;
      */
      
    }
    

.copyrightcontainer {
     min-height:6em;
}

.copyright {
     position:relative;
     text-align:left;
     color:rgba(0,0,0,.6);
     background-color:#444;
     width:auto;
     margin-left:auto;
     margin-right:auto;
}

.copyright a {
     text-decoration:none;
     color:#cdced0;
}

.copyright p {
     text-decoration:none;
     color:#cdced0;
}






.flex-container {
  /* We first create a flex layout context */
  display: flex;
  
  /* Then we define the flow direction 
     and if we allow the items to wrap 
   * Remember this is the same as:
   * flex-direction: row;
   * flex-wrap: wrap;
   */
  flex-flow: row wrap;
  
  /* Then we define how is distributed the remaining space */
  justify-content: center;
  align-items:center
  
  padding: auto;
  margin: auto;
  list-style: none;
}

.flex-item {
	border:1px;
	border-color: black;
    border-style: solid;
    padding: 5px;
    min-width: 200px;
    height: auto;
    margin-top: 10px;
    text-align: center;
    margin:5px;
}






.hiddenpopup{

    border: 1px solid #ccc;
    background-color: #f3f3f3;
    z-index: 10000;
    display:block;
    overflow-y: auto;
    visibility: hidden;

    position: absolute;
    width: fit-contents;
    height: auto;
    min-height:auto;
	max-height:95%;
	max-width:95%;
    left: 50%;
    top:50%;
    border-radius: 5px;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);    
	padding:10px;
}

.notdisplayed {
	color: firebrick;
	font-style: italic;
}