body[index] {background:white;}

holder[index] {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 95px;
    text-align: center;
    height: 20px;
    margin-top: -100px;
    transform: translate(-50%);
    perspective: 300px;
    cursor:pointer;
    padding:0 0 20px;
}

flap {
	display:inline-block;
	width:20px;
	height:100%;
	transition: transform 1s;
	transform-style: preserve-3d;		
	transform-origin:bottom;
	font-size: 9px;
    font-family: helvetica;
    color: whitesmoke;
    line-height: 20px;
}

flap[one]{
	animation:animate2 7s infinite;
	background:#f86c48;
}

flap[two] {
	animation:animate2 3s infinite;
	background:#3a77d1;
}

flap[three] {
	animation:animate2 5s infinite;
	background:#e8d52f;
}

flap[four] {
	animation:animate2 2s infinite;
	background:#fa77f2;
}

@keyframes animate2 {
	0% {transform: rotateX(0);}
	50% {transform: rotateX( -180deg );}
}

text {
	position:absolute;
	transform:translateX(-50%);
	left:50vw;
	top:50vh;
	font-family:times;
    font-size: 0.65em;
    letter-spacing: 0.08em;
	text-align:center;
}

thing, ie, safari {
    display: block;
    margin: 20px 0;
}

thing:nth-of-type(2) {margin-right:-22px;}

thing img, thing svg, ie svg, safari svg {
    height:18px;
    margin: -4px 5px;
}

ie, ie a, safari, safari a {color:red;text-decoration:none;}
ie, safari {display:none;}

thing svg.attention {height:15px;}

thing svg.attention path, ie svg, safari svg {fill:#FF5722;}
thing svg.unmute path {fill:#4183e6;}
thing svg.mute path {fill:#e8d52f;}
thing svg.no path {fill:#ff9200;}

a[mirror] {
    margin-top: 9vh;
    display: block;
    color: #ababab;
    text-decoration: none;
    font-family: consolas;
    font-size: 0.9em;
    line-height: 1.5em;
}

red {color:#ff5722;}

shh {display:block;width:0px;height:0px;overflow:hidden;}


