rr.css

标签：

@charset "utf-8";

.RR_visi {

display: block;

}

.RR_hidd {

display: none;

}

.RR_mask_body {

overflow: hidden;

margin: 0 auto;

}

.RR_mask_main {

height: 100%;

width: 100%;

z-index: 99;

overflow: scroll;

position: fixed;

top: 0;

left: 0;

}

.RR_mask_obj {

display: block;

margin: 0 auto;

}

.RR_page_cA {

background-color: rgb(0, 222, 202);

}

.RR_toTop_visi {

position: fixed;

display: block;

animation: toTop 0.7s forwards;

-webkit-animation: toTop 0.7s forwards;

-moz-animation: toTop 0.7s forwards;

-ms-animation: toTop 0.7s forwards;

}

@keyframes toTop {

0% {

border-radius: 0;

}

25% {

border-radius: 7px;

}

50% {

border-radius: 14px;

}

75% {

border-radius: 21px;

}

100% {

border-radius: 28px;

}

}

@-webkit-keyframes toTop {

0% {

border-radius: 0;

}

25% {

border-radius: 7px;

}

50% {

border-radius: 14px;

}

75% {

border-radius: 21px;

}

100% {

border-radius: 28px;

}

}

@-moz-keyframes toTop {

0% {

border-radius: 0;

}

25% {

border-radius: 7px;

}

50% {

border-radius: 14px;

}

75% {

border-radius: 21px;

}

100% {

border-radius: 28px;

}

}

}

@-ms-keyframes toTop {

0% {

border-radius: 0;

}

25% {

border-radius: 7px;

}

50% {

border-radius: 14px;

}

75% {

border-radius: 21px;

}

100% {

border-radius: 28px;

}

}

.RR_toTop_hidd {

position: fixed;

display: none;

}

.RR_ani_10 {

animation: RR_ani_11 0.7s;

-moz-animation: RR_ani_11 0.7s;

-ms-animation: RR_ani_11 0.7s;

-webkit-animation: RR_ani_11 0.7s;

}

@keyframes RR_ani_11 {

from {

border-radius: 20px;

transform: rotateY(0deg);

}

to {

border-radius: 0px;

transform: rotateY(360deg);

}

}

@-moz-keyframes RR_ani_11 {

from {

border-radius: 20px;

-moz-transform: rotateY(0deg);

}

to {

border-radius: 0px;

-moz-transform: rotateY(360deg);

}

}

@-ms-keyframes RR_ani_11 {

from {

border-radius: 20px;

-ms-transform: rotateY(0deg);

}

to {

border-radius: 0px;

-ms-transform: rotateY(360deg);

}

}

@-webkit-keyframes RR_ani_11 {

from {

border-radius: 20px;

-webkit-transform: rotateY(0deg);

}

to {

border-radius: 0px;

-webkit-transform: rotateY(360deg);

}

}

.RR_ani_20 {

animation: RR_ani_21 0.7s;

-moz-animation: RR_ani_21 0.7s;

-ms-animation: RR_ani_21 0.7s;

-webkit-animation: RR_ani_21 0.7s;

}

@keyframes RR_ani_21 {

from {

opacity: 0.6;

border-radius: 20px;

transform: skewX(0deg);

}

to {

opacity: 1;

border-radius: 0px;

transform: skewX(180deg);

}

}

@-moz-keyframes RR_ani_21 {

from {

opacity: 0.6;

border-radius: 20px;

-moz-transform: skewX(0deg);

}

to {

opacity: 1;

border-radius: 0px;

-moz-transform: skewX(180deg);

}

}

@-ms-keyframes RR_ani_21 {

from {

opacity: 0.6;

border-radius: 20px;

-ms-transform: skewX(0deg);

}

to {

opacity: 1;

border-radius: 0px;

-ms-transform: skewX(180deg);

}

}

@-webkit-keyframes RR_ani_21 {

from {

opacity: 0.6;

border-radius: 20px;

-webkit-transform: skewX(0deg);

}

to {

opacity: 1;

border-radius: 0px;

-webkit-transform: skewX(180deg);

}

}

