body {
margin:0;
font-family: 'Abel', sans-serif;
  color: #444;
}
#banner{width:100%;position:absolute;}
#logo{position: relative;
      margin-left: auto; 
      margin-right: auto; 
      padding-top: 5%; 
      display: block; 
      width: 40%}
ul{list-style-type: none;overflow: hidden; top:0%;position: fixed;}
li a{display:block;text-align: center;padding: 1px 16px;color: white;text-decoration: none;}
li{float: left;background-color: #f4a8a8}

#one,#two,#three{margin: 0 auto;
    padding: 0% 2% 0% 2%}

span{color:#bcd2e8;font-size: 2em;font-weight: 600}


/*#container{
padding-top:10%;
width:90%;
margin:auto}*/

.img{  
  margin-left: 20px;
  margin-bottom: 20px; 
}

#one img{width: 100%}
#lineimg{width:100%;}

h1 {
   text-align:center;}
 #two{background-color: #bcd2e8}
#two img{width:100%; margin:0 auto}
#three{margin: 10px 0px 60px 0px}
#three a{padding: 2px 10px 2px 10px}
h2{font-size: 1.5em;background-color: #f4a8a8;color: white}

@media(min-width:580px){
    #one,#two,#three{margin: 0 auto;
    padding: 0% 15% 0% 15%}
    #three{margin: 10px 0px 100px 0px}
#menu ul{position:fixed;
}
ul{     
    top: 50%
   }
li{background-color:#f4a8a8;list-style-type:none;float: none;}
li a{color: white;text-decoration: none;display: block; }
li:hover{background-color: white;
         border:solid #f4a8a8 2px}
a:hover{font-weight: bold;color: #f4a8a8}

/*#container{
padding-top: 10%;
width:80%;
margin:auto}*/
     
#logo{width:30%}
#two img{text-align:center;margin-bottom: 2rem}
   
}
h3{text-align: center;color:#7e6e70;font-size: 1.5em}

@media(min-width:480px) and (max-width:899px){
}