.homepage{
    height: 100vh;
}
#heading{
    text-align:center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: 5px double /*#8A939E*/#FEC3A6;
    padding: 30px 50px;
    background: rgba(52, 57, 63,0.5);
    animation: mymove 1s ease-in-out;}

@keyframes mymove {
    0%   {opacity:0}
    100% {opacity:1}
}

h1{
    font-size:5em;
    color:/*#E5E7E9*/#EFE9AE;
    letter-spacing: 6px;
}

h1 em {
    background-color: /*#8A939E*/ #FEC3A6;
    height: 3px;
    width: 80px;
    display: block;
    margin: 0 auto;
    position: relative;
    bottom: -15px; }

h2{
    font-size:2em;
    color:#EFE9AE /*#E5E7E9*/;
    letter-spacing: 1px;
}

h3{text-align:center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: 180px;
    border: 1px outset #34393F;
    padding: 10px 20px;
    background: rgba(62, 68, 75,0.7);    
    color: /*#E5E7E9*/#FFAC81;
    font-size: 2em;
    box-shadow: 2px 2px 2px black;
    letter-spacing: 1px;
    animation: drop 2s;
}

@keyframes drop{
    0%   {top: 100%;}
    70%  {top: 49%;}
    100% {top: 50%;}
}

a{
    text-decoration: none;
}

h3:hover{
    box-shadow: 2px 2px 2px #505b62;
    border: 1px inset #34393F;
}

.menu{
    background: rgba(23, 26, 28,0.75);
    position:absolute;
    top: 2%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.7em;
    color: #E5E7E9;
    width:100%;
    text-align: center;
    overflow: scroll;
    letter-spacing: 1px;
    font-weight: bold;
    animation: menu 2.5s;
    overflow:auto;
    white-space: nowrap;
}

.menu a {
    display: inline-block;
    color: /*#E5E7E9*/#CDEAC0;
    text-align: center;
    padding: 14px 50px;
    margin-top: 10px;
    float:left;
}

@keyframes menu{
    0%{opacity:0;}
    40%{opacity:0;}
    100%{opacity:1;}
}

.menu a:hover {
    background-color: #484f58;
}

.active{
    background-color: #34393F;
}


#snowfall {
  width: 100%;
  height: 100vh;
}