.RR_ani_30 {

animation: RR_ani_31 0.7s;

-moz-animation: RR_ani_31 0.7s;

-ms-animation: RR_ani_31 0.7s;

-webkit-animation: RR_ani_31 0.7s;

}

@keyframes RR_ani_31 {

0% {

width: 110%;

margin-left: 30px;

}

25% {

width: 130%;

border-radius: 5px;

}

50% {

width: 110%;

border-radius: 10px;

}

75 {

width: 90%;

margin-left: -10px;

border-radius: 5px;

}

100% {

margin-left: 0px;

width: 100%;

border-radius: 0px;

}

}

@-moz-keyframes RR_ani_31 {

0% {

width: 110%;

margin-left: 30px;

}

25% {

width: 130%;

border-radius: 5px;

}

50% {

width: 110%;

border-radius: 10px;

}

75 {

width: 90%;

margin-left: -10px;

border-radius: 5px;

}

100% {

margin-left: 0px;

width: 100%;

border-radius: 0px;

}

}

@-ms-keyframes RR_ani_31 {

0% {

width: 110%;

margin-left: 30px;

}

25% {

width: 130%;

border-radius: 5px;

}

50% {

width: 110%;

border-radius: 10px;

}

75 {

width: 90%;

margin-left: -10px;

border-radius: 5px;

}

100% {

margin-left: 0px;

width: 100%;

border-radius: 0px;

}

}

@-webkit-keyframes RR_ani_31 {

0% {

width: 110%;

margin-left: 30px;

}

25% {

width: 130%;

border-radius: 5px;

}

50% {

width: 110%;

border-radius: 10px;

}

75 {

width: 90%;

margin-left: -10px;

border-radius: 5px;

}

100% {

margin-left: 0px;

width: 100%;

border-radius: 0px;

}

}

.RR_ani_40 {

animation: RR_ani_41 0.7s;

-moz-animation: RR_ani_41 0.7s;

-ms-animation: RR_ani_41 0.7s;

-webkit-animation: RR_ani_41 0.7s;

}

@keyframes RR_ani_41 {

0% {

transform: skewX(20deg);

transform: skewY(20deg);

border-radius: 10px;

}

25% {

transform: skewX(40deg);

transform: skewY(40deg);

border-radius: 20px;

}

50% {

transform: skewX(15deg);

transform: skewY(15deg);

border-radius: 15px;

}

75% {

transform: skewX(-10deg);

transform: skewY(-10deg);

border-radius: 10px;

}

100% {

transform: skewX(0deg);

transform: skewY(0deg);

border-radius: 0px;

}

}

@-moz-keyframes RR_ani_41 {

0% {

-moz-transform: skewX(20deg);

-moz-transform: skewY(20deg);

border-radius: 10px;

}

25% {

-moz-transform: skewX(40deg);

-moz-transform: skewY(40deg);

border-radius: 20px;

}

50% {

-moz-transform: skewX(15deg);

-moz-transform: skewY(15deg);

border-radius: 15px;

}

75% {

-moz-transform: skewX(-10deg);

-moz-transform: skewY(-10deg);

border-radius: 10px;

}

100% {

-moz-transform: skewX(0deg);

-moz-transform: skewY(0deg);

border-radius: 0px;

}

}

@-ms-keyframes RR_ani_41 {

0% {

-ms-transform: skewX(20deg);

-ms-transform: skewY(20deg);

border-radius: 10px;

}

25% {

-ms-transform: skewX(40deg);

-ms-transform: skewY(40deg);

border-radius: 20px;

}

50% {

-ms-transform: skewX(15deg);

-ms-transform: skewY(15deg);

border-radius: 15px;

}

75% {

-ms-transform: skewX(-10deg);

-ms-transform: skewY(-10deg);

border-radius: 10px;

}

100% {

-ms-transform: skewX(0deg);

-ms-transform: skewY(0deg);

border-radius: 0px;

}

}

@-webkit-keyframes RR_ani_41 {

0% {

-webkit-transform: skewX(20deg);

-webkit-transform: skewY(20deg);

border-radius: 10px;

}

25% {

-webkit-transform: skewX(40deg);

-webkit-transform: skewY(40deg);

border-radius: 20px;

}

50% {

-webkit-transform: skewX(15deg);

-webkit-: skewY(15deg);

border-radius: 15px;

}

75% {

-webkit-transform: skewX(-10deg);

-webkit-transform: skewY(-10deg);

border-radius: 10px;

}

100% {

-webkit-transform: skewX(0deg);

-webkit-transform: skewY(0deg);

border-radius: 0px;

}

}

