/*  **  mic.css  **  */


.mic-wrap {
	position:absolute;
	width:110px;
	height:600px;
	transform:scale(.33,.33) skew(-0deg);
	top:43vh;
	left:49%;
	animation: MIC-1 20.5s linear 32s 1 forwards, MIC-2 28s linear 101s 1 forwards, MIC-3 27s linear 139s 1 forwards, MIC-4 28s linear 206s 1 forwards;	
}

.mic-head {
	position:relative;
	top:0;
	width:100px;
	height:100px;
	border:5px solid;
	border-radius:50%;
}

.mic-center {
	position:relative;
	width:50px;
	height:50px;
	border-radius:50%;
	margin-left:auto;
	margin-right:auto;
	top:25px;
	background-color:#C0C0C0;
	border:1px #c0c0c0;
}

.mic-holder {
	position:absolute;
	top:30px;
	width:100px;
	height:35px;
	border-radius:50%;
	border:2px solid;
}

#mh-1 {
	transform: rotate(45deg);
}

#mh-2 {
	transform: rotate(-45deg);
}

.mic-post {
	position:relative;
	width:10px;
	height:475px;
	margin:auto;

}

.mic-base {
	position:absolute;
	bottom:0px;
	left:-25px;
	width:150px;
	height:25px;

	border-radius: 50%;
}

.mic-post, .mic-base  {
	background-color:#222;
}

.mic-head, .mic-holder {
	border-color:#777;
}

/*  **  KEYFRAMES  ** */

/* MIC-1 */
        @keyframes MIC-1 { 
0%   	{transform:scale(.33,.33) skew(-0deg);}
2%		{transform:scale(.33,.33) skew(-8deg);}
98%		{transform:scale(.33,.33) skew(-8deg);}
100% 	{transform:scale(.33,.33) skew(-0deg);}
}

/* MIC-2 */
        @keyframes MIC-2 { 
0%   	{transform:scale(.33,.33) skew(-0deg);}
2%		{transform:scale(.33,.33) skew(-8deg);}
98%		{transform:scale(.33,.33) skew(-8deg);}
100% 	{transform:scale(.33,.33) skew(-0deg);}
}

/* MIC-3 */
        @keyframes MIC-3 { 
0%   	{transform:scale(.33,.33) skew(-0deg);}
2%		{transform:scale(.33,.33) skew(-8deg);}
98%		{transform:scale(.33,.33) skew(-8deg);}
100% 	{transform:scale(.33,.33) skew(-0deg);}
}

/* MIC-4 */
        @keyframes MIC-4 { 
0%   	{transform:scale(.33,.33) skew(-0deg);}
2%		{transform:scale(.33,.33) skew(-8deg);}
98%		{transform:scale(.33,.33) skew(-8deg);}
100% 	{transform:scale(.33,.33) skew(-0deg);}
}