* {
  box-sizing:border-box;
  font-family: 'Noto Sans SC', sans-serif;

}


body, html {

  height:100%;
min-height:350px;
}

/* Nav menu */
nav {
  position:absolute;
  top:0;
  width:100%;
  background:transparent;
  z-index:2;
  text-align:center;
}
nav>div {
  color:white;
  background:black;
}

nav>div:last-child {

  color:black;
  background:transparent;
}

nav>div.hidden {
  display:none;
}

nav>div.visible {
  display:block;
}

nav>div.expanded>ul {
  display:block;
}

nav>div.collapsed>ul {
  display:none;
}

nav>div>span{
  background:transparent;
  width:50px;
  height:50px;
  line-height:50px;
  display:block;
  margin:0 auto;
  text-align:center;
  cursor:pointer;
  font-size:24px;
}

nav ul {
  background:rgba(255,255,255,0.2);
  list-style-type:none;
  padding:0;
  margin:0;
  /* max-width:300px; */
  margin:0 auto;
}

nav ul>li {
  line-height:50px;
}

nav ul>li>a {
  display:block;
  text-decoration:none;
}

nav ul>li>a:hover {
  background:white;
  color:black;
}

.w3-container {
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 0;

}

#main_container {
  background: black;
}

#main_btn {
  position: absolute;
  width: 150px;
  height: 150px;
  
  box-shadow: 0 2px 5px 0 rgba(255, 235, 59, 0.64), 0 2px 10px 0 rgba(255, 235, 59, 0.48);

  vertical-align:middle;
  margin:0;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
}
#main_btn > h1 {
  margin:0;
  font-size: 1.3em;
  font-weight:bold;
  
}
#main_btn:focus {
  outline: 0;
  -moz-outline-style: none;
  border: none;
}


#contact_container {
  display:none;
  background: white;
}

form {
  background: #6eb9f7;
  max-width:500px;
  margin:50px auto 16px auto;
  padding:16px;
}


fieldset {
  display:block;
  border:none;
  padding:0;
  margin:0 0 16px 0;
}

fieldset>legend {
  font-size:24px;
  
  float:left;
  width:100%;
  text-align:left;
  line-height:40px;
  
  border:none;
  padding:0 0  0 0;
  margin:0 0 16px 0;
}


fieldset>legend>span {
  background:#ffeb3b;
  float:left;
  width:40px;
  height:40px;
  line-height:40px;
  text-align:center;
  border-radius:5px;
  font-size:18px;
  margin-right:16px;
  /* border:solid #6eb9f7 5px; */

}

fieldset > button[type="button"], fieldset > button[type="submit"] {
  background-color: white;
  padding:0;
  display:block;
}




fieldset > label {
  position:relative;
  width:100%;
  display:block;
  margin:0 0 16px 0;
  padding:0;
  
}

fieldset > label > input {
  width:100%;
  margin:0 0;
  padding:8px 8px 8px 38px;
  line-height:24px;
  
      background:white;
  border-color:#2F4F4F; /*rgb(118, 118, 118);*/
  border-width:1px;
  border-style:solid;
}

fieldset>label>span {
  position:absolute;
  line-height:44px;
  width:40px;
  text-align:center;
  left:0;
  /* transform:translatey(8px); */
  padding:0;
}
fieldset>label>.no_icon {
  padding:8px;
}

fieldset>label>.no_input {
  background:white;
  border-color:#2F4F4F; /* rgb(118, 118, 118); */
  border-width:1px;
  border-style:solid;
}


fieldset > label > textarea {
  width:100%;
  height:300px;
  resize: none; 
}

fieldset > label > button {
  line-height:40px;
  border:none;
  width:100%;
  
}
fieldset > label > .w3-btn {
  padding:0;
}

fieldset>p {
  width:100%;
  text-align:left;
  margin:0 0 16px 0;
}

#getLocation, #clearLocation {
  line-height:40px;
  border:none;
  width:100%;
}
#clearLocation {
  display:none;
}

#map_display {
  display:none;
  background:white;
  margin:16px auto;
  max-width:300px;
  height:300px;
  
  background-repeat: no-repeat;
  background-position: center center;
  
}

::-webkit-input-placeholder { /* Edge */
  color: #2F4F4F;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #2F4F4F;
}

::placeholder {
  color: #2F4F4F;
}

footer {
  position:absolute;
  top:0;
  display:none;
  min-height:100%;
  width:100%;
  background:white;
  z-index:4;
}


footer>span {
  background:transparent;
  display:block;
  width:50px;
  height:50px;
  line-height:50px;
  text-align:center;
  font-size:24px;
  margin:0 auto;
  cursor:pointer;
  
}

footer>span:hover {
  /* background:lightgray; */
  
}

footer>div {
  display:none;
  padding:16px;
}