/*Downloaded from https://www.codeseek.co/anthonygermishuys/a-pen-by-anthony-yyJKyJ */
*, *:after, *:before {margin: 0; padding: 0;}
body {overflow:hidden;
background:radial-gradient(#000 16%, transparent 17%),radial-gradient(#444 16%, transparent 17%) 0px 1px,
radial-gradient(#000 16%, transparent 17%) 8px 8px,radial-gradient(#444 16%, transparent 17%) 8px 9px;
background-color:#282828;background-size: 16px 16px;}
#C2D,#C3D{position:absolute;width:50px;height:50px;border-radius:50%;z-index:0;margin:10px 0 0 10px;}
#C3D{background:url(http://anthony.germishuys.cloudvent.net/pics/c3d2.png) no-repeat center;background-size:contain;}
#C2D{background: url(http://anthony.germishuys.cloudvent.net/pics/c2d.png) no-repeat center center;background-size:cover;display:none;}
#C3D:hover,#C2D:hover{box-shadow:0px 0px 24px rgba(87,193,232,1);}
.stage{position:absolute;top:50%;Left:50%;-webkit-perspective:1200px;}
.coin {box-sizing:border-box;-webkit-transform-style:preserve-3d;
-webkit-transform:rotate3d(1,0,0,90deg) translate3d(-16px,0,0);
-webkit-transition:-webkit-transform 1s ease-in-out, margin-top 2s ease-in-out;}
.coin.animate{
-webkit-transform:rotate3d(1,0,0,170deg) translate3d(-16px,0,0);
margin-top:280px;-webkit-transition:-webkit-transform 1s ease-in-out 1s, margin-top 2s ease-in-out;}
figure {position:absolute;width:32px;height:20px;opacity:1;}
[class*='coin-s'] {background:#8c8482;
background:-webkit-linear-gradient(left, #8b918d 0%, #b7bdbc 74%, #797979 75%, #979692 100%);
background-size:25%;}
figure.coin-bottom {width:300px;height:300px;border-radius:50%;box-sizing:border-box;}
figure.coin-top {width:300px;height:300px;border-radius:50%;-webkit-box-sizing:border-box;}
figure.coin-bottom {
background:url(http://anthony.germishuys.cloudvent.net/pics/bottom2.png) no-repeat center ;background-size:contain;
-webkit-transform:translate3d(-134px,-150px,0) rotate3d(1,0,0,90deg) rotate3d(0,0,1,220deg);
-webkit-transform-style:preserve-3d;
-webkit-box-shadow:4px 9px 10px rgba(0, 0, 0, .2), 5px 18px 40px rgba(0, 0, 0, .6), 18px 40px 20px rgba(0, 0, 0, .4);
}
.coin-bottom.animate{background:url(http://anthony.germishuys.cloudvent.net/pics/nobottom.png);
-webkit-transition:background 3s ease 2s;}
figure.coin-top {
background:url(http://anthony.germishuys.cloudvent.net/pics/bigring.png) no-repeat center;
background-size:cover;z-index:20;
-webkit-transform: translate3d(-134px, -130px, 0px) rotate3d(1,0,0,90deg);}
.coin-s1 {-webkit-transform: rotate3d(0,1,0,0deg) translate3d(0,0,149px);}
.coin-s2 {-webkit-transform: rotate3d(0,1,0,12deg) translate3d(0,0,149px);}
.coin-s3 {-webkit-transform: rotate3d(0,1,0,24deg) translate3d(0,0,149px);}
.coin-s4 {-webkit-transform: rotate3d(0,1,0,36deg) translate3d(0,0,149px);}
.coin-s5 {-webkit-transform: rotate3d(0,1,0,48deg) translate3d(0,0,149px);}
.coin-s6 {-webkit-transform: rotate3d(0,1,0,60deg) translate3d(0,0,149px);}
.coin-s7 {-webkit-transform: rotate3d(0,1,0,72deg) translate3d(0,0,149px);}
.coin-s8 {-webkit-transform: rotate3d(0,1,0,84deg) translate3d(0,0,149px);}
.coin-s9 {-webkit-transform: rotate3d(0,1,0,96deg) translate3d(0,0,149px);}
.coin-s10 {-webkit-transform: rotate3d(0,1,0,108deg) translate3d(0,0,149px);}
.coin-s11 {-webkit-transform: rotate3d(0,1,0,120deg) translate3d(0,0,149px);}
.coin-s12 {-webkit-transform: rotate3d(0,1,0,132deg) translate3d(0,0,149px);}
.coin-s13 {-webkit-transform: rotate3d(0,1,0,144deg) translate3d(0,0,149px);}
.coin-s14 {-webkit-transform: rotate3d(0,1,0,156deg) translate3d(0,0,149px);}
.coin-s15 {-webkit-transform: rotate3d(0,1,0,168deg) translate3d(0,0,149px);}
.coin-s16 {-webkit-transform: rotate3d(0,1,0,180deg) translate3d(0,0,149px);}
.coin-s17 {-webkit-transform: rotate3d(0,1,0,192deg) translate3d(0,0,149px);}
.coin-s18 {-webkit-transform: rotate3d(0,1,0,204deg) translate3d(0,0,149px);}
.coin-s19 {-webkit-transform: rotate3d(0,1,0,216deg) translate3d(0,0,149px);}
.coin-s20 {-webkit-transform: rotate3d(0,1,0,228deg) translate3d(0,0,149px);}
.coin-s21 {-webkit-transform: rotate3d(0,1,0,240deg) translate3d(0,0,149px);}
.coin-s22 {-webkit-transform: rotate3d(0,1,0,252deg) translate3d(0,0,149px);}
.coin-s23 {-webkit-transform: rotate3d(0,1,0,264deg) translate3d(0,0,149px);}
.coin-s24 {-webkit-transform: rotate3d(0,1,0,276deg) translate3d(0,0,149px);}
.coin-s25 {-webkit-transform: rotate3d(0,1,0,288deg) translate3d(0,0,149px);}
.coin-s26 {-webkit-transform: rotate3d(0,1,0,300deg) translate3d(0,0,149px);}
.coin-s27 {-webkit-transform: rotate3d(0,1,0,312deg) translate3d(0,0,149px);}
.coin-s28 {-webkit-transform: rotate3d(0,1,0,324deg) translate3d(0,0,149px);}
.coin-s29 {-webkit-transform: rotate3d(0,1,0,336deg) translate3d(0,0,149px);}
.coin-s30 {-webkit-transform: rotate3d(0,1,0,348deg) translate3d(0,0,149px);}
@-webkit-keyframes rotate {
0% {-webkit-transform:rotate3d(1,0,0,-270deg) translate3d(0,0,0);}
100% {-webkit-transform: rotate3d(1,0,0,90deg) translate3d(0,0,0);}}
.socket{background:url('http://anthony.germishuys.cloudvent.net/pics/bottom2.png') no-repeat center;background-size:contain;
position:relative;left:50%;top:50%;width:300px;height:300px;margin:-150px 0 0 -150px;
overflow:hidden;opacity:1;-webkit-transform:scale(1.5);-webkit-transition:all 2s ease 2s;}
.socket.animate{opacity:0;-webkit-transition:opacity 2s ease 2s;}
.hex-brick{position:absolute;background:#222;width:30px;height:17px;top:5px;}
.h2{-webkit-transform:rotateZ(60deg);-webkit-transition:-webkit-transform 2s;}
.h3{-webkit-transform:rotateZ(-60deg);-webkit-transition:-webkit-transform 2s;}
.gel{position:absolute;top:50%;left:50%;height:30px;width:30px;-webkit-transition:all .3s;}
.center-gel{margin:-15px 0 0 -15px;-webkit-animation:pulse 2s linear 1 8s both;}
.c1{margin-left:-47px;margin-top:-15px;}
.c2{margin-left:-31px;margin-top:-43px;}
.c3{margin-left:1px;margin-top:-43px;}
.c4{margin-left:17px;margin-top:-15px;}
.c5{margin-left:-31px;margin-top: 13px;}
.c6{margin-left:1px;margin-top:13px;}
.c7{margin-left:-63px;margin-top:-43px;}
.c8{margin-left:33px;margin-top:-43px;}
.c9{margin-left:-15px;margin-top:41px;}
.c10{margin-left:-63px;margin-top:13px;}
.c11{margin-left:33px;margin-top:13px;}
.c12{margin-left:-15px;margin-top:-71px;}
.c13{margin-left:-47px;margin-top:-71px;}
.c14{margin-left:17px;margin-top:-71px;}
.c15{margin-left:-47px;margin-top:41px;}
.c16{margin-left:17px;margin-top:41px;}
.c17{margin-left:-79px;margin-top:-15px;}
.c18{margin-left:49px;margin-top:-15px;}
.c19{margin-left:-63px;margin-top:-99px;}
.c20{margin-left:33px;margin-top:-99px;}
.c21{margin-left:1px;margin-top:-99px;}
.c22{margin-left:-31px;margin-top:-99px;}
.c23{margin-left:-63px;margin-top: 69px;}
.c24{margin-left:33px;margin-top:69px;}
.c25{margin-left:1px;margin-top:69px;}
.c26{margin-left:-31px;margin-top:69px;}
.c27{margin-left:-79px;margin-top:-15px;}
.c28{margin-left:-95px;margin-top:-43px;}
.c29{margin-left:-95px;margin-top:13px;}
.c30{margin-left:49px;margin-top:41px;}
.c31{margin-left:-79px;margin-top:-71px;}
.c32{margin-left:-111px;margin-top:-15px;}
.c33{margin-left:65px;margin-top:-43px;}
.c34{margin-left:65px;margin-top:13px;}
.c35{margin-left:-79px;margin-top:41px;}
.c36{margin-left:49px;margin-top:-71px;}
.c37{margin-left:81px;margin-top:-15px;}
.r1,.r2,.r3{-webkit-animation: pulse 2s linear 1 8.2s both;}
@-webkit-keyframes pulse{0%{-webkit-transform: scale(0.01);} 100%{-webkit-transform: scale(1);}}
@-webkit-keyframes impulse{0%{-webkit-transform: scale(1);opacity:1;} 100%{-webkit-transform: scale(0.01);opacity:0;}}
@-webkit-keyframes impulse2{0%{-webkit-transform: scale(0.01);opacity:0;} 100%{-webkit-transform: scale(1);opacity:1;}}
#laurel{border-radius:50%;width:230px;height:230px;position:absolute;left: 50%;top: 50%;margin:150px 0 0 -120px;z-index:11;-webkit-transition:all 1s linear 2s;
-webkit-transform: rotate3d(0,0,0,0deg) translate3d(0,0,0);
}
#laurel.loaded{margin-top:-120px;-webkit-transition:margin-top 1.5s ease;
}
.img {display:block;margin: 0 auto;}
#spark{background:url(http://anthony.germishuys.cloudvent.net/pics/spark.png) no-repeat center;background-size:contain;border-radius:50%;width:240px;height:240px;position:absolute;left: 50%;top:50%;margin:-350px 0 0 -120px;z-index:11;-webkit-transition:all 1s linear 2s;
-webkit-transform: rotate3d(0,1,0,180deg) translate3d(0,0,0);}
#spark.loaded{margin-top:-115px;-webkit-transition:margin-top 1.5s ease;}
@-webkit-keyframes rotate {0% {-webkit-transform: rotate3d(1, 0, 0, -270deg) translate3d(0, 0, 0);}100% {-webkit-transform: rotate3d(1, 0, 0, 90deg) translate3d(0, 0, 0);} }
.pulser-top {
position:absolute;
display: block;
left:0;
right:0;
top:0;
bottom:0;
opacity:0;
margin:auto;
width:250px;
height:250px;
border-radius:50%;
border:5px solid #0ab4ee;
box-sizing:border-box;
}
.pulser-top.animate{opacity:1;
-webkit-animation:pulse 2s infinite backwards cubic-bezier(0.1, 0.3, 0.3, 1.0) 3s;}
.pulser-bottom {
position:absolute;
display: block;
left:0;
right:0;
top:0;
bottom:0;
opacity:0;
margin:auto;
width:300px;
height:300px;
border-radius:100%;
background-color:#0ab4ee;
-webkit-transform:translate3d(0,0,5px);
}
.pulser-bottom.animate{opacity:1;-webkit-animation:pulse2 2s ease infinite 3s;}
.holo-loader {
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
opacity:0;
z-index:30;
margin:auto;
width:290px;
height:290px;
border-radius:50%;
border-top:15px solid transparent;
border-bottom:15px solid transparent;
border-left:15px solid #0ab4ee;
border-right:15px solid #0ab4ee;
-webkit-box-sizing:border-box;
-webkit-transition:opacity 2s ease;
display:none;
}
.holo-loader.animate{opacity:1;
-webkit-transition:opacity 2s ease 2s;
-webkit-animation:spin 3s infinite linear 3s;
}
.ring-1.animate{-webkit-animation:mymove 1s infinite alternate;}
.ring-2.animate{-webkit-animation:mymove 1s infinite alternate .1s;}
.ring-3.animate{-webkit-animation:mymove 1s infinite alternate .2s;}
.ring-4.animate{-webkit-animation:mymove 1s infinite alternate .3s;}
.ring-5.animate{-webkit-animation:mymove 1s infinite alternate .4s;}
.ring-6.animate{-webkit-animation:mymove 1s infinite alternate .5s;}
.ring-7.animate{-webkit-animation:mymove 1s infinite alternate .6s;}
.ring-8.animate{-webkit-animation:mymove 1s infinite alternate .7s;}
.ring-9.animate{-webkit-animation:mymove 1s infinite alternate .8s;}
.ring-10.animate{-webkit-animation:mymove 1s infinite alternate .9s;}
.holo {
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
margin:auto;
width:500px;
height:500px;
border-radius:50%;
display:none;
-webkit-box-sizing:border-box;
box-sizing:border-box;
-webkit-transform-style:preserve-3d;
-webkit-transform: rotate3d(1, 0, 0, 90deg)
rotate3d(0,1, 0, 180deg) translate3d(234px,0,0);
}
.ring-1 {
opacity:0;
width:250px;height:250px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,30px);
}
.ring-2 {
opacity:0;
width:270px;height:270px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,50px);
}
.ring-3 {
opacity:0;
width:290px;height:290px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,70px);
}
.ring-4 {
opacity:0;
width:310px;height:310px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,90px);
}
.ring-5 {
opacity:0;
width:330px;height:330px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,110px);
}
.ring-6 {
opacity:0;
width:350px;height:350px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,130px);
}
.ring-7 {
opacity:0;
width:370px;height:370px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,150px);
}
.ring-8 {
opacity:0;
width:390px;height:390px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,170px);
}
.ring-9 {
opacity:0;
width:410px;height:410px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,190px);
}
.ring-10 {
opacity:0;
width:430px;height:430px;
border:4px solid #0ab4ee;
-webkit-box-sizing:border-box;
box-sizing:border-box;border-radius:50%;
-webkit-transform:translate3d(0,0,210px);
}
@-webkit-keyframes mymove
{0% {opacity:0;} 100% {opacity:1;} }
@-webkit-keyframes spin {
0% {transform:rotateZ(0deg);}
100% {transform:rotateZ(360deg);}
}
@-webkit-keyframes pulse1 {
0% {opacity:1;-webkit-transform: scale(0.1,0.1);}
20% {opacity:1;}
50% {-webkit-transform: scale(1,1);}
80% {opacity:1;-webkit-transform: scale(1,1);}
100% {opacity:0;}
}
@-webkit-keyframes pulse2 {to{opacity:0;-webkit-transform:scale(2);}}
.flipWrapper {position:absolute;left:50%;top:50%;width:250px;height:250px;margin:-125px 0 0 -125px;-webkit-perspective:800px;-webkit-transform:rotatex(90deg) rotateZ(180deg) translate3d(-15px,0,-30px);}
.flipWrapper .card.flippedr {-webkit-transform: rotatey(180deg);}
.flipWrapper .card.flippedl {-webkit-transform: rotatey(-180deg);}
.flipWrapper .card.flippedt {-webkit-transform: rotatex(-180deg);}
.flipWrapper .card.flippedb {-webkit-transform: rotatex(180deg);}
.flipWrapper .card {width:100%;height:100%;-webkit-transform-style:preserve-3d;-webkit-transition:2s ease;}
.flipWrapper .card .face {position:absolute;width:100%;height:100%;z-index:2;-webkit-backface-visibility:hidden;}
.flipWrapper .card .front {position:absolute;border-radius:50%;z-index:1;}
.flipWrapper .card .right {background:transparent;border-radius:50%;-webkit-transform:rotatey(-180deg);}
.flipWrapper .card .left {background:transparent;border-radius:50%;-webkit-transform:rotatey(180deg);}
.flipWrapper .card .top {background:transparent;border-radius:50%;-webkit-transform:rotatex(180deg);}
.flipWrapper .card .bottom {background:transparent;border-radius:50%;-webkit-transform:rotatex(-180deg);}
.menu-button {position:absolute;left:50%;top:50%;width:250px;height:250px;margin:-125px 0 0 -125px;
border-radius:50%;overflow:hidden;border:5px solid grey;box-sizing:border-box;
z-index:10;background:black;-webkit-transition:all 1.5s ease 1.5s;}
.menu-button.animate {width:110px;height:110px;margin:-55px 0 0 -55px;-webkit-transition:all 1.5s ease 1.5s;}
#menu-radial-4button {position:absolute;left:50%;top:50%;width:110px;height:110px;margin:-55px 0 0 -55px;
overflow:hidden;list-style:none;border-radius:50%;border:5px solid grey;box-sizing:border-box;
-webkit-transition: all 1.5s ease;}
#menu-radial-3button {position:absolute;left:50%;top:50%;width:250px;height:250px;margin:-125px 0 0 -125px;
overflow:hidden;list-style:none;border-radius:50%;border:5px solid grey;box-sizing:border-box;
-webkit-transform:scale(0.45);-webkit-transition: all 1.5s ease;}
#menu-radial-3buttonb {position:absolute;left:50%;top:50%;width:250px;height:250px;margin:-125px 0 0 -125px;
overflow:hidden;list-style:none;border-radius:50%;border:5px solid grey;box-sizing:border-box;
-webkit-transform:scale(0.45) rotatez(180deg);
-webkit-transition: all 1.5s ease;}
#menu-radial-2button {position:absolute;left:50%;top:50%;width:250px;height:250px;margin:-125px 0 0 -125px;overflow:hidden;border-radius:50%;border:2.5px solid grey;box-sizing:border-box;
-webkit-transform: scale(0.45) rotateY(180deg);-webkit-transition: all 1.5s ease;}
#menu-radial-2button.animate {-webkit-transform:scale(1) rotateY(180deg);
-webkit-transition:-webkit-transform 1.5s ease 1.5s;}
#menu-radial-3button.animate{-webkit-transform:scale(1);
-webkit-transition:-webkit-transform 1.5s ease 1.5s;}
#menu-radial-3buttonb.animate{-webkit-transform:scale(1) rotatez(180deg);-webkit-transition: all 2s ease 2s;}
#menu-radial-4button.animate{width:250px;height:250px;margin:-125px 0 0 -125px;-webkit-transition:all 2s ease 3s;}
.menu-item-3{position:absolute;top:50%;left:50%;text-decoration:none;display:none;}
.menu-item-3:before {position:absolute;top:50%;left:50%;z-index:1;
background:-webkit-linear-gradient(white,#C0C0C0);-webkit-background-clip:text;
-webkit-text-fill-color:transparent;text-shadow:1px 1px 2px rgba(0,0,0,0.6);-webkit-transform:rotatey(180deg);}
.menu-radial-2button-right,
.menu-radial-2button-left{
float:left;width:50%;height:100%;margin:0;background:#222;border:2.5px solid grey;box-sizing:border-box;}
.menu-radial-2button-right {border-radius:0 125px 125px 0;}
.menu-radial-2button-left {border-radius:125px 0 0 125px;}
#menu-radial-2button a:hover {background:rgba(0,155,255,.1);-webkit-box-shadow: 1px 0 0 1px white, 0 0 10px 1px teal, inset 0 0 10px 1px teal;}
.menu-item-3:nth-child(1) {display: block;}
.menu-item-3:nth-child(1) .menu-item-back {-webkit-transform:rotate(-30deg) skew(30deg);}
.menu-item-3:nth-child(1):before {margin:-120px 0 0 -15px;}
.menu-item-3:nth-child(2) {display: block;}
.menu-item-3:nth-child(2) .menu-item-back {-webkit-transform:rotate(90deg) skew(30deg);}
.menu-item-3:nth-child(2):before {margin:14px 0 0 52px;}
.menu-item-3:nth-child(3) {display: block;}
.menu-item-3:nth-child(3) .menu-item-back {-webkit-transform:rotate(210deg) skew(30deg);}
.menu-item-3:nth-child(3):before {margin:14px 0 0 -105px;}
.menu-item-back {position:absolute;left:50%;top:50%;width:175px;height:149px;margin-top:-150px;background:#222;
border:1px solid rgba(204, 204, 204, 0.2);-webkit-transform-origin:0px 150px;-webkit-transition:all 1s ease-in-out;}
.menu-item-back:hover{background:rgba(0,155,255,.1);-webkit-box-shadow:0 0 0 1px white,0 0 10px 1px teal,inset 0 0 10px 1px teal;
-webkit-transition-duration:.5;}
.menu-item {position:absolute;top:50%;left:50%;text-decoration:none;display:none;}
.menu-item:before {position:absolute;top:50%;left:50%;z-index:1;}
.menu-item:nth-child(1) {display:block;}
.menu-item:nth-child(1) .menu-item-back {-webkit-transform:rotate(-45deg) skew(0deg);}
.menu-item:nth-child(1):before {margin-top:-85px;}
.menu-item:nth-child(2) {display:block;}
.menu-item:nth-child(2) .menu-item-back {-webkit-transform:rotate(45deg) skew(0deg);}
.menu-item:nth-child(2):before {margin-left:85px;}
.menu-item:nth-child(3) {display:block;}
.menu-item:nth-child(3) .menu-item-back {-webkit-transform:rotate(135deg) skew(0deg);}
.menu-item:nth-child(3):before {margin-top:90px;}
.menu-item:nth-child(4) {display:block;}
.menu-item:nth-child(4) .menu-item-back{-webkit-transform:rotate(225deg) skew(0deg);}
.menu-item:nth-child(4):before {margin-left:-85px;}
[menu4-icon]:before {
content:attr(menu4-icon);font-family:'Typicons';background:-webkit-linear-gradient(white, #C0C0C0);
-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow: 1px 2px 2px rgba(0, 0, 0, 0.6);z-index:10;
font-size:50px;top:-25px;left:-25px;-webkit-transform:rotate3d(0,1,0,-180deg);}
[m3-icon]:before {content:attr(m3-icon);
font-family:'Typicons';background:-webkit-linear-gradient(white, #C0C0C0);
-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow: 1px 2px 2px rgba(0, 0, 0, 0.6);z-index:10;
line-height:350px;position:absolute;left:-20px;
font-size:300px;}
[face-left-icon]:before {content:attr(face-left-icon);
font-family:'Typicons';background:-webkit-linear-gradient(white, #C0C0C0);
-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow: 1px 2px 2px rgba(0, 0, 0, 0.6);z-index:10;
line-height:300px;position:absolute;left:20px;
font-size:200px;}
[m2-icon-right]:before {
content: attr(m2-icon-right);
display: block;
font-family:'FontAwesome';
position:relative;
left:50%;top:50%;
margin:-30px 0 0 0px;
font-size:60px;
background:-webkit-linear-gradient(white, #C0C0C0);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
}
#at{
font-family: sans-serif;
background:-webkit-linear-gradient(white, #C0C0C0);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
position:relative;
left:50%;top:50%;
margin:-40px 0 0 -55px;
font-size:60px;
}
[phone-icon]:before {
content:attr(phone-icon);
font-family:'Typicons';background:-webkit-linear-gradient(white, #C0C0C0);
-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow: 1px 2px 2px rgba(0, 0, 0, 0.6);z-index:10;
line-height:300px;position:absolute;left:-5px;
font-size:250px;}
.menu-item-3b {position:absolute;top:50%;left:50%;text-decoration:none;display:none;}
.menu-item-3b:before {position:absolute;top:50%;left:50%;z-index:1;
background:-webkit-linear-gradient(white, #C0C0C0);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
}
.menu-item-3b:nth-child(1) {display: block;}
.menu-item-3b:nth-child(1) .menu-item-back {-webkit-transform: rotate(-30deg) skew(30deg);}
.menu-item-3b:nth-child(1):before {-webkit-transform:rotatez(180deg);margin:-110px 0 0 -25px;}
.menu-item-3b:nth-child(2) {display: block;}
.menu-item-3b:nth-child(2) .menu-item-back {-webkit-transform: rotate(90deg) skew(30deg);}
.menu-item-3b:nth-child(2):before {-webkit-transform:rotatez(180deg);margin: 20.0px 0 0 60px;}
.menu-item-3b:nth-child(3) {display: block;}
.menu-item-3b:nth-child(3) .menu-item-back {-webkit-transform:rotate(210deg) skew(30deg);}
.menu-item-3b:nth-child(3):before {-webkit-transform:rotatez(180deg);margin: 20.0px 0 0 -100px;}
#menu-t-button,#menu-l-button,#menu-r-button,#menu-b-button{
position:absolute;left:50%;top:50%;width:250px;height:250px;margin:-125px 0 0 -125px;z-index:1;
background:black;border-radius:50%;border:5px solid grey;box-sizing:border-box;
-webkit-transform:rotateY(-180deg);-webkit-transition: all 1.5s ease-in-out 1.5s;}
#menu-r-button.animate, #menu-l-button.animate, #menu-t-button.animate, #menu-b-button.animate{
-webkit-transform:rotateY(-180deg) scale(0.45);-webkit-transition:-webkit-transform 1.5s ease-in-out;}
#open{position:absolute;top:50%;left:50%;margin:-125px 0 0 -125px;height:250px;width:250px;
border-radius:50%;z-index:50;-webkit-transition:background 2s ease;}
#open:hover{background:rgba(0,0,0,.5);-webkit-transition:background 1.5s ease;}
#close {position:absolute;top:50%;left:50%;border-radius:50%;margin:-55px 0 0 -55px;height:110px;width:110px;-webkit-transform:rotate(-45deg);display:none;
-webkit-transition:all 2s ease 1s;z-index:100;}
.barh{position:absolute;top:50%;left:50%;
background: #d6d6d6 linear-gradient(#666,#d6d6d6,rgba(0,0,0,1));
box-shadow:-.5px 0px 0px white,0px 1px 1px black;
margin:-10px 0 0 0;height:20px;width:0px;
-webkit-transition:all 1s ease;}
.barh.animate{width:100px;margin:-10px 0 0 -50px;-webkit-transition:all 1s ease 1s;}
.close {position:absolute;border-radius:50%;margin:auto;height:100%;width:100%;background:transparent;z-index:100;display:none;}
.close:hover{background:black;}
.barv{position:absolute;top:50%;left:50%;height:0px;width:20px;margin:0 0 0 -10px;
background:#d6d6d6 linear-gradient(#666,#d6d6d6,rgba(0,0,0,1));box-shadow:0 1px 0 black;-webkit-transition:all 1s ease;}
.barv.animate{Height:80px;margin-top:-40px;-webkit-transition:all 1s ease;}