 .rotate {
	 transform: rotate(-25deg);
}
 .clearfix:before, .clearfix:after {
	 content: " ";
	 display: table;
}
 .clearfix:after {
	 clear: both;
}
 .cassetteOuter {
	 position: relative;
	 margin: 0em auto;
	 background: #ddd;
	 border-radius: 0.7em;
	 width: 20em;
	 height: 12em;
	 box-shadow: #959595 0 0.6em 0 0;
	 padding: 1em;
	 border-top: #d5d5d5 solid 0.1em;
	 border-bottom: #a2a2a2 solid 0.1em;
}
 .cassetteOuter:before {
	 position: absolute;
	 bottom: 1em;
	 right: 100%;
	 content: "";
	 height: 3.5em;
	 border-right: #959595 solid 0.2em;
	 border-top: transparent solid 0.2em;
	 border-bottom: transparent solid 0.2em;
}
 .cassetteOuter:after {
	 position: absolute;
	 z-index: -9000;
	 bottom: 1em;
	 left: 100%;
	 content: "";
	 height: 3.5em;
	 border-left: #aeaeae solid 0.2em;
	 border-top: transparent solid 0.2em;
	 border-bottom: transparent solid 0.2em;
}
 .screw {
	 position: absolute;
	 display: block;
	 width: 0;
	 height: 0;
	 border-left: #5e5f5a solid 0.4em;
	 border-bottom: #5e5f5a solid 0.3em;
	 border-top: #c3c4c1 solid 0.4em;
	 border-right: #c3c4c1 solid 0.4em;
	 border-radius: 50%;
	 box-shadow: #7b7b7b 0 -0.2em 0 0;
}
 .screw:before {
	 position: absolute;
	 top: -0.25em;
	 right: -0.35em;
	 display: block;
	 content: "";
	 width: 0.3em;
	 height: 0.2em;
	 border-radius: 50%;
	 background: #fff;
	 transform: rotate(45deg);
}
 .screw.screw1 {
	 top: 0.5em;
	 left: 0.3em;
}
 .screw.screw1 .screwInner {
	 transform: rotate(20deg);
}
 .screw.screw2 {
	 top: 0.5em;
	 right: 0.3em;
}
 .screw.screw2 .screwInner {
	 transform: rotate(30deg);
}
 .screw.screw3 {
	 bottom: 0.3em;
	 left: 0.3em;
}
 .screw.screw3 .screwInner {
	 transform: rotate(10deg);
}
 .screw.screw4 {
	 bottom: 0.3em;
	 right: 0.3em;
}
 .screw.screw4 .screwInner {
	 transform: rotate(-10deg);
}
 .screw .screwInner {
	 position: absolute;
	 top: -0.15em;
	 left: -0.225em;
	 display: block;
	 width: 0.45em;
	 height: 0.2em;
	 border-radius: 0.1em;
	 background: #373835;
}
 .screw .screwInner:after {
	 position: absolute;
	 top: 0;
	 left: 0;
	 display: block;
	 content: "";
	 width: 0.45em;
	 height: 0.2em;
	 border-radius: 0.1em;
	 background: #373835;
	 transform: rotate(90deg);
}
 .stickerOuter {
	 width: 100%;
	 height: 8em;
	 background: #bbb;
	 border-radius: 0.7em;
	 border-top: #a2a2a2 solid 0.1em;
	 border-bottom: #d5d5d5 solid 0.1em;
	 position: relative;
}
 .sticker {
	 position: absolute;
	 top: 0.2em;
	 right: 0.2em;
	 left: 0.2em;
	 bottom: 0.2em;
	 background: #efeeeb;
	 border-radius: 0.7em;
	 border-bottom: #888 solid 1px;
}
 .sticker .a-side {
	 position: absolute;
	 border-radius: 0.1em;
	 top: 0.8em;
	 left: 1em;
	 font-weight: 900;
	 display: block;
	 background: #4d4d4d;
	 color: #efeeeb;
	 width: 1.1em;
	 height: 1.1em;
	 padding-top: 0.1em;
	 line-height: 1em;
	 text-align: center;
}
 .sticker .cursive {
	 font-family: 'Shadows Into Light', cursive;
	 display: block;
	 padding: 0.5em 0.5em 0.5em 5em;
	 transform: rotate(-3deg);
	 color: #424ba8;
}
 .sticker .stripe {
	 display: block;
	 position: absolute;
	 top: 40%;
	 width: 100%;
	 border-top: #fd6139 solid 0.3em;
	 border-bottom: #4d4d4d solid 0.3em;
}
 .sticker .c90 {
	 position: absolute;
	 bottom: -0.1em;
	 left: 3.5em;
	 font-weight: 900;
	 color: #4b9121;
}
 .sticker .logo {
	 position: absolute;
	 bottom: -0.1em;
	 right: 3.5em;
	 font-weight: 900;
}
 .middle {
	 position: relative;
	 width: 60%;
	 margin: 0.5em auto 0;
	 background: #bbb;
	 padding: 0.2em;
	 border-radius: 0.4em;
	 border-top: #d5d5d5 solid 0.1em;
	 border-bottom: #959595 solid 0.1em;
	 box-shadow: #bbb 0 0 0 0.5em, #888 0 -1px 0 0.5em;
}
 .circle {
	 display: block;
	 position: relative;
	 float: left;
	 width: 2.3em;
	 height: 2.4em;
	 border-radius: 50%;
	 background: black;
	 border-top: #a2a2a2 solid 0.1em;
	/*change above from primary*/
	 border-bottom: #e1e1e1 solid 0.1em;
	 box-shadow: inset #bbb 0 0 0 0.2em, inset #959595 0 0.1em 0 0.2em, inset #efeeeb 0 0.1em 0 0.4em, inset #b6b2a4 0 0.2em 0 0.4em;
}
 .circle.two {
	 float: right;
}
 .teethBox {
	 position: absolute;
	 top: 50%;
	 margin-top: -0.75em;
	 left: 50%;
	 margin-left: -0.85em;
	 width: 1.7em;
	 height: 1.7em;
	 transition: transform;
	 transition-duration: 1s;
}
 .teeth {
	 display: block;
	 position: absolute;
	 top: 50%;
	 margin-top: -0.1em;
	 left: 50%;
	 width: 1.7em;
	 margin-left: -0.85em;
	 height: 0.2em;
	 box-shadow: inset #efeeeb 0.25em 0 0 0, inset #efeeeb -0.25em 0 0 0;
}
 .teeth:nth-of-type(2) {
	 transform: rotate(60deg);
}
 .teeth:nth-of-type(3) {
	 transform: rotate(-60deg);
}
 .window {
	 position: absolute;
	 z-index: 2;
	 top: 0.2em;
	 left: 50%;
	 margin-left: -2.5em;
	 margin-top: 0.3em;
	 width: 5em;
	 height: 1.8em;
	 border-radius: 0.4em;
	 overflow: hidden;
	 background: #000;
	 border-top: #a2a2a2 solid 0.1em;
	 border-bottom: #e1e1e1 solid 0.1em;
	 box-shadow: inset #959595 0 0.2em 0 0, #bbb 0 0 0 0.25em, #959595 0 -0.1em 0 0.2em, #e1e1e1 0 0.1em 0 0.2em;
}
 .window .reelOne {
	 position: absolute;
	 left: -1.4em;
	 top: 0.9em;
	 display: block;
	 margin-left: -4.5em;
	 margin-top: -4.5em;
	 width: 9em;
	 height: 9em;
	 background: #4d3b3b;
	 border-radius: 50%;
	 transition: width, height, margin;
	 transition-duration: 1s;
}
 .window .reelOne:after {
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 content: '';
	 width: 4em;
	 height: 4em;
	 margin: -2em 0 0 -2em;
	 border-radius: 50%;
	 background: #efeeeb;
	 border: #efeeeb solid 0.2em;
	 box-shadow: inset #dad8d2 0 0 0 0.2em;
}
 .window .reelTwo {
	 position: absolute;
	 right: -1.4em;
	 top: 0.9em;
	 display: block;
	 margin-right: -3em;
	 margin-top: -3em;
	 width: 6em;
	 height: 6em;
	 background: #4d3b3b;
	 border-radius: 50%;
	 transition: width, height, margin;
	 transition-duration: 1s;
}
 .window .reelTwo:after {
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 content: '';
	 width: 4em;
	 height: 4em;
	 margin: -2em 0 0 -2em;
	 border-radius: 50%;
	 background: #efeeeb;
	 border: #efeeeb solid 0.2em;
	 box-shadow: inset #dad8d2 0 0 0 0.2em;
}
 .cassetteBottom {
	 position: absolute;
	 left: 50%;
	 bottom: 0;
	 height: 2.2em;
	 width: 10em;
	 margin-left: -5em;
	 background: #c8c8c8;
	 border-top: #e1e1e1 solid 0.1em;
}
 .cassetteBottom .screw5 {
	 bottom: 1em;
	 left: 50%;
	 margin-left: -0.5em;
}
 .cassetteBottom:before {
	 content: '';
	 position: absolute;
	 right: 100%;
	 border-right: #c8c8c8 solid 0.5em;
	 border-top: transparent solid 2.2em;
}
 .cassetteBottom:after {
	 content: '';
	 position: absolute;
	 left: 100%;
	 border-left: #c8c8c8 solid 0.5em;
	 border-top: transparent solid 2.2em;
}
 .bottomShadow {
	 position: absolute;
	 z-index: 100;
	 left: 50%;
	 margin-left: -5.5em;
	 bottom: -0.7em;
	 width: 11em;
	 height: 0.7em;
	 background: #959595;
}
 .bottomShadow:before {
	 content: '';
	 display: block;
	 position: absolute;
	 z-index: 100;
	 bottom: 100%;
	 left: 50%;
	 margin-left: -5.5em;
	 width: 10.4em;
	 border-bottom: #959595 solid 0.1em;
	 border-right: transparent solid 0.3em;
	 border-left: transparent solid 0.3em;
}
 .bottomShadow:after {
	 content: '';
	 display: block;
	 position: absolute;
	 z-index: 100;
	 top: 100%;
	 left: 50%;
	 margin-left: -5.5em;
	 width: 10.4em;
	 border-top: #959595 solid 0.1em;
	 border-right: transparent solid 0.3em;
	 border-left: transparent solid 0.3em;
}
 .holes {
	 display: block;
	 position: absolute;
	 bottom: 0.8em;
	 width: 0.8em;
	 height: 0.6em;
	 border-radius: 0.2em;
	 background: #626262;
	 box-shadow: inset #959595 0 0.1em 0 0;
}
 .holes:after {
	 position: absolute;
	 top: 0.5em;
	 content: '';
	 width: 0.6em;
	 height: 0.6em;
	 border-radius: 50%;
	 background: #626262;
	 box-shadow: inset #959595 0 0.1em 0 0;
}
 .holes.one {
	 left: 20%;
}
 .holes.one:after {
	 right: 200%;
}
 .holes.two {
	 right: 20%;
}
 .holes.two:after {
	 left: 200%;
}
 .bottomHoles {
	 position: absolute;
	 top: 0.05em;
	 width: 2em;
	 height: 0.6em;
	 background: #626262;
	 box-shadow: inset #4d3b3b 0 0.3em 0 0, inset #7b7b7b 0 -0.1em 0 0;
}
 .bottomHoles.one {
	 left: 0.5em;
}
 .bottomHoles.two {
	 left: 50%;
	 margin-left: -1em;
}
 .bottomHoles.two:before {
	 content: '';
	 display: block;
	 position: absolute;
	 top: 0.1em;
	 right: 140%;
	 width: 0.4em;
	 height: 0.4em;
	 background: #626262;
	 box-shadow: inset #4d3b3b 0 0.2em 0 0, inset #7b7b7b 0 -0.05em 0 0;
}
 .bottomHoles.two:after {
	 content: '';
	 display: block;
	 position: absolute;
	 top: 0.1em;
	 left: 140%;
	 width: 0.4em;
	 height: 0.4em;
	 background: #626262;
	 box-shadow: inset #4d3b3b 0 0.2em 0 0, inset #7b7b7b 0 -0.05em 0 0;
}
 .bottomHoles.three {
	 right: 0.5em;
}
 .cassetteOuter:hover .teethBox {
	 transform: rotate(369deg);
}
 .cassetteOuter:hover .reelOne {
	 margin-left: -4em;
	 margin-top: -4em;
	 width: 8em;
	 height: 8em;
}
 .cassetteOuter:hover .reelTwo {
	 margin-right: -3.5em;
	 margin-top: -3.5em;
	 width: 7em;
	 height: 7em;
}
 