@charset "utf-8";
/* =============================================================================================
   Author: O G POPA. Copyright © O G POPA. Licensed to "SC COMPLEMENT CONTROL SRL".
   This code was developed for http://www.corollarytheorems.com on March 2016.
================================================================================================ */

@-webkit-keyframes rocks2L {
  16% {-webkit-transform: rotateY(-90deg);}
  33% {-webkit-transform: rotateY(-90deg)  rotateZ(90deg);}
  50% {-webkit-transform: rotateY(-180deg) rotateZ(90deg);}
  66% {-webkit-transform: rotateY(90deg)   rotateX(90deg);}
  83% {-webkit-transform: rotateX(-270deg) rotateY(90deg);}
}
 
@-moz-keyframes rocks2L {
  16% {-moz-transform: rotateY(-90deg);}
  33% {-moz-transform: rotateY(-90deg)  rotateZ(90deg);}
  50% {-moz-transform: rotateY(-180deg) rotateZ(90deg);}
  66% {-moz-transform: rotateY(90deg)   rotateX(90deg);}
  83% {-moz-transform: rotateX(-270deg) rotateY(90deg);}
} 
    
@-o-keyframes rocks2L {
  16% {-o-transform: rotateY(-90deg);}
  33% {-o-transform: rotateY(-90deg)  rotateZ(90deg);}
  50% {-o-transform: rotateY(-180deg) rotateZ(90deg);}
  66% {-o-transform: rotateY(90deg)   rotateX(90deg);}
  83% {-o-transform: rotateX(-270deg) rotateY(90deg);}
}
  
@-ms-keyframes rocks2L {
  16% {-ms-transform: rotateY(-90deg);}
  33% {-ms-transform: rotateY(-90deg)  rotateZ(90deg);}
  50% {-ms-transform: rotateY(-180deg) rotateZ(90deg);}
  66% {-ms-transform: rotateY(90deg)   rotateX(90deg);}
  83% {-ms-transform: rotateX(-270deg) rotateY(90deg);}
}

@keyframes rocks2L {
  16% {transform: rotateY(-90deg);}
  33% {transform: rotateY(-90deg)  rotateZ(90deg);}
  50% {transform: rotateY(-180deg) rotateZ(90deg);}
  66% {transform: rotateY(90deg)   rotateX(90deg);}
  83% {transform: rotateX(-270deg) rotateY(90deg);}
} 

@-webkit-keyframes blink4L { 
  12%,25% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(0,50,255,.5);} 
  37%,50% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
  62%,75% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(255,50,50,.5);}
  87%,100% {box-shadow: inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
}
@-moz-keyframes blink4L { 
  12%,25% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(0,50,255,.5);} 
  37%,50% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
  62%,75% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(255,50,50,.5);}
  87%,100% {box-shadow: inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
}

@-o-keyframes blink4L { 
  12%,25% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(0,50,255,.5);} 
  37%,50% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
  62%,75% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(255,50,50,.5);}
  87%,100% {box-shadow: inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
}

@-ms-keyframes blink4L { 
  12%,25% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(0,50,255,.5);} 
  37%,50% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
  62%,75% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(255,50,50,.5);}
  87%,100% {box-shadow: inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
}

@keyframes blink4L { 
  12%,25% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(0,50,255,.5);} 
  37%,50% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
  62%,75% {box-shadow:  inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(255,50,50,.5);}
  87%,100% {box-shadow: inset 0 0 10px 3px rgba(255,255,255,.7), 0 0 15px 7px rgba(240,50,255,.5);}
}

.rocker2L {
  -webkit-animation: rocks2L 15s ease infinite;  
  -moz-animation:    rocks2L 15s ease infinite;  
  -o-animation:      rocks2L 15s ease infinite;  
  -ms-animation:     rocks2L 15s ease infinite;
  animation:         rocks2L 15s ease infinite;
  
  -webkit-transform-style: preserve-3d;
  -moz-transform-style:    preserve-3d;
  -o-transform-style:      preserve-3d;
  -ms-transform-style:     preserve-3d;
  transform-style:         preserve-3d;
  
  -webkit-transform-origin: 50px 50px 0;
  -moz-transform-origin:    50px 50px 0;
  -o-transform-origin:      50px 50px 0;
  -ms-transform-origin:     50px 50px 0;
  transform-origin:         50px 50px 0;
}

.rock2L {
  position: relative;
  float: left; 
  margin-left: 0;
  margin-top: 0;
   
  -webkit-perspective: 1000px;
  -moz-perspective:    1000px;
  -ms-perspective:     1000px;
  -o-perspective:      1000px;
  perspective:         1000px;
}

