.fadeintop
{
  opacity:0;
transform: translateY(100px);
  max-width:100%;
    transition: transform 1s ease;
}
.fadein
{
  opacity:0;
transform: translateY(100px);
  max-width:100%;
      transition: transform 1s ease;
}

        .hamburger-menu {
          display: inline-block;
          height: 100px;
          position: fixed;
          left:150px;
          z-index: 999;
          padding: 35px 25px;
          transition: all 0.3s ease-in-out;
          left:90%;
          position:fixed;
          z-index:999;
        }
        .hamburger-menu:hover {
          cursor: pointer;
        }
        .hamburger-menu .menu-item {
          background: black;
          display: block;
          height: 3px;
          margin: 0 0 10px;
          transition: all 0.3s ease-in-out;
          width: 40px;
        }
        .hamburger-menu.open .menu-item {
          margin: 0 0 5px;
        }
        .hamburger-menu.open .menu-item:first-child {
          -webkit-transform: rotate(45deg);
                  transform: rotate(45deg);
          -webkit-transform-origin: 10px;
                  transform-origin: 10px;
                  background: white !important;
        }
        .hamburger-menu.open .menu-item:nth-child(2) {
          opacity: 0;
        }
        .hamburger-menu.open .menu-item:nth-child(3) {
          -webkit-transform: rotate(-45deg);
                  transform: rotate(-45deg);
          -webkit-transform-origin: 8px;
                  transform-origin: 8px;
                  background: white !important;
        }


    @-webkit-keyframes slide-down {
      0% { opacity: 0;  }
    100% { opacity: 1;  }
}
@-moz-keyframes slide-down {
      0% { opacity: 0; }
    100% { opacity: 1; }
}
/*
    #on
    {
           -webkit-animation: slide-down .5s ease-out;
    -moz-animation: slide-down .5s ease-out;
    }
    #off
    {

    }
.menu-on
    {
        left:90%;
        position:fixed;
        z-index:999;
    }
    .menu-off
    {
        left:90%;
        position:fixed;
        z-index:999;
        display: none;
    }
*/
.menu-back.open
{
  display: block;

  left:0%;
  width:100%;
  transition:all 1s;
  -webkit-transition:all 1s ;
      opacity: 1;
}

.menu-back{
position:fixed;

top:0%;
left:0%;
z-index:997;
width:0%;
height:100%;

background-image:url(./assets/image/menuback.jpg);
background-size:cover;
-webkit-filter: grayscale(100%);
filter: gray;
/*  display: none;*/
transition:all 1s;
-webkit-transition:all 1s;
opacity: 0.1;
left:100%;
}

.menu{
position:fixed;
top:0px;
left:0px;
z-index:998;
width:100%;
height:100%;
  background: transparent;
background:black;
background-size:cover;
transition:all 1s;
-webkit-transition:all 1s;
opacity: 0.7;
}
    .indicator
    {
        display:none;
    }