html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  }

body
{
 margin:0px auto;
 padding:0px;
 text-align:center;
 width:100%;
 font-family: Prompt;
 background-color:#A9D0F5;
}
#header
{
 width:100%;
 margin:0px auto;
 padding:0px;
 text-align:right;
 height:70px;
 white-space: nowrap;
 float:right;
 position:absolute;
 font-size:1.4vw;
}
#header li
{
 display:inline-block;
 color:#FFFFFF;
 font-weight:bold;
 cursor:pointer;
}
#header button
{
 display:inline-block;
 margin-right:20px;
 font-size:17px;
 color:#FFFFFF;
 background-color: transparent;
 border-color:#FFFFFF;
 font-weight:bold;
 cursor:pointer;
 line-height: 30px;
 padding-right: 15px;
 padding-left: 15px;
 border-radius: 15px;
}
#header input[type=text] {
  border: 2px;
  font-size: 17px;
  height:40px;
  width:160px;
  border-radius: 5px;
}
#home,#about,#contact
{
 border-radius:10px;
 color:white;
}
#home h1
{
 font-size:40px;
}
#home p
{
 font-size:20px;
}
#about p
{
 font-size:20px;
}
#contact input[type="text"]
{
 width:250px;
 height:35px;
 padding-left:10px;
 float:left;
 margin-left:80px;
 border:none;
}
#contact textarea
{
 float:left;
 width:250px;
 height:35px;
 margin-left:20px;
 border:none;
 padding-left:10px;
 padding-top:10px;
}
#contact input[type="submit"]
{
 float:left;
 margin-left:20px;
 height:35px;
 width:100px;
 background:none;
 color:white;
 border:1px solid white;
}

#topBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  left: 10px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: red;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#topBtn:hover {
  background-color: #555;
}

.loginmodal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
}
.headmodal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 2; /* Sit on top */
}

.headmodal-content {
  background-color: rgb(0,0,0);
  background-color: rgba(254,254,254,0.8);
  margin-top: 5px;
  padding: 5px;
  border: 1px solid #888;
}
.headmodal-content p {
  margin-bottom: 5px;
  cursor: pointer;
  margin-left:10px;
  margin-right:10px;
}


/* Modal Content */
.loginmodal-content {
  background-color: rgb(0,0,0);
  background-color: rgba(254,254,254,0.4);
  margin-top: 5px;
  padding: 5px;
  border: 1px solid #888;
}
.loginmodal-content p {
  margin-bottom: 5px;
}
#loginmodal-button {
  background-color: #ffffff;
  padding: 5px;
  padding-right: 20px;
  padding-left: 20px;
  border-radius: 20px;
  font-size:15px;
  white-space: nowrap;
}

/* The Close Button */
.loginclose {
  color: #aaaaaa;
  float: right;
  font-size: 20px;
  font-weight: bold;
}

.loginclose:hover,
.loginclose:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

#header .headicon {
  display: none;
}

.navresp {
  padding: 12px 16px;
}

@media screen and (max-width: 1099px) {
  #header .navresp {
    display: none;
  }
  #header .headicon {
    float: right;
    display: block;
    margin-right: 10px;
  }
}
@media screen and (min-width: 999px) {
  #header {
     line-height: 60px;
  }
}
