/*--公共部分--*/
html {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
cursor: pointer;
}
body, form, img, ul, ol, li, dl, dt, dd, p, tr, td, strong, span, pre {
margin: 0;
padding: 0;
border: 0;
}
@font-face{
src:url('../fonts/TitilliumWeb-Regular.ttf');
font-family:"Titillium";
font-style:normal;
}
h1, h2, h3, h4, h5, h6, p {
margin: 0;
padding: 0;
font-weight: normal;
}
body, button, input, select, textarea {
font: 14px/1.5 Arial, 'Microsoft YaHei', 'Hiragino Sans GB', sans-serif;
color: #333;
}
ul, li {
list-style: none;
}
img {
border: 0px;
vertical-align: middle;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
table th, table td {
border: 1px solid #ccc;
}
*, :after, :before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-repeat: no-repeat;
}
article, aside, footer, header, nav, section {
display: block;
}
a {
background-color: transparent;
-webkit-text-decoration-skip: objects;
text-decoration: none;
color: #333;
outline: none;
cursor: pointer;
}
a:hover {
background-repeat: no-repeat;
text-decoration: none;
}
a, input[type="button"], button, label, input[type="submit"], input[type="reset"] {
cursor: pointer;
}
sub, sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
audio, video {
display: inline-block;
}
[type="checkbox"], [type="radio"] {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
}
input, textarea, select {
outline: none;
}
input[type="text"], input[type="password"], input[type="button"], input[type="submit"], input[type="reset"], select, textarea {
}
textarea {
overflow: auto;
vertical-align: top;
}
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px rgba(255, 255, 255, 0) inset !important;
}
.bd_weixin_popup, .content-box {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.clearfix {
*zoom: 1;
}
.clear {
font-size: 0;
}
.fl {
float: left;
}
.fr {
float: right;
}
.show {
display: block !important;
}
.hide {
display: none !important;
}
.commonweb {
padding: 0px 15px;
}
.commonwebbox {
margin-left: 0px;
margin-right: 0px;
}
.commonleft {
float: none;
}
.commonright {
float: none;
}
.visible-sm, .visible-md, .visible-lg {
display: none;
}
.hidden-sm, .hidden-md, .hidden-lg {
display: block;
}
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
float: left;
padding-left: 10px;
padding-right: 10px;
}
.col-xs-12 {
width: 100%;
}
.col-xs-11 {
width: 91.66666667%;
}
.col-xs-10 {
width: 83.33333333%;
}
.col-xs-9 {
width: 75%;
}
.col-xs-8 {
width: 66.66666667%;
}
.col-xs-7 {
width: 58.33333333%;
}
.col-xs-6 {
width: 50%;
}
.col-xs-5 {
width: 41.66666667%;
}
.col-xs-4 {
width: 33.33333333%;
}
.col-xs-3 {
width: 25%;
}
.col-xs-2 {
width: 16.66666667%;
}
.col-xs-1 {
width: 8.33333333%;
}
@media (max-width: 320px) {
body {
min-width: 320px;
}
}
@media (min-width: 768px) {
.commonweb {
padding: 0px 20px;
}
.commonwebbox {
margin-left: -10px;
margin-right: -10px;
}
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
float: left;
padding-left: 10px;
padding-right: 10px;
}
.col-sm-12 {
width: 100%;
}
.col-sm-11 {
width: 91.66666667%;
}
.col-sm-10 {
width: 83.33333333%;
}
.col-sm-9 {
width: 75%;
}
.col-sm-8 {
width: 66.66666667%;
}
.col-sm-7 {
width: 58.33333333%;
}
.col-sm-6 {
width: 50%;
}
.col-sm-5 {
width: 41.66666667%;
}
.col-sm-4 {
width: 33.33333333%;
}
.col-sm-3 {
width: 25%;
}
.col-sm-2 {
width: 16.66666667%;
}
.col-sm-1 {
width: 8.33333333%;
}
.visible-sm {
display: block;
}
.hidden-sm {
display: none;
}
}
@media (min-width: 992px) {
.commonweb {
padding: 0px 40px;
}
.commonwebbox {
margin-left: -10px;
margin-right: -10px;
}
.commonleft {
float: left;
}
.commonright {
float: right;
}
.visible-md {
display: block;
}
.hidden-md {
display: none;
}
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md-13 {
float: left;
padding-left: 10px;
padding-right: 10px;
}
.col-md-12 {
width: 100%;
}
.col-md-11 {
width: 91.66666667%;
}
.col-md-10 {
width: 83.33333333%;
}
.col-md-9 {
width: 75%;
}
.col-md-8 {
width: 66.66666667%;
}
.col-md-7 {
width: 58.33333333%;
}
.col-md-6 {
width: 50%;
}
.col-md-5 {
width: 41.66666667%;
}
.col-md-4 {
width: 33.33333333%;
}
.col-md-3 {
width: 25%;
}
.col-md-2 {
width: 16.66666667%;
}
.col-md-1 {
width: 8.33333333%;
}
.col-md-13 {
width: 20%;
}
}
@media (min-width: 1200px) {
html {
cursor: default;
}
.commonleft {
float: left;
}
.commonright {
float: right;
}
.visible-lg {
display: block;
}
.hidden-lg {
display: none;
}
.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-13 {
float: left;
padding-left: 10px;
padding-right: 10px;
}
.col-lg-12 {
width: 100%;
}
.col-lg-11 {
width: 91.66666667%;
}
.col-lg-10 {
width: 83.33333333%;
}
.col-lg-9 {
width: 75%;
}
.col-lg-8 {
width: 66.66666667%;
}
.col-lg-7 {
width: 58.33333333%;
}
.col-lg-6 {
width: 50%;
}
.col-lg-5 {
width: 41.66666667%;
}
.col-lg-4 {
width: 33.33333333%;
}
.col-lg-3 {
width: 25%;
}
.col-lg-2 {
width: 16.66666667%;
}
.col-lg-1 {
width: 8.33333333%;
}
.col-lg-13 {
width:20%;
}
}
@media (min-width: 1260px) {
.commonweb {
margin: 0px auto;
max-width: 1200px;
padding: 0;
}
}
/* layout start*/
.swiper-container {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
z-index: 1;
}
.swiper-container-no-flexbox .swiper-slide {
float: left;
}
.swiper-container-vertical > .swiper-wrapper {
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-ms-flex-direction: column;
-webkit-flex-direction: column;
flex-direction: column;
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: -webkit-transform;
-moz-transition-property: transform,-moz-transform;
-moz-transition-property: transform, -moz-transform;
transition-property: transform;
transition-property: transform, -webkit-transform, -moz-transform, -o-transform;
transition-property: transform,-webkit-transform,-moz-transform,-o-transform;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.swiper-container-android .swiper-slide, .swiper-wrapper {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-o-transform: translate(0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.swiper-container-free-mode > .swiper-wrapper {
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
margin: 0 auto;
}
.swiper-slide {
-webkit-flex-shrink: 0;
-ms-flex: 0 0 auto;
-ms-flex-negative: 0;
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
}
.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {
height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
-moz-box-align: start;
align-items: flex-start;
-webkit-transition-property: -webkit-transform,height;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-webkit-transition-property: height,-webkit-transform;
transition-property: height,-webkit-transform;
-o-transition-property: height,-o-transform;
-moz-transition-property: transform,height,-moz-transform;
transition-property: transform,height;
transition-property: transform,height,-webkit-transform,-moz-transform,-o-transform;
}
.swiper-container .swiper-notification {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
opacity: 0;
z-index: -1000;
}
.swiper-wp8-horizontal {
-ms-touch-action: pan-y;
touch-action: pan-y;
}
.swiper-wp8-vertical {
-ms-touch-action: pan-x;
touch-action: pan-x;
}
.swiper-button-next, .swiper-button-prev {
position: absolute;
top: 50%;
width: 27px;
height: 44px;
margin-top: -22px;
z-index: 10;
cursor: pointer;
-o-background-size: 27px 44px;
background-size: 27px 44px;
background-position: center;
background-repeat: no-repeat;
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
opacity: .35;
cursor: auto;
pointer-events: none;
}
.swiper-pagination {
position: absolute;
text-align: center;
-webkit-transition: .3s;
-moz-transition: .3s;
-o-transition: .3s;
transition: .3s;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer;
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.swiper-container-fade .swiper-slide {
pointer-events: none;
-webkit-transition-property: opacity;
-moz-transition-property: opacity;
-o-transition-property: opacity;
transition-property: opacity;
}
.swiper-container-fade .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0;
}
.swiper-pagination-bullet {
width: 8px;
height: 8px;
display: inline-block;
-webkit-border-radius: 100%;
border-radius: 100%;
background: #000;
}
button.swiper-pagination-bullet {
border: none;
margin: 0;
padding: 0;
-webkit-box-shadow: none;
box-shadow: none;
-moz-appearance: none;
-ms-appearance: none;
-webkit-appearance: none;
appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer;
}
.swiper-pagination-bullet-active {
opacity: 1;
background: #007aff;
}
/*!
* animate.css -http://daneden.me/animate
* Version - 3.5.1
* Licensed under the MIT license - http://opensource.org/licenses/MIT
*
* Copyright (c) 2016 Daniel Eden
*/
.animated {
-webkit-animation-duration: 1s;
-moz-animation-duration: 1s;
-o-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode: both;
-o-animation-fill-mode: both;
animation-fill-mode: both;
}
.animated.infinite {
-webkit-animation-iteration-count: infinite;
-moz-animation-iteration-count: infinite;
-o-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.animated.hinge {
-webkit-animation-duration: 2s;
-moz-animation-duration: 2s;
-o-animation-duration: 2s;
animation-duration: 2s;
}
.animated.bounceIn, .animated.bounceOut, .animated.flipOutX, .animated.flipOutY {
-webkit-animation-duration: .75s;
-moz-animation-duration: .75s;
-o-animation-duration: .75s;
animation-duration: .75s;
}
@-webkit-keyframes bounce {
0%, 20%, 53%, 80%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
40%, 43% {
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
40%, 43%, 70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
}
70% {
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
@-moz-keyframes bounce {
0%, 20%, 53%, 80%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
40%, 43% {
-webkit-transform: translate3d(0, -30px, 0);
-moz-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
40%, 43%, 70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-moz-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
}
70% {
-webkit-transform: translate3d(0, -15px, 0);
-moz-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
-moz-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
@-o-keyframes bounce {
0%, 20%, 53%, 80%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
40%, 43% {
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
40%, 43%, 70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-o-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
}
70% {
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
@keyframes bounce {
0%, 20%, 53%, 80%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
40%, 43% {
-webkit-transform: translate3d(0, -30px, 0);
-moz-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
40%, 43%, 70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-moz-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-o-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
}
70% {
-webkit-transform: translate3d(0, -15px, 0);
-moz-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
-moz-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
.bounce {
-webkit-animation-name: bounce;
-moz-animation-name: bounce;
-o-animation-name: bounce;
animation-name: bounce;
-webkit-transform-origin: center bottom;
-moz-transform-origin: center bottom;
-ms-transform-origin: center bottom;
-o-transform-origin: center bottom;
transform-origin: center bottom;
}
@-webkit-keyframes flash {
0%, 50%, to {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@-moz-keyframes flash {
0%, 50%, to {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@-o-keyframes flash {
0%, 50%, to {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@keyframes flash {
0%, 50%, to {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
.flash {
-webkit-animation-name: flash;
-moz-animation-name: flash;
-o-animation-name: flash;
animation-name: flash;
}
@-webkit-keyframes pulse {
0% {
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
to {
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
}
@-moz-keyframes pulse {
0% {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
transform: scaleX(1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
-moz-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
to {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
transform: scaleX(1);
}
}
@-o-keyframes pulse {
0% {
-webkit-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
to {
-webkit-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
}
@keyframes pulse {
0% {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
-moz-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
to {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
}
.pulse {
-webkit-animation-name: pulse;
-moz-animation-name: pulse;
-o-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes rubberBand {
0% {
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
to {
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
}
@-moz-keyframes rubberBand {
0% {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
transform: scaleX(1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
-moz-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
-moz-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
-moz-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
-moz-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
-moz-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
to {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
transform: scaleX(1);
}
}
@-o-keyframes rubberBand {
0% {
-webkit-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
to {
-webkit-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
}
@keyframes rubberBand {
0% {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
-moz-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
-moz-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
-moz-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
-moz-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
-moz-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
to {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
}
.rubberBand {
-webkit-animation-name: rubberBand;
-moz-animation-name: rubberBand;
-o-animation-name: rubberBand;
animation-name: rubberBand;
}
@-webkit-keyframes shake {
0%, to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@-moz-keyframes shake {
0%, to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
-moz-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
-moz-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@-o-keyframes shake {
0%, to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@keyframes shake {
0%, to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
-moz-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
-moz-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
.shake {
-webkit-animation-name: shake;
-moz-animation-name: shake;
-o-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes headShake {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
6.5% {
-webkit-transform: translateX(-6px) rotateY(-9deg);
transform: translateX(-6px) rotateY(-9deg);
}
18.5% {
-webkit-transform: translateX(5px) rotateY(7deg);
transform: translateX(5px) rotateY(7deg);
}
31.5% {
-webkit-transform: translateX(-3px) rotateY(-5deg);
transform: translateX(-3px) rotateY(-5deg);
}
43.5% {
-webkit-transform: translateX(2px) rotateY(3deg);
transform: translateX(2px) rotateY(3deg);
}
50% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-moz-keyframes headShake {
0% {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
transform: translateX(0);
}
6.5% {
-webkit-transform: translateX(-6px) rotateY(-9deg);
-moz-transform: translateX(-6px) rotateY(-9deg);
transform: translateX(-6px) rotateY(-9deg);
}
18.5% {
-webkit-transform: translateX(5px) rotateY(7deg);
-moz-transform: translateX(5px) rotateY(7deg);
transform: translateX(5px) rotateY(7deg);
}
31.5% {
-webkit-transform: translateX(-3px) rotateY(-5deg);
-moz-transform: translateX(-3px) rotateY(-5deg);
transform: translateX(-3px) rotateY(-5deg);
}
43.5% {
-webkit-transform: translateX(2px) rotateY(3deg);
-moz-transform: translateX(2px) rotateY(3deg);
transform: translateX(2px) rotateY(3deg);
}
50% {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
transform: translateX(0);
}
}
@-o-keyframes headShake {
0% {
-webkit-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
6.5% {
-webkit-transform: translateX(-6px) rotateY(-9deg);
transform: translateX(-6px) rotateY(-9deg);
}
18.5% {
-webkit-transform: translateX(5px) rotateY(7deg);
transform: translateX(5px) rotateY(7deg);
}
31.5% {
-webkit-transform: translateX(-3px) rotateY(-5deg);
transform: translateX(-3px) rotateY(-5deg);
}
43.5% {
-webkit-transform: translateX(2px) rotateY(3deg);
transform: translateX(2px) rotateY(3deg);
}
50% {
-webkit-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes headShake {
0% {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
6.5% {
-webkit-transform: translateX(-6px) rotateY(-9deg);
-moz-transform: translateX(-6px) rotateY(-9deg);
transform: translateX(-6px) rotateY(-9deg);
}
18.5% {
-webkit-transform: translateX(5px) rotateY(7deg);
-moz-transform: translateX(5px) rotateY(7deg);
transform: translateX(5px) rotateY(7deg);
}
31.5% {
-webkit-transform: translateX(-3px) rotateY(-5deg);
-moz-transform: translateX(-3px) rotateY(-5deg);
transform: translateX(-3px) rotateY(-5deg);
}
43.5% {
-webkit-transform: translateX(2px) rotateY(3deg);
-moz-transform: translateX(2px) rotateY(3deg);
transform: translateX(2px) rotateY(3deg);
}
50% {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
}
.headShake {
-webkit-animation-timing-function: ease-in-out;
-moz-animation-timing-function: ease-in-out;
-o-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-name: headShake;
-moz-animation-name: headShake;
-o-animation-name: headShake;
animation-name: headShake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate(15deg);
transform: rotate(15deg);
}
40% {
-webkit-transform: rotate(-10deg);
transform: rotate(-10deg);
}
60% {
-webkit-transform: rotate(5deg);
transform: rotate(5deg);
}
80% {
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
to {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@-moz-keyframes swing {
20% {
-webkit-transform: rotate(15deg);
-moz-transform: rotate(15deg);
transform: rotate(15deg);
}
40% {
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
transform: rotate(-10deg);
}
60% {
-webkit-transform: rotate(5deg);
-moz-transform: rotate(5deg);
transform: rotate(5deg);
}
80% {
-webkit-transform: rotate(-5deg);
-moz-transform: rotate(-5deg);
transform: rotate(-5deg);
}
to {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@-o-keyframes swing {
20% {
-webkit-transform: rotate(15deg);
-o-transform: rotate(15deg);
transform: rotate(15deg);
}
40% {
-webkit-transform: rotate(-10deg);
-o-transform: rotate(-10deg);
transform: rotate(-10deg);
}
60% {
-webkit-transform: rotate(5deg);
-o-transform: rotate(5deg);
transform: rotate(5deg);
}
80% {
-webkit-transform: rotate(-5deg);
-o-transform: rotate(-5deg);
transform: rotate(-5deg);
}
to {
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate(15deg);
-moz-transform: rotate(15deg);
-o-transform: rotate(15deg);
transform: rotate(15deg);
}
40% {
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
-o-transform: rotate(-10deg);
transform: rotate(-10deg);
}
60% {
-webkit-transform: rotate(5deg);
-moz-transform: rotate(5deg);
-o-transform: rotate(5deg);
transform: rotate(5deg);
}
80% {
-webkit-transform: rotate(-5deg);
-moz-transform: rotate(-5deg);
-o-transform: rotate(-5deg);
transform: rotate(-5deg);
}
to {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
}
.swing {
-webkit-transform-origin: top center;
-moz-transform-origin: top center;
-ms-transform-origin: top center;
-o-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
-moz-animation-name: swing;
-o-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
0% {
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
10%, 20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
}
to {
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
}
@-moz-keyframes tada {
0% {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
transform: scaleX(1);
}
10%, 20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
-moz-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
-moz-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
-moz-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
}
to {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
transform: scaleX(1);
}
}
@-o-keyframes tada {
0% {
-webkit-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
10%, 20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
}
to {
-webkit-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
}
@keyframes tada {
0% {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
10%, 20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
-moz-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
-moz-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
-moz-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
}
to {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
}
.tada {
-webkit-animation-name: tada;
-moz-animation-name: tada;
-o-animation-name: tada;
animation-name: tada;
}
@-webkit-keyframes wobble {
0% {
-webkit-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
transform: translate3d(-25%, 0, 0) rotate(-5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
transform: translate3d(20%, 0, 0) rotate(3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
transform: translate3d(-15%, 0, 0) rotate(-3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
transform: translate3d(10%, 0, 0) rotate(2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
transform: translate3d(-5%, 0, 0) rotate(-1deg);
}
to {
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes wobble {
0% {
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
-moz-transform: translate3d(-25%, 0, 0) rotate(-5deg);
transform: translate3d(-25%, 0, 0) rotate(-5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
-moz-transform: translate3d(20%, 0, 0) rotate(3deg);
transform: translate3d(20%, 0, 0) rotate(3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
-moz-transform: translate3d(-15%, 0, 0) rotate(-3deg);
transform: translate3d(-15%, 0, 0) rotate(-3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
-moz-transform: translate3d(10%, 0, 0) rotate(2deg);
transform: translate3d(10%, 0, 0) rotate(2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
-moz-transform: translate3d(-5%, 0, 0) rotate(-1deg);
transform: translate3d(-5%, 0, 0) rotate(-1deg);
}
to {
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes wobble {
0% {
-webkit-transform: none;
-o-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
transform: translate3d(-25%, 0, 0) rotate(-5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
transform: translate3d(20%, 0, 0) rotate(3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
transform: translate3d(-15%, 0, 0) rotate(-3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
transform: translate3d(10%, 0, 0) rotate(2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
transform: translate3d(-5%, 0, 0) rotate(-1deg);
}
to {
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes wobble {
0% {
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
-moz-transform: translate3d(-25%, 0, 0) rotate(-5deg);
transform: translate3d(-25%, 0, 0) rotate(-5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
-moz-transform: translate3d(20%, 0, 0) rotate(3deg);
transform: translate3d(20%, 0, 0) rotate(3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
-moz-transform: translate3d(-15%, 0, 0) rotate(-3deg);
transform: translate3d(-15%, 0, 0) rotate(-3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
-moz-transform: translate3d(10%, 0, 0) rotate(2deg);
transform: translate3d(10%, 0, 0) rotate(2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
-moz-transform: translate3d(-5%, 0, 0) rotate(-1deg);
transform: translate3d(-5%, 0, 0) rotate(-1deg);
}
to {
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.wobble {
-webkit-animation-name: wobble;
-moz-animation-name: wobble;
-o-animation-name: wobble;
animation-name: wobble;
}
@-webkit-keyframes jello {
0%, 11.1%, to {
-webkit-transform: none;
transform: none;
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg);
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg);
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg);
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg);
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg);
}
77.7% {
-webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
transform: skewX(0.39063deg) skewY(0.39063deg);
}
88.8% {
-webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
transform: skewX(-0.19531deg) skewY(-0.19531deg);
}
}
@-moz-keyframes jello {
0%, 11.1%, to {
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
-moz-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg);
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
-moz-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg);
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
-moz-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg);
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
-moz-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg);
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
-moz-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg);
}
77.7% {
-webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
-moz-transform: skewX(0.39063deg) skewY(0.39063deg);
transform: skewX(0.39063deg) skewY(0.39063deg);
}
88.8% {
-webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
-moz-transform: skewX(-0.19531deg) skewY(-0.19531deg);
transform: skewX(-0.19531deg) skewY(-0.19531deg);
}
}
@-o-keyframes jello {
0%, 11.1%, to {
-webkit-transform: none;
-o-transform: none;
transform: none;
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
-o-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg);
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
-o-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg);
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
-o-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg);
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
-o-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg);
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
-o-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg);
}
77.7% {
-webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
-o-transform: skewX(0.39063deg) skewY(0.39063deg);
transform: skewX(0.39063deg) skewY(0.39063deg);
}
88.8% {
-webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
-o-transform: skewX(-0.19531deg) skewY(-0.19531deg);
transform: skewX(-0.19531deg) skewY(-0.19531deg);
}
}
@keyframes jello {
0%, 11.1%, to {
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
-moz-transform: skewX(-12.5deg) skewY(-12.5deg);
-o-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg);
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
-moz-transform: skewX(6.25deg) skewY(6.25deg);
-o-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg);
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
-moz-transform: skewX(-3.125deg) skewY(-3.125deg);
-o-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg);
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
-moz-transform: skewX(1.5625deg) skewY(1.5625deg);
-o-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg);
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
-moz-transform: skewX(-0.78125deg) skewY(-0.78125deg);
-o-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg);
}
77.7% {
-webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
-moz-transform: skewX(0.39063deg) skewY(0.39063deg);
-o-transform: skewX(0.39063deg) skewY(0.39063deg);
transform: skewX(0.39063deg) skewY(0.39063deg);
}
88.8% {
-webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
-moz-transform: skewX(-0.19531deg) skewY(-0.19531deg);
-o-transform: skewX(-0.19531deg) skewY(-0.19531deg);
transform: skewX(-0.19531deg) skewY(-0.19531deg);
}
}
.jello {
-webkit-animation-name: jello;
-moz-animation-name: jello;
-o-animation-name: jello;
animation-name: jello;
-webkit-transform-origin: center;
-moz-transform-origin: center;
-ms-transform-origin: center;
-o-transform-origin: center;
transform-origin: center;
}
@-webkit-keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
to {
opacity: 1;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
}
@-moz-keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-moz-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
-moz-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
-moz-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
-moz-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
-moz-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
to {
opacity: 1;
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
transform: scaleX(1);
}
}
@-o-keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
to {
opacity: 1;
-webkit-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
}
@keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-moz-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
-moz-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
-moz-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
-moz-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
-moz-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
to {
opacity: 1;
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
}
.bounceIn {
-webkit-animation-name: bounceIn;
-moz-animation-name: bounceIn;
-o-animation-name: bounceIn;
animation-name: bounceIn;
}
@-webkit-keyframes bounceInDown {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
to {
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes bounceInDown {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
-moz-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
-moz-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
-moz-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
-moz-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
to {
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes bounceInDown {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
to {
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes bounceInDown {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
-moz-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
-moz-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
-moz-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
-moz-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
to {
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
-moz-animation-name: bounceInDown;
-o-animation-name: bounceInDown;
animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
to {
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes bounceInLeft {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
-moz-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
-moz-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
-moz-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
-moz-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
to {
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes bounceInLeft {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
to {
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes bounceInLeft {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
-moz-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
-moz-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
-moz-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
-moz-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
to {
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
-moz-animation-name: bounceInLeft;
-o-animation-name: bounceInLeft;
animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
to {
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes bounceInRight {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
-moz-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
-moz-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
-moz-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
-moz-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
to {
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes bounceInRight {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
to {
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes bounceInRight {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
-moz-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
-moz-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
-moz-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
-moz-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
to {
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
-moz-animation-name: bounceInRight;
-o-animation-name: bounceInRight;
animation-name: bounceInRight;
}
@-webkit-keyframes bounceInUp {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@-moz-keyframes bounceInUp {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
-moz-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
-moz-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
-moz-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
-moz-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
@-o-keyframes bounceInUp {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@keyframes bounceInUp {
0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-moz-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-o-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
-moz-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
-moz-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
-moz-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
-moz-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
-moz-animation-name: bounceInUp;
-o-animation-name: bounceInUp;
animation-name: bounceInUp;
}
@-webkit-keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
@-moz-keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
-moz-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
-moz-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-moz-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
@-o-keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
@keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
-moz-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
-moz-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-moz-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
.bounceOut {
-webkit-animation-name: bounceOut;
-moz-animation-name: bounceOut;
-o-animation-name: bounceOut;
animation-name: bounceOut;
}
@-webkit-keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@-moz-keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
-moz-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
-moz-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
-moz-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@-o-keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
-moz-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
-moz-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
-moz-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
-moz-animation-name: bounceOutDown;
-o-animation-name: bounceOutDown;
animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@-moz-keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
-moz-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
-moz-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@-o-keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
-moz-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
-moz-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
-moz-animation-name: bounceOutLeft;
-o-animation-name: bounceOutLeft;
animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@-moz-keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
-moz-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
-moz-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@-o-keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
-moz-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
-moz-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.bounceOutRight {
-webkit-animation-name: bounceOutRight;
-moz-animation-name: bounceOutRight;
-o-animation-name: bounceOutRight;
animation-name: bounceOutRight;
}
@-webkit-keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@-moz-keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
-moz-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
-moz-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
-moz-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@-o-keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
-moz-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
-moz-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
-moz-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
-moz-animation-name: bounceOutUp;
-o-animation-name: bounceOutUp;
animation-name: bounceOutUp;
}
@-webkit-keyframes fadeIn {
0% {
opacity: 0;
}
to {
opacity: 1;
}
}
@-moz-keyframes fadeIn {
0% {
opacity: 0;
}
to {
opacity: 1;
}
}
@-o-keyframes fadeIn {
0% {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
0% {
opacity: 0;
}
to {
opacity: 1;
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
-moz-animation-name: fadeIn;
-o-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
-moz-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
-moz-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
-moz-animation-name: fadeInDown;
-o-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
-moz-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
-moz-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
-moz-animation-name: fadeInDownBig;
-o-animation-name: fadeInDownBig;
animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-10%, 0, 0);
transform: translate3d(-10%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-10%, 0, 0);
-moz-transform: translate3d(-10%, 0, 0);
transform: translate3d(-10%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-10%, 0, 0);
transform: translate3d(-10%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-10%, 0, 0);
-moz-transform: translate3d(-10%, 0, 0);
transform: translate3d(-10%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
-moz-animation-name: fadeInLeft;
-o-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
-moz-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
-moz-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
-moz-animation-name: fadeInLeftBig;
-o-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(15px, 0, 0);
transform: translate3d(15px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(15px, 0, 0);
-moz-transform: translate3d(15px, 0, 0);
transform: translate3d(15px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(15px, 0, 0);
transform: translate3d(15px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(15px, 0, 0);
-moz-transform: translate3d(15px, 0, 0);
transform: translate3d(15px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
-moz-animation-name: fadeInRight;
-o-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
-moz-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
-moz-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
-moz-animation-name: fadeInRightBig;
-o-animation-name: fadeInRightBig;
animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 15px, 0);
transform: translate3d(0, 15px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 15px, 0);
-moz-transform: translate3d(0, 15px, 0);
transform: translate3d(0, 15px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 15px, 0);
transform: translate3d(0, 15px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 15px, 0);
-moz-transform: translate3d(0, 15px, 0);
transform: translate3d(0, 15px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
-moz-animation-name: fadeInUp;
-o-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
-moz-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
-moz-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
-moz-animation-name: fadeInUpBig;
-o-animation-name: fadeInUpBig;
animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeOut {
0% {
opacity: 1;
}
to {
opacity: 0;
}
}
@-moz-keyframes fadeOut {
0% {
opacity: 1;
}
to {
opacity: 0;
}
}
@-o-keyframes fadeOut {
0% {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes fadeOut {
0% {
opacity: 1;
}
to {
opacity: 0;
}
}
.fadeOut {
-webkit-animation-name: fadeOut;
-moz-animation-name: fadeOut;
-o-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOutDown {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-moz-keyframes fadeOutDown {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
-moz-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-o-keyframes fadeOutDown {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes fadeOutDown {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
-moz-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
-moz-animation-name: fadeOutDown;
-o-animation-name: fadeOutDown;
animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutDownBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@-moz-keyframes fadeOutDownBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
-moz-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@-o-keyframes fadeOutDownBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes fadeOutDownBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
-moz-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
-moz-animation-name: fadeOutDownBig;
-o-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-moz-keyframes fadeOutLeft {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
-moz-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-o-keyframes fadeOutLeft {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
-moz-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
-moz-animation-name: fadeOutLeft;
-o-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@-moz-keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
-moz-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@-o-keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
-moz-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
-moz-animation-name: fadeOutLeftBig;
-o-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRight {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-moz-keyframes fadeOutRight {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
-moz-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-o-keyframes fadeOutRight {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes fadeOutRight {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
-moz-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
-moz-animation-name: fadeOutRight;
-o-animation-name: fadeOutRight;
animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutRightBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@-moz-keyframes fadeOutRightBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
-moz-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@-o-keyframes fadeOutRightBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes fadeOutRightBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
-moz-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
-moz-animation-name: fadeOutRightBig;
-o-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig;
}
@-webkit-keyframes fadeOutUp {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-moz-keyframes fadeOutUp {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
-moz-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-o-keyframes fadeOutUp {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes fadeOutUp {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
-moz-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
-moz-animation-name: fadeOutUp;
-o-animation-name: fadeOutUp;
animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutUpBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@-moz-keyframes fadeOutUpBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
-moz-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@-o-keyframes fadeOutUpBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes fadeOutUpBig {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
-moz-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
-moz-animation-name: fadeOutUpBig;
-o-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig;
}
@-webkit-keyframes flip {
0% {
-webkit-transform: perspective(400px) rotateY(-1turn);
transform: perspective(400px) rotateY(-1turn);
}
0%, 40% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
transform: perspective(400px) translateZ(150px) rotateY(-190deg);
}
50% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
transform: perspective(400px) translateZ(150px) rotateY(-170deg);
}
50%, 80% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@-moz-keyframes flip {
0% {
-webkit-transform: perspective(400px) rotateY(-1turn);
-moz-transform: perspective(400px) rotateY(-1turn);
transform: perspective(400px) rotateY(-1turn);
}
0%, 40% {
-webkit-animation-timing-function: ease-out;
-moz-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
-moz-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
transform: perspective(400px) translateZ(150px) rotateY(-190deg);
}
50% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
-moz-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
transform: perspective(400px) translateZ(150px) rotateY(-170deg);
}
50%, 80% {
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
-moz-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
}
to {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@-o-keyframes flip {
0% {
-webkit-transform: perspective(400px) rotateY(-1turn);
transform: perspective(400px) rotateY(-1turn);
}
0%, 40% {
-webkit-animation-timing-function: ease-out;
-o-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
transform: perspective(400px) translateZ(150px) rotateY(-190deg);
}
50% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
transform: perspective(400px) translateZ(150px) rotateY(-170deg);
}
50%, 80% {
-webkit-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@keyframes flip {
0% {
-webkit-transform: perspective(400px) rotateY(-1turn);
-moz-transform: perspective(400px) rotateY(-1turn);
transform: perspective(400px) rotateY(-1turn);
}
0%, 40% {
-webkit-animation-timing-function: ease-out;
-moz-animation-timing-function: ease-out;
-o-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
-moz-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
transform: perspective(400px) translateZ(150px) rotateY(-190deg);
}
50% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
-moz-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
transform: perspective(400px) translateZ(150px) rotateY(-170deg);
}
50%, 80% {
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
-moz-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
}
to {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
.animated.flip {
-webkit-backface-visibility: visible;
-moz-backface-visibility: visible;
backface-visibility: visible;
-webkit-animation-name: flip;
-moz-animation-name: flip;
-o-animation-name: flip;
animation-name: flip;
}
@-webkit-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
0%, 40% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
40% {
-webkit-transform: perspective(400px) rotateX(-20deg);
transform: perspective(400px) rotateX(-20deg);
}
60% {
-webkit-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotateX(-5deg);
transform: perspective(400px) rotateX(-5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@-moz-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
-moz-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
0%, 40% {
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
40% {
-webkit-transform: perspective(400px) rotateX(-20deg);
-moz-transform: perspective(400px) rotateX(-20deg);
transform: perspective(400px) rotateX(-20deg);
}
60% {
-webkit-transform: perspective(400px) rotateX(10deg);
-moz-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotateX(-5deg);
-moz-transform: perspective(400px) rotateX(-5deg);
transform: perspective(400px) rotateX(-5deg);
}
to {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
}
}
@-o-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
0%, 40% {
-webkit-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
40% {
-webkit-transform: perspective(400px) rotateX(-20deg);
transform: perspective(400px) rotateX(-20deg);
}
60% {
-webkit-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotateX(-5deg);
transform: perspective(400px) rotateX(-5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
-moz-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
0%, 40% {
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
40% {
-webkit-transform: perspective(400px) rotateX(-20deg);
-moz-transform: perspective(400px) rotateX(-20deg);
transform: perspective(400px) rotateX(-20deg);
}
60% {
-webkit-transform: perspective(400px) rotateX(10deg);
-moz-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotateX(-5deg);
-moz-transform: perspective(400px) rotateX(-5deg);
transform: perspective(400px) rotateX(-5deg);
}
to {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInX;
-moz-animation-name: flipInX;
-o-animation-name: flipInX;
animation-name: flipInX;
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
0%, 40% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
40% {
-webkit-transform: perspective(400px) rotateY(-20deg);
transform: perspective(400px) rotateY(-20deg);
}
60% {
-webkit-transform: perspective(400px) rotateY(10deg);
transform: perspective(400px) rotateY(10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotateY(-5deg);
transform: perspective(400px) rotateY(-5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@-moz-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
-moz-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
0%, 40% {
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
40% {
-webkit-transform: perspective(400px) rotateY(-20deg);
-moz-transform: perspective(400px) rotateY(-20deg);
transform: perspective(400px) rotateY(-20deg);
}
60% {
-webkit-transform: perspective(400px) rotateY(10deg);
-moz-transform: perspective(400px) rotateY(10deg);
transform: perspective(400px) rotateY(10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotateY(-5deg);
-moz-transform: perspective(400px) rotateY(-5deg);
transform: perspective(400px) rotateY(-5deg);
}
to {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
}
}
@-o-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
0%, 40% {
-webkit-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
40% {
-webkit-transform: perspective(400px) rotateY(-20deg);
transform: perspective(400px) rotateY(-20deg);
}
60% {
-webkit-transform: perspective(400px) rotateY(10deg);
transform: perspective(400px) rotateY(10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotateY(-5deg);
transform: perspective(400px) rotateY(-5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
-moz-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
0%, 40% {
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
40% {
-webkit-transform: perspective(400px) rotateY(-20deg);
-moz-transform: perspective(400px) rotateY(-20deg);
transform: perspective(400px) rotateY(-20deg);
}
60% {
-webkit-transform: perspective(400px) rotateY(10deg);
-moz-transform: perspective(400px) rotateY(10deg);
transform: perspective(400px) rotateY(10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotateY(-5deg);
-moz-transform: perspective(400px) rotateY(-5deg);
transform: perspective(400px) rotateY(-5deg);
}
to {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInY;
-moz-animation-name: flipInY;
-o-animation-name: flipInY;
animation-name: flipInY;
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotateX(-20deg);
transform: perspective(400px) rotateX(-20deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@-moz-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotateX(-20deg);
-moz-transform: perspective(400px) rotateX(-20deg);
transform: perspective(400px) rotateX(-20deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotateX(90deg);
-moz-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@-o-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotateX(-20deg);
transform: perspective(400px) rotateX(-20deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotateX(-20deg);
-moz-transform: perspective(400px) rotateX(-20deg);
transform: perspective(400px) rotateX(-20deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotateX(90deg);
-moz-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-name: flipOutX;
-moz-animation-name: flipOutX;
-o-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
backface-visibility: visible !important;
}
@-webkit-keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotateY(-15deg);
transform: perspective(400px) rotateY(-15deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
@-moz-keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotateY(-15deg);
-moz-transform: perspective(400px) rotateY(-15deg);
transform: perspective(400px) rotateY(-15deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotateY(90deg);
-moz-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
@-o-keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotateY(-15deg);
transform: perspective(400px) rotateY(-15deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
@keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
-moz-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotateY(-15deg);
-moz-transform: perspective(400px) rotateY(-15deg);
transform: perspective(400px) rotateY(-15deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotateY(90deg);
-moz-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
.flipOutY {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipOutY;
-moz-animation-name: flipOutY;
-o-animation-name: flipOutY;
animation-name: flipOutY;
}
@-webkit-keyframes lightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
}
60%, 80% {
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
}
to {
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes lightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
-moz-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
-moz-transform: skewX(20deg);
transform: skewX(20deg);
}
60%, 80% {
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
-moz-transform: skewX(-5deg);
transform: skewX(-5deg);
}
to {
-webkit-transform: none;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@-o-keyframes lightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
-o-transform: skewX(20deg);
transform: skewX(20deg);
}
60%, 80% {
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
-o-transform: skewX(-5deg);
transform: skewX(-5deg);
}
to {
-webkit-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes lightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
-moz-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
-moz-transform: skewX(20deg);
-o-transform: skewX(20deg);
transform: skewX(20deg);
}
60%, 80% {
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
-moz-transform: skewX(-5deg);
-o-transform: skewX(-5deg);
transform: skewX(-5deg);
}
to {
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
-moz-animation-name: lightSpeedIn;
-o-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
-moz-animation-timing-function: ease-out;
-o-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
0% {
opacity: 1;
}
to {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
@-moz-keyframes lightSpeedOut {
0% {
opacity: 1;
}
to {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
-moz-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
@-o-keyframes lightSpeedOut {
0% {
opacity: 1;
}
to {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
@keyframes lightSpeedOut {
0% {
opacity: 1;
}
to {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
-moz-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
-moz-animation-name: lightSpeedOut;
-o-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
@-webkit-keyframes rotateIn {
0% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate(-200deg);
transform: rotate(-200deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: center;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes rotateIn {
0% {
-moz-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate(-200deg);
-moz-transform: rotate(-200deg);
transform: rotate(-200deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: center;
}
to {
-moz-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@-o-keyframes rotateIn {
0% {
-o-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate(-200deg);
-o-transform: rotate(-200deg);
transform: rotate(-200deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: center;
}
to {
-o-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateIn {
0% {
-webkit-transform-origin: center;
-moz-transform-origin: center;
-o-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate(-200deg);
-moz-transform: rotate(-200deg);
-o-transform: rotate(-200deg);
transform: rotate(-200deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: center;
}
to {
-webkit-transform-origin: center;
-moz-transform-origin: center;
-o-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
-moz-animation-name: rotateIn;
-o-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes rotateInDownLeft {
0% {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@-o-keyframes rotateInDownLeft {
0% {
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
-moz-transform-origin: left bottom;
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-webkit-transform-origin: left bottom;
-moz-transform-origin: left bottom;
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
-moz-animation-name: rotateInDownLeft;
-o-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes rotateInDownRight {
0% {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@-o-keyframes rotateInDownRight {
0% {
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
-moz-transform-origin: right bottom;
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-webkit-transform-origin: right bottom;
-moz-transform-origin: right bottom;
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
-moz-animation-name: rotateInDownRight;
-o-animation-name: rotateInDownRight;
animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes rotateInUpLeft {
0% {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@-o-keyframes rotateInUpLeft {
0% {
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
-moz-transform-origin: left bottom;
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-webkit-transform-origin: left bottom;
-moz-transform-origin: left bottom;
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
-moz-animation-name: rotateInUpLeft;
-o-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes rotateInUpRight {
0% {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@-o-keyframes rotateInUpRight {
0% {
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
-moz-transform-origin: right bottom;
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-webkit-transform-origin: right bottom;
-moz-transform-origin: right bottom;
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
-moz-animation-name: rotateInUpRight;
-o-animation-name: rotateInUpRight;
animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateOut {
0% {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
0%, to {
-webkit-transform-origin: center;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate(200deg);
transform: rotate(200deg);
opacity: 0;
}
}
@-moz-keyframes rotateOut {
0% {
-moz-transform-origin: center;
transform-origin: center;
opacity: 1;
}
0%, to {
-webkit-transform-origin: center;
}
to {
-moz-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate(200deg);
-moz-transform: rotate(200deg);
transform: rotate(200deg);
opacity: 0;
}
}
@-o-keyframes rotateOut {
0% {
-o-transform-origin: center;
transform-origin: center;
opacity: 1;
}
0%, to {
-webkit-transform-origin: center;
}
to {
-o-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate(200deg);
-o-transform: rotate(200deg);
transform: rotate(200deg);
opacity: 0;
}
}
@keyframes rotateOut {
0% {
-webkit-transform-origin: center;
-moz-transform-origin: center;
-o-transform-origin: center;
transform-origin: center;
opacity: 1;
}
0%, to {
-webkit-transform-origin: center;
}
to {
-webkit-transform-origin: center;
-moz-transform-origin: center;
-o-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate(200deg);
-moz-transform: rotate(200deg);
-o-transform: rotate(200deg);
transform: rotate(200deg);
opacity: 0;
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
-moz-animation-name: rotateOut;
-o-animation-name: rotateOut;
animation-name: rotateOut;
}
@-webkit-keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
}
@-moz-keyframes rotateOutDownLeft {
0% {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
}
@-o-keyframes rotateOutDownLeft {
0% {
-o-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
}
@keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
-moz-transform-origin: left bottom;
-o-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-webkit-transform-origin: left bottom;
-moz-transform-origin: left bottom;
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
opacity: 0;
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
-moz-animation-name: rotateOutDownLeft;
-o-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
}
@-moz-keyframes rotateOutDownRight {
0% {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
}
@-o-keyframes rotateOutDownRight {
0% {
-o-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
}
@keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
-moz-transform-origin: right bottom;
-o-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-webkit-transform-origin: right bottom;
-moz-transform-origin: right bottom;
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
-moz-animation-name: rotateOutDownRight;
-o-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight;
}
@-webkit-keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
}
@-moz-keyframes rotateOutUpLeft {
0% {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
}
@-o-keyframes rotateOutUpLeft {
0% {
-o-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
}
@keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
-moz-transform-origin: left bottom;
-o-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: left bottom;
}
to {
-webkit-transform-origin: left bottom;
-moz-transform-origin: left bottom;
-o-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
opacity: 0;
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
-moz-animation-name: rotateOutUpLeft;
-o-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
@-moz-keyframes rotateOutUpRight {
0% {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
@-o-keyframes rotateOutUpRight {
0% {
-o-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
@keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
-moz-transform-origin: right bottom;
-o-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
0%, to {
-webkit-transform-origin: right bottom;
}
to {
-webkit-transform-origin: right bottom;
-moz-transform-origin: right bottom;
-o-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
-moz-animation-name: rotateOutUpRight;
-o-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight;
}
@-webkit-keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
}
0%, 20%, 60% {
-webkit-transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate(80deg);
transform: rotate(80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
}
40%, 80% {
-webkit-transform: rotate(60deg);
transform: rotate(60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
to {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@-moz-keyframes hinge {
0% {
-moz-transform-origin: top left;
transform-origin: top left;
}
0%, 20%, 60% {
-webkit-transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
-moz-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate(80deg);
-moz-transform: rotate(80deg);
transform: rotate(80deg);
-moz-transform-origin: top left;
transform-origin: top left;
}
40%, 80% {
-webkit-transform: rotate(60deg);
-moz-transform: rotate(60deg);
transform: rotate(60deg);
-webkit-transform-origin: top left;
-moz-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
-moz-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
to {
-webkit-transform: translate3d(0, 700px, 0);
-moz-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@-o-keyframes hinge {
0% {
-o-transform-origin: top left;
transform-origin: top left;
}
0%, 20%, 60% {
-webkit-transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
-o-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate(80deg);
-o-transform: rotate(80deg);
transform: rotate(80deg);
-o-transform-origin: top left;
transform-origin: top left;
}
40%, 80% {
-webkit-transform: rotate(60deg);
-o-transform: rotate(60deg);
transform: rotate(60deg);
-webkit-transform-origin: top left;
-o-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
-o-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
to {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@keyframes hinge {
0% {
-webkit-transform-origin: top left;
-moz-transform-origin: top left;
-o-transform-origin: top left;
transform-origin: top left;
}
0%, 20%, 60% {
-webkit-transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
-moz-animation-timing-function: ease-in-out;
-o-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate(80deg);
-moz-transform: rotate(80deg);
-o-transform: rotate(80deg);
transform: rotate(80deg);
-webkit-transform-origin: top left;
-moz-transform-origin: top left;
-o-transform-origin: top left;
transform-origin: top left;
}
40%, 80% {
-webkit-transform: rotate(60deg);
-moz-transform: rotate(60deg);
-o-transform: rotate(60deg);
transform: rotate(60deg);
-webkit-transform-origin: top left;
-moz-transform-origin: top left;
-o-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
-moz-animation-timing-function: ease-in-out;
-o-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
to {
-webkit-transform: translate3d(0, 700px, 0);
-moz-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
.hinge {
-webkit-animation-name: hinge;
-moz-animation-name: hinge;
-o-animation-name: hinge;
animation-name: hinge;
}
@-webkit-keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
transform: translate3d(-100%, 0, 0) rotate(-120deg);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
-moz-transform: translate3d(-100%, 0, 0) rotate(-120deg);
transform: translate3d(-100%, 0, 0) rotate(-120deg);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
transform: none;
}
}
@-o-keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
transform: translate3d(-100%, 0, 0) rotate(-120deg);
}
to {
opacity: 1;
-webkit-transform: none;
-o-transform: none;
transform: none;
}
}
@keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
-moz-transform: translate3d(-100%, 0, 0) rotate(-120deg);
transform: translate3d(-100%, 0, 0) rotate(-120deg);
}
to {
opacity: 1;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
transform: none;
}
}
.rollIn {
-webkit-animation-name: rollIn;
-moz-animation-name: rollIn;
-o-animation-name: rollIn;
animation-name: rollIn;
}
@-webkit-keyframes rollOut {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
transform: translate3d(100%, 0, 0) rotate(120deg);
}
}
@-moz-keyframes rollOut {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
-moz-transform: translate3d(100%, 0, 0) rotate(120deg);
transform: translate3d(100%, 0, 0) rotate(120deg);
}
}
@-o-keyframes rollOut {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
transform: translate3d(100%, 0, 0) rotate(120deg);
}
}
@keyframes rollOut {
0% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
-moz-transform: translate3d(100%, 0, 0) rotate(120deg);
transform: translate3d(100%, 0, 0) rotate(120deg);
}
}
.rollOut {
-webkit-animation-name: rollOut;
-moz-animation-name: rollOut;
-o-animation-name: rollOut;
animation-name: rollOut;
}
@-webkit-keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
@-moz-keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-moz-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
@-o-keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
@keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-moz-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
.zoomIn {
-webkit-animation-name: zoomIn;
-moz-animation-name: zoomIn;
-o-animation-name: zoomIn;
animation-name: zoomIn;
}
@-webkit-keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-moz-keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-o-keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInDown {
-webkit-animation-name: zoomInDown;
-moz-animation-name: zoomInDown;
-o-animation-name: zoomInDown;
animation-name: zoomInDown;
}
@-webkit-keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-moz-keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-o-keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInLeft {
-webkit-animation-name: zoomInLeft;
-moz-animation-name: zoomInLeft;
-o-animation-name: zoomInLeft;
animation-name: zoomInLeft;
}
@-webkit-keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-moz-keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-o-keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInRight {
-webkit-animation-name: zoomInRight;
-moz-animation-name: zoomInRight;
-o-animation-name: zoomInRight;
animation-name: zoomInRight;
}
@-webkit-keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-moz-keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-o-keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInUp {
-webkit-animation-name: zoomInUp;
-moz-animation-name: zoomInUp;
-o-animation-name: zoomInUp;
animation-name: zoomInUp;
}
@-webkit-keyframes zoomOut {
0% {
opacity: 1;
}
50% {
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50%, to {
opacity: 0;
}
}
@-moz-keyframes zoomOut {
0% {
opacity: 1;
}
50% {
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-moz-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50%, to {
opacity: 0;
}
}
@-o-keyframes zoomOut {
0% {
opacity: 1;
}
50% {
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50%, to {
opacity: 0;
}
}
@keyframes zoomOut {
0% {
opacity: 1;
}
50% {
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-moz-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50%, to {
opacity: 0;
}
}
.zoomOut {
-webkit-animation-name: zoomOut;
-moz-animation-name: zoomOut;
-o-animation-name: zoomOut;
animation-name: zoomOut;
}
@-webkit-keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-moz-keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
-moz-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-o-keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
-o-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
-moz-transform-origin: center bottom;
-o-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomOutDown {
-webkit-animation-name: zoomOutDown;
-moz-animation-name: zoomOutDown;
-o-animation-name: zoomOutDown;
animation-name: zoomOutDown;
}
@-webkit-keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
@-moz-keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
-moz-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
transform-origin: left center;
}
}
@-o-keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;
}
}
@keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
-moz-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;
}
}
.zoomOutLeft {
-webkit-animation-name: zoomOutLeft;
-moz-animation-name: zoomOutLeft;
-o-animation-name: zoomOutLeft;
animation-name: zoomOutLeft;
}
@-webkit-keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
@-moz-keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
-moz-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
-moz-transform-origin: right center;
transform-origin: right center;
}
}
@-o-keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
-o-transform-origin: right center;
transform-origin: right center;
}
}
@keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
-moz-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
-moz-transform-origin: right center;
-o-transform-origin: right center;
transform-origin: right center;
}
}
.zoomOutRight {
-webkit-animation-name: zoomOutRight;
-moz-animation-name: zoomOutRight;
-o-animation-name: zoomOutRight;
animation-name: zoomOutRight;
}
@-webkit-keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-moz-keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
-moz-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@-o-keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
-o-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-moz-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-moz-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-o-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-moz-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
-moz-transform-origin: center bottom;
-o-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
-o-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomOutUp {
-webkit-animation-name: zoomOutUp;
-moz-animation-name: zoomOutUp;
-o-animation-name: zoomOutUp;
animation-name: zoomOutUp;
}
@-webkit-keyframes slideInDown {
0% {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@-moz-keyframes slideInDown {
0% {
-webkit-transform: translate3d(0, -100%, 0);
-moz-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
@-o-keyframes slideInDown {
0% {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@keyframes slideInDown {
0% {
-webkit-transform: translate3d(0, -100%, 0);
-moz-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
.slideInDown {
-webkit-animation-name: slideInDown;
-moz-animation-name: slideInDown;
-o-animation-name: slideInDown;
animation-name: slideInDown;
}
@-webkit-keyframes slideInLeft {
0% {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@-moz-keyframes slideInLeft {
0% {
-webkit-transform: translate3d(-100%, 0, 0);
-moz-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
@-o-keyframes slideInLeft {
0% {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@keyframes slideInLeft {
0% {
-webkit-transform: translate3d(-100%, 0, 0);
-moz-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
.slideInLeft {
-webkit-animation-name: slideInLeft;
-moz-animation-name: slideInLeft;
-o-animation-name: slideInLeft;
animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
0% {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@-moz-keyframes slideInRight {
0% {
-webkit-transform: translate3d(100%, 0, 0);
-moz-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
@-o-keyframes slideInRight {
0% {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@keyframes slideInRight {
0% {
-webkit-transform: translate3d(100%, 0, 0);
-moz-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
.slideInRight {
-webkit-animation-name: slideInRight;
-moz-animation-name: slideInRight;
-o-animation-name: slideInRight;
animation-name: slideInRight;
}
@-webkit-keyframes slideInUp {
0% {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@-moz-keyframes slideInUp {
0% {
-webkit-transform: translate3d(0, 100%, 0);
-moz-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
@-o-keyframes slideInUp {
0% {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
}
@keyframes slideInUp {
0% {
-webkit-transform: translate3d(0, 100%, 0);
-moz-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
to {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
}
.slideInUp {
-webkit-animation-name: slideInUp;
-moz-animation-name: slideInUp;
-o-animation-name: slideInUp;
animation-name: slideInUp;
}
@-webkit-keyframes slideOutDown {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-moz-keyframes slideOutDown {
0% {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
-moz-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-o-keyframes slideOutDown {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes slideOutDown {
0% {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
-moz-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.slideOutDown {
-webkit-animation-name: slideOutDown;
-moz-animation-name: slideOutDown;
-o-animation-name: slideOutDown;
animation-name: slideOutDown;
}
@-webkit-keyframes slideOutLeft {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-moz-keyframes slideOutLeft {
0% {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
-moz-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-o-keyframes slideOutLeft {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes slideOutLeft {
0% {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
-moz-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.slideOutLeft {
-webkit-animation-name: slideOutLeft;
-moz-animation-name: slideOutLeft;
-o-animation-name: slideOutLeft;
animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-moz-keyframes slideOutRight {
0% {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
-moz-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-o-keyframes slideOutRight {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes slideOutRight {
0% {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
-moz-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.slideOutRight {
-webkit-animation-name: slideOutRight;
-moz-animation-name: slideOutRight;
-o-animation-name: slideOutRight;
animation-name: slideOutRight;
}
@-webkit-keyframes slideOutUp {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-moz-keyframes slideOutUp {
0% {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
-moz-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-o-keyframes slideOutUp {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes slideOutUp {
0% {
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
transform: translateZ(0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
-moz-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.slideOutUp {
-webkit-animation-name: slideOutUp;
-moz-animation-name: slideOutUp;
-o-animation-name: slideOutUp;
animation-name: slideOutUp;
}
header {
height: 60px;
}
.header {
width: 100%;
height: 60px;
position: fixed;
top: 0;
left: 0;
z-index: 50;
padding: 7px 0;
border-bottom: 1px solid #ddd;
background-color: #fff;
}
.logo {
display: block;
padding: 8px 0;
}
.logo img {
height: 30px;
display: block;
}
.header .ctrl {
padding: 9px 0;
vertical-align: middle;
}
.search-icon {
width: 25px;
height: 25px;
display: inline-block;
vertical-align: middle;
background: url(../images/search.png) center center no-repeat;
-o-background-size: 20px;
background-size: 20px;
margin-right: 15px;
margin-top: 1px;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.language {
width: 25px;
height: 25px;
display: inline-block;
vertical-align: middle;
background: url(../images/language.png) center center no-repeat;
margin-right: 15px;
margin-top: 1px;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.language-wrap {
width: 100%;
position: fixed;
left: 0;
top: 60px;
z-index: 50;
background-color: #f2f2f2;
display: none;
}
.language-wrap a {
display: block;
font-size: 16px;
padding: 15px 20px;
border-bottom: 1px solid #ddd;
color: #fff;
}
.header-search {
width: 100%;
padding: 15px 10px;
position: fixed;
left: 0;
top: 60px;
z-index: 50;
background-color: #f2f2f2;
display: none;
}
.header-search form {
position: relative;
padding-right: 60px;
-webkit-border-radius: 3px;
border-radius: 3px;
overflow: hidden;
}
.header-search input {
height: 40px;
line-height: 40px;
font-size: 14px;
display: block;
}
.header-search input[type=text] {
width: 100%;
padding: 0 10px;
}
.header-search input[type=submit] {
width: 60px;
text-align: center;
position: absolute;
right: 0;
top: 0;
z-index: 1;
background-color: #314486;
color: #fff;
}
.nav-btn {
width: 22px;
height: 20px;
position: relative;
display: inline-block;
vertical-align: middle;
}
.nav-btn span {
width: 22px;
height: 3px;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
transition: all 0.5s ease;
position: absolute;
top: 50%;
left: 0;
background-color: #d04e38;
margin-top: -2px;
}
.nav-btn span:first-child {
content: "";
top: 0;
left: 0;
margin-top: 0;
}
.nav-btn span:last-child {
content: "";
top: auto;
bottom: 0;
left: 0;
}
.nav-btn.on span {
opacity: 0;
}
.nav-btn.on span:first-child {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
top: 8px;
opacity: 1;
}
.nav-btn.on span:last-child {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
top: 10px;
opacity: 1;
}
.nav {
width: 100%;
vertical-align: middle;
position: fixed;
top: 84px;
left: 0;
bottom: 0;
z-index: 100;
background-color: #fff;
overflow-x: hidden;
overflow-y: auto;
padding-bottom: 20px;
display: none;
}
.nav a {
display: inline-block;
color: #333;
padding: 0 20px;
font-size: 16px;
width: 100%;
}
.nav .subnav {
padding: 0 35px 15px;
background-color: #fff;
}
.nav .subnav a {
color: #000;
font-size: 14px;
padding: 12px 10px;
}
.nav i {
padding: 14px 0;
display: block;
position: relative;
font-style: normal;
transition: all 0.65s; box-shadow: 0px 0px 0px 0px; width: 100%; box-sizing: border-box
}
.nav i:hover {
box-sizing: border-box
}
.nav .bar {
width: 0;
height: 3px;
background-color: #124bbe;
position: absolute;
left: 0;
bottom: 0;
z-index: 1;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
display: none;
}
.subnav .item{border-bottom: 1px solid #fff}
.nav li {
border-bottom: 1px solid #ddd;
text-align: left;
position: relative;
width: 100%;
float: left;
}
.nav .subnav {
display: none;
}
.nav li {
position: relative;
}
.nav li .showicon {
position: absolute;
top: 0;
right: 0px;
width: 30%;
height: 100%;
z-index: 3;
display: none;
}
.nav li .showicon:after {
content: '';
position: absolute;
width: 12px;
height: 12px;
border: 1px solid #999;
border-top: none;
border-right: none;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
right: 20px;
top: 14px;
}
@media (min-width: 1024px) {
.header {
padding: 0;
-webkit-transition: .5s;
-o-transition: .5s;
-moz-transition: .5s;
transition: .5s;
}
.nav {
display: inline-block !important;
padding-top: 0;
padding-bottom: 0;
}
.language-wrap {
top: 60px;
right: -28px;
}
.nav a {
color: #333;
}
.nav a.on i:before {
background-color: #1e7aff;
}
.nav i {
padding: 12px 0;font-size:16px;
}
.nav li h4{position:relative;}
.nav li h4:after{content:''; display:block; width:0; height:3px; position:absolute; left:50%; bottom:-5px; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); transition:0.3s; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s;}
.nav li:hover h4:after,.nav li.cur h4:after{width:100%; }
.nav li:hover h4 a,.nav li.cur h4 a{color:#bf0000;}
.header-ctrl {
padding: 0;
}
.logo {
padding: 17px 0;
}
.nav-btn {
display: none;
}
.search-icon {
margin-right: 0;
margin-top: -5px;
}
.column-wrap {
border-bottom: 1px solid #eaeaea;
background-color: #fff;
}
.commonweb {
position: relative;
}
.header-search {
width: 280px;
position: absolute;
left: auto;
right: 0;
top: 100%;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.subnav {
border-top: 1px solid #ddd;
}
.subnav a {
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.subnav a:hover {
background-color: #bf0000;
color: #fff;
}
.nav {
width: auto;
background: none;
position: static;
top: 0;
left: 0;
padding-right: 0;
}
.nav li {
display: inline-block;
border-bottom: none;
padding-left: 12px;
padding-right: 12px;
}
.nav a {
padding: 0px;
font-size: 14px;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.nav {
overflow: inherit;
}
.nav li {
position: relative;
}
.nav li .showicon {
display: none !important;
}
.nav li > a:hover, .nav li > a.on {
color: #bf0000;
}
.nav .subnav {
position: absolute;
top: 100%;
z-index: 99999999999;
width: 140px;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
padding: 0px;
text-align: center;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
background-color: rgba(215,39,26,0.75);
}
}
@media (min-width: 1260px) {
header, .header {
height: 100px;
}
.header .ctrl {
padding: 0;
}
.header .commonweb {
max-width: 1400px;
padding: 0 20px;
}
.logo {
padding: 28px 0;
}
.logo img {
height: 44px;
}
.nav li {
}
.nav a {
font-size: 18px;
line-height: 24px;
padding: 0 25px;
}
.nav i {
padding: 38px 0;
}
.search-icon {
width: 30px;
height: 30px;
-o-background-size: auto;
background-size: auto;
margin-top: -3px;
margin-left: 2px;
}
.nav li h4:after{bottom:0;}
}
@media (min-width: 1800px) {
.header .commonweb {
padding: 0;
}
}
.banner {
position: relative;
}
.banner img {
width: 100%;
display: block;
}
.banner .banner-dot {
width: 100%;
position: absolute;
bottom: 5px;
left: 0;
z-index: 30;
text-align: center;
}
.banner .banner-dot span {
width: 20px;
height: 20px;
background: none;
position: relative;
-webkit-border-radius: 100%;
border-radius: 100%;
vertical-align: top;
margin: 0 2px;
}
.banner .banner-dot span:after {
content: '';
display: block;
width: 6px;
height: 6px;
position: absolute;
left: 50%;
top: 50%;
background-color: #fff;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-border-radius: 100%;
border-radius: 100%;
}
.banner .banner-dot span:before {
content: '';
display: block;
width: 6px;
height: 6px;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-border-radius: 100%;
border-radius: 100%;
border: 1px solid #fff;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.banner .banner-dot .swiper-pagination-bullet-active:before {
width: 100%;
height: 100%;
}
@media (min-width: 1260px) {
.banner .banner-dot {
bottom: 27px;
}
}
.inTitle dt {
line-height: 26px;
}
.inTitle dt span {
color: #cccccc;
display: block;
font-family:"Titillium";
letter-spacing:-1px;
font-style:italic;
}
.inTitle dd {
padding-top: 8px;
}
.inTitle dd a {
width: 90px;
height: 36px;
line-height: 36px;
background-color: #bf0000;
display: block;
color: #fff;
-webkit-border-radius: 5px;
border-radius: 5px;
text-align: center;
font-family:Montserrat;
}
.inTitle .text {
color: #929292;
}
.inResearch {
padding: 30px 0;
}
.inResearch li {
padding-bottom: 30px;
}
.inResearch .switch {
padding-top: 20px;
white-space: nowrap;
overflow-y: hidden;
overflow-x: auto;
}
.inResearch .switch a {
min-width: 98px;
padding: 0 10px;
height: 38px;
line-height: 38px;
display: inline-block;
vertical-align: top;
-webkit-border-radius: 5px;
border-radius: 5px;
text-align: center;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.inResearch .switch .on {
background-color: #bf0000;
color: #fff;
}
.inResearch .tab {
padding-top: 20px;
}
.inResearch .img {
-webkit-border-radius: 5px;
border-radius: 5px;
}
.inResearch img {
width: 100%;
display: block;
}
.inResearch .article {
position: relative;
z-index: 1;
max-width: 90%;
margin: 0 auto;
background-color: #fff;
margin-top: -30px;
-webkit-border-radius: 5px;
border-radius: 5px;
padding: 20px 30px;
border: 1px solid #bf0000;
-webkit-box-shadow: 0 0 25px 2px rgba(181, 178, 178, 0.1);
box-shadow: 0 0 25px 2px rgba(181, 178, 178, 0.1);
}
.inResearch h3 {
padding-bottom: 5px;
}
.inResearch .desc {
color: #808080;
}
.inResearch .td {
display: none;
}
.inResearch .td:first-child {
display: block;
}
.inResearch .thumb {
display: block;
}
@media (min-width: 768px) {
.inTitle dt {
line-height: 36px;
}
.inTitle dt span {
display: inline-block;
padding-left: 10px;
}
.inTitle dd {
padding-top: 0;
}
.inTitle .text {
padding-top: 10px;
}
.inResearch li {
width: 33.3333%;
float: left;
padding: 0 5px;
}
}
@media (min-width: 1260px) {
.inResearch {
padding: 60px 0;
}
.inResearch .switch {
padding-top: 35px;
}
.inResearch .switch a:hover {
color: #fff;
background-color: #bf0000;
}
.inResearch .tab {
padding-top: 30px;
}
.inResearch ul {
margin: 0 -15px;
}
.inResearch li {
padding: 0 15px;
}
.inResearch .img{
max-height:255px;
display:block;
}
.inResearch .article {
position: relative;
padding: 45px 45px 50px;
border-color: transparent;
border-width: 2px;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.inResearch .article:after {
content: '';
display: block;
width: 60px;
height: 60px;
background: #fff url(../images/icon14.png) center center no-repeat;
border: 2px solid #bf0000;
-webkit-border-radius: 100%;
border-radius: 100%;
position: absolute;
bottom: -50px;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
opacity: 0;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.inResearch .desc {
line-height: 30px;
font-size: 16px;
}
.inResearch .thumb:hover .article {
border-color: #bf0000;
box-shadow: 0 0 25px 2px rgba(191, 0, 0, 0.1);
}
.inResearch .thumb:hover .article:after {
opacity: 1;
bottom: -28px;
}
}
.inManage {
padding: 30px 0;
background-color: #f2f2f2;
}
.inManage img {
width: 100%;
display: block;
}
.inManage .list {
padding-top: 20px;
}
.inManage .list dl {
padding-bottom: 15px;
}
.inManage .list dt {
position: relative;
}
.inManage .list dt a {
display: block;
}
.inManage .list h3 {
width: 100%;
position: absolute;
bottom: 0;
left: 0;
text-align: center;
color: #fff;
padding-bottom: 5px;
font-weight: bold;
}
.inManage .list dd {
padding: 10px 0;
line-height: 26px;
}
.inManage .list dd p {
overflow: hidden;
}
.inManage .list dd span {
color: #a4a8ae;
float: right;
font-family: Montserrat;
}
.inManage .list dd a {
max-width: 60%;
float: left;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
}
@media (min-width: 768px) {
.inManage {
padding-bottom: 10px;
}
.inManage .list {
margin: 0 -10px;
}
}
@media (min-width: 1260px) {
.inManage {
padding-top: 70px;
padding-bottom: 50px;
}
.inManage .list {
margin: 0 -17px;
padding-top: 37px;
}
.inManage .list dl {
padding: 0;
}
.inManage .list dd {
line-height: 34px;
padding-top: 20px;
}
.inManage .list dd a {
max-width: 70%;
font-size: 16px;
}
.inManage .list h3 {
padding-bottom: 10px;
}
}
.inNews {
padding: 30px 0;
}
.inNews img {
width: 100%;
display: block;
}
.inNews .image {
padding-top: 20px;
}
.inNews .image .thumb {
background-color: #f7f7f7;
padding: 20px 15px;
}
.inNews .image .date {
color: #a4a8ae;
font-family: Montserrat;
}
.inNews .image h3 {
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
color: #3f4144;
}
.inNews .image .desc {
color: #8d929a;
display: -webkit-box;
height: 52px;
line-height: 26px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.inNews .image .more {
width: 120px;
height: 34px;
line-height: 34px;
background: #c10808 url(../images/icon15.png) 83px 10px no-repeat;
color: #fff;
display: block;
-webkit-border-radius: 3px;
border-radius: 3px;
padding-left: 25px;
margin-top: 10px;
font-family: Montserrat;
}
.inNews .list {
padding-top: 30px;
}
.inNews .list ul {
border-top: 1px solid #f2f2f2;
}
.inNews .list li {
border-bottom: 1px solid #f2f2f2;
padding: 15px 0;
}
.inNews .list h4 {
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
}
.inNews .list .date {
display: block;
padding: 2px 0;
}
.inNews .list .date {
color: #a4a8ae;
font-family: Montserrat;
}
.inNews .list .desc {
color: #808080;
display: -webkit-box;
height: 52px;
line-height: 26px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
@media (min-width: 768px) {
.inNews .image {
width: 45%;
float: left;
}
.inNews .image h3 {
padding-bottom: 5px;
}
.inNews .image .thumb {
padding-bottom: 30px;
}
.inNews .image .more {
margin-top: 15px;
}
.inNews .list {
width: 50%;
float: right;
padding-top: 20px;
}
.inNews .list li {
padding: 13px 0;
}
.inNews .list .desc {
height: 48px;
}
}
@media (min-width: 1024px) {
.inNews .list li {
padding: 20px 0;
}
}
@media (min-width: 1260px) {
.inNews {
padding: 60px 0 125px;
}
.inNews .bd {
padding-top: 15px;
}
.inNews .image {
width: 45.5%;
}
.inNews .image .thumb {
padding: 15px 30px 32px;
}
.inNews .image .desc {
height: 60px;
line-height: 30px;
}
.inNews .list ul {
border-width: 2px;
}
.inNews .list li {
border-width: 2px;
position: relative;
padding: 0;
}
.inNews .list .tit {
padding-bottom: 7px;
position: relative;
}
.inNews .list .tit:before {
content: '';
display: block;
width: 6px;
height: 6px;
background-color: #8d929a;
-webkit-border-radius: 100%;
border-radius: 100%;
position: absolute;
left: -20px;
top: 10px;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.inNews .list h4 {
float: left;
max-width: 70%;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.inNews .list .date {
float: right;
}
.inNews .list .desc {
width: 450px;
height: 60px;
line-height: 30px;
font-size: 16px;
}
.inNews .list a {
display: block;
position: relative;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
padding: 35px 10px 35px 30px;
}
.inNews .list a:hover {
-webkit-box-shadow: 0 0 8px 8px rgba(202, 202, 202, 0.1);
box-shadow: 0 0 8px 8px rgba(202, 202,202, 0.1);
}
.inNews .list a:after {
content: '';
display: block;
width: 19px;
height: 13px;
background: url(../images/icon16.png) no-repeat;
position: absolute;
right: 10px;
top: 60%;
margin-top: 3px;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.inNews .list a:hover .tit:before {
background-color: #bf0000;
}
.inNews .list a:hover h4 {
color: #bf0000;
}
.inNews .list a:hover:after {
background-image: url(../images/icon17.png);
}
}
.inService {
padding: 30px 0;
background-position-x: center;
}
.inService .inTitle {
color: #fff;
}
.inService .inTitle .text, .inService .inTitle dt span {
color: #fff;
}
.inService img {
width: 100%;
display: block;
}
.inService .list {
padding-top: 20px;
}
.inService .list li {
-webkit-border-radius: 3px;
border-radius: 3px;
overflow: hidden;
text-align: center;
-webkit-box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1);
margin-bottom: 30px;
}
.inService .list .tit {
padding: 10px;
}
.inService .list h3 {
font-size: 16px;
}
.inService .list .desc {
color: #929292;
}
@media (min-width: 768px) {
.inService .bd {
margin-top: 20px;
position: relative;
-webkit-border-radius: 3px;
border-radius: 3px;
overflow: hidden;
-webkit-box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1);
background-color: #fff;
}
.inService .bd .img {
width: 75%;
}
.inService .item {
width: 25%;
height: 100%;
background-color: #fff;
position: absolute;
right: 0;
top: 0;
z-index: 1;
}
.inService .item a {
width: 100%;
height: 33.3333%;
display: -webkit-box;
-webkit-box-pack: center;
-webkit-box-orient: vertical;
text-align: center;
-webkit-transition: .5s;
-o-transition: .5s;
-moz-transition: .5s;
transition: .5s;
border-bottom:1px solid #bf0000;
}
.inService .item a:last-child{
border-bottom:none;
}
.inService .item a.on {
background-color: #bf0000;
color: #fff;
}
.inService .item a.on .desc {
color: #fff;
}
.inService .item span {
display: block;
width: 100%;
}
.inService .item .desc {
width: 100%;
font-size: 16px;
color: #929292;
}
}
@media (min-width: 1260px) {
.inService {
padding-top: 70px;
}
.inService .bd {
margin-top: 70px;
}
.inService .bd .item a {
float: right;
position: relative;
}
.inService .bd .item a:after {
content: '';
display: block;
width: 10px;
height: 18px;
background: url(../images/icon18.png) no-repeat;
position: absolute;
right: 50px;
top: 50%;
margin-top: -9px;
opacity: 0;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.inService .bd .item a.on {
width: 117%;
text-align: left;
padding-left: 30px;
-webkit-border-top-left-radius: 5px;
border-top-left-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.inService .bd .item a.on .font20 {
font-size: 24px;
}
.inService .bd .item a.on .desc {
font-size: 20px;
}
.inService .bd .item a.on:after {
opacity: 1;
right: 30px;
}
}
.inTeam .list {
background-color: #f2f2f2;
-webkit-box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.1);
margin-top: 20px;
}
.inTeam ul {
margin: 0 -5px;
}
.inTeam li {
width: 50%;
float: left;
text-align: center;
padding: 10px;
}
.inTeam .img {
width: 112px;
height: 112px;
-webkit-border-radius: 100%;
border-radius: 100%;
overflow: hidden;
display: block;
margin: 0 auto;
}
.inTeam .thumb {
background-color: #fff;
display: block;
padding: 10px;
}
.inTeam h4 {
padding-top: 10px;
}
.inTeam .desc {
color: #929292;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
}
@media (min-width: 768px) {
.inTeam li {
width: 25%;
}
}
@media (min-width: 1024px) {
.inTeam .thumb {
padding: 20px 10px;
}
}
@media (min-width: 1024px) {
.inTeam {
padding-top: 30px;
padding-bottom: 80px;
}
.inTeam .list {
-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.1);
}
.inTeam ul {
margin: 0 -12px;
}
.inTeam li {
padding: 12px;
}
.inTeam .thumb {
padding: 35px 10px 40px;
}
.inTeam h4 {
padding-top: 25px;
padding-bottom: 5px;
}
.inTeam .desc {
font-size: 16px;
}
}
.inCase {
background-color: #f2f2f2;
padding: 30px 0 10px;
margin-top: 30px;
}
.inCase-list {
padding-top: 20px;
}
.inCase-list li {
padding-bottom: 30px;
}
.inCase-list .thumb {
display: block;
-webkit-border-radius: 5px;
border-radius: 5px;
overflow: hidden;
}
.inCase-list img {
width: 100%;
display: block;
}
.inCase-list .article {
background-color: #fff;
padding: 20px;
}
.inCase-list h4 {
padding-bottom: 5px;
}
.inCase-list .desc {
color: #808080;
}
.inCase-list .more {
display: block;
position: relative;
background-color: #e6e6e6;
padding: 10px 20px;
}
.inCase-list .more:after {
content: '';
display: block;
width: 14px;
height: 11px;
position: absolute;
top: 50%;
right: 20px;
margin-top: -5px;
background: url(../images/icon19.png) no-repeat;
}
.inCustomer {
padding-top: 30px;
padding-bottom: 30px;
/*background-color: #f2f2f2;
border-top: 1px solid #eaeaea;*/
}
.inCustomer li {
padding-bottom: 20px;
}
.inCustomer .thumb {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
width: 100%;
height: 60px;
padding: 0 10px;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.inCustomer img {
max-width: 100%;
max-height: 100%;
display: block;
margin: 0 auto;
}
@media (min-width: 768px) {
.inCase-list {
padding-bottom: 30px;
}
.inCase-list ul {
margin: 0 -10px;
}
.inCase-list li {
padding-bottom: 0;
}
}
@media (min-width: 1024px) {
.inCustomer li {
padding-bottom: 30px;
}
}
@media (min-width: 1260px) {
.inCase {
padding-top: 65px;
}
.inCase-list {
padding-top: 35px;
padding-bottom: 57px;
}
.inCase-list ul {
margin: 0 -15px;
}
.inCase-list li {
padding: 0 15px;
}
.inCase-list .article {
padding-bottom: 27px;
}
.inCase-list .desc {
font-size: 16px;
display: -webkit-box;
height: 78px;
line-height: 26px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.inCase-list .more {
font-size: 16px;
padding: 19px 20px;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.inCase-list .thumb:hover {
-webkit-box-shadow: 0 5px 5px 3px rgba(191, 0, 0, 0.1);
box-shadow: 0 5px 5px 3px rgba(191, 0, 0, 0.1);
}
.inCase-list .thumb:hover .more {
background-color: #bf0000;
color: #fff;
}
.inCase-list .thumb:hover .more:after {
background-image: url(../images/icon20.png);
}
.inCustomer {
padding-top: 60px;
}
.inCustomer li {
padding-bottom: 53px;
}
.inCustomer li:hover img {
-webkit-filter: grayscale(0);
filter: grayscale(0);
}
.inCustomer img {
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
/*-webkit-filter: grayscale(100%);
filter: grayscale(100%);*/
}
}
.free-evaluation {
background-position: center 0;
background-image: url(../images/img85.jpg);
background-repeat: no-repeat;
padding: 30px 20px;
-webkit-border-radius: 6px;
border-radius: 6px;
-o-background-size: cover;
background-size: cover;
position: relative;
z-index: 2;
margin-top: 20px;
}
.free-conbox {
color: #fff;
}
.free-conbox h4 {
font-size: 20px;
text-align: center;
margin-bottom: 10px;
font-weight: bold;
}
.free-conbox h4 br {
display: none;
}
.free-right {
color: #ffffff;
}
.free-list {
margin-top: 20px;
position: relative;
}
.free-list ul li {
width: 100%;
float: left;
margin-bottom: 10px;
}
.free-list ul li input {
width: 100%;
background: #fff;
height: 42px;
padding-left: 20px;
-webkit-border-radius: 2px;
border-radius: 2px;
}
.free-list ul li input::-webkit-input-placeholder {
color: #666;
}
.free-list ul li input:-moz-placeholder {
color: #666;
}
.free-list ul li input::-moz-placeholder {
color: #666;
}
.free-list ul li input:-ms-input-placeholder {
color: #666;
}
.free-list .free-submit {
display: block;
overflow: hidden;
width: 120px;
height: 42px;
background-color: #ffffff;
-webkit-border-radius: 26px;
border-radius: 26px;
color: #bf0000;
font-size: 16px;
margin: 10px auto 0;
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
@media (min-width: 768px) {
.foot-nav li.ewm{ float:left; width:50%; text-align:center;border-bottom:none; margin-top:20px;}
.foot-nav h1{ font-size:1.875rem; color:#fff; text-align:center;}
.free-conbox h4 {
text-align: left;
}
.free-conbox h4 br {
display: block;
}
.free-list ul li {
width: 33.3%;
padding-right: 10px;
padding-bottom: 0;
}
.index-contactlist li {
width: 30%;
}
.index-contactlist li:last-child {
width: 39%;
}
}
@media (min-width: 1024px) {
.free-evaluation {
padding: 40px 88px 40px 100px;
}
.free-conbox h4 {
float: left;
font-size: 34px;
max-width: 278px;
width: 30%;
}
.free-right {
font-size: 16px;
line-height: 30px;
padding-top: 2px;
}
.free-list {
padding-right: 120px;
margin-top: 20px;
}
.free-list ul li {
width: 33.3%;
padding-right: 24px;
}
.free-list ul li input {
height: 52px;
padding-left: 20px;
}
.free-list .free-submit {
position: absolute;
top: 0;
right: 0;
width: 120px;
height: 52px;
font-size: 18px;
margin-top: 0;
}
}
footer {
background-color: #2b2b2b;
}
.foot-nav {
padding: 30px 0;
}
.foot-nav li {
color: #bababa;
border-bottom: 1px solid #fff;
}
.foot-nav li:last-child {
border-bottom: none;
}
.foot-nav li:last-child h4:after {
display: none;
}
.foot-nav .box {
text-align: center;
display: inline-block;
}
.foot-nav .box img {
display: block;
margin-bottom: 5px;width: 145px;
}
.foot-nav h4 {
color: #fff;
padding: 10px 0;
position: relative;
}
.foot-nav h4:after {
content: '+';
width: 20px;
text-align: center;
font-weight: normal;
font-size: 20px;
position: absolute;
right: 10px;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.foot-nav .on:after {
content: '-';
}
.foot-nav .item {
padding: 5px 0 15px 10px;
display: none;
}
.foot-nav a {
color: #a6a6a6;
display: block;
line-height: 30px;
}
.foot-info {
padding: 10px 0;
background-color: #2b2b2b;
color: #b7b7b7;
text-align: center;
border-top: 1px solid #3c3c3c;
overflow: hidden;
}
.foot-info a {
color: #b7b7b7;
}
.friend_link a{ color:#fff;}
#foot-share {
padding-top: 5px;
}
#foot-share a {
width: 34px;
height: 34px;
float: none;
margin: 0 3px;
padding: 0;
opacity: 1;
display: inline-block;
vertical-align: top;
}
#foot-share .bds_weixin {
background: url(../images/icon21.png);
}
#foot-share .bds_tsina {
background: url(../images/icon22.png);
}
#foot-share .youku {
background: url(../images/icon23.png);
}
@media (min-width: 1024px) {
.foot-nav {
padding-bottom: 15px;
}
.foot-nav ul.clearfix:nth-of-type(1){width: 68%;}
.commonweb .foot-nav {
display: flex;
justify-content: space-between;
}
.foot-nav li {
padding-right: 20px;
float: left;
border-bottom: none;
}
.foot-nav li:last-child {
padding-right: 0;
/*float:right;*/
}
.foot-nav .box {
padding-top: 14px;
}
.foot-nav h1{ font-size:1.25rem; color:#fff;}
.foot-nav .item {
display: block !important;
padding-left: 0;
}
.foot-nav h4 {
padding-bottom: 0;
}
.foot-nav h4:after {
display: none;
}
.foot-info {
padding: 14px 0;
}
.foot-info .info {
float: left;
line-height: 34px;
}
.foot-info .info a {
padding-left: 20px;
display: inline-block;
vertical-align: top;
}
#foot-share {
float: right;
padding-top: 0;
}
}
@media (min-width: 1260px) {
.foot-nav li {
/* padding-right: 66px;*/
}
}
.ovhid {
overflow: hidden;
}
.bold {
font-weight: bold;
}
.ac {
color: #bf0000;
}
.disblock {
display: block;
}
.inblock {
display: inline-block;
}
.font16 {
font-size: 14px;
}
.font17, .font18 {
font-size: 15px;
}
.font20, .font22 {
font-size: 16px;
}
.font24, .font26, .font28 {
font-size: 18px;
}
.font30, .font32, .font36, .font40, .font42, .font46 {
font-size: 20px;
}
.font54 {
font-size: 24px;
}
.font60 {
font-size: 30px;
}
.lighter {
font-weight: lighter;
}
.unline {
text-decoration: underline;
}
.text-center {
text-align: center;
}
.scale img {
-webkit-transition: 1s;
-o-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}
.grey {
color: #666;
}
.white {
color: #fff;
}
.imghover img {
-webkit-transition: 1s;
-o-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}
.center {
text-align: center;
}
@media (min-width: 768px) {
.font16 {
font-size: 16px;
}
.font17 {
font-size: 17px;
}
.font18, .font17 {
line-height: 34px;
}
.font18, .font22, .font20 {
font-size: 18px;
}
.font28, .font24, .font26 {
font-size: 22px;
}
.font30, .font32, .font36 {
font-size: 24px;
}
.font40, .font42 {
font-size: 26px;
}
.font46 {
font-size: 28px;
}
.font54 {
font-size: 30px;
}
.distable {
width: 100%;
display: table;
}
.table-cell {
display: table-cell;
vertical-align: middle;
}
}
@media (min-width: 1024px) {
.font22, .font20 {
font-size: 20px;
}
.font24 {
font-size: 24px;
}
.font26 {
font-size: 26px;
}
.font28 {
font-size: 28px;
line-height: normal;
}
.font40, .font42 {
font-size: 30px;
line-height: normal;
}
.font46 {
font-size: 32px;
}
.font54 {
font-size: 36px;
}
.md-block {
display: block;
}
}
@media (min-width: 1200px) {
.font22 {
font-size: 22px;
}
.font30 {
font-size: 30px;
line-height: normal;
}
.font32 {
font-size: 32px;
line-height: normal;
}
.font36 {
font-size: 36px;
line-height: normal;
}
.font40 {
font-size: 40px;
}
.scale:hover img {
-webkit-transform: scale(1.03, 1.03);
-moz-transform: scale(1.03, 1.03);
-ms-transform: scale(1.03, 1.03);
-o-transform: scale(1.03, 1.03);
transform: scale(1.03, 1.03);
}
.font42 {
font-size: 42px;
}
.font46 {
font-size: 46px;
}
.font54 {
font-size: 54px;
}
.imghover:hover img {
-webkit-transform: scale(1.03, 1.03);
-moz-transform: scale(1.03, 1.03);
-ms-transform: scale(1.03, 1.03);
-o-transform: scale(1.03, 1.03);
transform: scale(1.03, 1.03);
}
}
.subbanner img {
height: 150px;
position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
.container {
padding: 30px 0;
}
.class-thumb {
padding-bottom: 20px;
}
.class-thumb .tit {
text-align: center;
line-height: 1;
cursor: pointer;
}
.class-thumb .tit span:after {
content: '';
display: inline-block;
vertical-align: middle;
width: 20px;
height: 20px;
margin-left: 10px;
background: url(../images/navdw.png) no-repeat center;
-o-background-size: 14px auto;
background-size: 14px auto;
-webkit-transition: all ease .3s;
-o-transition: all ease .3s;
-moz-transition: all ease .3s;
transition: all ease .3s;
}
.class-thumb .item {
padding-top: 20px;
}
.class-thumb a {
display: block;
padding-left: 38px;
background: url(../images/icon01.png) left center no-repeat;
margin-bottom: 15px;
overflow: hidden;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.class-thumb .amount {
color: #666;
float: right;
font-size: 14px;
}
.class-thumb .on {
background-image: url(../images/icon02.png);
color: #bf0000;
}
.class-thumb .item {
display: none;
}
.n-list a {
display: block;
background-color: #f8f5f5;
}
.n-list li {
padding-bottom: 25px;
}
.n-list li img {
width: 100%;
display: block;
}
.n-list .thumb {
padding: 20px;
}
.n-list h3 {
padding-bottom: 5px;
}
.n-list .desc {
color: #666;
line-height: 26px;
}
.page img {
max-width: 100%;
margin: 0 auto;
display: block;
}
.detail-main h2 {
padding-bottom: 5px;
}
.detail-main .ctrl {
color: #999;
font-size: 16px;
}
.detail-main .date {
font-family: "Montserrat";
}
.detail-main .writer {
padding-left: 20px;
}
.detail-article {
border-top: 1px solid #e0e0e0;
padding-top: 30px;
margin-top: 20px;
color: #666;
line-height: 26px;
}
.detail-article h4 {
color: #333;
font-weight: bold;
padding-top: 10px;
}
.detail-article img {
max-width: 100%;
height: auto !important;
}
.detail-article h5 {
color: #333;
padding-bottom: 10px;
}
#news-share {
overflow: hidden;
padding-top: 3px;
}
#news-share a {
width: 33px;
height: 32px;
background: url(../images/icon05.png) no-repeat;
margin: 0 10px 0 0;
}
#news-share a:last-child {
margin-right: 0;
}
#news-share .bds_tsina {
background-position-x: right;
}
.detail-thumb {
padding-top: 30px;
}
.detail-thumb .ctrl {
padding-bottom: 3px;
border-bottom: 2px solid #bf0000;
}
.detail-thumb .ctrl a {
color: #808080;
font-size: 14px;
font-family: "Montserrat";
}
.detail-thumb ul {
padding-top: 20px;
}
.detail-thumb li a {
margin-bottom: 8px;
color: #4c4c4c;
position: relative;
display: block;
padding-left: 14px;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
}
.detail-thumb li a:before {
content: '';
display: block;
width: 5px;
height: 5px;
background-color: #939393;
-webkit-border-radius: 50%;
border-radius: 50%;
position: absolute;
left: 0;
top: 50%;
margin-top: -2px;
}
.m-tit {
text-align: center;
padding-bottom: 20px;
}
@media (min-width: 768px) {
.container {
padding: 40px 0;
}
.class-thumb {
padding-bottom: 30px;
}
.n-list ul {
padding-bottom: 10px;
}
.n-list li {
padding-bottom: 30px;
}
.n-list li img {
width: 41.41%;
float: right;
}
.n-list a {
overflow: hidden;
}
.n-list .thumb {
width: 58.59%;
float: left;
padding: 40px 30px;
}
.n-list h3 {
padding-bottom: 10px;
}
}
@media (min-width: 1024px) {
.subbanner img {
width: 100%;
height: auto;
}
.container {
padding-top: 20px;
padding-bottom: 50px;
}
.class-thumb {
width: 30%;
float: left;
}
.class-thumb .tit {
display: none;
}
.class-thumb .item {
display: block !important;
padding-top: 0;
}
.m-tit {
padding-bottom: 25px;
}
.n-list {
width: 61.25%;
float: right;
}
.n-list .thumb {
padding: 20px 30px;
}
.n-list h3 {
font-size: 20px;
}
.crumb {
padding-top: 25px;
}
.crumb .home {
width: 16px;
height: 21px;
display: inline-block;
background: url(../images/icon03.png) center center no-repeat;
}
.crumb .cur {
color: #666;
padding-left: 11px;
background: url(../images/icon04.png) left center no-repeat;
margin-left: 5px;
display: inline-block;
vertical-align: top;
}
}
@media (min-width: 1260px) {
.container {
padding-top: 40px;
padding-bottom: 70px;
}
.detail-container {
padding-bottom: 50px;
}
.m-tit {
padding-bottom: 65px;
}
.n-list ul {
padding-bottom: 30px;
}
.n-list .thumb {
padding: 50px 40px 0;
}
.n-list h3 {
line-height: 34px;
padding-bottom: 13px;
}
.n-list .desc {
line-height: 30px;
}
.class-thumb a {
margin-bottom: 25px;
}
.detail-main {
width: 67.75%;
float: left;
}
.detail-main h2 {
padding-bottom: 25px;
}
.detail-main .ctrl {
line-height: 35px;
}
.detail-main h5 {
padding-bottom: 20px;
}
#news-share {
float: right;
}
.detail-article {
padding-top: 60px;
line-height: 30px;
}
.detail-thumb {
width: 28.5%;
float: right;
padding-top: 0;
}
.detail-thumb a {
-webkit-transition: ease color 0.2s;
-o-transition: ease color 0.2s;
-moz-transition: ease color 0.2s;
transition: ease color 0.2s;
}
.detail-thumb .ctrl {
padding-bottom: 13px;
}
.detail-thumb .ctrl a {
padding-top: 5px;
}
.detail-thumb a:hover {
color: #bf0000;
}
.detail-thumb ul {
padding-top: 33px;
}
.detail-thumb li a {
margin-bottom: 13px;
}
}
.m-list ul {
padding-bottom: 30px;
}
.m-list li {
border-bottom: 1px solid #e0e0e0;
padding: 30px 0 20px;
}
.m-list li a {
overflow: hidden;
display: block;
}
.m-list li:first-child {
padding-top: 0;
}
.m-list li img {
width: 100%;
}
.m-list h3 {
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
margin: 10px 0 5px;
font-weight: bold;
-webkit-transition: .2s;
-o-transition: .2s;
-moz-transition: .2s;
transition: .2s;
}
.m-list .desc {
color: #666;
line-height: 26px;
}
@media (min-width: 768px) {
.m-list li {
padding: 30px 0;
}
.m-list h3 {
margin-bottom: 15px;
}
.m-list .img {
float: left;
margin-right: 28px;
}
.m-list .desc {
display: -webkit-box;
height: 90px;
line-height: 30px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
}
@media (min-width: 1024px) {
.m-list {
width: 61.25%;
float: right;
}
}
@media (min-width: 1260px) {
.m-list ul {
padding-bottom: 55px;
}
.m-list .img {
width: 34.4%;
}
.m-list a:hover {
color: #bf0000;
}
}
.newsA-topnews-swiper {
margin-bottom: 15px;
}
.newsA-topnews-swiper .thumb {
overflow: hidden;
}
.newsA-topnews-swiper .thumb img {
width: 100%;
}
.newsA-topnews-swiper a {
display: block;
background-color: #f2f2f2;
}
.newsA-topnews-swiper .conent {
padding: 10px 15px 40px;
}
.newsA-topnews-swiper .title {
margin-bottom: 2px;
font-size: 18px;
line-height: 30px;
color: #333;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
}
.newsA-topnews-swiper .date {
color: #bf0000;
font-family: "Montserrat";
padding-bottom: 2px;
}
.newsA-topnews-swiper .desc {
font-size: 14px;
line-height: 24px;
color: #808080;
display: -webkit-box;
height: 72px;
line-height: 24px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.newsA-topnews-swiper .more {
min-width: 90px;
display: inline-block;
vertical-align: top;
font-size: 14px;
line-height: 32px;
color: #fff;
background-color: #bf0000;
font-family: "Montserrat";
text-align: center;
-webkit-border-radius: 3px;
border-radius: 3px;
margin-top: 10px;
}
.newsA-topnews-swiper .newsA-pages {
position: absolute;
left: 0;
bottom: 15px;
z-index: 10;
width: 100%;
font-size: 0;
line-height: 0;
text-align: center;
}
.newsA-topnews-swiper .newsA-pages span {
opacity: 1;
display: inline-block;
vertical-align: top;
width: 10px;
height: 10px;
margin: 0 5px;
background-color: #d9d9d9;
}
.newsA-topnews-swiper .newsA-pages .swiper-pagination-bullet-active {
background-color: #de0012;
}
@media (min-width: 1024px) {
.m-tit {
text-align: left;
}
.newsA-topnews-swiper {
margin-bottom: 47px;
}
.newsA-topnews-swiper .thumb {
float: left;
width: 65%;
}
.newsA-topnews-swiper .thumb img {
-webkit-transition: -webkit-transform ease .7s;
transition: -webkit-transform ease .7s;
-o-transition: -o-transform ease .7s;
-moz-transition: transform ease .7s, -moz-transform ease .7s;
transition: transform ease .7s;
transition: transform ease .7s, -webkit-transform ease .7s, -moz-transform ease .7s, -o-transform ease .7s;
}
.newsA-topnews-swiper a {
overflow: hidden;
zoom: 1;
}
.newsA-topnews-swiper a:hover .title {
color: #de0012;
}
.newsA-topnews-swiper a:hover img {
-webkit-transform: scale(1.04);
-moz-transform: scale(1.04);
-ms-transform: scale(1.04);
-o-transform: scale(1.04);
transform: scale(1.04);
}
.newsA-topnews-swiper .conent {
overflow: hidden;
zoom: 1;
padding: 40px 25px 35px;
}
.newsA-topnews-swiper .title {
margin-bottom: 10px;
font-size: 22px;
max-height: 64px;
line-height: 32px;
display: -webkit-box;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: normal;
}
.newsA-topnews-swiper .desc {
margin-bottom: 24px;
height: 120px;
line-height: 24px;
-webkit-line-clamp: 5;
}
.newsA-topnews-swiper .more {
margin-top: 0;
}
.newsA-topnews-swiper .newsA-pages {
left: auto;
right: 36%;
bottom: 15px;
width: auto;
text-align: left;
padding-left: 25px;
}
}
@media (min-width: 1260px) {
.newsA-topnews-swiper .conent {
padding: 60px 38px 50px;
}
.newsA-topnews-swiper .thumb {
width: 62.5%;
}
.newsA-topnews-swiper .title {
font-size: 24px;
max-height: 72px;
line-height: 36px;
display: -webkit-box;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.newsA-topnews-swiper .desc {
height: 120px;
line-height: 30px;
-webkit-line-clamp: 4;
font-size: 16px;
}
.newsA-topnews-swiper .date {
padding-bottom: 13px;
}
.newsA-topnews-swiper .more {
margin-top: 3px;
}
.newsA-topnews-swiper .newsA-pages {
padding-left: 38px;
right: 40%;
}
}
.R-list li {
padding-bottom: 30px;
}
.R-list li img {
width: 100%;
display: block;
}
.R-list .img {
-webkit-border-top-left-radius: 5px;
border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
border-top-right-radius: 5px;
}
.R-list .date {
font-family: "Montserrat";
color: #999999;
}
.R-list .thumb {
padding: 20px 10px;
-webkit-box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1);
}
.R-list .desc {
color: #666;
display: -webkit-box;
height: 60px;
line-height: 30px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.R-list h3 {
padding: 5px 0;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
}
@media (min-width: 768px) {
.R-list .thumb {
padding: 20px 20px 30px;
}
}
@media (min-width: 768px) {
.R-list .thumb {
padding: 20px 20px 30px;
}
}
@media (min-width: 1260px) {
.R-list ul {
margin: 0 -21px 20px;
}
.R-list li {
padding: 0 21px 45px;
}
.R-list .thumb {
padding: 27px 28px 50px;
}
}
.menu {
max-width: 788px;
border-bottom: 1px solid #e0e0e0;
margin-bottom: 30px;
white-space: nowrap;
overflow-x: auto;
overflow-y: visible;
}
.menu a {
color: #666;
white-space: nowrap;
display: inline-block;
padding-bottom: 10px;
margin-right: 20px;
position: relative;
}
.menu a:after {
content: '';
display: block;
width: 100%;
height: 2px;
position: absolute;
bottom: -1px;
left: 0;
z-index: 1;
-webkit-transition: .2s ease background-color;
-o-transition: .2s ease background-color;
-moz-transition: .2s ease background-color;
transition: .2s ease background-color;
}
.menu a:hover:after, .menu a.on:after {
background-color: #bf0000;
}
.menu a.on, .menu a:hover {
color: #bf0000;
}
.partner ul {
margin: 0 -10px 10px;
}
.partner li {
margin-bottom: 20px;
}
.partner li img {
max-width: 80%;
max-height: 100%;
display: block;
margin: 0 auto;
}
.partner .thumb {
padding: 10px;
height: 80px;
border: 1px solid #ededed;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media (min-width: 768px) {
.menu {
overflow: visible;
}
.partner ul {
margin-bottom: 20px;
}
}
@media (min-width: 1024px) {
.menu {
margin-bottom: 40px;
}
.menu a {
padding-bottom: 15px;
}
.partner .thumb {
height: 130px;
}
}
@media (min-width: 1260px) {
.menu {
margin-bottom: 60px;
margin-top: -28px;
}
.menu a {
margin-right: 30px;
}
.partner ul {
margin-bottom: 15px;
}
.partner li {
margin-bottom: 40px;
}
.partner .thumb {
height: 180px;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.partner .thumb:hover {
-webkit-box-shadow: 0 0 8px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 8px 3px rgba(0, 0, 0, 0.1);
}
}
.heartfelt .thumb {
-webkit-box-shadow: 0 0 20px 3px rgba(136, 136, 136, 0.1);
box-shadow: 0 0 20px 3px rgba(136, 136, 136, 0.1);
padding: 60px 30px 30px;
}
.heartfelt li {
padding-top: 45px;
padding-bottom: 40px;
position: relative;
}
.heartfelt li:nth-child(2n) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
.heartfelt .photo {
width: 80px;
height: 80px;
-webkit-border-radius: 100%;
border-radius: 100%;
overflow: hidden;
display: block;
position: absolute;
left: 30px;
top: 0;
}
.heartfelt img {
max-width: 100%;
}
.heartfelt .desc {
color: #666;
}
.heartfelt .name {
padding-top: 20px;
}
@media (min-width: 768px) {
.heartfelt li {
padding-top: 50px;
}
.heartfelt .thumb {
padding-top: 70px;
}
.heartfelt .photo {
width: 100px;
height: 100px;
left: 40px;
}
}
@media (min-width: 1260px) {
.heartfelt li {
padding: 60px 30px;
}
.heartfelt .thumb {
padding: 70px 50px 75px;
position: relative;
}
.heartfelt .photo {
left: 80px;
}
.heartfelt .desc {
line-height: 26px;
}
.heartfelt .name {
position: absolute;
bottom: 37px;
left: 50px;
}
}
.expert-list li {
margin-bottom: 40px;
}
.expert-list li:last-child {
margin-bottom: 20px;
}
.expert-list .thumb {
-webkit-transition: .3s ease;
-o-transition: .3s ease;
-moz-transition: .3s ease;
transition: .3s ease;
display: block;
-webkit-box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1);
padding: 20px;
}
.expert-list .article:before {
content: '';
display: block;
width: 100px;
height: 1px;
background-color: #dedede;
margin: 10px 0;
}
.expert-list .desc {
color: #7f7f7f;
padding-top: 10px;
}
.expert-list .more {
min-width: 90px;
line-height: 35px;
padding: 0 10px;
color: #fff;
background-color: #bf0000;
display: inline-block;
text-align: center;
-webkit-border-radius: 3px;
border-radius: 3px;
margin-top: 20px;
}
.menu.full {
max-width: 100%;
}
.expert-ctrl {
color: #4c4c4c;
border-bottom: 1px solid #dcdce5;
padding-bottom: 20px;
margin-bottom: 20px;
}
.expert-ctrl h2 {
padding-bottom: 10px;
}
.expert-article {
line-height: 26px;
}
.expert-article h3 {
color: #333;
padding-bottom: 10px;
}
.case-list {
padding-top: 30px;
}
.case-list ul {
padding-top: 10px;
}
.case-list li {
padding-bottom: 30px;
}
.case-list .img {
-webkit-border-top-left-radius: 5px;
border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
border-top-right-radius: 5px;
}
.case-list img {
width: 100%;
}
.case-list .article {
padding: 20px;
border: 1px solid #dcdce5;
}
.case-list .desc {
line-height: 26px;
padding-top: 5px;
}
@media (min-width: 768px) {
.expert-article {
line-height: 30px;
}
.expert-ctrl {
padding-bottom: 30px;
margin-bottom: 30px;
}
.expert-ctrl .post {
line-height: 30px;
}
.case-list ul {
margin: 0 -5px;
}
.case-list li {
padding: 0 5px 20px;
}
}
@media (min-width: 1024px) {
.case-list {
padding-top: 50px;
}
.case-list ul {
margin: 0 -15px;
padding-top: 20px;
}
.case-list li {
padding: 0 15px 10px;
}
}
@media (min-width: 1260px) {
.menu.full a {
margin-right: 57px;
}
.expert-list li {
margin-bottom: 25px;
}
.expert-list .thumb {
padding-left: 167px;
position: relative;
padding-right: 370px;
-webkit-box-shadow: none;
box-shadow: none;
}
.expert-list .article {
padding-left: 25px;
}
.expert-list .article:before {
display: none;
}
.expert-list h3 {
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
}
.expert-list .name {
width: 167px;
border-right: 1px solid #dedede;
line-height: 80px;
position: absolute;
left: 0;
top: 50%;
text-align: center;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: .2s color ease;
-o-transition: .2s color ease;
-moz-transition: .2s color ease;
transition: .2s color ease;
}
.expert-list .desc {
display: -webkit-box;
height: 60px;
line-height: 30px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
padding-top: 0;
margin-top: 10px;
}
.expert-list .more {
position: absolute;
right: 45px;
top: 50%;
margin-top: -18px;
}
.expert-list li:hover .name {
color: #bf0000;
}
.expert-list li:hover .thumb {
-webkit-box-shadow: 0 0 5px 3px rgba(180, 180, 180, 0.1);
box-shadow: 0 0 5px 3px rgba(180, 180, 180, 0.1);
}
.expert-list li:last-child {
margin-bottom: 0;
}
.expert-ctrl {
padding-bottom: 43px;
margin-bottom: 35px;
}
.expert-ctrl h2 {
line-height: 1;
padding-bottom: 30px;
}
.expert-article h3 {
padding-top: 28px;
padding-bottom: 25px;
}
.case-list {
padding-top: 70px;
}
.case-list ul {
padding-top: 40px;
}
.case-list .article {
padding: 30px 30px 35px;
}
.case-list .desc {
line-height: 30px;
}
}
.advisory-list dl {
border-top: 2px solid #c21313;
padding: 20px 15px;
-webkit-box-shadow: 0 5px 25px 3px rgba(156, 156, 156, 0.1);
box-shadow: 0 5px 25px 3px rgba(156, 156, 156, 0.1);
margin-bottom: 20px;
}
.advisory-list dd {
padding-top: 5px;
line-height: 30px;
}
.advisory-list .more{
padding:1px 15px;
border:1px solid #ccc;
display:inline-block;
color:#666;
font-size:14px;
vertical-align:top;
margin-top:10px;
}
.advisory-hd {
background-color: #f9f9f9;
padding: 40px 15px;
margin-top: 50px;
}
.advisory-hd h3 {
color: #c7000b;
}
.advisory-hd h5 {
color: #222;
}
.advisory-hd .article {
padding-top: 20px;
line-height: 30px;
}
.advisory-hd .section {
padding-bottom: 40px;
}
.advisory-hd .section:last-child {
padding-bottom: 0;
}
@media (min-width: 1024px) {
.service {
width: 75%;
float: right;
}
.service-thumb {
width: 25%;
}
.advisory-list .more{
padding:5px 25px;
}
.expert-list ul{
padding-bottom:30px;
}
}
@media (min-width: 1260px) {
.advisory-list {
padding-bottom: 15px;
margin-bottom: 0;
}
.advisory-list dl {
padding: 55px 47px 48px;
border-width: 4px;
margin-bottom: 60px;
}
.advisory-list dl:hover dt a {
color:#bf0000;
}
.advisory-list dd {
line-height: 36px;
padding-top: 15px;
}
.advisory-hd {
padding: 50px 22px 47px 45px;
margin-top: 0;
}
.advisory-hd .article {
padding-top: 45px;
line-height: 36px;
}
.advisory-hd .section {
padding-bottom: 60px;
}
.container.botnone {
padding-bottom: 0;
}
.advisory-list .more{
padding: 3px 20px;
font-size:16px;
margin-top:25px;
}
.advisory-list .more:hover{
color:#fff;
background-color:#bf0000;
border-color:#bf0000;
}
}
.insrecruit-list {
padding: 20px 0 0;
}
.insrecruit-list ul {
padding: 0 0 20px;
}
.insrecruit-list li {
border-radius: 10px;
border:1px solid rgba(0,0,0,.125);
margin-bottom: 30px;
width:100%;
float:left;
}
.insrecruit-list li:hover .rectue-top, .insrecruit-list li.cur .rectue-top {
background-color: rgba(0,0,0,.03);
border-bottom:1px;
border:none;
}
.insrecruit-list li:hover .rectue-top span, .insrecruit-list li.cur .rectue-top span {
color: #000;
}
.insrecruit-list li:hover .rectue-top .date, .insrecruit-list li.cur .rectue-top .date {
background-image: url(../images/icon07.png);
}
.insrecruit-list li.cur .rectue-top .icon em {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
background-color: #fff;
}
.insrecruit-list .rectue-top {
border: 1px solid #e5e5e5;
padding: 10px 30px 5px 10px;
color: #323232;
font-size: 0;
position: relative;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.insrecruit-list .rectue-top span {
display: inline-block;
vertical-align: top;
*display: inline;
*zoom: 1;
vertical-align: middle;
margin-right: 20px;
margin-bottom: 5px;
width: 40%;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
color: #323232;
}
.insrecruit-list .rectue-top .pnum, .insrecruit-list .rectue-top .loac {
color: #929292;
}
.insrecruit-list .rectue-top .date {
background: url(../images/icon06.png) no-repeat 0 center;
padding-left: 28px;
font-family: Montserrat;
color: #808080;
}
.insrecruit-list .rectue-top .icon {
width: 20px;
height: 20px;
position: absolute;
right: 10px;
top: 10px;
margin: 0;
}
.insrecruit-list .rectue-top .icon em {
position: absolute;
background: #bfbfbf;
width: 20px;
height: 1px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
transition: all 0.5s ease;
left: 0;
top: 50%;
}
.insrecruit-list .rectue-top .icon em:nth-child(2) {
width: 1px;
height: 20px;
left: 50%;
top: 0;
}
.insrecruit-list .rectue-min {
padding: 20px 10px;
color: #757575;
display: none;
}
.insrecruit-list .rectue-min .desc {
padding: 0 0 10px;
}
.insrecruit-list .rectue-min h3 {
color: #333333;
padding: 0 0 5px;
}
.insrecruit-list .rectue-send {
padding: 20px 0 0;
margin-top: 80px;
border-top:dashed 1px #ccc
}
.insrecruit-list .rectue-send a {
display: inline-block;
vertical-align: top;
color: #fff;
background: #2d8eb4;
-webkit-transition: all .3s;
-o-transition: all .3s;
-moz-transition: all .3s;
transition: all .3s;
line-height: 45px;
text-align: center;
min-width: 160px;
-webkit-border-radius: 3px;
border-radius: 3px;
padding: 0 15px;
}
@media (min-width: 1024px) {
.insrecruit-list {
padding: 0;
}
.insrecruit-list ul {
padding: 0 0 30px;
}
.insrecruit-list .rectue-top {
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
-moz-transition: all 0.5s;
transition: all 0.5s;
cursor: pointer;
padding: 26px 40px 26px 30px;
border: none;
background: rgba(0,0,0,.03)
}
.insrecruit-list .rectue-top span {
width: 100%;
text-align: center;
margin-bottom: 0;
font-size:36px;
}
.insrecruit-list .rectue-top .date {
width: 15%;
float: right;
margin-top: 6px;
margin-right: 25px;
}
.insrecruit-list .rectue-top .icon {
width: 36px;
height: 36px;
right: 40px;
top: 25px;
}
.insrecruit-list .rectue-top .icon em {
width: 36px;
}
.insrecruit-list .rectue-top .icon em:nth-child(2) {
width: 1px;
height: 36px;
}
.insrecruit-list .rectue-min {
padding: 25px 30px 30px;
line-height: 24px;
}
.insrecruit-list .rectue-min .desc {
padding: 0 0 40px 0;
line-height: 30px;
width:20%;
}
.insrecruit-list .rectue-min h3 {
padding: 0 0 10px;
}
}
@media (min-width: 1260px) {
.insrecruit-list {
margin-top: -10px;
}
.insrecruit-list ul {
padding-bottom: 55px;
}
}
.contact img {
width: 100%;
display: block;
}
.contact .info {
padding: 20px 20px 10px;
border: 1px solid #e0e0e0;
}
.contact h2 {
color: #333;
}
.contact h2:after {
content: '';
display: block;
width: 40px;
height: 3px;
background-color: #bf0000;
margin: 10px 0 15px;
}
.contact p {
padding-bottom: 10px;
}
.contact .ac {
font-family: "Montserrat";
letter-spacing: -1px;
}
.contact .address, .contact .tel {
padding-left: 32px;
}
.contact .tel {
background: url(../images/icon08.png) left 7px no-repeat;
}
.contact .address {
background: url(../images/icon09.png) left 2px no-repeat;
}
.contact .qrcode {
padding-top: 10px;
display: inline-block;
color: #999;
text-align: center;
font-size: 14px;
padding-bottom: 0;
}
.contact .qrcode img {
margin-bottom: 3px;
}
.map {
height: 300px;
margin-top: 30px;
}
@media (min-width: 1024px) {
.contact {
width: 100%;
display: table;
}
.contact .info, .contact .img {
display: table-cell;
vertical-align: middle;
}
.contact .info {
width: 41%;
padding: 10px 30px;
}
.map {
height: 400px;
margin-top: 50px;
}
}
@media (min-width: 1260px) {
.contact .img, .contact .info {
width: 50%;
}
.contact .info {
padding-left: 85px;
}
.contact h2:after {
margin: 22px 0;
}
.contact p {
padding-bottom: 15px;
}
.contact .qrcode {
padding-top: 13px;
}
.map {
height: 580px;
}
}
.introductionA-one {
padding-top: 20px;
padding-bottom: 20px;
color: #868686;
}
.introductionA-one .year {
color: #ececec;
font-family: "Montserrat";
line-height: 1.8;
}
.introductionA-one h2 {
color: #cd002b;
padding-bottom: 10px;
text-transform: uppercase;
line-height: 1;
}
.introductionA-text {
line-height: 20px;
}
.introductionA-slide {
padding-bottom: 30px;
position: relative;
}
.introductionA-bd {
overflow: hidden;
padding-top: 20px;
}
.introductionA-bd img {
width: 100%;
display: block;
}
.introductionA-hd {
display: none;
position: absolute;
right: 0;
bottom: 30px;
z-index: 20;
font-size: 0;
white-space: nowrap;
}
.introductionA-hd a {
width: 40px;
height: 40px;
display: inline-block;
vertical-align: top;
position: relative;
}
.introductionA-hd a:after {
content: '';
display: block;
width: 12px;
height: 12px;
position: absolute;
left: 50%;
top: 50%;
}
.introductionA-prev {
background-color: #FFFFFF;
}
.introductionA-prev:after {
border: 1px solid #666666;
border-right: none;
border-top: none;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
margin: -6px 0 0 -3px;
}
.introductionA-next {
background-color: #333333;
}
.introductionA-next:after {
border: 1px solid #ffffff;
border-left: none;
border-bottom: none;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
margin: -6px 0 0 -9px;
}
.introductionA-dot {
text-align: center;
padding-top: 5px;
position: absolute;
width: 100%;
}
.introductionA-dot span {
width: 20px;
height: 2px;
opacity: 1;
background-color: #c1c1c1;
-webkit-border-radius: 0;
border-radius: 0;
margin: 0 5px;
}
.introductionA-dot span.swiper-pagination-bullet-active {
background-color: #de0012;
}
@media (min-width: 768px) {
.introductionA-one {
padding: 40px 0;
}
.introductionA-one h3 {
font-size: 20px;
}
.introductionA-two .text {
padding-top: 0;
}
}
@media (min-width: 1024px) {
.introductionA-bd {
padding-top: 0;
}
}
@media (min-width: 1260px) {
.introductionA-container {
padding: 70px 0 0;
}
.introductionA-one {
padding: 20px 0 5.41667%;
}
.introductionA-one .col-md-6 {
padding: 0;
}
.introductionA-one .introductionA-text {
padding: 0 46px 0 0;
font-size: 16px;
line-height: 30px;
margin-top: -20px;
}
.introductionA-one .year {
letter-spacing: -1px;
line-height: 1;
padding-bottom: 20px;
}
.introductionA-one h2 {
padding-bottom: 30px;
}
.introductionA-title {
font-size: 30px;
line-height: 1.5;
padding: 30px;
}
.introductionA-title:after {
margin-top: 8px;
}
.introductionA-one h3 {
font-size: 24px;
line-height: 30px;
padding-bottom: 23px;
}
.introductionA-hd {
display: block;
right: -50px;
}
.introductionA-hd a {
width: 50px;
height: 50px;
}
}
@media (min-width: 1400px) {
.introductionA-hd {
right: -80px;
}
.introductionA-hd a {
width: 80px;
height: 80px;
}
}
.about-post {
padding: 30px 0;
background-color: #f7f7f7;
}
.about-post li {
padding-top: 10px;
padding-bottom: 10px;
}
.about-post .thumb {
width: 100%;
display: table;
}
.about-post .img, .about-post img {
width: 120px;
}
.about-post .img {
-webkit-border-radius: 5px;
border-radius: 5px;
overflow: hidden;
}
.about-post .img, .about-post .info {
display: table-cell;
vertical-align: middle;
}
.about-post .info {
padding-left: 20px;
}
.about-post h4 {
padding-bottom: 3px;
}
.about-post .desc {
color: #666;
}
.container.padbot {
padding-bottom: 0;
}
@media (min-width: 768px) {
.about-post li {
padding-top: 22px;
padding-bottom: 22px;
}
.about-post .img, .about-post img {
width: 140px;
}
.about-post h4 {
padding-bottom: 0;
}
.about-post .desc {
line-height: 30px;
font-size: 16px;
}
}
@media (min-width: 1260px) {
.about-post {
padding: 60px 0;
}
}
.full-img {
width: 100%;
display: block;
}
.dimension {
padding-top: 20px;
}
.dimension ul {
padding-top: 20px;
}
.dimension li {
border-bottom: 1px solid #e5e5e5;
padding-bottom: 20px;
margin-bottom: 20px;
}
.dimension h4 {
padding-bottom: 5px;
}
.founder-list {
padding-top: 30px;
}
.founder-list.nopadding,.founder-list.nopadding ul{
padding-top: 0;
}
.founder-list ul {
padding-top: 20px;
}
.founder-list li {
border-bottom: 1px solid #e5e5e5;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
.founder-list h3 {
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
padding: 10px 50px 10px 15px;
background: url(../images/icon10.png) 95% center no-repeat;
}
.founder-list .info {
background-color: #f7f7f7;
padding: 20px 15px;
display: none;
}
.founder-list .info .font18 {
padding: 5px 0;
}
.founder-list .on {
-webkit-border-radius: 5px;
border-radius: 5px;
overflow: hidden;
border-bottom: transparent;
}
.founder-list .on h3 {
background-color: #bf0000;
color: #fff;
background-image: url(../images/icon11.png);
}
.founder-article {
padding-top: 10px;
}
.founder-article .article {
padding-top: 20px;
line-height: 26px;
}
@media (max-width: 640px) {
.dimension .font24 {
font-size: 16px;
}
}
@media (min-width: 1024px) {
.dimension {
padding-top: 40px;
}
.dimension ul {
padding-top: 40px;
display: table;
width: 100%;
}
.dimension li {
width: 33.33333%;
vertical-align: top;
display: table-cell;
padding: 0 20px;
border-bottom: none;
position: relative;
line-height: 30px;
}
.dimension li:after {
content: '';
display: block;
width: 1px;
height: 100%;
position: absolute;
right: 0;
top: 15px;
z-index: 1;
background-color: #e5e5e5;
}
.dimension li:first-child {
padding-left: 0;
}
.dimension li:last-child:after {
display: none;
}
.dimension h4 {
padding-bottom: 20px;
}
.founder-article {
padding-top: 50px;
}
.founder-list .info {
padding: 30px;
}
}
@media (min-width: 1260px) {
.founder {
margin-top: -10px;
}
.dimension ul {
padding-top: 60px;
}
.dimension li {
padding: 0 30px 10px;
}
.dimension h4 {
padding-bottom: 25px;
}
.founder-article {
padding-top: 60px;
}
.founder-article .article {
padding-top: 37px;
line-height: 30px;
}
.founder-list {
padding-top: 75px;
padding-bottom: 10px;
}
.founder-list ul {
padding-top: 47px;
}
.founder-list h3 {
padding: 10px 50px;
background-position-x: 96%;
}
.founder-list .info {
padding: 50px 50px 80px;
font-size: 16px;
line-height: 30px;
}
}
.training-section {
line-height: 28px;
}
.training-section h3 {
color: #333333;
padding-bottom: 5px;
}
.training-section .gray {
color: #4d4d4d;
}
.schedule {
padding-top: 30px;
}
.schedule .box {
padding-top: 10px;
overflow-x: scroll;
overflow-y: hidden;
}
.training-qrcode {
text-align: center;
background-color: #f7f7f7;
padding: 30px 0;
margin-top: 20px;
}
.training-qrcode img {
max-width: 40%;
margin: 0 auto 10px;
display: block;
}
.training-list {
padding-top: 30px;
}
@media (min-width: 1260px) {
.training-qrcode {
margin-bottom: 20px;
padding-bottom: 42px;
}
.training-qrcode img {
margin-bottom: 15px;
}
.training-list dd {
overflow: hidden;
}
.training-list .item {
width: 50%;
float: left;
}
.training-list .changewidth .item:first-child {
width: 68%;
}
.training-list .changewidth .item:last-child {
width: 32%;
}
}
.train-list .box {
padding-top: 20px;
overflow-y: hidden;
overflow-x: auto;
}
.train-list ul {
padding-top: 20px;
}
.train-list .odd {
border-top: 2px solid #c21212;
}
.train-list .even {
padding: 30px 15px;
line-height: 30px;
}
.train-list .tit {
text-indent: -8px;
padding-bottom: 5px;
}
.train-list .tit span:after {
content: '';
display: inline-block;
width: 30px;
height: 1px;
vertical-align: middle;
background-color: #282828;
margin-right: 5px;
}
.train-list .ac {
color: #d32228;
}
.train-list .thumb {
padding: 20px 15px;
-webkit-box-shadow: 0 5px 25px 3px rgba(156, 156, 156, 0.1);
box-shadow: 0 5px 25px 3px rgba(156, 156, 156, 0.1);
}
.train-list dt {
float: left;
line-height: 36px;
color: #c7000b;
}
.train-list dd {
float: right;
}
.train-list dd a {
width: 90px;
height: 36px;
line-height: 36px;
display: block;
text-align: center;
color: #fff;
background-color: #bf0000;
font-size: 14px;
text-transform: uppercase;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.train-list .cont {
margin-top: 15px;
padding: 22px;
line-height: 26px;
position: relative;
}
.train-list .cont:before {
content: '';
display: block;
width: 22px;
height: 18px;
background: url(../images/icon12.png) no-repeat;
position: absolute;
left: 0;
top: 0;
}
.train-list .cont:after {
content: '';
display: block;
width: 22px;
height: 18px;
background: url(../images/icon13.png) no-repeat;
position: absolute;
right: 0;
bottom: 0;
}
.train-list .bot {
padding-top: 20px;
color: #282828;
text-align: right;
}
.train-list .bot:before {
content: '';
width: 30px;
height: 1px;
display: inline-block;
vertical-align: middle;
background-color: #474747;
margin-right: 5px;
}
@media (min-width: 768px) {
.train-list .box img {
width: 100%;
}
.train-list .even {
padding: 50px 15px;
}
}
@media (min-width: 1024px) {
.train-list .even {
line-height: 50px;
}
.train-list .cont {
line-height: 36px;
}
}
@media (min-width: 1260px) {
.train-list .thumb {
padding: 60px 33px 55px 25px;
}
.train-list .bot {
padding-right: 10px;
padding-top: 30px;
}
.train-list .bot:before {
width: 55px;
}
.train-list .even {
padding: 50px 15px 50px 30px;
}
}
.searchtitle401 {
padding: 15px;
background-color: #f1f1f1;
}
.searchcont401 {
padding: 0;
}
.resultlist401 {
font-size: 13px;
padding: 15px 0;
}
.resultlist401 h2{
text-align:center;
padding-top:10px;
color:#666;
}
.resultlist401 img {
display: block;
width: 100%;
}
.resultlist401 li {
padding: 15px 0;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
margin-bottom: -1px;
}
.resultlist401 h4 {
font-size: 16px;
line-height: 24px;
margin-bottom: 10px;
}
.resultlist401 h4 a {
display: block;
}
.resultlist401 h4 em {
color: red;
font-style: normal;
}
.resultlist401 h4 a {
display: block;
}
.resulttext401 {
height: 72px;
font-size: 14px;
line-height: 24px;
display: -webkit-box;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
color: #666;
}
.resultlabel401 {
color: #333;
display: inline-block;
padding-top: 3%;
}
.searchinputcont401 {
padding-right: 60px;
}
.searchinputcont401 dt input {
position: relative;
float: left;
width: 100%;
height: 40px;
line-height: 40px;
text-indent: 12px;
font-size: 15px;
color: #333;
background-color: #fff;
}
.searchinputcont401 dd input {
position: relative;
left: 60px;
margin-left: -60px;
float: left;
width: 60px;
height: 40px;
line-height: 40px;
font-size: 14px;
color: #fff;
cursor: pointer;
background: #bf0000;
}
.searchimg401 {
display: block;
margin-bottom: 3%;
}
@media (min-width: 768px) {
.searchinputcont401 {
max-width: 61.8%;
margin: 0 auto;
}
.searchtitle401 {
font-size: 24px;
}
.resultlist401 {
padding: 3% 0;
}
.resultlist401 img {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
max-width: 100%;
width: auto;
}
.searchimg401 {
float: left;
margin: 0 3% 0 0;
display: block;
width: 200px;
height: 150px;
overflow: hidden;
position: relative;
}
.resultlist401 h4 {
font-size: 20px;
margin-bottom: 2%;
}
}
@media (min-width: 1024px) {
.searchtitle401 {
padding: 28px 15px;
}
.searchinputcont401 {
width: 45%;
}
.searchinputcont401 dt {
float: left;
width: 78%;
}
.searchinputcont401 dd {
float: left;
width: 22%;
}
.searchinputcont401 dd input {
left: 0;
margin-left: 0;
width: 100%;
}
.searchinputcont401 dt input {
font-size: 18px;
}
.searchinputcont401 dd input {
text-align: center;
font-size: 16px;
}
}
.sitemapcont2 {
padding: 6% 10px;
overflow: hidden;
background: #fff;
}
.sitemapcont2 dl {
position: relative;
margin-bottom: 36px;
}
.sitemapcont2 dl:last-of-type {
margin-bottom: 0;
}
.sitemapcont2 dl dt {
font-size: 16px;
font-weight: bold;
padding: 0 8px;
background: #fff;
position: absolute;
left: 18px;
top: -14px;
}
.sitemapcont2 dl dt a {
color: #bf0000;
}
.sitemapcont2 dl dt a:hover {
color: #bf0000;
}
.sitemapcont2 dl dd {
padding: 4% 3% 1% 3%;
border: 1px solid #e6e6e6;
}
.sitemapcont2 dl dd a {
display: inline-block;
padding-left: 10px;
margin: 0 23px 8px 0;
}
@media (min-width: 767px) {
.sitemapcont2 {
padding: 5% 10px;
}
.sitemapcont2 dl dt {
font-size: 20px;
}
.sitemapcont2 dl dd {
padding: 2% 3% 1% 3%;
border: 1px solid #e6e6e6;
}
.sitemapcont2 dl dd a {
margin: 0 45px 8px 0;
}
.sitemapcont2 dl dd a:hover {
color: #bf0000;
}
}
@media (min-width: 1024px) {
.sitemapcont2 {
padding: 3.5% 30px;
margin-top: -30px;
}
.sitemapcont2 dl {
margin-bottom: 50px;
}
}
#ie-alert-overlay {
width: 100%;
height: 100%;
background: url(../images/bg.png) repeat 0 0;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
}
* html #ie-alert-overlay {
position: absolute;
z-index: 9999;
}
#ie-alert-panel {
width: 520px;
height: 331px;
position: fixed;
background: url(../images/iealertsprite.png) no-repeat;
background-position: -1px -109px;
top: 50%;
left: 50%;
margin: -201px 0 0 -296px;
padding: 72px 0 0 72px;
_position: absolute;
_top: expression(300+((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+'px');
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
font-weight: bold;
color: #333;
line-height: 1.5em;
z-index: 10000;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
#ie-alert-panel div, #ie-alert-panel p, #ie-alert-panel span, #ie-alert-panel a, #ie-alert-panel img, #ie-alert-panel ul, #ie-alert-panel li {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
#ie-alert-panel p {
font-size: 14px;
width: 486px;
text-align: justify;
}
#ie-alert-panel img {
border: 0;
}
#ie-alert-panel span {
font-size: 18px;
margin: 0 0 20px 0;
display: block;
padding: 0;
}
#ie-alert-panel ul {
list-style: none;
margin: 0;
padding: 0;
overflow: hidden;
}
#ie-alert-panel li {
float: left;
margin: 0 22px 0 0;
}
#ie-alert-panel li.last {
margin-right: 0;
}
#ie-alert-panel a {
display: inline-block;
vertical-align: top;
}
#goon {
text-decoration: underline;
}
.browser {
position: absolute;
bottom: 35px;
}
.chrome, .firefox, .ie9, .opera, .safari {
background: url(../images/iealertsprite.png) no-repeat;
}
.chrome {
background-position: 0 0;
width: 73px;
height: 96px;
margin: 0 4px 0 0;
}
.firefox {
background-position: -292px 0;
width: 73px;
height: 98px;
}
.ie9 {
background-position: -179px 0;
width: 95px;
height: 98px;
}
.opera {
background-position: -90px 0;
width: 73px;
height: 98px;
}
.safari {
background-position: -387px 0;
width: 73px;
height: 98px;
margin: 0 4px 0 0;
}
.full-newsdetailB-container {
padding: 30px 0;
background-color: #ffffff;
/* {"title": "栏目全局背景色","type":"color","name": "@bgcgnewsdetailBcol","value": "#ffffff"}*/
}
.full-newsdetailB-container .article-tilte {
margin-bottom: 8px;
font-size: 18px;
line-height: 26px;
color: #333333;
/* {"title": "新闻详细B标题文本色","type":"color","name": "@clnewsdetailBtilte","value": "#333333"}*/
}
.full-newsdetailB-container .date {
margin-bottom: 10px;
font-size: 16px;
line-height: 32px;
color: #8e8e8e;
/* {"title": "新闻详细B日期文本色","type":"color","name": "@clnewsdetailBdate","value": "#8e8e8e"}*/
}
.full-newsdetailB-container .newsdetailB-article {
position: relative;
padding: 38px 0 30px;
margin-bottom: 15px;
border: 1px solid #d9d9d9;
/* {"title": "新闻详细B内容上下边框色","type":"color","name": "@bdnewsdetailBart","value": "#d9d9d9"}*/
border-left: 0;
border-right: 0;
font-size: 14px;
line-height: 24px;
color: #888888;
/* {"title": "新闻详细B内容文本色","type":"color","name": "@clnewsdetailBart","value": "#888888"}*/
}
.full-newsdetailB-container .newsdetailB-article img {
max-width: 100%;
margin: 0.5em 0;
}
.full-newsdetailB-container .newsdetailB-bdshare {
position: absolute;
right: 0;
top: -43px;
overflow: hidden;
zoom: 1;
}
.full-newsdetailB-container .newsdetailB-bdshare a {
float: left;
display: block;
width: 32px;
height: 32px;
padding: 0;
margin: 0 0 0 5px;
background-repeat: no-repeat;
background-position: center;
-o-background-size: cover;
background-size: cover;
}
.full-newsdetailB-container .newsdetailB-bdshare .bds_weixin {
background-image: url(../images/newsdetailBwxico.png);
/* {"title": "新闻详情A微信分享背景图","type":"image","name": "@imgnewsdetailAsharewx","value": "url(../images/newsdetailBwxico.png)"}*/
}
.full-newsdetailB-container .newsdetailB-bdshare .bds_tsina {
background-image: url(../images/newsdetailBsnico.png);
/* {"title": "新闻详情A新浪分享背景图","type":"image","name": "@imgnewsdetailAsharesn","value": "url(../images/newsdetailBsnico.png)"}*/
}
.full-newsdetailB-container .newsdetailB-bdshare .bds_sqq {
background-image: url(../images/newsdetailBqqico.png);
/* {"title": "新闻详情A企鹅分享背景图","type":"image","name": "@imgnewsdetailAshareqq","value": "url(../images/newsdetailBqqico.png)"}*/
}
.full-newsdetailB-container .newsdetailB-ctrl .page-ctrl {
margin-bottom: 10px;
}
.full-newsdetailB-container .newsdetailB-ctrl .page-ctrl a {
display: block;
font-size: 14px;
line-height: 30px;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
color: #666666;
/* {"title": "新闻详细B上下页文本色","type":"color","name": "@clnewsdetailBpage","value": "#666666"}*/
}
.full-newsdetailB-container .newsdetailB-ctrl .return {
display: block;
width: 120px;
height: 40px;
margin: 0 auto;
text-align: center;
font-size: 16px;
line-height: 40px;
color: #ffffff;
/* {"title": "新闻详细B返回文本色","type":"color","name": "@clnewsdetailBreturn","value": "#ffffff"}*/
background-color: #de0012;
/* {"title": "新闻详细B返回背景色","type":"color","name": "@bgcnewsdetailBreturn","value": "#de0012"}*/
}
@media (min-width: 768px) {
.full-newsB-container .newsB-list ul {
margin: 0 -10px;
}
.full-newsB-container .newsB-list li {
width: 50%;
padding: 0 10px;
margin-bottom: 20px;
}
}
@media (min-width: 1024px) {
.full-newsdetailB-container {
padding: 75px 0 78px;
/* {"title": "栏目全局内填充","type":"text","name": "@pdgnewsdetailBcol","value": "75px 0 78px"}*/
}
.full-newsdetailB-container .article-tilte {
font-size: 24px;
/* {"title": "新闻详细B标题字号","type":"text","name": "@fznewsdetailBtilte","value": "24px"}*/
margin: 0 0 18px;
/* {"title": "新闻详细B标题下外间距","type":"text","name": "@mgnewsdetailBtilte","value": "0 0 18px"}*/
line-height: 32px;
}
.full-newsdetailB-container .date {
margin: 0 0 40px;
/* {"title": "新闻详细B日期下外间距","type":"text","name": "@mgnewsdetailBdate","value": "0 0 40px"}*/
font-size: 24px;
}
.full-newsdetailB-container .newsdetailB-article {
padding: 72px 0 55px;
margin-bottom: 42px;
}
.full-newsdetailB-container .single-page {
padding: 0 100px;
}
.full-newsdetailB-container .newsdetailB-bdshare {
position: absolute;
right: auto;
left: 0;
top: 76px;
z-index: 50;
}
.full-newsdetailB-container .newsdetailB-bdshare.js-fixed-top {
position: fixed;
left: 40px;
}
.full-newsdetailB-container .newsdetailB-bdshare.js-absolute-bottom {
position: absolute;
left: 0;
top: auto;
bottom: 55px;
}
.full-newsdetailB-container .newsdetailB-bdshare a {
float: none;
width: 72px;
height: 72px;
margin: 0 0 1px 0;
-webkit-transition: all ease .3s;
-o-transition: all ease .3s;
-moz-transition: all ease .3s;
transition: all ease .3s;
}
.full-newsdetailB-container .newsdetailB-bdshare .bds_weixin:hover {
background-image: url(../images/newsdetailBwxicoac.jpg);
/* {"title": "新闻详情A微信分享背景图","type":"image","name": "@imgnewsdetailAsharewx","value": "url(../images/newsdetailBwxicoac.jpg)"}*/
}
.full-newsdetailB-container .newsdetailB-bdshare .bds_tsina:hover {
background-image: url(../images/newsdetailBsnicoac.jpg);
/* {"title": "新闻详情A新浪分享背景图","type":"image","name": "@imgnewsdetailAsharesn","value": "url(../images/newsdetailBsnicoac.jpg)"}*/
}
.full-newsdetailB-container .newsdetailB-bdshare .bds_sqq:hover {
background-image: url(../images/newsdetailBqqicoac.jpg);
/* {"title": "新闻详情A企鹅分享背景图","type":"image","name": "@imgnewsdetailAshareqq","value": "url(../images/newsdetailBqqicoac.jpg)"}*/
}
.full-newsdetailB-container .newsdetailB-ctrl {
position: relative;
padding-right: 200px;
}
.full-newsdetailB-container .newsdetailB-ctrl .page-ctrl {
margin-bottom: 0;
}
.full-newsdetailB-container .newsdetailB-ctrl .page-ctrl a:hover {
color: #de0012;
/* {"title": "新闻详细B上下页文本色","type":"color","name": "@clnewsdetailBpage","value": "#de0012"}*/
}
.full-newsdetailB-container .newsdetailB-ctrl .return {
position: absolute;
right: 0;
top: 5px;
z-index: 3;
width: 145px;
height: 50px;
line-height: 50px;
}
}
@media (min-width: 1260px) {
.full-newsdetailB-container .single-page {
max-width: 840px;
padding: 0;
margin: 0 auto;
}
.full-newsdetailB-container .newsdetailB-bdshare.js-fixed-top {
position: fixed;
left: 50%;
margin-left: -590px;
}
.full-newsdetailB-container .newsdetailB-bdshare.js-absolute-bottom {
position: absolute;
left: 0;
top: auto;
margin-left: 0;
}
}
#page{
text-align:center;
}
#page .laypageskin_molv a,#page .laypageskin_molv span{
width:36px;
height:36px;
padding:0;
margin:0 2px 10px 3px;
border:1px solid #d8d8d8;
display:inline-block;
background-color:#fff;
line-height:34px;
text-align:center;
vertical-align:middle;
font-size:14px;
border-radius:0;
}
#page .laypageskin_molv a span{
margin: 0;
vertical-align: text-bottom;
border: none;
background: none;
}
#page .laypageskin_molv a img{
display:inline-block;
vertical-align:middle;
}
#page .laypageskin_molv .laypage_curr{
color:#fff;
background-color:#bf0000 !important;
border-color:#bf0000;
}
/*20190911*/
.tc { text-align: center; }
.inlink { display: inline-block; }
.wqp-tabnav { position: relative; overflow: hidden; margin-bottom:30px; }
.wqp-tabnav ul { text-align: center; }
.wqp-tabnav ul li { padding: 0 5px; font-size: 0; width: auto; }
.wqp-tabnav ul li a { font-size: 14px; line-height: 24px; display: block; -webkit-border-radius: 4px; border-radius: 4px; border: solid 1px #dfdfdf; background-color: #f6f6f6; padding: 6px 12px; -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; }
.wqp-tabnav ul li:hover a, .wqp-tabnav ul li.cur a { background-color: #bf0000; color: #fff; border-color: #bf0000; }
.video-wrap { margin: 30px 0; position: relative; overflow: hidden; }
.video-wrap.nomargin{margin-top:0;}
.video-wrap img { max-width: 100%; display: block; -webkit-border-radius: 10px; border-radius: 10px; }
.wqp-videobtn { display: block; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 55px; height: 55px; background: url(../images/videobtn.png) 0 0 no-repeat; -o-background-size: cover; background-size: cover; cursor: pointer; }
.Improvement { background-color: #f7f7f7; padding: 30px 0; color: #666666; line-height: 26px; }
.Improvement img { max-width: 100%; }
.improve-title { color: #333333; font-size: 20px; text-align: center; margin-bottom: 10px; }
.improve-title:after { content: ""; width: 30px; height: 2px; background-color: #bf0000; margin-top: 20px; display: block; margin: 15px auto 0; }
.pt40 { padding-top: 20px; }
.m-position { position: relative; }
.related-courses { padding-top: 30px; padding-bottom: 0; }
.related-swiper { position: relative; overflow: hidden; padding-bottom: 10px; padding-top: 20px; }
.related-swiper ul li { float: left; width: 33.333%; }
.related-swiper ul li a { display: block; color: #212121; }
.related-swiper ul li a .zoomimg { position: relative; overflow: hidden; }
.related-swiper ul li a .zoomimg:before { content: ""; display: block; padding-bottom: 79.45205%; }
.related-swiper ul li a .zoomimg img { position: absolute; top: 0; left: 0; width: 100%; }
.related-swiper ul li h3 { font-size: 16px; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; height: 36px; line-height: 36px; margin: 14px 0 8px; }
.related-swiper ul li .courses-dec { color: #666666; display: -webkit-box; height: 52px; line-height: 26px; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.m-btn { position: absolute; cursor: pointer; }
.m-btn { position: absolute; top: 42%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); width: 50px; height: 50px; left: -70px; cursor: pointer; z-index: 2; }
.m-btn:after { content: ""; position: absolute; width: 30px; height: 30px; border-left: 2px solid #bf0000; border-bottom: 2px solid #bf0000; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: 10px; left: 18px; }
.m-btn.m-right { right: -70px; left: auto; }
.m-btn.m-right:after { left: 3px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); }
.inner-dot { text-align: center; }
.inner-dot span { background: #f6f6f6; margin: 0 4px; width: 10px; height: 10px; opacity: 1; }
.inner-dot span.swiper-pagination-bullet-active { background: #bf0000; }
.return-btn { text-align: center; }
.return-btn a { display: inline-block; color: #ffffff; font-size: 16px; background: #bf0000; padding: 8px 40px; -webkit-border-radius: 8px; border-radius: 8px; }
.pc-hidden { display: block; }
.mob-hidden { display: none; }
.taboverflow {
overflow:hidden;}
@media (min-width: 1024px) { .pc-hidden { display: none; }
.mob-hidden { display: block; }
.wqp-tabnav{margin-bottom:55px;}
.wqp-tabnav ul li { padding: 0 5px; }
.wqp-tabnav ul li a { font-size: 18px; line-height: 24px; padding: 17px 30px; }
.video-wrap { margin: 57px 0 75px; overflow: hidden; }
.video-wrap:hover img { -webkit-transform: scale(1.03, 1.03); -moz-transform: scale(1.03, 1.03); -ms-transform: scale(1.03, 1.03); -o-transform: scale(1.03, 1.03); transform: scale(1.03, 1.03); }
.video-wrap img { -webkit-transition: transform ease 0.7s; -moz-transition: transform ease 0.7s; -o-transition: transform ease 0.7s; -webkit-transition: -webkit-transform ease 0.7s; transition: -webkit-transform ease 0.7s; -o-transition: -o-transform ease 0.7s; -moz-transition: transform ease 0.7s, -moz-transform ease 0.7s; transition: transform ease 0.7s; transition: transform ease 0.7s, -webkit-transform ease 0.7s, -moz-transform ease 0.7s, -o-transform ease 0.7s; }
.wqp-videobtn { width: 115px; height: 115px; }
.Improvement { padding: 78px 0 135px; font-size: 16px; line-height: 36px; }
.Improvement img { max-width: 100%; }
.improve-title { font-size: 30px; margin-bottom: 20px; }
.improve-title:after { margin: 20px auto 0; }
.pt40 { padding-top: 40px; }
.related-courses { padding-top: 70px; padding-bottom: 20px; }
.related-swiper ul li { margin-right: 43px; }
.related-swiper ul li a { overflow: hidden; }
.related-swiper ul li a:hover img { -webkit-transform: scale(1.03, 1.03); -moz-transform: scale(1.03, 1.03); -ms-transform: scale(1.03, 1.03); -o-transform: scale(1.03, 1.03); transform: scale(1.03, 1.03); }
.related-swiper ul li a img { -webkit-transition: transform ease 0.7s; -moz-transition: transform ease 0.7s; -o-transition: transform ease 0.7s; -webkit-transition: -webkit-transform ease 0.7s; transition: -webkit-transform ease 0.7s; -o-transition: -o-transform ease 0.7s; -moz-transition: transform ease 0.7s, -moz-transform ease 0.7s; transition: transform ease 0.7s; transition: transform ease 0.7s, -webkit-transform ease 0.7s, -moz-transform ease 0.7s, -o-transform ease 0.7s; }
.related-swiper ul li a:hover h3 { color: #bf0000; }
.related-swiper ul li h3 { margin-top: 20px; font-size: 20px; }
.related-swiper ul li .courses-dec { font-size: 16px; height: 72px; line-height: 36px; }
.m-btn { left: -40px; }
.m-btn.m-right { right: -40px; }
.return-btn a { font-size: 22px; padding: 13px 55px; } }
@media (min-width: 1280px) { .m-btn { left: -70px; }
.m-btn.m-right { right: -70px; }
.wqp-tabnav ul li a { padding: 17px 50px; min-width: 212px; } }
/*视频播放*/
.recruitmentfloat { display: none; z-index: 110; width: 100%; position: fixed; height: 100%; background: rgba(0, 0, 0, 0.6); left: 0px; top: 0px; }
.tianjiatvwrap { width: 95%; margin: 0 auto; position: absolute; top: 50%; left: 2.5%; margin-top: -125px; }
.tianjiatvwrap .videobox { height: 250px; position: relative; z-index: 1; }
.recclosebtn { display: block; width: 25px; height: 25px; position: absolute; right: 15px; top: -5px; cursor: pointer; z-index: 100; margin: -20px -20px 0 0; z-index: 9; }
.recclosebtn:before { content: ""; position: absolute; top: 10px; width: 20px; height: 2px; background-color: #fff; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
.recclosebtn:after { content: ""; position: absolute; top: 10px; width: 20px; height: 2px; background-color: #fff; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
@media (min-width: 768px) { .tianjiatvwrap { width: 660px; left: 50%; margin-left: -330px; margin-top: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }
.tianjiatvwrap .videobox { height: 400px; } }
@media (min-width: 1024px) { .tianjiatvwrap { width: 700px; margin-left: -350px; }
.tianjiatvwrap .videobox { height: 400px; } }
@media (min-width: 1260px) { .tianjiatvwrap { width: 1000px; margin-left: -500px; }
.tianjiatvwrap .videobox { height: 600px; } }
@media (max-width: 48.0625rem){
.foot-nav li.ewm{ float:left; width:50%; text-align:center;border-bottom:none; margin-top:20px;}
.foot-nav li.ewm .box{ width:70%;}
.foot-nav li.ewm .box img{ width:100%;}
.foot-nav h1{ font-size: 1.1rem; color:#fff; text-align:center;}
}