.RR_ani_50 {

animation: RR_ani_51 0.7s;

-moz-animation: RR_ani_51 0.7s;

-ms-animation: RR_ani_51 0.7s;

-webkit-animation: RR_ani_51 0.7s;

}

@keyframes RR_ani_51 {

0% {

transform: scaleY(0.1);

transform: rotateZ(40deg);

}

25% {

transform: scaleY(0.4);

transform: rotateZ(70deg);

}

50% {

transform: scaleY(0.7);

transform: rotateZ(30deg);

}

75% {

transform: scaleY(1.1);

transform: rotateZ(-10deg);

}

100% {

transform: scaleY(1);

transform: rotateZ(0deg);

}

}

@-moz-keyframes RR_ani_51 {

0% {

-moz-transform: scaleY(0.1);

-moz-transform: rotateZ(40deg);

}

25% {

-moz-transform: scaleY(0.4);

-moz-transform: rotateZ(70deg);

}

50% {

-moz-transform: scaleY(0.7);

-moz-transform: rotateZ(30deg);

}

75% {

-moz-transform: scaleY(1.1);

-moz-transform: rotateZ(-10deg);

}

100% {

-moz-transform: scaleY(1);

-moz-transform: rotateZ(0deg);

}

}

@-ms-keyframes RR_ani_51 {

0% {

-ms-transform: scaleY(0.1);

-ms-transform: rotateZ(40deg);

}

25% {

-ms-transform: scaleY(0.4);

-ms-transform: rotateZ(70deg);

}

50% {

-ms-transform: scaleY(0.7);

-ms-transform: rotateZ(30deg);

}

75% {

-ms-transform: scaleY(1.1);

-ms-transform: rotateZ(-10deg);

}

100% {

-ms-transform: scaleY(1);

-ms-transform: rotateZ(0deg);

}

}

@-webkit-keyframes RR_ani_51 {

0% {

-webkit-transform: scaleY(0.1);

-webkit-transform: rotateZ(40deg);

}

25% {

-webkit-transform: scaleY(0.4);

-webkit-transform: rotateZ(70deg);

}

50% {

-webkit-transform: scaleY(0.7);

-webkit-transform: rotateZ(30deg);

}

75% {

-webkit-transform: scaleY(1.1);

-webkit-transform: rotateZ(-10deg);

}

100% {

-webkit-transform: scaleY(1);

-webkit-transform: rotateZ(0deg);

}

}

.RR_ani_60 {

animation: RR_ani_61 0.7s;

-moz-animation: RR_ani_61 0.7s;

-ms-animation: RR_ani_61 0.7s;

-webkit-animation: RR_ani_61 0.7s;

}

@keyframes RR_ani_61 {

0% {

-webkit-filter: blur(3px);

-moz-filter: blur(3px);

-o-filter: blur(3px);

-ms-filter: blur(3px);

filter: blur(3px);

}

25% {} 50% {

-webkit-filter: blur(30px);

-moz-filter: blur(30px);

-o-filter: blur(30px);

-ms-filter: blur(30px);

filter: blur(30px);

}

75% {}100% {

-webkit-filter: blur(0px);

-moz-filter: blur(0px);

-o-filter: blur(0px);

-ms-filter: blur(0px);

filter: blur(0px);

}

}

@-moz-keyframes RR_ani_61 {

0% {

-webkit-filter: blur(3px);

-moz-filter: blur(3px);

-o-filter: blur(3px);

-ms-filter: blur(3px);

filter: blur(3px);

}

25% {} 50% {

-webkit-filter: blur(30px);

-moz-filter: blur(30px);

-o-filter: blur(30px);

-ms-filter: blur(30px);

filter: blur(30px);

}

75% {}100% {

-webkit-filter: blur(0px);

-moz-filter: blur(0px);

-o-filter: blur(0px);

-ms-filter: blur(0px);

filter: blur(0px);

}

}

