body
    {
  background-repeat: repeat; 
  background: -webkit-linear-gradient(white, lime, orange, white); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(white, lime, orange, white); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(white, lime, orange, white); /* For Firefox 3.6 to 15 */
  background: linear-gradient(white, lime, orange, white); /* Standard syntax */
  opacity:0.4;
  font-family: "Lucida Console", Monaco, monospace;
  font-size: 80px;
  color: yellow;
  text-shadow: 3px 1px 7px rgba(0, 252, 107, 0.96);
  width:90%;
  height:90%;
  opacity:1;
	}
.contener_box
    {
    -webkit-perspective: 1080px;
    -moz-perspective: 1080px;
    -ms-perspective: 1080px;
    perspective: 1080px;
    }
.box {
    position: relative;
    width: 700px;
    height: 700px;
    margin: 0 auto;
	background-repeat:no-repeat;
	opacity:0.9;
    -webkit-transform-style: preserve-3d;
    -webkit-transition: transform 350ms;
    -webkit-animation: spin 30s infinite linear;
    -moz-transform-style: preserve-3d;
    -moz-transition: transform 350ms;
    -moz-animation: spin 30s infinite linear;
    -ms-transform-style: preserve-3d;
    -ms-transition: transform 350ms;
    -ms-animation: spin 30s infinite linear;
    transform-style: preserve-3d;
    transition: transform 350ms;
    animation: spin 30s infinite linear;
    }
.box:before, .box:after, .box i, .box i:before, .box i:after {
    display: block;
    width: 400px;
    height: 300px;
    position: absolute;
    -webkit-animation: lighting 25s infinite linear;
    -moz-animation: lighting 25s infinite linear;
    -ms-animation: lighting 25s infinite linear;
    animation: lighting 25s infinite linear;
    }
.box:before {
    -webkit-transform: rotateY(45deg) translate3D(-110px,0,50px);
    -moz-transform: rotateY(45deg) translate3D(-110px,0,50px);
    -ms-transform: rotateY(45deg) translate3D(-110px,0,50px);
    transform: rotateY(45deg) translate3D(-110px,0,50px);
    background-color: white;
    }
.box:after {
    -webkit-transform: rotateY(1080deg) rotateZ(360deg) translate3D(50px,0,-500px);
    -moz-transform: rotateY(1080deg) rotateZ(360deg) translate3D(50px,0,-500px);
    -ms-transform: rotateY(1080deg) rotateZ(360deg) translate3D(50px,0,-500px);
    transform: rotateY(1080deg) rotateZ(360deg) translate3D(50px,0,-500px);
    background-color: white;
    }
.box i {
    -webkit-transform-style: preserve-3d;
    -webkit-transform: translate3D(0,0,100px);
    -webkit-animation-delay: 1s;
    -moz-transform-style: preserve-3d;
    -moz-transform: translate3D(0,0,100px);
    -moz-animation-delay: 1s;
    -ms-transform-style: preserve-3d;
    -ms-transform: translate3D(0,0,100px);
    -ms-animation-delay: 1s;
    transform-style: preserve-3d;
    transform: translate3D(0,0,100px);
    animation-delay: 0.1s;
    background-color: white;
    }
.box i:before {
    -webkit-transform: rotate(180deg) translate3D(0,0,-100px);
    -webkit-animation-delay: 1s;
    -moz-transform: rotate(180deg) translate3D(0,0,-100px);
    -moz-animation-delay: 1s;
    -ms-transform: rotate(180deg) translate3D(0,0,-100px);
    -ms-animation-delay: 1s;
    transform: rotate(180deg) translate3D(0,0,-100px);
    animation-delay: 0.6s;
    background-color: white;
    }