.rocker2L div {
  position: absolute;  
  width: 100px;
  height: 100px;
  border: 2px solid black;
  border-radius: 15px;
  box-shadow: inset 0 0 10px 3px rgba(255,255,255,.7), 
                    0 0 15px 7px rgba(240,50,255,.5);
  background: rgba(0,0,0,.5);
  text-align: center;
  line-height: 90px;
  font-size: 50px;
  white-space: nowrap;
  text-shadow: -1px 0 #000000, 0 1px #000000, 1px 0 #000000, 0 -1px #000000,
               -1px 0 #000000, 0 1px #000000, 1px 0 #000000, 0 -1px #000000,
               -1px 0 #000000, 0 1px #000000, 1px 0 #000000, 0 -1px #000000;  
               
  -webkit-animation: blink4L 20s infinite linear;
  -moz-animation:    blink4L 20s infinite linear;
  -o-animation:      blink4L 20s infinite linear;
  -ms-animation:     blink4L 20s infinite linear;
  animation:         blink4L 20s infinite linear;   
}

.rocker2L .face1 {
  -webkit-transform: translateZ(60px);
  -moz-transform:    translateZ(60px);
  -ms-transform:     translateZ(60px);
  -o-transform:      translateZ(60px);
  transform:         translateZ(60px);
}

.rocker2L .face2 {
  -webkit-transform: rotateY(90deg) translateZ(60px);
  -moz-transform:    rotateY(90deg) translateZ(60px);
  -ms-transform:     rotateY(90deg) translateZ(60px);
  -o-transform:      rotateY(90deg) translateZ(60px);
  transform:         rotateY(90deg) translateZ(60px);
}

.rocker2L .face3 {
  -webkit-transform: rotateY(90deg) rotateX(90deg) translateZ(60px);
  -moz-transform:    rotateY(90deg) rotateX(90deg) translateZ(60px);
  -ms-transform:     rotateY(90deg) rotateX(90deg) translateZ(60px);
  -o-transform:      rotateY(90deg) rotateX(90deg) translateZ(60px);
  transform:         rotateY(90deg) rotateX(90deg) translateZ(60px);
}

.rocker2L .face4 {
  -webkit-transform: rotateY(180deg) rotateZ(90deg) translateZ(60px);
  -moz-transform:    rotateY(180deg) rotateZ(90deg) translateZ(60px);
  -ms-transform:     rotateY(180deg) rotateZ(90deg) translateZ(60px);
  -o-transform:      rotateY(180deg) rotateZ(90deg) translateZ(60px);
  transform:         rotateY(180deg) rotateZ(90deg) translateZ(60px);
}

.rocker2L .face5 {
  -webkit-transform: rotateY(-90deg) rotateZ(90deg) translateZ(60px);
  -moz-transform:    rotateY(-90deg) rotateZ(90deg) translateZ(60px);
  -ms-transform:     rotateY(-90deg) rotateZ(90deg) translateZ(60px);
  -o-transform:      rotateY(-90deg) rotateZ(90deg) translateZ(60px);
  transform:         rotateY(-90deg) rotateZ(90deg) translateZ(60px);
}

.rocker2L .face6 {
  -webkit-transform: rotateX(-90deg) translateZ(60px);
  -moz-transform:    rotateX(-90deg) translateZ(60px);
  -ms-transform:     rotateX(-90deg) translateZ(60px);
  -o-transform:      rotateX(-90deg) translateZ(60px);
  transform:         rotateX(-90deg) translateZ(60px);
}

.rocker2L:hover .face1, .rocker2L:focus .face1 {
  border-radius: 50%;
}

.rocker2L:hover .face2, .rocker2L:focus .face2 {
  border-radius: 50%;
}

.rocker2L:hover .face3, .rocker2L:focus .face3 {
  border-radius: 50%;
}

.rocker2L:hover .face4, .rocker2L:focus .face4 {
  border-radius: 50%;
}

.rocker2L:hover .face5, .rocker2L:focus .face5 {
  border-radius: 50%;
}

.rocker2L:hover .face6, .rocker2L:focus .face6 {
  border-radius: 50%;
}

/* =============================================================================================
   Author: O G POPA. Copyright © O G POPA. Licensed to "SC COMPLEMENT CONTROL SRL".
   This code was developed for http://www.corollarytheorems.com on March 2016.
================================================================================================ */