@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(fomb2.png);
        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: #798bbd77; /* to make scrollbar invisible */
}
::-webkit-scrollbar-thumb {
background: #798bbd7a;
}

::selection {
background: #ffffff0c;
color: #cccccc;
}

a { color: #e75db9; }

.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: #bfcef6;
  padding: 2px;
  margin: auto;
  border: #96aae0 5px solid;
  width: 1000px;
  height: 560px;
}

#box{
  background-color: #bfcef6;
  width: 1000px;
  height: 560px;
}

#header{
  background-image: url(fomb.jpg);
  background-repeat: no-repeat;
  background-size: 1000px;
  background-position-y: -80px;
  height: 149px;
  width: 1000px;
}

#mid{
  align-items: center;
  background-color: #eef0fa;
  color: #646e74;
  position: absolute;
  top: 160px;
 left: 0.1em;
  height: 400px;
  width: 390px;
  text-align: center;
  overflow: scroll;
  overflow-x: hidden;
  
}


#navs{
  background-color: #eef0fa;
position: absolute;
align-items: center;
text-align: center;
  top: 160px;
left: 24.71em;
  height: 400px;
  width: 156px;
color: #646e74;
}

#sides{
  text-align: center;
  align-items: center;
color: #646e74;
    background-color: #eef0fa;
position: absolute;
  top: 160px;
left: 34.7em;
  height: 400px;
  width: 446px;
  overflow: scroll;
  overflow-x: hidden;
}

#navtop{
    background-color: #bfcef6;
  display: flex;
  justify-content: center;
  align-items: center; 
  font-size: 25px;
  font-weight: 1000;
  height: 140px;
  width: 156px;
}

#about{
    background-color: #fdedff;
border: #50335346 2px solid;
    position: relative;
    left: 0.2em;
align-items: center;
text-align: center;
  height: 200px;
  width: 418px;
color: #746472;

}

#pfp{
      background-image: url(karma4.png);
      background-repeat: no-repeat;
      background-size: contain;
position: absolute;
align-items: center;
text-align: center;
  height: 200px;
  width: 200px;
color: #646e74;
}

#txt{
background-color: #4e944e00;
position: absolute;
left: 200px;
align-items: center;
text-align: center;
  height: 200px;
  width: 218px;
color: #534253;
}