.element {
    width: 4em;
    height: 4em;
    display: inline-block;
    cursor: pointer;
    border: 1px solid rgb(200,200,200);
    border-radius: 50px;
}


/*.god {
    max-width:1000px;
}
*/

#content {
    overflow: hidden;
}

.god-outer::before, .god-outer::after {
    content:"";
    position: absolute;
    width: 50%;
    top: 0;
    bottom: 0;
    z-index: 9;
    background-color: rgba(0,0,0, 0.99);
    background: url("../img/curtain.jpg");
    transition: all 5s;
}
.god-outer::before{
    left: 0;
} 

.god-outer::after {
    right: 0;
}

.god-outer.open::before {
    left: -52%;
    /*width:10%;*/
    /*transition: all 2s;*/
}

.god-outer.open::after { 
    right: -52%;
    /*width:10%;*/
    /*transition: all 2s;*/
}

/* 
@media screen and (max-height:567) {
    .elements {
        position: absolute;
        right: 0;
        top:0;
        display: none;
        
    }
} */

/* #content { width: 100%; height: 100%; top: 42px;
    overflow: hidden; position: absolute; } */

    #snowflake { width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; }
.snowRoll { position: absolute; opacity: 0; -webkit-animation-name: mysnow; -webkit-animation-duration: 20s; -moz-animation-name: mysnow; -moz-animation-duration: 20s; height: 80px; }
 @-webkit-keyframes mysnow { 0% {
 bottom: 100%;
}
 50% {
 -webkit-transform: rotate(1080deg);
}
 100% {
 -webkit-transform: rotate(0deg) translate3d(50px, 50px, 50px);
}
}
 @-moz-keyframes mysnow { 0% {
 bottom: 100%;
}
 50% {
 -moz-transform: rotate(1080deg);
}
 100% {
 -moz-transform: rotate(0deg) translate3d(50px, 50px, 50px);
}
}

