body {
    color: #333;
    padding: 20px;
    text-align: center;
    font-family: Arial;
}

.separator {
    margin-top: 40px;
}

/* 3D Cube */
.space3d {
    perspective: 1000px;
    width: 250px;
    height: 250px;
    text-align: center;
    display: inline-block;
    margin-top: 150px;
}

._3dbox{
    display: inline-block;
    transition: all 0.85s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    text-align: center;
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transform: rotateX(-15deg) rotateY(15deg);
}

._3dface {
    overflow: hidden;
    position: absolute;
    border: 1px solid #888;
    background: #FFF;
    box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.1), 0 0 50px rgba(0, 0, 0, 0.3);
    color: #333;
    line-height: 250px;
    opacity: 0.8;
}

._3dface--front {
    width: 250px;
    height: 250px;
    transform: translate3d(0, 0, 125px);
}

._3dface--top {
    width: 250px;
    height: 250px;
    transform: rotateX(90deg) translate3d(0, 0, 125px);
}

._3dface--bottom {
    width: 250px;
    height: 250px;
    transform: rotateX(-90deg) translate3d(0, 0, 125px);
}

._3dface--left {
    width: 250px;
    height: 250px;
    left: 50%;
    margin-left: -125px;
    transform: rotateY(-90deg) translate3d(0, 0, 125px);
}

._3dface--right {
    width: 250px;
    height: 250px;
    left: 50%;
    margin-left: -125px;
    transform: rotateY(90deg) translate3d(0, 0, 125px);
}

._3dface--back {
    width: 250px;
    height: 250px;
    transform: rotateY(180deg) translate3d(0, 0, 125px);
}
.front{
    transform: rotateX(180deg);
}
.left{
    transform: rotateY(90deg);
}
.right{
    transform: rotateY(-90deg);
}
.bottom{
    transform: rotateX(90deg);
}
.top{
    transform: rotateX(-90deg);
}
.back{
    transform: rotateY(180deg);
}

._3dface--front {
    background: url(../images/1.jpg);
    background-size: 100%;
}

._3dface--left {
    background: url(../images/2.jpg);
    background-size: auto 100%;
}

._3dface--right {
    background: url(../images/3.jpg);
    background-size: auto 100%;
}

._3dface--top {
    background: url(../images/4.jpg);
    background-size: auto 100%;
}

._3dface--bottom {
    background: url(../images/5.jpg);
    background-size: auto 100%;
}

._3dface--back {
    background: url(../images/6.jpg);
    background-size: auto 100%;
}
.options{
    margin-top: 100px;
}