@import 'reset.css';
@font-face {
    font-family: '215000E'; /*a name to be used later*/
    src: url('../fonts/215000E.ttf'); /*URL to font*/
}
@font-face {
    font-family: 'CFAnarchy'; /*a name to be used later*/
    src: url('../fonts/CFAnarchy-Regular.ttf'); /*URL to font*/
}

body {
    font-family: '215000E',serif;
    background-color:black;
    overflow-x: hidden;
    overflow-y: hidden;

}
.testHeadline{
    margin:10px auto;
    text-align:center;
    font-size:10vw;
    letter-spacing: 15px;
    width:100%;
    height:100%;
}

.cubeContainer{
    position:relative;
    margin-top:25vh;

}
.cubeContainer div {
    position: absolute;
    width: 100%;
    margin: 10px auto;
    text-align: center;
    font-size: 10vw;
    letter-spacing: 15px;
}
.start{
    transform: rotateX(90deg);
}

.flip {
    -webkit-animation: flipForward 3000ms ease-in-out 0s 1 normal;
    -moz-animation:    flipForward 3000ms ease-in-out 0s 1 normal;
    -o-animation:      flipForward 3000ms ease-in-out 0s 1 normal;
    animation:         flipForward 3000ms ease-in-out 0s 1 normal;
}

@-webkit-keyframes flipForward {
    0%   { transform: perspective(1000px) rotateX( 90deg); }
    35%   { transform: perspective(1000px) rotateX( 0deg); }
    65%   { transform: perspective(1000px) rotateX( 0deg); }
    100% { transform: perspective(1000px) rotateX( -90deg); }
}