html, body { font-family: "T-Star"; color: black; height: 100%; }
a { color:black}


.hero {background:none}
.hero-body { padding:0px }
.hero h1 { font-size:5em;font-weight:normal; color:white; font-family:'Charactron'; text-shadow: 1px 1px 2px black; text-align:center; line-height:1.1em;margin: 40px 0px}
.hero-body h2 { font-size:1.3em;font-weight:normal}
.hero-body p { font-size:.9em; 
  line-height:1.4em; text-align:left; 
  max-width:728px;
  margin: .6em auto; 
  background:rgba(255,255,255,0.8); 
  padding: 10px; 
  border-radius:3px;
  opacity:0.8
}
.hero-body p a { font-size:1.2em; text-decoration:underline}
.hero-head { font-size: 1.6em; background:#f9f9f9;padding:10px}
.hero-foot { font-size: .8em; line-height: 1.6em; padding:10px; background:#f9f9f9;opacity:0.9;}
.hero-foot .title { margin: 15px 0px 10px 0px; font-weight:normal}
.hero-foot p {margin-bottom:5px;}
.hero-foot a {text-decoration:underline}
.hero-foot a.button {text-decoration:none}

.spacer {padding-bottom:20%; background:#f9f9f9; opacity:0.5;  background-size:cover; background-image: url(../img/full/close_up.jpg)}

.mainmenu { margin-top:5em;font-size:1.1em} 
.mainmenu a , .mainmenu{ color:white; margin: 0 10px;padding: 4px 2px 2px 4px}
.mainmenu a:hover { background:white}

footer { 
  text-align:center; z-index: 30;
  font-size: .8em; line-height: 1.6em; background:#f9f9f9;padding:10px
}
footer a {text-decoration:underline}

.button { color: white;}
.hero-body .button  { text-shadow: 1px 1px 2px black; }
.hero-body a.button:hover{ background:none !important; color: #666; }

.icons {width:100%; text-align:center;margin-bottom:10px; }
.icons a {color:#666666}
.slidedown { color:white; }
.slidedown .icon { font-size:2em }
.is-transparent { background-color: transparent !important; border:none }
.is-transparent:hover { background-color: white !important; border:none }
.is-black {  background: black; background: rgba(0, 0, 0, 0.8);}
.is_black {  background: rgba(0, 0, 0, 0.8);}
.is-right { position:relative;right:5%;top: 0%;	transform: translate(0, 60%);}
.has-text-shadow { text-shadow: 1px 1px 2px black; }
.hasfullimage {
  background: url(default.png) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* maps */

#map { position: relative; top:0px; height: 100%; width: 70%; z-index:1000;  background-color: rgba(0,0,0,0); margin:0 auto; border-top:1px solid #666}

.leaflet-container .leaflet-control-attribution { font-size:0.7em; color:#bbb; background:black}
.leaflet-container .leaflet-control-attribution a { color:white}
.leaflet-control-zoom { opacity: 0.5 }

.leaflet-popup .title {border-bottom:1px solid black; font-size:0.9em; margin:0; padding:0}
.leaflet-popup .location {font-size:0.9em}
.leaflet-popup .country {color:gray}
.leaflet-popup .url {color:black; text-decoration:underline}
.leaflet-popup .report {padding:10px 0px}


.marker-cluster div { background-color: rgba(255, 255, 0, 1);}
.marker-cluster { background-color: rgba(255,255,255, 0.6);}

.leaflet-tile-pane { 
  opacity:0.8;
  filter: gray; 
  -webkit-filter: grayscale(1);
  filter: grayscale(1); 
}

.abstitle { 
  position: relative; 
  top:0px; 
  height: 105px;
  z-index:10001; 
  text-align:center; 
  background:rgba(0,0,0,0.8); 
  padding-top:0px;
}
.abstitle h1 { margin:0}
.add-button {    
  position: absolute; 
  top:80px; 
  right:10px;
  padding:1em; 
  margin-top:1.6em; 
  margin-left:1.6em; 
  font-size:1.2em
}


/* navigation */

#page-nav {  position: fixed; top: 0px; width:100%; z-index: 20000; font-size:1.3em; }
#page-nav input { display:none}
#page-nav label {
  display: inline-block;
  color: #fff;
  background: none;
  font-style: normal;
  font-size: 1.5em;
  padding: 10px;
  border-radius:50%;
}

#page-nav ul li {
  display: block;
  
}
#page-nav ul li {
  border-top: 1px solid #888;
  text-align:center;
}

#page-nav ul li a {
 color:white;
}

/* Toggle show/hide menu on checkbox click */
#page-nav ul {
  display: none;
  font-size:2em;
  
}
#page-nav input:checked ~ ul {
  display: block;

}

#page-nav .menu { color:white}



/* modals */

.modal { z-index: 20001; color:white}
.modal label { color:white}



/* intro */

#intro {
    -moz-animation: fadein 5s; /* Firefox */
    -webkit-animation: fadein 5s; /* Safari and Chrome */
    -o-animation: fadein 5s; /* Opera */
}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}


@media screen and (max-width: 414px) {
  body,html { font-size: 0.9em}
  .hero p { margin-left: 10px; margin-right: 10px}
}