
body {
  background-image: url("images/background600titles.png");
  background-position:  top  right;
  font-family: Verdana,Arial,Helvetica,sans-serif;    
  background-color:rgb(204, 204, 255);   
  background-repeat: no-repeat;
  }
	.introtext {
       position: absolute;
       top: 55%;
       width: 100%;  
       font-family: Verdana,Arial,Helvetica,sans-serif;
       font-size:x-large;
       text-align: center; 
       z-index: 3;
   }
 .bodytext {
	      font-family: Verdana,Arial,Helvetica,sans-serif;
	      text-decoration:none;
	      color:#000000;
	      font-size: large;
   }  
 
      #mobilemenu {
 z-index: 5;
}

#hamburger-menu {
    position: fixed;
    top: 20px;
    left: 20px;
    width: 50px;
    height: 50px;
    display: block;
    border: none;
    padding: 0px;
    margin: 0px;
    font-family: 'Cabin', Sans-serif;
    background: linear-gradient(
      to bottom, 
       #3D0E61, #3D0E61 20%, 
     rgb(204,204,255) 20%, rgb(204,204,255) 40%, 
      #3D0E61 40%, #3D0E61 60%, 
      rgb(204,204,255) 60%, rgb(204,204,255) 80%, 
      #3D0E61 80%, #3D0E61 100%
    );
}

#hamburger-menu #sidebar-menu {
    visibility: hidden;
    position: fixed;
    top: 0;
    left: -350px;
    width: 300px;
    height: 100%;
    background-color: #3D0E61;
    transition: 0.3s;
    padding: 0px 10px;
    box-sizing: border-box;
}

#hamburger-menu h3 {
  color: #B9FAF8;
  font-size: 2.2rem;
}

#hamburger-menu ul {
  padding-left: 0px;
}

#hamburger-menu li {
  list-style-type: none;
  line-height: 3rem;
}

#hamburger-menu a {
  color: #B9FAF8;
  font-size: 1.3rem;
  text-decoration: none;
}

#hamburger-menu a:hover {
  text-decoration: underline;
}
#hamburger-input{
  display: none;
}
#hamburger-input:checked + #hamburger-menu #sidebar-menu {
    visibility: visible;
    left: 0;
}
#hamburger-input:checked ~ .overlay{
   visibility: visible;
  opacity: 0.4;
}

 .center  {
       width:100%;
       position: absolute;
       top: 300px;
       align-content: center;
       text-align: center;
       z-index: -2;
     }   
.overlay{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s, visibility .35s, height .35s;
    overflow: hidden;
    background: black;
    z-index: 3;
}
#mobilemenu {
 z-index: 5;
}

#hamburger-menu #sidebar-menu {
    visibility: hidden;
    position: fixed;
    top: 0;
    left: -350px;
    width: 300px;
    height: 100%;
    background-color: #3D0E61;
    transition: 0.3s;
    padding: 0px 10px;
    box-sizing: border-box;
}

#hamburger-menu h3 {
  color: #B9FAF8;
  font-size: 2.2rem;
}

#hamburger-menu ul {
  padding-left: 0px;
}

#hamburger-menu li {
  list-style-type: none;
  line-height: 3rem;
}

#hamburger-menu a {
  color: #B9FAF8;
  font-size: 1.3rem;
  text-decoration: none;
}

#hamburger-menu a:hover {
  text-decoration: underline;
}
#hamburger-input{
  display: none;
}
#hamburger-input:checked + #hamburger-menu #sidebar-menu {
    visibility: visible;
    left: 0;
}
#hamburger-input:checked ~ .overlay{
   visibility: visible;
  opacity: 0.4;
}
.bodytext
{
	font-family: Verdana,Arial,Helvetica,sans-serif;
	text-decoration:none;
	color:#000000;
	font-size: x-large;
	text-align: center;
}
div.a {
  text-align: center;
}
.button {
  font-family: Verdana,Arial,Helvetica,sans-serif;
  background-color: #3D0E61;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}
.heading {
 position: relative;
 width: 100%;
 top:-50px;
 z-index:2;
}

@media only screen and (orientation: landscape) {
  .center  {
       width:80%;
       position: absolute;
       top: 45%;
       align-content: center;
       text-align: center;
       z-index: -2;  }
      }
.table1 {
				   position: absolute;
       top: 280px;
       width: 95%;
       font-family: Verdana,Arial,Helvetica,sans-serif;
       font-size: x-large;
							text-align: center;
        z-index: -3
       }
   .introtext {
       position: absolute;
       top: 650px;
       width: 100%;  
       font-family: Verdana,Arial,Helvetica,sans-serif;
       font-size:large;
       text-align: center; 
       z-index: 3;
   }
   .text {
      position: absolute;
      top: 170px;
      left: 30px;
      width: 55%;  
      font-family: Verdana,Arial,Helvetica,sans-serif;
      font-size:large;
      text-align: center;  
       z-index: -1;
   }
  .text2 {
   font-family: Verdana,Arial,Helvetica,sans-serif;
   font-size:large;
   width: 100%;
   position: absolute;
   top: 500px;
   }
  .text3 {
   font-family: Verdana,Arial,Helvetica,sans-serif;
      font-size:large;
   width: 100%;
   position: absolute;
   top: 450px;
   text-align: center;
  }
   .text4 {
   font-family: Verdana,Arial,Helvetica,sans-serif;
   font-size:large;
   width: 100%;
   position: absolute;
   top: 350px;
   text-align: center;
  }
  .a {
  text-align: center;
  top: 400px;
}