body{
  background: #101010;
  margin: 0;
}

.loader{
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: #101010;
  text-align: center;
}

#loader-svg {
  display: block;
  /* margin: 20% auto; */
  position : relative;
  top: 40vh;
  left: 44vw;
}

.svg-path {
  fill: none;
  stroke: #f7f7f7;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

small#loading {

font-size: 13px;

color: #f3f3f3ad;

position: fixed;

top: 57%;

font-family: sans-serif;
}

.menu{

position: relative;

top: 100%;

height: 100vh;

background: #1f1f1f;

z-index: 10;
}

.item{

width: 100px;

height: 100px;

position: absolute;

background-color: black;

border-radius: 15px;
}

.item.one{

top: 30%;

left: 20%;

background-image: url(images/paperoids.png);

background-size: contain;
}

.item.two{

top: 30%;

left: 38%;

background-image: url(images/typatone.png);

background-size: contain;
}

.item.three{

top: 30%;

left: 57%;
background-image: url(images/nyan.png);

background-size: contain;
}

.item.four{

top: 30%;

left: 75%;
}

.more-btn{

height: 50px;

width: 50px;

position: fixed;

left: 50vw;

bottom: 54px;

color: white;

/* background-color: white; */

border-radius: 50%;

text-align: center;

/* font-size: 38px !important; */

transition: .25s ease-in-out;

z-index: 9;
}

.more-btn:hover {
    color: black;
    background: white;
    cursor: pointer;
}

.material-icons{
  font-size: 45px !important;
}

.one-btn{

/* height: inherit; */

/* width: inherit; */

width: 100px;

height: 100px;

border-radius: 15px;

/* border-radius: inherit; */

background-color: transparent;

color: transparent;

border: none;

transition: .25s ease-in-out;

padding: 0;
}

.one-btn:hover {
    background-color: #000000b3;
    color: white;
    cursor: pointer;
}