* {
    margin: 0;
    padding: 0;
  }

.nav-area{
   
    float:right;
    list-style: none;
    margin-top: 20px;
    margin-right: 5%;
}
.nav-area li{ 
    display:inline-block;
}
.nav-area li a{
    
    background-color: rgb(230, 220, 219);
    text-decoration:rgb(13, 9, 21);
    font-size: 130%;
    font-family: poppins;
    border-radius: 7px;
    padding:5px 20px;
    color: rgb(32, 51, 50);
}
.nav-area li a:hover{
    background: rgb(45, 221, 204);
    color: rgb(14, 11, 10);
}
h1.heading{
   
  color: rgb(245, 249, 252);
  margin-left: 1mm;
  font-size: 200%;
  font-family: "Comic Sans MS", cursive, sans-serif,"Trebuchet MS",Helvetica, sans-serif;
  font-style: initial;
  font-variant: normal;
  padding: 5px 10px;
}
.container{
 
}
.matter{
  margin-top:70px ;
  margin-left: 300px;
  font-size: 30px;
  color: rgb(75, 42, 112);

}
.tbutton{
  margin-top: 40px;
  margin-left: 600px;
  padding: 15px 30px;
  border-radius: 8px;
  color: rgb(15, 208, 221);
  font-size: 23px;
  font-weight: bold;
}

.contain{
   background-color: rgb(15, 33, 60);
   padding:5px 30px;
}
#welcome{
  color: rgb(230, 87, 115);
  margin-left: 420px;
  margin-top: 50px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-size: 50px;
}
body{
  background:url(image.jpg) no-repeat;
  height:594px;
   background-size: 100%;
}
/* 
 margin-top: 2px;
  height:1000px;
  width: 800px;
  margin-left: 560px;background-color: rgb(99, 150, 150) ;
 margin-left: 780px;
    margin-top: 30px;
      height: 500px;
      background: rgb(240, 87, 67);
      color
      <h2 id="next">with one click.</h2>
      #next{
  color: rgb(41, 5, 82);
  font-size: 32px;
  margin-left: 50px;
  linear-gradient(to right, #b18cd6cc,#64bbceba),
}
*/