body {
  font-family: "Arial", sans-serif;
  font-size: 17px;
  background: #ffffff url("https://elevate.neocities.org/img/pink-flower-bg.png"); 
  text-align: left;
  background-attachment: fixed;
  background-position: left top;
  background-size: cover;
    margin: 10px;

}


  


p {
 font-size: 20px;
 font-family: 'Roboto', 'Arial', sans-serif;
 text-align:left;
}

li {
  text-align: left;
  margin-left: 20px
  }

h1 {
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  }
  
h2 {
  text-align: left;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 0px;
  margin-top: 2px;
  }
  
h3 {
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  }

.t1 {
font-family: 'Andale Mono','AndaleMono',monospace; 
font-size:45px;
font-weight:700;
text-align:center;
}
  

.logo {
width: 100%;
max-width: 900px;
margin-top:5px;
margin-bottom:-108px;
text-align: left;
overflow:visible;
background-color:transparent;
position: static;
z-index: 50;

}


.nav {
width: 222px;
margin-top:215px;
text-align: left;
margin-left:10px;
overflow:visible;
background-color:black;
position: absolute;
float:right;
padding:50px;
box-sizing: border-box;
z-index: 5;
}

.footer {
    width: 100%;
    margin: 0 auto;
    margin-top:10px;
    background-color: #ffffff;
    max-width:900px;
    padding:15px;
    position: relative;
    box-sizing: border-box;
    border:1px solid black;
    text-align:center;
    z-index: 2;
    }


a.menu:link, a.menu:visited, a.menu:active
{ color:#ffffff; text-decoration:underline; font-size:24px;}

a.menu:hover {color:#ffffff; text-decoration:none; font-size:24px; }


.container {
          
                max-width:900px;
                width:100%;
                margin: 0 auto;
                background-color: var(--container-bg-color);
                overflow:visible;

                }
              

.header {
  
  margin-top:100px;
  position: relative;
  background-color: transparent; 
  width:100%;
  overflow-y: visible;
  clear:none;
  z-index: -1;
  }

  .box {
  margin-top:10px;
  background-color: #ffffff;
  width:100%;
  max-width:900px;
  overflow-y: visible;
  padding:15px;
  position: relative;
  box-sizing: border-box;
  border:3px solid black;
  z-index: 2;

}

  
/*Mobile compatibility.*/
@media (orientation: portrait) {
  .nav {
    margin: 0 auto;
    position: static;
    width: 100%;
      box-sizing: border-box;
          float:none;
    }
    
  .logo
  {
    margin: 0;
    position: static;
    margin-bottom:0px;
    width: 100%;
  }
    
  .main, .main-first, .box, .header, .container {
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
        float:none;
    }
    
    .footer {
    margin: 0 auto;
    margin-top:10px;
    width: 100%;
    }
    
    
}