#body{
background:#333333;
width:100%;
height:100vh;
margin:0;
padding:0;
box-sizing:border-box;}

#menu{
padding:20px 0px 0px 0px;}

#menu h1{
color:#FFFFFF;
font-size:30px;
}

#menu a{
color: #999999;
font-size:19px;
text-decoration:none;
margin:0px 20px 0px 0px;
text-align:center;
transition:0.2s;
}

.active{
border-bottom:4px solid #FFFFFF;
color:#FFFFFF !important;}

#menu a:hover{
border-bottom:4px solid #999999;}

#middle h1{
font-size:40px;
color:#FFFFFF;
text-align:center;
margin:220px 0px 15px 0px;}

#middle p{
font-size:19px;
color:#FFFFFF;
text-align:center;
font-weight:300;}

.btnn{
display:block;
width:150px;
height:55px;
background:#FFFFFF;
color:#000000 !important;
margin:10px auto 200px auto;
text-decoration:none !important;
font-size:19px;
text-align:center;
padding:12px 0px 0px 0px;
border-radius:7px;
font-weight:700;}

.footer{
font-size:16px !important;
color: #999999 !important;
text-align:center !important;
position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;}

.footer a{
color: #FFFFFF !important;
text-decoration:none !important;}

.footer a:hover{
text-decoration: underline !important;}


@media only screen and (max-width:1050px) {

#middle h1{
margin:400px 0px 20px 0px;}

.btnn{
margin:10px auto 450px auto;}

}

@media only screen and (max-width:850px) {

#middle h1{
margin:250px 0px 20px 0px;}

.btnn{
margin:10px auto 250px auto;}

#menu a{
font-size:15px;
margin:0px 10px 0px 0px;
}


}

@media only screen and (max-width: 600px) {

#menu h1{
text-align:center;
margin:0px 0px 15px 0px;
}

#menu a{
font-size:19px;
margin:0px 20px 0px 0px;
}

#middle h1{
margin:130px 0px 20px 0px;}

.btnn{
margin:10px auto 200px auto;}


}