@font-face {
font-family: pixel;
src: url(https://dl.dropbox.com/s/kmhe7d3n18vdz5e/w95fa.woff?dl=0);
}

@font-face {
font-family: "annoying kettle";
src: url('https://dl.dropboxusercontent.com/s/ym4auwzsduc1llw/annoyingkettle.ttf?dl=0');
}

@font-face { 
font-family: "crewniverse"; 
src: url('https://dl.dropboxusercontent.com/s/tbbeoiwfdly16c2/crewniverse_font.ttf?dl=0');
}

html{
    font-family: pixel;
    position: relative;
}


html{
    background-image: url(bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
}

html {
overflow: scroll;
overflow-x: hidden;
overflow-y: hidden;
}
::-webkit-scrollbar {
width: -1; /* remove scrollbar space */
background: #0000000a; /* to make scrollbar invisible */
}
::-webkit-scrollbar-thumb {
background: #ffffff2f;
}

::selection {
background: #ffffff0c;
color: #cccccc;
}

a { color: #040b1d; }

.hi {
  background-image: linear-gradient(to right, #e04a4a, #e49554, #f0f071, #4e944e, #50a0ce, #8e55b6, #ee82ee);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-size: 50px;
    font-weight: bold;
}

.bye {
  background-image: linear-gradient(to right, #e04a4a, #e49554, #f0f071, #4e944e, #50a0ce, #8e55b6, #ee82ee);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: bold;
}



#container{
  position: relative;
  background-color: #ffb546;
  padding: 2px;
  margin: auto;
  border: #bd633a 5px solid;
  width: 1000px;
  height: 560px;
}

#box{
  background-color: #ffb546;
  width: 1000px;
  height: 560px;
}

#header{
  background-image: url(banner.jpg);
  background-repeat: no-repeat;
  background-size: 1000px;
  background-position-y:-100px;
  height: 149px;
  width: 1000px;
border: #00000000 1px solid;

}

#mid{
  align-items: center;
  background-color: #65a3ff;
  border: #3a65b4 1px solid;
  color: #1f3f7a;
  position: absolute;
  top: 160px;
 left: 0.1em;
  height: 400px;
  width: 390px;
  text-align: center;
  overflow: scroll;
  overflow-x: hidden;
  
}


#navs{
  background-color: #ffb546;
    border: #a0543100 1px solid;

position: absolute;
align-items: center;
text-align: center;
  top: 160px;
left: 24.71em;
  height: 400px;
  width: 156px;
color: #a05431;
}

#sides{
  text-align: center;
  align-items: center;
color: #1f3f7a;
  border: #3a65b4 1px solid;
    background-color: #65a3ff;
position: absolute;
  top: 160px;
left: 34.7em;
  height: 400px;
  width: 446px;
  overflow: scroll;
  overflow-x: hidden;
}

#navtop{
    background-color: #ffb546;
  display: flex;
  justify-content: center;
  align-items: center; 
  font-size: 25px;
  font-weight: 1000;
  height: 140px;
  width: 156px;
}