@-ms-keyframes RR_ani_61 {

0% {

-webkit-filter: blur(3px);

-moz-filter: blur(3px);

-o-filter: blur(3px);

-ms-filter: blur(3px);

filter: blur(3px);

}

25% {} 50% {

-webkit-filter: blur(30px);

-moz-filter: blur(30px);

-o-filter: blur(30px);

-ms-filter: blur(30px);

filter: blur(30px);

}

75% {}100% {

-webkit-filter: blur(0px);

-moz-filter: blur(0px);

-o-filter: blur(0px);

-ms-filter: blur(0px);

filter: blur(0px);

}

}

@-webkit-keyframes RR_ani_61 {

0% {

-webkit-filter: blur(3px);

-moz-filter: blur(3px);

-o-filter: blur(3px);

-ms-filter: blur(3px);

filter: blur(3px);

}

25% {} 50% {

-webkit-filter: blur(30px);

-moz-filter: blur(30px);

-o-filter: blur(30px);

-ms-filter: blur(30px);

filter: blur(30px);

}

75% {}100% {

-webkit-filter: blur(0px);

-moz-filter: blur(0px);

-o-filter: blur(0px);

-ms-filter: blur(0px);

filter: blur(0px);

}

}

.RR_ani_70 {

animation: RR_ani_71 0.7s;

-moz-animation: RR_ani_71 0.7s;

-ms-animation: RR_ani_71 0.7s;

-webkit-animation: RR_ani_71 0.7s;

}

@keyframes RR_ani_71 {

0% {

transform: skewX(-10deg);

transform: scaleY(1.1);

border-radius: 10px;

}

25% {

transform: skewX(10deg);

transform: scaleY(1.4);

border-radius: 20px;

}

50% {

transform: skewX(30deg);

transform: scaleY(1.1);

border-radius: 15px;

}

75% {

transform: skewX(10deg);

transform: scaleY(0.9);

border-radius: 10px;

}

100% {

transform: skewX(0deg);

transform: scaleY(1);

border-radius: 0px;

}

}

@-ms-keyframes RR_ani_71 {

0% {

-ms-transform: rotateX(-10deg);

-ms-transform: scaleY(1.1);

border-radius: 10px;

}

25% {

-ms-transform: rotateX(10deg);

-ms-transform: scaleY(1.4);

border-radius: 20px;

}

50% {

-ms-transform: rotateX(30deg);

-ms-transform: scale(1.1);

border-radius: 15px;

}

75% {

-ms-transform: rotateX(10deg);

-ms-transform: scaleY(0.9);

border-radius: 10px;

}

100% {

-ms-transform: rotateX(0deg);

-ms-transform: scaleY(1);

border-radius: 0px;

}

}

@-moz-keyframes RR_ani_71 {

0% {

-moz-transform: rotateX(-10deg);

-moz-transform: scaleY(1.1);

border-radius: 10px;

}

25% {

-moz-transform: rotateX(10deg);

-moz-transform: scaleY(1.4);

border-radius: 20px;

}

50% {

-moz-transform: rotateX(30deg);

-moz-transform: scaleY(1.1);

border-radius: 15px;

}

75% {

-moz-transform: rotateX(10deg);

-moz-transform: scaleY(0.9);

border-radius: 10px;

}

100% {

-moz-transform: rotateX(0deg);

-moz-transform: scaleY(1);

border-radius: 0px;

}

}

@-webkit-keyframes RR_ani_71 {

0% {

-webkit-transform: rotateX(-10deg);

-webkit-transform: scaleY(1.1);

border-radius: 10px;

}

25% {

-webkit-transform: rotateX(10deg);

-webkit-transform: scaleY(1.4);

border-radius: 20px;

}

50% {

-webkit-transform: rotateX(30deg);

-webkit-transform: scaleY(1.1);

border-radius: 15px;

}

75% {

-webkit-transform: rotateX(10deg);

-webkit-transform: scaleY(0.9);

border-radius: 10px;

}

100% {

-webkit-transform: rotateX0deg);

-webkit-transform: scaleY(1);

border-radius: 0px;

}

}

rr.css

标签：

原文地址：http://www.cnblogs.com/umissthestars/p/4580343.html