/** {*/
/*    padding: 0;*/
/*    margin: 0;*/
/*    box-sizing: border-box;*/
/*}*/

/*body {*/
/*    width: 100%;*/
/*    height: 100vh;*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*}*/

.index-anim-container {
    width: 100%;
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.index-container {
    background-color: transparent;
    transform-style: preserve-3d;
    /*perspective: 1000px;*/
    /*-webkit-animation: fastspin 6s ease-in-out infinite 2s;*/
    /*animation: fastspin 6s ease-in-out infinite 2s;*/
    -webkit-transform: rotateX(-45deg) rotateY(45deg);
    transform: rotateX(-45deg) rotateY(45deg);
    transform-origin: 50px 50px;
}

.index-container :nth-child(1) {
    -webkit-transform: translateZ(50px);
    transform: translateZ(50px);
    /*background: radial-gradient(transparent 30%, rgba(152, 42, 255, 0.4) 100%);*/
    background: #999;
}

.index-container :nth-child(2) {
    -webkit-transform: translateY(50px) rotateY(-90deg);
    transform: translateY(-0px) translateX(-50px) rotateX(-90deg) rotateY(-90deg);
    /*background: radial-gradient(transparent 30%, rgba(139, 255, 37, 0.4) 100%);*/
    background: #333;
}

.index-container :nth-child(3) {
    -webkit-transform: translateZ(50px);
    transform: translateZ(-50px);
    /*background: radial-gradient(transparent 30%, rgba(152, 42, 255, 0.4) 100%);*/
    background: transparent;
}

.index-container :nth-child(4) {
    -webkit-transform: translateX(50px) rotateX(-90deg) rotateY(-90deg);
    transform: translateX(50px) rotateX(-90deg) rotateY(-90deg);
    /*background: radial-gradient(transparent 30%, rgba(139, 255, 37, 0.4) 100%);*/
    background: transparent;
}
.index-container :nth-child(5) {
    -webkit-transform: translateX(50px) rotateX(-90deg) rotateY(-90deg);
    transform: translateY(50px) rotateX(-90deg) rotateY(-0deg) rotateZ(-0deg);
    /*background: radial-gradient(transparent 30%, rgba(251, 44, 255, 0.4) 100%);*/
    background: transparent;
}
.index-container :nth-child(6) {
    -webkit-transform: translateX(8px) rotateX(-90deg) rotateY(-90deg);
    transform: translateX(0px) translateY(-8px) translateZ(-43px) rotateX(-90deg) rotateY(-0deg) rotateZ(-0deg);
    /*background: radial-gradient(transparent 0, rgba(251, 44, 255, 0.4) 100%);*/
    background: #999;
    border-radius: 0 0 12 12;
}
.index-container :nth-child(7) {
    -webkit-transform: translateX(8px) rotateX(-90deg) rotateY(-90deg);
    transform: translateX(0px) translateY(-8px) translateZ(-17px) rotateX(-90deg) rotateY(-0deg) rotateZ(-0deg);
    /*background: radial-gradient(transparent 0, rgba(251, 44, 255, 0.4) 100%);*/
    background: #999;
}
.index-container :nth-child(8) {
    -webkit-transform: translateX(8px) rotateX(-90deg) rotateY(-90deg);
    transform: translateX(50px) translateY(-8px) translateZ(10px) rotateX(-90deg) rotateY(-0deg) rotateZ(-0deg);
    /*background: radial-gradient(transparent 0, rgba(251, 44, 255, 0.4) 100%);*/
    background: #999;
}
.index-container :nth-child(9) {
    -webkit-transform: translateX(10px) rotateX(-90deg) rotateY(-90deg);
    transform: translateX(50px) translateY(-10px) translateZ(40px) rotateX(-90deg) rotateY(-0deg) rotateZ(-0deg);
    /*background: rgba(251, 44, 255, 0.4);*/
    background: #999;
    border-radius: 0 12 0 0;

}

.index-cube-container {
    text-align: center;
    line-height: 100px;
    position: absolute;
    width: 100px;
    height: 100px;
    background-color: aqua;
    /*border: 1px dashed rgba(100, 100, 100, 0.5);*/
}

.index-cube-container-line {
    text-align: center;
    line-height: 16px;
    position: absolute;
    width: 100px;
    height: 16px;
    /*background-color: black;*/
    /*border: 1px dashed rgba(100, 100, 100, 0.5);*/
}
.index-cube-container-half {
    text-align: center;
    line-height: 16px;
    position: absolute;
    width: 50px;
    height: 16px;
    background-color: black;
    /*border: 1px dashed rgba(100, 100, 100, 0.5);*/
}
.index-cube-container-half-thick {
    text-align: center;
    line-height: 20px;
    position: absolute;
    width: 50px;
    height: 20px;
    background-color: black;
    /*animation: fast9 6s ease-in-out infinite 2s;*/
    /*border: 1px dashed rgba(100, 100, 100, 0.5);*/
}