.box i:after {
    -webkit-transform: rotateX(360deg) translate3D(0,-50px,-100px);
    background-color: white;
    -webkit-filter: blur(20px);
    opacity: 0.3;
    -webkit-animation: none;
    -moz-transform: rotateX(360deg) translate3D(0,-50px,-100px);
    background-color: #999999;
    box-shadow: 0 0 30px rgba(0,0,0,1);
    -moz-filter: blur(15px);
    opacity: 0.3;
    -moz-animation: none;
    -ms-transform: rotateX(360deg) translate3D(0,-50px,-100px);
    background-color: #999999;
    box-shadow: 0 0 30px rgba(0,0,0,1);
    -ms-filter: blur(15px);
    opacity: 0.3;
    -ms-animation: none;
    transform: rotateX(360deg) translate3D(0,-50px,-100px);
    background-color: white;
    box-shadow: 0 0 30px rgba(0,0,0,1);
    filter: blur(15px);
    opacity: 0.3;
    animation: none;
    }
@-webkit-keyframes spin {
    0% { -webkit-transform: rotateY(0deg) translateZ(-180px); }
    100% { -webkit-transform: rotateY(360deg) translateZ(-180px); }
    }
@-webkit-keyframes lighting {
    0% { box-shadow: inset 100px 0 150px rgba(0,0,0,0.4), inset 0 0 150px rgba(255,255,0255,0.3); }
    100% { box-shadow: inset 0 0 150px rgba(0,0,0,0.4), inset -100px 0 150px rgba(255,255,0255,0.3); }
    }
@-moz-keyframes spin {
    0% { -moz-transform: rotateY(360deg) translateZ(-50px); }
    100% { -moz-transform: rotateY(360deg) translateZ(-50px); }
    }
@-moz-keyframes lighting {
    0% { box-shadow: inset 40px 0 150px rgba(0,0,0,0.4), inset 0 0 150px rgba(255,255,0255,0.3); }
    100% { box-shadow: inset 40px 0 150px rgba(0,0,0,0.4), inset -100px 0 150px rgba(255,255,0255,0.3); }
    }
@keyframes spin {
    0% { transform: rotateY(0deg) translateZ(-50px); }
    100% { transform: rotateY(360deg) translateZ(-50px); }
    }
@keyframes lighting {
    0% { box-shadow: inset 100px 0 150px rgba(0,0,0,0.4), inset 0 0 150px rgba(255,255,0255,0.3); }
    100% { box-shadow: inset 0 0 150px rgba(0,0,0,0.4), inset -100px 0 150px rgba(255,255,0255,0.3); }
    }
@-ms-keyframes spin {
    0% { -ms-transform: rotateY(0deg) translateZ(-50px); opacity:0.4; }
    100% { -ms-transform: rotateY(360deg) translateZ(-50px);opacity:0.8; }
    }
@-ms-keyframes lighting {
    0% { box-shadow: inset 100px 0 150px rgba(0,0,0,0.4), inset 0 0 150px rgba(255,255,0255,0.3); }
    100% { box-shadow: inset 0 0 150px rgba(0,0,0,0.4), inset -100px 0 150px rgba(255,255,0255,0.3); }
    }
.contener_box1 {    -webkit-perspective: 1080px;
    -moz-perspective: 1080px;
    -ms-perspective: 1080px;
    perspective: 1080px;
}
.contener_box2 {    -webkit-perspective: 360px;
    -moz-perspective: 360px;
    -ms-perspective: 360px;
    perspective: 360px;
}
.contener_box11 {-webkit-perspective: 1080px;
    -moz-perspective: 1080px;
    -ms-perspective: 1080px;
    perspective: 1080px;
}

#div1 {
    margin: auto;
    width: 550px;
    height: 100px;
    background-image: url("bck-div.png");
    font-family: "Lucida Console", Monaco, monospace;
	font-size: 60px;
    text-align: center;
    } 
#div1:hover {
	opacity:0.4;
	text-shadow: 1px 1px 6px rgba(0, 252, 107, 0.96);
	width: 900px;
	height: 100px;
	cursor: wait;
    }
#liens {
    margin:20px;
    font-size:18px;
    }