@charset "UTF-8";
/*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license - http://opensource.org/licenses/MIT
Copyright (c) 2014 Daniel Eden
*/
.animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.animated.infinite {
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.animated.hinge {
-webkit-animation-duration: 2s;
animation-duration: 2s;
}
@-webkit-keyframes bounce {
0%, 20%, 53%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
40%, 43% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-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%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
40%, 43% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0,-4px,0);
transform: translate3d(0,-4px,0);
}
}
.bounce {
-webkit-animation-name: bounce;
animation-name: bounce;
-webkit-transform-origin: center bottom;
-ms-transform-origin: center bottom;
transform-origin: center bottom;
}
@-webkit-keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
.flash {
-webkit-animation-name: flash;
animation-name: flash;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes pulse {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.pulse {
-webkit-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes rubberBand {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 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(.95, 1.05, 1);
transform: scale3d(.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, .95, 1);
transform: scale3d(1.05, .95, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes rubberBand {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 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(.95, 1.05, 1);
transform: scale3d(.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, .95, 1);
transform: scale3d(1.05, .95, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.rubberBand {
-webkit-animation-name: rubberBand;
animation-name: rubberBand;
}
@-webkit-keyframes shake {
0%, 100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 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%, 100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 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);
}
}
.shake {
-webkit-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
.swing {
-webkit-transform-origin: top center;
-ms-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%, 20% {
-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes tada {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%, 20% {
-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.tada {
-webkit-animation-name: tada;
animation-name: tada;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
0% {
-webkit-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes wobble {
0% {
-webkit-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.wobble {
-webkit-animation-name: wobble;
animation-name: wobble;
}
@-webkit-keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .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(.97, .97, .97);
transform: scale3d(.97, .97, .97);
}
100% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .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(.97, .97, .97);
transform: scale3d(.97, .97, .97);
}
100% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.bounceIn {
-webkit-animation-name: bounceIn;
animation-name: bounceIn;
-webkit-animation-duration: .75s;
animation-duration: .75s;
}
@-webkit-keyframes bounceInDown {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
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);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes bounceInDown {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
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);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
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);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes bounceInLeft {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
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);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
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);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes bounceInRight {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
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);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
animation-name: bounceInRight;
}
@-webkit-keyframes bounceInUp {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
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);
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInUp {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
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);
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
animation-name: bounceInUp;
}
@-webkit-keyframes bounceOut {
20% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
}
@keyframes bounceOut {
20% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
}
.bounceOut {
-webkit-animation-name: bounceOut;
animation-name: bounceOut;
-webkit-animation-duration: .75s;
animation-duration: .75s;
}
@-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);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@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);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.bounceOutRight {
-webkit-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);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@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);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
animation-name: bounceOutUp;
}
@-webkit-keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
.fadeOut {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOutDown {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes fadeOutDown {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutDownBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes fadeOutDownBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRight {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes fadeOutRight {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutRightBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes fadeOutRightBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig;
}
@-webkit-keyframes fadeOutUp {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes fadeOutUp {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutUpBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes fadeOutUpBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig;
}
@-webkit-keyframes flip {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(.95, .95, .95);
transform: perspective(400px) scale3d(.95, .95, .95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@keyframes flip {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(.95, .95, .95);
transform: perspective(400px) scale3d(.95, .95, .95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
.animated.flip {
-webkit-backface-visibility: visible;
backface-visibility: visible;
-webkit-animation-name: flip;
animation-name: flip;
}
@-webkit-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInX;
animation-name: flipInX;
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInY;
animation-name: flipInY;
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-animation-duration: .75s;
animation-duration: .75s;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
}
@-webkit-keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
.flipOutY {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipOutY;
animation-name: flipOutY;
-webkit-animation-duration: .75s;
animation-duration: .75s;
}
@-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);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
opacity: 1;
}
100% {
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@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);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
opacity: 1;
}
100% {
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
0% {
opacity: 1;
}
100% {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
@keyframes lightSpeedOut {
0% {
opacity: 1;
}
100% {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
@-webkit-keyframes rotateIn {
0% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateIn {
0% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateOut {
0% {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
@keyframes rotateOut {
0% {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
animation-name: rotateOut;
}
@-webkit-keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
@keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight;
}
@-webkit-keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
@keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight;
}
@-webkit-keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%, 80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 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;
}
100% {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%, 80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 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;
}
100% {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
.hinge {
-webkit-animation-name: hinge;
animation-name: hinge;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.rollIn {
-webkit-animation-name: rollIn;
animation-name: rollIn;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
@keyframes rollOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
.rollOut {
-webkit-animation-name: rollOut;
animation-name: rollOut;
}
@-webkit-keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
50% {
opacity: 1;
}
}
@keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
50% {
opacity: 1;
}
}
.zoomIn {
-webkit-animation-name: zoomIn;
animation-name: zoomIn;
}
@-webkit-keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomInDown {
-webkit-animation-name: zoomInDown;
animation-name: zoomInDown;
}
@-webkit-keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomInLeft {
-webkit-animation-name: zoomInLeft;
animation-name: zoomInLeft;
}
@-webkit-keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomInRight {
-webkit-animation-name: zoomInRight;
animation-name: zoomInRight;
}
@-webkit-keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomInUp {
-webkit-animation-name: zoomInUp;
animation-name: zoomInUp;
}
@-webkit-keyframes zoomOut {
0% {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
100% {
opacity: 0;
}
}
@keyframes zoomOut {
0% {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
100% {
opacity: 0;
}
}
.zoomOut {
-webkit-animation-name: zoomOut;
animation-name: zoomOut;
}
@-webkit-keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
transform: scale3d(.1, .1, .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.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
transform: scale3d(.1, .1, .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.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomOutDown {
-webkit-animation-name: zoomOutDown;
animation-name: zoomOutDown;
}
@-webkit-keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
transform: scale(.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
@keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
transform: scale(.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
.zoomOutLeft {
-webkit-animation-name: zoomOutLeft;
animation-name: zoomOutLeft;
}
@-webkit-keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(.1) translate3d(2000px, 0, 0);
transform: scale(.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
@keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(.1) translate3d(2000px, 0, 0);
transform: scale(.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
.zoomOutRight {
-webkit-animation-name: zoomOutRight;
animation-name: zoomOutRight;
}
@-webkit-keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
transform: scale3d(.1, .1, .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.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
transform: scale3d(.1, .1, .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.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomOutUp {
-webkit-animation-name: zoomOutUp;
animation-name: zoomOutUp;
}
@-webkit-keyframes slideInDown {
0% {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slideInDown {
0% {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
.slideInDown {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
@-webkit-keyframes slideInLeft {
0% {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInLeft {
0% {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
.slideInLeft {
-webkit-animation-name: slideInLeft;
animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
0% {
-webkit-transform: translateX(100%);
transform: translateX(100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInRight {
0% {
-webkit-transform: translateX(100%);
transform: translateX(100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
}
@-webkit-keyframes slideInUp {
0% {
-webkit-transform: translateY(100%);
transform: translateY(100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slideInUp {
0% {
-webkit-transform: translateY(100%);
transform: translateY(100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
.slideInUp {
-webkit-animation-name: slideInUp;
animation-name: slideInUp;
}
@-webkit-keyframes slideOutDown {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
visibility: hidden;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@keyframes slideOutDown {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
visibility: hidden;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
.slideOutDown {
-webkit-animation-name: slideOutDown;
animation-name: slideOutDown;
}
@-webkit-keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
visibility: hidden;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
visibility: hidden;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
.slideOutLeft {
-webkit-animation-name: slideOutLeft;
animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
visibility: hidden;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
visibility: hidden;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
.slideOutRight {
-webkit-animation-name: slideOutRight;
animation-name: slideOutRight;
}
@-webkit-keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
visibility: hidden;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
visibility: hidden;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
.slideOutUp {
-webkit-animation-name: slideOutUp;
animation-name: slideOutUp;
}
/**
* Swiper 3.3.1
* Most modern mobile touch slider and framework with hardware accelerated transitions
*
* http://www.idangero.us/swiper/
*
* Copyright 2016, Vladimir Kharlampidi
* The iDangero.us
* http://www.idangero.us/
*
* Licensed under MIT
*
* Released on: February 7, 2016
*/
.swiper-container {
margin: 0 auto;
position: relative;
z-index: 1;
overflow: hidden;
}
.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;
-ms-transition-property: -ms-transform;
transition-property: 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;
-ms-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;
flex-shrink: 0;
width: 100% !important;
height: 100% !important;
position: relative
}
.swiper-slide img{
width: 100%;
}
.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;
align-items: flex-start;
-webkit-transition-property: -webkit-transform, height;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform, height
}
.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: 40px;
height: 40px;
margin-top: -22px;
z-index: 10;
cursor: pointer;
-moz-background-size: 27px 44px;
-webkit-background-size: 27px 44px;
background-size: 40px 40px;
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-button-prev,
.swiper-container-rtl .swiper-button-next {
/* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");*/
background-image: url(../images/left.png);
left: 0px;
right: auto
}
.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
/* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")*/
background-image: url(../images/left.png);
}
.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
/* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");*/
background-image:url(../images/right.png);
right: 0px;
left: auto
}
.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
/* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")*/
}
.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
/* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")*/
}
.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);
transform: translate3d(0, 0, 0);
z-index: 10;
position: absolute;
width: 100%;
bottom: -70px;
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0
}
.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom:30px;
left:50px;
width: 100%;
position: absolute;
}
.swiper-pagination-bullet {
width:12px;
height:12px;
display: inline-block;
background:#999999;
opacity: .5;
border-radius:50% ;
margin-right: 15px;
}
button.swiper-pagination-bullet {
border: none;
margin: 0;
padding: 0;
box-shadow: none;
-moz-appearance: none;
-ms-appearance: none;
-webkit-appearance: none;
appearance: none
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer
}
.swiper-pagination-white .swiper-pagination-bullet {
background: #fff
}
.swiper-pagination-bullet-active {
opacity: 1;
background: #545454;
}
.swiper-pagination-white .swiper-pagination-bullet-active {
background: #013dff;
}
.swiper-pagination-black .swiper-pagination-bullet-active {
background: #000;
}
.swiper-container-vertical>.swiper-pagination-bullets {
right: 10px;
top: 50%;
-webkit-transform: translate3d(0, -50%, 0);
-moz-transform: translate3d(0, -50%, 0);
-o-transform: translate(0, -50%);
-ms-transform: translate3d(0, -50%, 0);
transform: translate3d(0, -50%, 0)
}
.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 5px 0;
display: block
}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 5px
}
.swiper-pagination-progress {
background: rgba(0, 0, 0, .25);
position: absolute
}
.swiper-pagination-progress .swiper-pagination-progressbar {
background: #007aff;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
-webkit-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
-webkit-transform-origin: left top;
-moz-transform-origin: left top;
-ms-transform-origin: left top;
-o-transform-origin: left top;
transform-origin: left top
}
.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
-webkit-transform-origin: right top;
-moz-transform-origin: right top;
-ms-transform-origin: right top;
-o-transform-origin: right top;
transform-origin: right top
}
.swiper-container-horizontal>.swiper-pagination-progress {
width: 100%;
height: 4px;
left: 0;
top: 0
}
.swiper-container-vertical>.swiper-pagination-progress {
width: 4px;
height: 100%;
left: 0;
top: 0
}
.swiper-pagination-progress.swiper-pagination-white {
background: rgba(255, 255, 255, .5)
}
.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
background: #fff
}
.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
background: #000
}
.swiper-container-3d {
-webkit-perspective: 1200px;
-moz-perspective: 1200px;
-o-perspective: 1200px;
perspective: 1200px
}
.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d
}
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10
}
.swiper-container-3d .swiper-slide-shadow-left {
background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-3d .swiper-slide-shadow-right {
background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-3d .swiper-slide-shadow-top {
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-3d .swiper-slide-shadow-bottom {
background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-coverflow .swiper-wrapper,
.swiper-container-flip .swiper-wrapper {
-ms-perspective: 1200px
}
.swiper-container-cube,
.swiper-container-flip {
overflow: visible
}
.swiper-container-cube .swiper-slide,
.swiper-container-flip .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1
}
.swiper-container-cube .swiper-slide .swiper-slide,
.swiper-container-flip .swiper-slide .swiper-slide {
pointer-events: none
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active,
.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
pointer-events: auto
}
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-top {
z-index: 0;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden
}
.swiper-container-cube .swiper-slide {
visibility: hidden;
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
width: 100%;
height: 100%
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
-webkit-transform-origin: 100% 0;
-moz-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
transform-origin: 100% 0
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-next+.swiper-slide,
.swiper-container-cube .swiper-slide-prev {
pointer-events: auto;
visibility: visible
}
.swiper-container-cube .swiper-cube-shadow {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
background: #000;
opacity: .6;
-webkit-filter: blur(50px);
filter: blur(50px);
z-index: 0
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-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-scrollbar {
border-radius: 10px;
position: relative;
-ms-touch-action: none;
background: rgba(0, 0, 0, .1)
}
.swiper-container-horizontal>.swiper-scrollbar {
position: absolute;
left: 1%;
bottom: 3px;
z-index: 50;
height: 5px;
width: 98%
}
.swiper-container-vertical>.swiper-scrollbar {
position: absolute;
right: 3px;
top: 1%;
z-index: 50;
width: 5px;
height: 98%
}
.swiper-scrollbar-drag {
height: 100%;
width: 100%;
position: relative;
background: rgba(0, 0, 0, .5);
border-radius: 10px;
left: 0;
top: 0
}
.swiper-scrollbar-cursor-drag {
cursor: move
}
.swiper-lazy-preloader {
width: 42px;
height: 42px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -21px;
margin-top: -21px;
z-index: 10;
-webkit-transform-origin: 50%;
-moz-transform-origin: 50%;
transform-origin: 50%;
-webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
-moz-animation: swiper-preloader-spin 1s steps(12, end) infinite;
animation: swiper-preloader-spin 1s steps(12, end) infinite
}
.swiper-lazy-preloader:after {
display: block;
content: "";
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-position: 50%;
-webkit-background-size: 100%;
background-size: 100%;
background-repeat: no-repeat
}
.swiper-lazy-preloader-white:after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
}
@-webkit-keyframes swiper-preloader-spin {
100% {
-webkit-transform: rotate(360deg)
}
}
@keyframes swiper-preloader-spin {
100% {
transform: rotate(360deg)
}
}
@charset "utf-8";
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
body {
margin: 0px;
padding: 0px;
font-family: "微软雅黑";
-webkit-text-size-adjust: none;
background: #fff;
}
html{
font-size: 15px;
}
ul,
h1,
h2,
h3,
li,
p{
margin: 0px;
padding: 0px;
list-style-type: none;
font-weight: normal;
}
a {
text-decoration: none !important;
blr: expression(this.onFocus=this.blur());
outline: none;
}
a:focus {
outline: none;
-moz-outline-style: none;
-moz-outline: none;
}
a:hover {
text-decoration: none;
}
input[type="button"], input[type="submit"], input[type="reset"] {
-webkit-appearance: none;
}
.clear {
clear: both;
overflow: hidden;
}
.clearpadding {
padding: 0 !important;
}
#clearbg {
background: none !important;
}
input,
textarea {
outline: none;
background-color: transparent;
resize: none;
appearance: none;
-webkit-appearance: none;
border-radius:0;
}
.fl{
float: left;
}
.fr{
float: right;
}
.pt10{
padding-top: 10px;
}
.pt20{
padding-top: 20px;
}
.pt30{
padding-top: 30px;
}
.pt40{
padding-top: 40px;
}
.pt50{
padding-top: 50px;
}
.pt60{
padding-top: 60px;
}
.pt70{
padding-top: 70px;
}
.pt80{
padding-top: 80px;
}
.pt90{
padding-top: 90px;
}
.pt100{
padding-top: 100px;
}
.pl10{
padding-left: 10px;
}
.pl20{
padding-left: 20px;
}
.pl30{
padding-left: 30px;
}
.pl40{
padding-left: 40px;
}
.pl50{
padding-left: 50px;
}
.pl60{
padding-left: 60px;
}
.pl70{
padding-left: 70px;
}
.pl80{
padding-left: 80px;
}
.pl90{
padding-left: 90px;
}
.pl100{
padding-left: 100px;
}
.pr10{
padding-right: 10px;
}
.pr20{
padding-right: 20px;
}
.pr30{
padding-right: 30px;
}
.pr40{
padding-right: 40px;
}
.pr50{
padding-right: 50px;
}
.pr60{
padding-right: 60px;
}
.pr70{
padding-right: 70px;
}
.pr80{
padding-right: 80px;
}
.pr90{
padding-right: 90px;
}
.pr100{
padding-right: 100px;
}
.pb10{
padding-bottom: 10px;
}
.pb20{
padding-bottom: 20px;
}
.pb30{
padding-bottom: 30px;
}
.pb40{
padding-bottom: 40px;
}
.pb50{
padding-bottom: 50px;
}
.pb60{
padding-bottom: 60px;
}
.pb70{
padding-bottom: 70px;
}
.pb80{
padding-bottom: 80px;
}
.pb90{
padding-bottom: 90px;
}
.pb100{
padding-bottom: 100px;
}
.mt10{
margin-top: 10px !important;
}
.mt20{
margin-top: 20px !important;
}
.mt30{
margin-top: 30px !important;
}
.mt40{
margin-top: 40px !important;
}
.mt50{
margin-top: 50px !important;
}
.mt60{
margin-top: 60px !important;
}
.mt70{
margin-top: 70px !important;
}
.mt80{
margin-top: 80px !important;
}
.mt90{
margin-top: 90px !important;
}
.mt100{
margin-top: 100px !important;
}
.mr10{
margin-right: 10px;
}
.mr20{
margin-right: 20px;
}
.mr30{
margin-right: 30px;
}
.mr40{
margin-right: 40px;
}
.mr50{
margin-right: 50px;
}
.mr60{
margin-right:60px;
}
.mr70{
margin-right: 70px;
}
.mr80{
margin-right: 80px;
}
.mr90{
margin-right: 90px;
}
.mr100{
margin-right: 100px;
}
.mb10{
margin-bottom: 10px;
}
.mb20{
margin-bottom: 20px;
}
.mb30{
margin-bottom: 30px;
}
.mb40{
margin-bottom: 40px;
}
.mb50{
margin-bottom: 50px;
}
.mb60{
margin-bottom: 60px;
}
.mb70{
margin-bottom: 70px;
}
.mb80{
margin-bottom: 80px;
}
.mb90{
margin-bottom: 90px;
}
.mb100{
margin-bottom: 100px;
}
.ml10{
margin-left: 10px;
}
.ml20{
margin-left: 20px;
}
.ml30{
margin-left: 30px;
}
.ml40{
margin-left: 40px;
}
.ml50{
margin-left: 50px;
}
.ml60{
margin-left: 60px;
}
.ml70{
margin-left: 70px;
}
.ml80{
margin-left: 80px;
}
.ml90{
margin-left: 90px;
}
.ml100{
margin-left: 100px;
}
.overhide{
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.more-overhide{
display: -webkit-box;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
overflow: hidden;
}
.header{
width: 100%;
background: #050505;
height: 150px;
}
.headerbox{
width: 1360px;
padding-top: 40px;
margin: 0 auto;
overflow: hidden;
}
.navcon_mobile{ display:none;}
.logo{
float: left;
}
.header-rt{
float: right;
}
.header .header-menu{
display:none;
}
.searchbox{
float: right;
padding-top: 10px;
margin-bottom: 10px;
}
.searchbox input{
background: #fff;
border: 0;
float: left;
height: 21px;
padding-left: 10px;
}
.searchbox input[type=submit]{
float: left;
height: 21px;
width: 20px;
border: 0;
cursor: pointer;
background:#d9d9d9 url(../images/search_btn.png) no-repeat center;
}
.searchbox button:hover{
background-color:#E60012;
transition: 0.6s all;
}
.language{
float: right;
}
.language ul li{
float: left;
color: #fff;
border-right: 2px solid #fff;
margin-right: 10px;
padding-right: 10px;
line-height: 14px;
font-size: 14px;
}
.language ul li:nth-child(3){
border: 0;
margin-right: 0;
padding-right: 0;
}
.language ul li a{
font-size: 14px;
color: #fff;
line-height: 14px;
display: block;
}
.language ul li a:hover{
color: #E60012;
transition: 0.5s all;
}
.nav{
box-shadow: 0 20px 0px #dcdcdc;
margin-bottom: 20px;
}
.navbox{
width: 1360px;
margin: 0 auto;
height: 85px;
}
.navbox ul li{
float: left;
color: #e60012;
margin-right: 40px;
}
.navbox ul li a{
font-size: 15px;
color: #050505;
line-height: 85px;
padding-bottom: 34px;
}
.navbox ul li a:hover,.navbox ul li.on a{
color: #e60012;
background: url(../images/navbg.png) no-repeat bottom;
}
.navtab{
background: #ebebe9;
height: 48px;
display: none;
}
.navtabbox{
width: 1360px;
margin: 0 auto;
position: relative;
}
.navcon{
position:absolute ;
top: 0;
z-index: 10;
display: none;
}
.navcon ul li{
float:left;
}
.navcon ul li a{
display: block;
color: #050505;
width: 232px;
padding-left: 30px;
height: 48px;
line-height: 48px;
font-size: 15px;
}
.navcon ul li a:hover,.navcon ul li.on a{
background: #acacac;
color: #FFFFFF;
transition: 0.3s all;
}
.banner{
box-shadow: 0 20px 0px #dcdcdc;
position: relative;
margin-bottom: 130px;
}
.banner-pro{
position: absolute;
top: 0;
z-index: 10;
overflow: hidden;
width: 100%;
display: none;
}
.banner-pro-li a{
display: block;
overflow: hidden;
}
.banner-pro-li-lt{
background:#acacac;
height: 380px;
width: 300px;
}
.banner-pro-li-lt img{
display: block;
margin: 0 auto;
margin-top: 80px;
}
.banner-pro-li-rt{
background: rgba(0,0,0,0.5);
height: 380px;
width: 300px;
padding-top: 90px;
}
.banner-pro-li-rt img{
display: block;
margin: 0 auto;
width: 100px;
}
.banner-pro-li-rt h3{
color: #fff;
font-size: 20px;
text-align: center;
margin-top: 20px;
margin-bottom: 10px;
}
.banner-pro-li-rt span{
color: #fff;
text-align: center;
display: block;
font-size: 10px;
}
.swiper-container img{
display: block;
}
.footer{
background: #050505;
height:150px;
overflow:hidden;
}
.footerbox{
width: 1360px;
margin: 0 auto;
overflow: hidden;
margin-top:18px;
margin-bottom:20px;
}
.footer-contact{
margin-right: 180px;
float: left;
line-height:170%;
}
.footer-contact h3,.footer-nav h3,.footer-wx h3{
color: #fff;
font-size: 14px;
background: url(../images/f_bg.png) no-repeat bottom left;
padding-bottom: 10px;
margin-bottom:10px;
}
.footer-contact-p{
color: #fff;
font-size: 12px;
}
.footer-nav {
width:300px;
}
.footer-nav ul li{ width:90px; float:left;}
.footer-nav ul li a{
color: #fff;
font-size: 12px;
line-height: 30px;
}
.footer-nav ul li a:hover{
color: #E60012;
transition: 0.6s all;
}
.footer-wx{ float:right;}
.footer-wx ul{
width:358px;
padding-top: 10px;
}
.footer-wx ul li{
color: #fff;
font-size: 12px;
line-height: 34px;
float:left;
width:50px;
}
.footer-wx ul li a img{
width: 20px;
}
.video{
margin-top: 5px;
position: relative;
}
.go_index{
display: block;
width: 100px;
position:absolute;
bottom:40px;
left: 50%;
transition: 0.8s all;
margin-left: -50px;
}
.go_index:hover{
bottom: 20px;
transition: 0.8s all;
}
.banner-con img{
width: 100%;
display: block;
}
.news{
box-shadow: 0 10px 20px #c5c5c5;
margin-bottom: 20px;
padding-bottom: 100px;
}
.newsbox{
width: 1360px;
margin: 0 auto;
}
.news-title {
border-bottom: 1px solid #cdcdcd;
padding-top: 78px;
}
.news-title h3{
text-align: center;
font-size: 40px;
padding-bottom: 40px;
}
.news-con ul{
overflow: hidden;
}
.news-con ul li{
width: 291px;
float: left;
margin-right: 44px;
}
.news-con ul li:nth-child(4n){
margin-right: 0;
}
.news-con ul li a{
display: block;
position: relative;
}
.news-con ul li a h3{
font-size: 16px;
position: absolute;
bottom: 0;
color: #fff;
background: rgba(0,0,0,0.4);
width: 100%;
padding: 10px 20px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.news-con-title{
position: relative;
}
.news-conbox span{
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
overflow: hidden;
height: 120px;
}
.news-con ul li{
margin-bottom:20px;
}
.news-con ul li span{
font-size:18px;
}
.news-con ul li a img{
display: block;
width: 100%;
}
.news-con ul{
width: 1300px;
margin: 0 auto;
padding-top: 30px;
}
.news-conbox{
position: relative;
}
.news-conbox span{
font-size: 12px;
color: #616161;
line-height: 24px;
text-indent: 30px;
}
.news-conbox font{
font-size: 10px;
background: #050505;
color: #fff;
position: absolute;
display: block;
bottom:4px;
right: 0;
text-align: center;
padding: 0 10px;
}
.news-conbox{
margin-top: 20px;
}
.btm_border{
border-bottom: 1px solid #cdcdcd;
padding-bottom: 50px;
}
.news-conbox span:hover{
color: #E60012;
transition: 0.5s all;
}
.news-conbox font:hover{
background: #E60012;
transition: 0.5s all;
}
.tech{
box-shadow: 0 10px 20px #c5c5c5;
padding: 80px 0;
overflow: hidden;
margin-bottom: 20px;
}
.techbox{
width: 1360px;
margin: 0 auto;
}
.brand{
padding: 100px 0 120px;
margin-bottom: 20px;
box-shadow: 0 10px 20px #c5c5c5;
}
.brandbox{
width: 1360px;
margin: 0 auto;
}
.brand-title{
overflow: hidden;
margin-bottom: 40px;
}
.brand-title h3{
text-align: center;
color: #050505;
font-size: 27px;
margin-bottom: 10px;
}
.brand-title span.brand-title-span{
display: block;
text-align: center;
margin-bottom: 20px;
color: #050505;
font-size: 29px;
font-weight: bold;
}
.brand-p{
text-align: center;
color: #898989;
line-height: 30px;
font-size: 14px;
}
.history_mobile{
display:none;
}
.qiyuan img{
display: block;
margin: 0 auto;
}
.product{
padding: 80px 0 100px;
margin-bottom: 20px;
box-shadow: 0 10px 20px #c5c5c5;
}
.productbox{
width: 1360px;
margin: 0 auto;
}
.product-title{
border-bottom: 1px solid #cdcdcd;
padding-bottom: 40px;
}
.product-title-img img{
margin: 0 auto;
width: 100%;
display: block;
}
.product-titlebox{
margin-top: 40px;
overflow: hidden;
}
.product-title-lt h3{
background: url(../images/line.png) no-repeat left bottom;
padding-bottom: 10px;
font-size: 25px;
color: #050505;
margin-bottom: 20px;
}
.product-title-lt span{
display: block;
font-size: 11px;
line-height: 24px;
color: #050505;
}
.product-title-lt{
width: 495px;
}
.product-title-rt{
margin-top: 15px;
}
.product-title-rt img:nth-child(1){
margin-right: 30px;
}
.product-con-li ul{
overflow: hidden;
padding-top: 70px;
padding-bottom: 30px;
}
.product-con-li ul li{
padding-bottom: 50px;
border-bottom: 1px solid #cdcdcd;
margin-bottom: 50px;
position: relative;
}
.product-con-li ul li a{
display: block;
}
.product-con-li ul li a img.pro-img{
display: block;
margin: 0 auto;
width: 100%;
}
.product-con-li ul li a .btn-view{
width: 82px;
height: 82px;
position: absolute;
top:50%;
left: 50%;
margin-left: -50px;
margin-top: -50px;
background: url(../images/bg_btn.png) no-repeat center;
background-size:100% 100%;
text-align: center;
padding-top: 25px;
color: #000000;
font-size: 15px;
transition: 0.5s all;
}
.product-con-li ul li a .btn-view:hover{
transition: 0.5s all;
color: #333333;
top: 52%;
}
.product-con-li ul li a span{
display: block;
width: 70%;
margin: 0 auto;
text-align: center;
background: #050505;
color: #fff;
padding: 8px 0;
font-size: 18px;
}
.product-con-li ul li a:hover span{
color: #E60012;
transition: 0.6s all;
}
.pro-viewbox{
width: 1360px;
margin: 0 auto;
}
.pro-view-nav{
margin-top: 20px;
overflow: hidden;
}
.pro-view-nav h3{
color: #cccccc;
font-size: 15px;
margin: 20px 0;
}
.pro-viewcon{
border: 1px solid #050505;
margin-top: 50px;
background: url(../images/bg.png) no-repeat center;
background-size:cover;
overflow: hidden;
margin-bottom:80px;
padding-bottom: 40px;
}
.pro-viewcon-lt{
padding-left: 100px;
padding-top: 50px;
}
.pro-viewcon-rt{
width: 533px;
padding-top: 130px;
margin-right: 70px;
}
.pro-viewcon-rt h3{
background: url(../images/line.png) no-repeat bottom left;
color: #050505;
font-size: 35px;
padding-bottom: 20px;
padding-left: 18px;
margin-bottom: 10px;
background-position-x:18px ;
}
.pro-viewcon-p{
background: url(../images/libg.png) no-repeat left top;
background-position-y:10px ;
padding-left: 18px;
line-height: 26px;
margin-bottom: 20px;
font-size: 17px;
}
.pro-view-img {
margin-bottom:80px;
}
.pro-view-img img{
width: 100%;
}
.boxbj{ background:rgba(0,0,0,.9); position:fixed; width:100%; height:100%; top:0; left:0; z-index:9999999999;}
.boxbj .box{ width:800px; height:500px; background:#000; border:solid #666 1px; position:fixed; left:50%; top:70%; margin:-400px 0 0 -400px; text-align:center; overflow:hidden;}
.boxbj .box_close{ color:#FFF; font-size:30px; text-align:right;position:absolute; top:50%; left:50%; margin-top:-300px; margin-left:380px;cursor:pointer;}
.inter-con a {
display: block;
position: relative;
z-index:9;
}
.inter-con a span{
display: block;
width: 80px;
margin:0 auto;
}
.inter-con a span>img{
display: block;
position: absolute;
top: 240px;
}
.content p{
background: url(../images/libg.png) no-repeat left top;
background-position-y:10px ;
padding-left: 18px;
line-height: 26px;
margin-bottom: 20px;
font-size: 17px;
}
.page{
text-align: center;
height: auto;
}
.page a.prev{
border: 1px solid #dcdcdc;
background: #fff;
color: #bfbfbf;
margin-right: 10px;
width: 97px;
height: 47px;
padding: 10px 14px;
line-height: 47px;
}
.page a.next{
border: 1px solid #dcdcdc;
background: #fff;
color: #313131;
width: 97px;
padding: 10px 14px;
}
.page a.next:hover{
color: #bfbfbf;
}
.pagebox{
display: inline-block;
margin-right: 10px;
}
.pagebox a{
color: #313131;
border: 1px solid #dcdcdc;
font-size: 16px;
padding:10px 14px;
margin:-3px;
}
.pagebox a:hover,.pagebox a.on{
background: #000;
color: #fff;
}
.contact {
margin-bottom: 20px;
box-shadow: 0 10px 20px #c5c5c5;
overflow: hidden;
padding-top: 125px;
padding-bottom: 98px;
}
.contactbox {
background: url(../images/conbg.png) no-repeat center;
width: 1360px;
margin: 0 auto;
background-size: 100% 100%;
height: 600px;
overflow: hidden;
border-bottom: 4px solid #03b9e1;
box-shadow: 0 10px 10px #626262;
}
.contact-lt {
margin-top: 200px;
margin-left: 200px;
border-right: 1px solid #828387;
width: 370px;
float: left;
}
.contact-ltbox {
color: #828387;
font-size: 16px;
line-height: 34px;
}
.contact-lticon {
margin-top: 20px;
}
.contact-lticon ul li {
float: left;
margin-right: 8px;
padding: 3px;
position: relative;
}
.contact-lticon ul li:hover a img.contact-icon {
border: 2px solid #a4a4a4;
}
.contact-lticon ul li a img.contact-icon {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
display: block;
border: 2px solid #808082;
border-radius: 2px;
width: 30px;
}
.contact-lticon ul li a img.contact-code{
position: absolute;
bottom: -110px;
left: -30px;
width: 100px;
display: none;
}
.contact-rt {
margin-top: 200px;
overflow: hidden;
float: right;
margin-right: 148px;
}
.contact-rt input.contact-txt {
display: block;
width: 512px;
border: 0;
border-radius: 5px;
background: url(../images/textbg.png) no-repeat center;
background-size: cover;
color: #fff;
padding: 10px;
margin-bottom: 5px;
font-family: 微软雅黑;
box-shadow: 5px 5px 5px #000 inset;
}
.contact-rt textarea {
display: block;
width: 512px;
height: 143px;
border-radius: 5px;
background: url(../images/textbg2.png) no-repeat center;
background-size: cover;
padding: 10px;
border: 0;
color: #fff;
font-family: 微软雅黑;
box-shadow: 5px 5px 5px #000 inset;
}
.contact-btn {
float: right;
margin-top: 10px;
border: 0;
border-radius: 5px;
background: linear-gradient(to bottom, #232323, #050505);
color: #fff;
padding: 8px 30px;
border: 1px solid #050505;
font-family: 微软雅黑;
cursor: pointer;
}
.contact-btn:hover {
color: #999;
transition: 0.8s all;
}
.pro_viewcon{
width: 1360px;
margin: 0 auto;
padding: 20px 0 100px;
overflow: hidden;
}
.pro_viewcon_title{
overflow: hidden;
width:1046px;
margin: 0 auto;
padding-bottom: 20px;
margin-bottom: 20px;
margin-top: 30px;
}
.pro_viewcon_title h3.pro_viewcon_title_h3{
text-align: center;
font-size: 28px;
/* border-bottom: 1px solid #ebebe9;*/
margin-bottom:30px;
padding-bottom: 30px;
}
.pro_viewcon_nav ul li{
float: left;
color: #d5d5d5;
}
.pro_viewcon_nav ul li a{
color: #d5d5d5;
}
.pro_viewconbox{
padding-bottom: 30px;
border-bottom: 1px solid #ebebe9;
}
.footer-wx ul li{
position: relative;
}
.footer-wx ul li{
position: relative;
}
.footer-code{
width: 100px;
display: block;
position: absolute;
left: 30px;
top: 0;
display: none;
}
.footer-wx ul li a img.footer-icon{
width: 20px;
}
.history{
width: 1125px;
margin: 0 auto;
background: url(../images/history_bg.png) no-repeat center;
height: 1536px;
}
h3.history-h3{
color: #939393;
display: block;
line-height: 30px;
}
span.history-span{
color: #939393;
font-weight: bold;
font-size: 30px;
display: block;
font-style:italic ;
margin-bottom: 15px;
}
.history-lt{
width: 520px;
position: absolute;
}
.history-rt{
position: absolute;
}
.historybox{
position: relative;
}
.brand-tech{
margin-top: 100px;
height: 766px;
margin-bottom: 60px;
}
.brand-techbox{
width: 1290px;
margin: 0 auto;
border-bottom: 60px solid #000000;
border-radius:4px ;
}
.brand-tech-lt ul li{
float: left;
margin-right: 20px;
position: relative;
}
.brand-tech-lt ul li a{
color: #fff;
border: 2px solid #363636;
padding:6px 14px;
border-radius:5px ;
background: linear-gradient(to bottom, #232323, #050505);
}
.brand-tech-lt ul li a img{
position: absolute;
top: -15px;
right: -8px;
display: none;
}
.brand-tech-lt ul li.on a img{
display: block;
}
.brand-tech-tab{
background: #000000;
padding: 24px 0;
height: 66px;
border-bottom: 1px solid #363636;
}
.brand-tech-tabbox{
width: 1188px;
margin: 0 auto;
}
.brand-tech-rt{
float: right;
position: relative;
margin-right:30px ;
}
.brand-tech-rt-h3{
background: url(../images/arr.png) no-repeat right;
color: #fff;
font-size: 14px;
padding-right:40px;
cursor: pointer;
}
.brand-tech-rtbox{
position: absolute;
top:30px;
right: -30px;
background: url(../images/sj_bg2.png) no-repeat center;
background-size:100% 100% ;
padding: 10px 15px 10px 15px;
display: none;
}
.brand-tech-rtbox li a{
margin: 0 auto;
border-bottom:1px solid #000000;
text-align: center;
display: block;
padding:6px 0;
color: #fff;
font-size: 12px;
border-top:1px solid #6c6c6c ;
}
.brand-tech-rtbox li:nth-child(1) a{
border-top:0 ;
}
.brand-tech-rtbox li:nth-child(4) a{
border-bottom:0 ;
}
.brand-tech-content{
background: #24252a;
height: 655px;
padding-top: 20px;
}
.brand-tech-content-lt{
width: 700px;
height: 360px;
}
.brand-tech-content-lt h3{
background:#212121 url(../images/icon1.png) no-repeat left;
padding-left: 60px;
color: #fff;
font-size: 17px;
width: 700px;
padding-top: 10px;
padding-bottom: 10px;
background-position-x:20px ;
border: 1px solid #000;
border-top-left-radius:5px ;
border-top-right-radius:5px ;
box-shadow: 0 0 2px #fff;
}
.brand-tech-contentbox{
width: 1188px;
margin: 0 auto;
}
.brand-tech-content-img{
background: url(../images/icon2.png) no-repeat center;
background-size:cover ;
padding: 10px 15px;
overflow: hidden;
border: 1px solid #000000;
box-shadow: 0 0 2px #999;
}
.brand-tech-content-opac{
padding-left: 8px;
margin-top: 6px;
overflow: hidden;
}
.brand-tech-content-opac ul li {
clear: both;
}
.brand-tech-content-opac ul li font{
display: block;
height: 22px;
width: 22px;
float: left;
background:url(../images/arr2.png) no-repeat left;
}
.brand-tech-content-opac ul li.on font{
display: block;
height: 22px;
width: 22px;
float: left;
background:url(../images/arr1.png) no-repeat left;
}
.brand-tech-content-opac ul li span{
display: block;
float: left;
color: #fff;
color: #00c6f1;
}
.brand-tech-content-imgbox{
width: 570px;
}
.brand-tech-content-imgbox img{
width: 100%;
}
.brand-tech-content-rt{
height: 360px;
}
.brand-tech-content-rt h3{
background:#000000 url(../images/icon4.png) no-repeat left;
padding-left: 60px;
color: #fff;
font-size: 17px;
width: 470px;
padding-top: 10px;
padding-bottom: 10px;
background-position-x:20px ;
border: 1px solid #000;
border-top-left-radius:5px ;
border-top-right-radius:5px ;
box-shadow: 0 0 2px #fff;
}
.brand-tech-content-select{
background:#000000 url(../images/icon6.png) no-repeat center;
height: 315px;
box-shadow: 0 0 1px #000;
background-size:100% 100% ;
border: 1px solid #000;
}
.brand-tech-content-selectbox{
width: 430px;
margin: 0 auto;
margin-top: 10px;
overflow: hidden;
}
.brand-tech-content-selectbox span.brand-tech-select-tt{
color: #fff;
}
.select11,.select22,.select33,.select44{
display: none;
}
.select1 .select11,.select2 .select22,.select3 .select33,.select4 .select44{
display: block;
}
.brand-tech-select-ttbox{
float: right;
margin-top: 10px;
}
.brand-tech-select-ttbox span{
float: left;
display: block;
color: #fff;
font-size: 13px;
border-right:1px solid #0a0a0a;
padding-right: 10px;
margin-right: 10px;
line-height: 14px;
}
.brand-tech-select-ttbox font{
float: left;
display: block;
color: #00c6f1;
line-height: 14px;
font-size: 13px;
}
.brand-tech-char{
margin-top: 16px;
width: 380px;
}
h3.brand-tech-char-h3{
background:#000000 url(../images/icon7.png) no-repeat left;
padding-left: 50px;
color: #fff;
font-size: 17px;
width: 380px;
padding-top: 10px;
padding-bottom: 10px;
background-position-x:20px ;
border: 1px solid #000;
border-top-left-radius:5px ;
border-top-right-radius:5px ;
box-shadow: 0 0 2px #fff;
}
.brand-tech-charcon{
height: 183px;
overflow-y:auto ;
background-size:cover ;
}
.brand-tech-charcon ul li:nth-child(2n+1){
color: #fff;
font-size: 13px;
background: url(../images/icon9.png) no-repeat left;
padding-left: 40px;
line-height: 30px;
}
.brand-tech-charcon ul li:nth-child(2n){
color: #fff;
font-size: 13px;
background: url(../images/icon10.png) no-repeat left;
padding-left: 40px;
line-height: 30px;
}
.brand-tech-charcon::-webkit-scrollbar
{
width: 5px;
height: 5px;
background-color: #e8e8e8;
}
/*定义滚动条轨道 内阴影+圆角*/
.brand-tech-charcon::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
background-color: #121418;
}
/*定义滑块 内阴影+圆角*/
.brand-tech-charcon::-webkit-scrollbar-thumb
{
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #e8e8e8;
}
h3.brand-tech-type-h3{
background:#000000 url(../images/icon8.png) no-repeat left;
padding-left: 50px;
color: #fff;
font-size: 17px;
width: 380px;
padding-top: 10px;
padding-bottom: 10px;
background-position-x:20px ;
border: 1px solid #000;
border-top-left-radius:5px ;
border-top-right-radius:5px ;
width: 790px;
box-shadow: 0 0 2px #fff;
}
.brand-tech-type{
width: 790px;
margin-top: 15px;
border: 1px solid #000000;
}
.brand-tech-type-table{
height: 183px;
width: 100%;
overflow-y:auto ;
}
.brand-tech-type-table table{
border-collapse:collapse ;
border: none;
}
.brand-tech-type-tablebox{
width: 100%;
}
.brand-tech-type-table::-webkit-scrollbar
{
width: 5px;
height: 5px;
background-color: #e8e8e8;
}
/*定义滚动条轨道 内阴影+圆角*/
.brand-tech-type-table::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
background-color: #121418;
}
/*定义滑块 内阴影+圆角*/
.brand-tech-type-table::-webkit-scrollbar-thumb
{
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #e8e8e8;
}
.brand-tech-type-tablebox thead tr{
background: url(../images/icon12.png) no-repeat left;
border: none;
background-size:100% 100% ;
border: 0;
}
.brand-tech-type-tablebox thead tr td{
width: 20%;
padding-left: 30px;
color: #fff;
line-height: 30px;
font-size: 13px;
}
.brand-tech-type-tablebox tbody tr:nth-child(2n){
background: url(../images/icon12.png) no-repeat left;
background-size:100% 100% ;
}
.brand-tech-type-tablebox tbody tr:nth-child(2n+1){
background: url(../images/icon13.png) no-repeat left;
background-size:100% 100% ;
}
.brand-tech-type-tablebox tbody tr td{
width: 20%;
padding-left: 30px;
color: #868d97;
font-size: 13px;
border: none;
line-height: 30px;
}
.brand-tech-content-opac ul li a{
display: block;
}
.tech_banner{
width: 560px;
}
@media screen and (max-width:1440px ) {
.headerbox{
width: 1200px;
}
.navbox{
width: 1200px;
}
.navtabbox{
width: 1200px;
}
.footerbox{
width: 1200px;
}
.banner-pro-li-lt img{
margin-top: 40px;
}
.productbox{
width: 1200px;
}
.techbox{
width: 1200px;
}
.techbox img{
width: 100%;
display: block;
margin: 0 auto;
}
.newsbox{
width: 1200px;
}
.contactbox{
width: 1200px;
}
.brandbox{
width: 1200px;
}
.contact-lt{
margin-left: 100px;
}
.contact-rt{
margin-right: 100px;
}
.content1{
margin-top: 50px;
margin-left: 200px;
margin-right: 200px;
line-height: 25px;
}
}
@media screen and (max-width:640px) {
.header{
height:auto;
padding-bottom:20px;
}
.headerbox{
width:92%;
margin:0 auto;
padding-top:20px;
}
.headerbox .header-rt{
float:inherit;
}
.header .header-menu{
display:block;
background:#FFFFFF;
width:40px;
height:40px;
float:right;
background:url(../images/menu.png) no-repeat center;
background-size: 80% 80%;
margin-top:20px;
}
.banner{
margin-bottom:90px;
}
.nav{
box-shadow:0 0 0 0;
display:none;
margin-bottom:0;
}
.navbox{
width:100%;
height:auto;
}
.navbox ul li{
float:inherit;
display:block;
text-align:center;
margin-right:0;
padding-top:10px;
padding-bottom:10px;
border-bottom:1px solid #CCCCCC;
}
.navbox ul li a {
font-size: 15px;
color: #050505;
line-height: 150%;
padding-bottom: 0;
}
.navbox ul li a:hover, .navbox ul li.on a {
background:none;
}
.navtab{
display:none;
}
.headerbox .language{
float:inherit;
}
.headerbox .language ul{
margin-top:5%;
}
.brand{
padding-top:30px;
}
.brandbox{
width:100%;
}
.history{
width:100%;
display:none;
}
.history_mobile{
width:100%;
display:block;
margin: 0 auto;
background: url(../images/history_bg.png) no-repeat center;
height: 1536px;
}
.history-lt{
width:41%;
margin-left:3%;
}
.history-lt img{
width:100%;
}
.history-rt{
width:41%;
margin-right:3%;
}
.history-rt img{
width:100%;
}
h3.history-h3{
font-size:18px;
line-height:120%;
}
.body_box{
margin-top: 0px !important;
}
.news{
padding-bottom:10px;
}
.news-title{
padding-top:20px;
}
.news-title h3{
padding-bottom:10px;
}
.newsbox{
width:100%;
}
.news-con ul{
width:96%;
margin:0 auto;
}
.news-con ul li{
width:100%;
float:none;
}
.news-conbox font{
display:none;
}
.news-conbox span{
height:auto;
}
.content{
padding:10px 0 !important;
}
.content1{
margin-left:2%;
margin-right:2%;
margin-top:20px;
}
.polarized_box .row5, .polarized_box .row6{
padding: 10px 0 !important;
}
.tech{
padding:20px 0;
}
.techbox{
width:100%;
}
.boxbj .box_close{
top:0;
right:0;
margin-top:0;
margin-left:0;
}
.boxbj .box{
width:100%;
left: 0;
margin:0;
top:10%;
}
.contact{
padding-top:30px;
padding-bottom:30px;
}
.contact-lt{
margin-top:50px;
width:96%;
margin-left:5%;
float:none;
}
.contact-rt{
width:90%;
margin-left:5%;
margin-top:0;
padding-top:30px;
float:none;
}
.contactbox{
width:100%;
}
.bd{
height:130px !important;
overflow:hidden;
}
.navcon_mobile{ display:block;}
.navcon_mobile ul li{ width:50%; text-align:center; height:40px; line-height:40px; float:left; border-bottom:1px solid #CCCCCC;border-right:1px solid #CCCCCC;}
.navcon_mobile ul li a{ color:#000000; font-size:18px;}
.navcon_mobile ul li.on a{ color:#ff0000; font-size:18px;}
.footer{
height:auto;
padding-top:20px;
}
.footerbox{
width:92%;
margin:0 auto;
}
.footer .footer-contact{
margin-right:0;
margin-bottom:20px;
}
.footer .footer-nav{
margin-right:0;
margin-bottom:20px;
}
.footer .footer-wx{
float:left;
}
}
.footer_link{ clear:both; color:#121212; font-size:10px;}
.footer_link a{color:#121212; font-size:10px;}
.mCustomScrollbar{-ms-touch-action:pinch-zoom;touch-action:pinch-zoom}.mCustomScrollbar.mCS_no_scrollbar,.mCustomScrollbar.mCS_touch_action{-ms-touch-action:auto;touch-action:auto}.mCustomScrollBox{position:relative;overflow:hidden;height:100%;max-width:100%;outline:0;direction:ltr}.mCSB_container{overflow:hidden;width:auto;height:auto}.mCSB_inside>.mCSB_container{margin-right:30px}.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{margin-right:0}.mCS-dir-rtl>.mCSB_inside>.mCSB_container{margin-right:0;margin-left:30px}.mCS-dir-rtl>.mCSB_inside>.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{margin-left:0}.mCSB_scrollTools{position:absolute;width:16px;height:auto;left:auto;top:0;right:0;bottom:0;opacity:.75;filter:"alpha(opacity=75)";-ms-filter:"alpha(opacity=75)"}.mCSB_outside+.mCSB_scrollTools{right:-26px}.mCS-dir-rtl>.mCSB_inside>.mCSB_scrollTools,.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools{right:auto;left:0}.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools{left:-26px}.mCSB_scrollTools .mCSB_draggerContainer{position:absolute;top:0;left:0;bottom:0;right:0;height:auto}.mCSB_scrollTools a+.mCSB_draggerContainer{margin:20px 0}.mCSB_scrollTools .mCSB_draggerRail{width:2px;height:100%;margin:0 auto;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}.mCSB_scrollTools .mCSB_dragger{cursor:pointer;width:100%;height:30px;z-index:1}.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{position:relative;width:4px;height:100%;margin:0 auto;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px;text-align:center}.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{width:12px}.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{width:8px}.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonUp{display:block;position:absolute;height:20px;width:100%;overflow:hidden;margin:0 auto;cursor:pointer}.mCSB_scrollTools .mCSB_buttonDown{bottom:0}.mCSB_horizontal.mCSB_inside>.mCSB_container{margin-right:0;margin-bottom:30px}.mCSB_horizontal.mCSB_outside>.mCSB_container{min-height:100%}.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{margin-bottom:0}.mCSB_scrollTools.mCSB_scrollTools_horizontal{width:auto;height:16px;top:auto;right:0;bottom:0;left:0}.mCustomScrollBox+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox+.mCSB_scrollTools.mCSB_scrollTools_horizontal{bottom:-26px}.mCSB_scrollTools.mCSB_scrollTools_horizontal a+.mCSB_draggerContainer{margin:0 20px}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:2px;margin:7px 0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{width:30px;height:100%;left:0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:4px;margin:6px auto}.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{height:12px;margin:2px auto}.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{height:8px;margin:4px 0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{display:block;position:absolute;width:20px;height:100%;overflow:hidden;margin:0 auto;cursor:pointer}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{left:0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{right:0}.mCSB_container_wrapper{position:absolute;height:auto;width:auto;overflow:hidden;top:0;left:0;right:0;bottom:0;margin-right:30px;margin-bottom:30px}.mCSB_container_wrapper>.mCSB_container{padding-right:30px;padding-bottom:30px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_vertical{bottom:20px}.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_horizontal{right:20px}.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden+.mCSB_scrollTools.mCSB_scrollTools_vertical{bottom:0}.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal{right:0}.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal{left:20px}.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal{left:0}.mCS-dir-rtl>.mCSB_inside>.mCSB_container_wrapper{margin-right:0;margin-left:30px}.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden>.mCSB_container{padding-right:0}.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden>.mCSB_container{padding-bottom:0}.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{margin-right:0;margin-left:0}.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{margin-bottom:0}.mCSB_scrollTools,.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonLeft,.mCSB_scrollTools .mCSB_buttonRight,.mCSB_scrollTools .mCSB_buttonUp,.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{-webkit-transition:opacity .2s ease-in-out,background-color .2s ease-in-out;-moz-transition:opacity .2s ease-in-out,background-color .2s ease-in-out;-o-transition:opacity .2s ease-in-out,background-color .2s ease-in-out;transition:opacity .2s ease-in-out,background-color .2s ease-in-out}.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar{-webkit-transition:width .2s ease-out .2s,height .2s ease-out .2s,margin-left .2s ease-out .2s,margin-right .2s ease-out .2s,margin-top .2s ease-out .2s,margin-bottom .2s ease-out .2s,opacity .2s ease-in-out,background-color .2s ease-in-out;-moz-transition:width .2s ease-out .2s,height .2s ease-out .2s,margin-left .2s ease-out .2s,margin-right .2s ease-out .2s,margin-top .2s ease-out .2s,margin-bottom .2s ease-out .2s,opacity .2s ease-in-out,background-color .2s ease-in-out;-o-transition:width .2s ease-out .2s,height .2s ease-out .2s,margin-left .2s ease-out .2s,margin-right .2s ease-out .2s,margin-top .2s ease-out .2s,margin-bottom .2s ease-out .2s,opacity .2s ease-in-out,background-color .2s ease-in-out;transition:width .2s ease-out .2s,height .2s ease-out .2s,margin-left .2s ease-out .2s,margin-right .2s ease-out .2s,margin-top .2s ease-out .2s,margin-bottom .2s ease-out .2s,opacity .2s ease-in-out,background-color .2s ease-in-out}.mCS-autoHide>.mCustomScrollBox>.mCSB_scrollTools,.mCS-autoHide>.mCustomScrollBox~.mCSB_scrollTools{opacity:0;filter:"alpha(opacity=0)";-ms-filter:"alpha(opacity=0)"}.mCS-autoHide:hover>.mCustomScrollBox>.mCSB_scrollTools,.mCS-autoHide:hover>.mCustomScrollBox~.mCSB_scrollTools,.mCustomScrollBox:hover>.mCSB_scrollTools,.mCustomScrollBox:hover~.mCSB_scrollTools,.mCustomScrollbar>.mCustomScrollBox>.mCSB_scrollTools.mCSB_scrollTools_onDrag,.mCustomScrollbar>.mCustomScrollBox~.mCSB_scrollTools.mCSB_scrollTools_onDrag{opacity:1;filter:"alpha(opacity=100)";-ms-filter:"alpha(opacity=100)"}.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.4);filter:"alpha(opacity=40)";-ms-filter:"alpha(opacity=40)"}.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.75);filter:"alpha(opacity=75)";-ms-filter:"alpha(opacity=75)"}.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85);filter:"alpha(opacity=85)";-ms-filter:"alpha(opacity=85)"}.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9);filter:"alpha(opacity=90)";-ms-filter:"alpha(opacity=90)"}.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonLeft,.mCSB_scrollTools .mCSB_buttonRight,.mCSB_scrollTools .mCSB_buttonUp{background-image:url(mCSB_buttons.png);background-repeat:no-repeat;opacity:.4;filter:"alpha(opacity=40)";-ms-filter:"alpha(opacity=40)"}.mCSB_scrollTools .mCSB_buttonUp{background-position:0 0}.mCSB_scrollTools .mCSB_buttonDown{background-position:0 -20px}.mCSB_scrollTools .mCSB_buttonLeft{background-position:0 -40px}.mCSB_scrollTools .mCSB_buttonRight{background-position:0 -56px}.mCSB_scrollTools .mCSB_buttonDown:hover,.mCSB_scrollTools .mCSB_buttonLeft:hover,.mCSB_scrollTools .mCSB_buttonRight:hover,.mCSB_scrollTools .mCSB_buttonUp:hover{opacity:.75;filter:"alpha(opacity=75)";-ms-filter:"alpha(opacity=75)"}.mCSB_scrollTools .mCSB_buttonDown:active,.mCSB_scrollTools .mCSB_buttonLeft:active,.mCSB_scrollTools .mCSB_buttonRight:active,.mCSB_scrollTools .mCSB_buttonUp:active{opacity:.9;filter:"alpha(opacity=90)";-ms-filter:"alpha(opacity=90)"}.mCS-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.15)}.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:rgba(0,0,0,.85)}.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:rgba(0,0,0,.9)}.mCS-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-80px 0}.mCS-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-80px -20px}.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-80px -40px}.mCS-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-80px -56px}.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail,.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail{width:4px;background-color:#fff;background-color:rgba(255,255,255,.1);-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:4px;background-color:#fff;background-color:rgba(255,255,255,.75);-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px}.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:4px;margin:6px auto}.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85)}.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9)}.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px 0}.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -20px}.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -40px}.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -56px}.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1);-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75);-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px 0}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -20px}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -40px}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -56px}.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail,.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail{width:4px;background-color:#fff;background-color:rgba(255,255,255,.1);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:6px;background-color:#fff;background-color:rgba(255,255,255,.75);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:4px;margin:6px 0}.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:6px;margin:5px auto}.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85)}.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9)}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{background-position:-16px 0}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{background-position:-16px -20px}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{background-position:-20px -40px}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{background-position:-20px -56px}.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{background-position:-96px 0}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{background-position:-96px -20px}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{background-position:-100px -40px}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{background-position:-100px -56px}.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{background-color:#fff;background-color:rgba(255,255,255,.1)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:2px}.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%}.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:2px;margin:7px auto}.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.15)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{background-position:-80px 0}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{background-position:-80px -20px}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{background-position:-80px -40px}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{background-position:-80px -56px}.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{background-color:#fff;background-color:rgba(255,255,255,.15)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger,.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,.mCS-rounded.mCSB_scrollTools .mCSB_dragger{height:14px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:14px;margin:0 1px}.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger{width:14px}.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{height:14px;margin:1px 0}.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{width:16px;height:16px;margin:-1px 0}.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{width:4px}.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{height:16px;width:16px;margin:0 -1px}.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{height:4px;margin:6px 0}.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{background-position:0 -72px}.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{background-position:0 -92px}.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{background-position:0 -112px}.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{background-position:0 -128px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.15)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-80px -72px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-80px -92px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-80px -112px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-80px -128px}.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail{width:4px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail{background-color:transparent;background-position:center}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==);background-repeat:repeat-y;opacity:.3;filter:"alpha(opacity=30)";-ms-filter:"alpha(opacity=30)"}.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail{height:4px;margin:6px 0;background-repeat:repeat-x}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{background-position:-16px -72px}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{background-position:-16px -92px}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{background-position:-20px -112px}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{background-position:-20px -128px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=)}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-96px -72px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-96px -92px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-100px -112px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-100px -128px}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-repeat:repeat-y;background-image:-moz-linear-gradient(left,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-webkit-gradient(linear,left top,right top,color-stop(0,rgba(255,255,255,.5)),color-stop(100%,rgba(255,255,255,0)));background-image:-webkit-linear-gradient(left,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-o-linear-gradient(left,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-ms-linear-gradient(left,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:linear-gradient(to right,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%)}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{background-repeat:repeat-x;background-image:-moz-linear-gradient(top,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(255,255,255,.5)),color-stop(100%,rgba(255,255,255,0)));background-image:-webkit-linear-gradient(top,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-o-linear-gradient(top,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-ms-linear-gradient(top,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:linear-gradient(to bottom,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%)}.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger,.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger{height:70px}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger{width:70px}.mCS-3d-dark.mCSB_scrollTools,.mCS-3d.mCSB_scrollTools{opacity:1;filter:"alpha(opacity=30)";-ms-filter:"alpha(opacity=30)"}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_draggerRail{-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-3d.mCSB_scrollTools .mCSB_draggerRail{width:8px;background-color:#000;background-color:rgba(0,0,0,.2);box-shadow:inset 1px 0 1px rgba(0,0,0,.5),inset -1px 0 1px rgba(255,255,255,.2)}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#555}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:8px}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:8px;margin:4px 0;box-shadow:inset 0 1px 1px rgba(0,0,0,.5),inset 0 -1px 1px rgba(255,255,255,.2)}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:8px;margin:4px auto}.mCS-3d.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-3d.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-3d.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1);box-shadow:inset 1px 0 1px rgba(0,0,0,.1)}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{box-shadow:inset 0 1px 1px rgba(0,0,0,.1)}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCS-3d-thick-dark.mCSB_scrollTools,.mCS-3d-thick.mCSB_scrollTools{opacity:1;filter:"alpha(opacity=30)";-ms-filter:"alpha(opacity=30)"}.mCS-3d-thick-dark.mCSB_scrollTools,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer,.mCS-3d-thick.mCSB_scrollTools,.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px}.mCSB_inside+.mCS-3d-thick-dark.mCSB_scrollTools_vertical,.mCSB_inside+.mCS-3d-thick.mCSB_scrollTools_vertical{right:1px}.mCS-3d-thick-dark.mCSB_scrollTools_vertical,.mCS-3d-thick.mCSB_scrollTools_vertical{box-shadow:inset 1px 0 1px rgba(0,0,0,.1),inset 0 0 14px rgba(0,0,0,.5)}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal,.mCS-3d-thick.mCSB_scrollTools_horizontal{bottom:1px;box-shadow:inset 0 1px 1px rgba(0,0,0,.1),inset 0 0 14px rgba(0,0,0,.5)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;box-shadow:inset 1px 0 0 rgba(255,255,255,.4);width:12px;margin:2px;position:absolute;height:auto;top:0;bottom:0;left:0;right:0}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{box-shadow:inset 0 1px 0 rgba(255,255,255,.4);height:12px;width:auto}.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#555}.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{background-color:#000;background-color:rgba(0,0,0,.05);box-shadow:inset 1px 1px 16px rgba(0,0,0,.1)}.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{background-color:transparent}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-3d-thick-dark.mCSB_scrollTools{box-shadow:inset 0 0 14px rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal{box-shadow:inset 0 1px 1px rgba(0,0,0,.1),inset 0 0 14px rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{box-shadow:inset 1px 0 0 rgba(255,255,255,.4),inset -1px 0 0 rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#777}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{background-color:#fff;background-color:rgba(0,0,0,.05);box-shadow:inset 1px 1px 16px rgba(0,0,0,.1)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail{background-color:transparent}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical{right:0;margin:12px 0}.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools.mCSB_scrollTools_horizontal{bottom:0;margin:0 12px}.mCS-dir-rtl>.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,.mCS-dir-rtl>.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical{left:0;right:auto}.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger,.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger{height:50px}.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger{width:50px}.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.2);filter:"alpha(opacity=20)";-ms-filter:"alpha(opacity=20)"}.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.5);filter:"alpha(opacity=50)";-ms-filter:"alpha(opacity=50)"}.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.2);filter:"alpha(opacity=20)";-ms-filter:"alpha(opacity=20)"}.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.5);filter:"alpha(opacity=50)";-ms-filter:"alpha(opacity=50)"}.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail{width:6px;background-color:#000;background-color:rgba(0,0,0,.2)}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:6px}.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:6px;margin:5px 0}.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{width:12px}.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{height:12px;margin:2px 0}.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1)}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset.mCSB_scrollTools .mCSB_draggerRail{width:12px;background-color:#000;background-color:rgba(0,0,0,.2)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:6px;margin:3px 5px;position:absolute;height:auto;top:0;bottom:0;left:0;right:0}.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{height:6px;margin:5px 3px;position:absolute;width:auto;top:0;bottom:0;left:0;right:0}.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:12px;margin:2px 0}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail{background-color:transparent;border-width:1px;border-style:solid;border-color:#fff;border-color:rgba(255,255,255,.2);-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{border-color:#000;border-color:rgba(0,0,0,.2)}.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{background-color:#fff;background-color:rgba(255,255,255,.6)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.6)}.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.75)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9)}
body {margin: 0; padding: 0;color: #000; font-size: 14px;line-height: 20px;border: 0;}
body,input,textarea{ font-family:"Microsoft Yahei","SourceM", Arial, "Helvetica Neue", Helvetica, sans-serif; }
.nowrap{ white-space: nowrap;text-overflow:ellipsis; overflow:hidden; }
.break { word-wrap:break-word; word-break: break-all; }
/*CSShack*/
@media all and (min-width: 0px) {body { min-width: auto;}}
i { font-style: normal; }
.tb { display: table;height: 100%;width: 100%; } .tb_c { display: table-cell;vertical-align: middle; }
a{ text-decoration: none;color: #666; }
ul,dl,dt,dd{ list-style: none;margin: 0;padding: 0; } ul,li,ol{ list-style: none;}
input:focus , select:focus , textarea:focus { outline: none; }
img { max-width: 100%; height: auto; border: 0; }
h1,h2,h3,h4,h5,p { margin: 0; padding: 0; line-height: 1.2;font-weight: normal; } table { border-collapse: collapse; }
.row .md1 { width: 8.3333%; } .row .md2 { width: 16.6666%; } .row .md3 { width: 25%; }
.row .md4 { width: 33.3333%; } .row .md5 { width: 41.6666%; } .row .md6 { width: 50%; }
.row .md7 { width: 58.3333%; } .row .md8 { width: 66.6666%; } .row .md9 { width: 75%; }
.row .md10 { width: 83.3333%; } .row .md11 { width: 91.6666%; } .row .md12 { width: 100%; }
.row .md1, .row .md2,.row .md3,.row .md4,.row .md5,.row .md6,
.row .md7, .row .md8,.row .md9,.row .md10,.row .md11,.row .md12 { float: left; }
input{padding: 0;margin: 0;border: 0;}
input[type="text"], input[type="password"] , select , textarea { -webkit-appearance: none;width: 100%;font-size: 14px;}
input[type="submit"] { -webkit-appearance: none !important; }
input[type="button"] { -webkit-appearance: none !important; }
input::-webkit-input-placeholder { color:#666 !important ;}
input:-moz-placeholder {color: #666 !important ;}
input::-moz-placeholder {color: #666 !important ;}
input:-ms-input-placeholder {color: #666 !important ;}
textarea::-webkit-input-placeholder { color:#666 !important ;}
textarea:-moz-placeholder {color: #666 !important ;}
textarea::-moz-placeholder {color: #666 !important ;}
textarea:-ms-input-placeholder {color: #666 !important ;}
h1 { font-size: 48px; } h2 { font-size: 36px; } h3 { font-size: 24px; }
h4 { font-size: 18px; } h5 { font-size: 16px; }
.fl { float: left; } .fr{float: right;}
.posr { position: relative; }
.posa{position: absolute;}
.clearfix:after,
.clearfix:before{content: "";display: block;height:0;width: 100%;clear: both;overflow: hidden;font-size: 0;line-height: 0;}
.clearboth{width: 100%;height:0;clear: both;overflow: hidden;font-size: 0;line-height: 0;}
.clear{overflow: auto;zoom:1;}
.blur {filter:url(blur.svg#blur);-webkit-filter: blur(10px);-moz-filter: blur(10px);-o-filter: blur(10px);-ms-filter: blur(10px);filter:blur(10px);filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=10, MakeShadow=false);}
.gray{-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray;}
/*共用*/
.scroll_down{position: absolute;bottom: 20px;left: 50%;width: 28px;height: 54px;margin-left: -14px;border: 2px solid #fff;z-index: 99;border-radius: 30px;cursor: pointer;}
.scroll_down span{width: 4px;height: 10px;margin: 0 auto;position: absolute;top: 8px;left: 0;right: 0; background: #fff;border-radius: 10px;-webkit-animation: scrollDown 2s infinite linear; -o-animation: scrollDown 2s infinite linear; -moz-animation: scrollDown 2s infinite linear; animation: scrollDown 2s infinite linear;}
.picbg{background-size: cover;background-size: auto 100%\9;background-position: center center;display: block;}
.picbg img{display: none;}
.commontit{font-size: 40px;margin-bottom: 50px;line-height: 1.5;}
.innertit{font-size: 34px;text-align: center;margin-bottom: 70px;padding-bottom:35px;line-height: 1; position: relative;color: #020202;}
.innertit:after{content: "";position: absolute;left:0;right: 0;bottom: 0;margin: 0 auto;height: 2px;width: 55px;background: #32a0fc;-webkit-transform: scale(0,1);-moz-transform: scale(0,1);-o-transform: scale(0,1);-ms-transform: scale(0,1);transform: scale(0,1);transition: all 0.8s ease-out 0.8s;-webkit-transition: all 0.8s ease-out 0.8s;-o-transition: all 0.8s ease-out 0.8s;-moz-transition: all 0.8s ease-out 0.8s;-ms-transition: all 0.8s ease-out 0.8s;}
.innertit .smalls{font-size: 24px;color: #464646;margin-top: 15px;}
.innertit.animated:after{-webkit-transform: scale(1,1);-moz-transform: scale(1,1);-o-transform: scale(1,1);-ms-transform: scale(1,1);transform: scale(1,1);}
.wrap{max-width: 1600px;margin: 0 auto;}
@media screen and (max-width: 1600px) {
.wrap{max-width: 1200px;}
}
@media screen and (max-width: 1200px) {
.wrap{margin: 0 15px;}
}
.moveline{position: absolute;height:2px;bottom: -2px;transition: all 0.5s ease-out;-webkit-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-ms-transition: all 0.5s ease-out;}
.moveline span{width: 70px;height: 100%;display: block;margin: 0 auto;background: #28abff;}
/*.sourceE{font-family:"SourceE", Arial, "Helvetica Neue", Helvetica, sans-serif; }*/
.innerbanner{position: relative;overflow: hidden;}
.innerbanner img{width: 100%;}
.innerbanner .pic img,
.innerbanner .picbg{-webkit-transform: scale(1.06);-moz-transform: scale(1.06);-o-transform: scale(1.06);-ms-transform: scale(1.06);transform: scale(1.06);transition: all 5s ease-out;-webkit-transition: all 5s ease-out;-o-transition: all 5s ease-out;-moz-transition: all 5s ease-out;-ms-transition: all 5s ease-out;}
.innerbanner .pic.animated img,
.innerbanner .picbg.animated{-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
.pop{position: fixed;width: 100%;height: 100%;left: 0;top: 0;}
/*头部*/
.wrap_header{width: 260px;position: fixed;top: 0;left: 0;height: 110px;z-index: 999;overflow: hidden;}
.header_box{height: 110px;margin: 0 55px;position:relative;line-height: 110px;}
.header_box,
.header_box a{color: #fff;}
.header_box .menu a{opacity: 0.7;}
.header_box .menu li.active a{opacity: 1;}
.header_box .head_lt{width: 165px;height: 100%;padding: 0 20px;overflow: hidden;background: #33a0fc;position: absolute;left: 0;top: 0;z-index: 9;}
.header_box .head_lt i{width: 30px;margin-right: 20px;text-align: center;font-size: 30px;}
.header_box .head_lt .logo{width: 115px;height: 110px;}
.header_box .head_rt{position: relative;-webkit-transform: scale(0,1);-moz-transform: scale(0,1);-o-transform: scale(0,1);-ms-transform: scale(0,1);transform: scale(0,1);transform-origin: 0 50%;-o-transform-origin: 0 50%;-moz-transform-origin: 0 50%;-webkit-transform-origin: 0 50%;-ms-transform-origin: 0 50%;}
.header_box .head_rt:after,.header_box .menu .down:after{content: '';position: absolute;top:0;left:0;width: 100%;height: 100%;z-index: 0;background: #33a0fc;opacity: 0.8;}
.header_box .lang{position: absolute;top: 0;right: 25px;z-index: 1;font-size: 23px;opacity: 0;}
.header_box .lang a{padding: 0 10px;color: #a6a6a6;text-transform: uppercase;}
.header_box .lang a:hover,.header_box .lang a.active{color: #fff;}
.header_box .menu_box{position: relative;z-index: 1;text-align: center;padding-left:205px;padding-right: 105px;border-left: 2px solid #fff;}
.header_box .menu{display: inline-block;font-size: 18px;position: relative;opacity: 0;}
.header_box .menu li{float: left;position: relative;padding: 0 25px;z-index: 2;}
.header_box .mask{position: absolute;left: 0;bottom: 0;height: 4px;width: 65px;background: #fff;z-index: 1; transition: all 0.5s ease-out;-webkit-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-ms-transition: all 0.5s ease-out;}
.header_box .menu .down{position: absolute;top: 100%;left:0;min-width: 280px;padding-bottom: 15px;display: none;}
.header_box .menu .down dl{position: relative;z-index: 2;}
.header_box .menu .down a{display: block;height: 45px;line-height: 45px;border-bottom: 1px solid transparent;font-size: 20px;padding: 0 25px;text-align: left;font-weight: normal;}
.header_box .menu .down a:hover{border-bottom-color: #fff;opacity: 1;}
/*.wrap_header:hover{width: 100%;}*/
.wrap_header:hover{width: 100%;overflow: initial;}
.wrap_header:hover .header_box .head_rt{-webkit-transform: scale(1,1);-moz-transform: scale(1,1);-o-transform: scale(1,1);-ms-transform: scale(1,1);transform: scale(1,1);}
.wrap_header:hover .header_box .menu,
.wrap_header:hover .header_box .lang{opacity: 1; transition: all 0.2s ease-out 0.4s;-webkit-transition: all 0.2s ease-out 0.4s;-o-transition: all 0.2s ease-out 0.4s;-moz-transition: all 0.2s ease-out 0.4s;-ms-transition: all 0.2s ease-out 0.4s;}
.header_box .moveline{bottom: 0;}
.header_box .moveline span{background: #fff;width: 40px;}
/*底部*/
.footer_box{background: #f1f7fc;text-align: center;padding: 20px 0;}
.footer_box .share{display: inline-block;height: 40px;line-height: 40px;}
.footer_box .share a,.footer_box .share span{float: left;display:block;}
.footer_box .share span{height: 100%;width: 1px;background: #cde2f4;}
.footer_box .share a{font-size: 40px;color: #78b2e2;padding:5px 15px;position: relative;background: none;text-indent: 0;margin: 0;height: 40px;line-height: 40px;cursor: pointer;overflow: hidden;}
.footer_box .share a i{position: relative;z-index: 2;}
.footer_box .share a .imgs{position: absolute;bottom: 120%;left: 50%;width:120px;margin-left: -60px;opacity: 0;z-index: 1; transform:translateY(100px);-o-transform:translateY(100px);-ms-transform:translateY(100px);-moz-transform:translateY(100px);-webkit-transform:translateY(100px);}
.footer_box .share a:hover{overflow: inherit;}
.footer_box .share a:hover .imgs{opacity: 1;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);transition: all 0.3s ease-out;-webkit-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;}
.footer_box .ft_bd{display: inline-block;overflow: hidden;font-weight:bold;font-size: 13px;color: #000;margin-top: 15px;}
.footer_box .links li{float: left;padding: 0 10px;}
.footer_box .links li a{color: #000;}
.footer_box .links li a:hover{color: #78b2e2;}
.body_box{position: relative;}
/*首页*/
.ind_box .banner{overflow: hidden;position: relative;}
.ind_box .banner .pic{width: 100%;height: 100%; background-size: cover;background-size: auto 100%\9;background-position: center center;}
/*.ind_box .banner li.active .pic{-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}*/
.ind_box .banner .con{position: absolute;top:53.05%;height: 300px;z-index: 2;}
.ind_box .banner .con{left: 0;width: 100%;}
.ind_box .banner .con:before{content: '';width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: #27547a;opacity: 0.3;z-index: 1;}
.ind_box .banner .txt{color: #fff;position: relative;z-index: 3;}
.ind_box .banner h3,.ind_box .banner p,.ind_box .banner .line{line-height: 1;}
.ind_box .banner h3{font-size: 60px;overflow: hidden;height: 60px;}
.ind_box .banner p{font-size: 26px;line-height: 1.5;}
.ind_box .banner h3 font,
.ind_box .banner li p font{display: block;float: left;opacity: 0;}
.ind_box .banner li font.none{width: 10px;height: 10px;}
.ind_box .banner .swiper-slide-active h3 font{ -webkit-animation-name: fadeInUp;animation-name: fadeInUp;}
.ind_box .banner .swiper-slide-active p font{ -webkit-animation-name: fadeInDown;animation-name: fadeInDown;}
.ind_box .banner .line{width: 475px;height: 10px;background: #33a0fc;margin: 15px 0;-webkit-transform: scale(0,1);-moz-transform: scale(0,1);-o-transform: scale(0,1);-ms-transform: scale(0,1);transform: scale(0,1);transform-origin: 0 0;-o-transform-origin: 0 0;-moz-transform-origin: 0 0;-webkit-transform-origin: 0 0;-ms-transform-origin: 0 0;transition: all 1.2s ease-out 0.5s;-webkit-transition: all 1.2s ease-out 0.5s;-o-transition: all 1.2s ease-out 0.5s;-moz-transition: all 1.2s ease-out 0.5s;-ms-transition: all 1.2s ease-out 0.5s; }
.ind_box .banner .swiper-slide-active .line{-webkit-transform: scale(1,1);-moz-transform: scale(1,1);-o-transform: scale(1,1);-ms-transform: scale(1,1);transform: scale(1,1);}
.ind_box .banner .page span{display: block;width: 15px;height: 15px;border-radius: 50%;background: #fff;opacity: 0.3;margin-bottom: 15px;}
.ind_box .banner .page span:hover,
.ind_box .banner .page .swiper-pagination-bullet-active{background: #fff;opacity: 1;}
.ind_box .row1{height: 395px;position: relative;}
.ind_box .row1 .pic{width: 40.5%;overflow: hidden;}
.ind_box .row1 .pic,.ind_box .row1 .pic span{height: 100%;}
.ind_box .row1 .pic span{-webkit-transform: scale(1.05);-moz-transform: scale(1.05);-o-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);transition: all 3s ease-out;-webkit-transition: all 3s ease-out;-o-transition: all 3s ease-out;-moz-transition: all 3s ease-out;-ms-transition: all 3s ease-out;}
.ind_box .row1 .pic.animated span{-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
.ind_box .row1 .content{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}
.ind_box .row1 .wrap{height: 100%;}
.ind_box .row1 .txtwrap{width: 46%;color: #494c4f;}
p{line-height: 24px;}
.ind_box .row1 .more{display: block;width: 170px;height: 50px;border: 2px solid #ccf2f7;text-align: center;line-height: 50px;margin-top: 35px;text-transform: uppercase;}
.ind_box .row1 .more:hover{border-color: #fff;}
.ind_box .row2{margin-top:60px;}
.ind_box .row2 .commontit{text-align: right;}
.ind_box .row2 ul li{height: 315px;overflow: hidden;color: #494c4f;}
.ind_box .row2 ul li .box{height: 100%;}
.ind_box .row2 ul li .md6,
.ind_box .row2 ul li .picbg{height: 100%;overflow: hidden;}
.ind_box .row2 ul li .pic span{transition: all 2s ease-out;-webkit-transition: all 2s ease-out;-o-transition: all 2s ease-out;-moz-transition: all 2s ease-out;-ms-transition: all 2s ease-out;}
.ind_box .row2 ul li .txtwrap{position: relative;}
.ind_box .row2 ul li .txt{max-width: 520px;margin: 0 auto;padding: 20px;line-height: 22px;}
.ind_box .row2 ul li h4{font-size: 28px;line-height: 1;color: #020202;}
.ind_box .row2 ul li .line{width: 40px;height: 8px;background: #32a0fc;margin: 30px 0 20px 0;}
.ind_box .row2 ul li:nth-child(2n) .pic{float: right;}
.ind_box .row2 ul li:nth-child(1) .txtwrap:after,
.ind_box .row2 ul li:nth-child(1) .txtwrap:before,
.ind_box .row2 ul li:last-child .txtwrap:after,
.ind_box .row2 ul li:last-child .txtwrap:before{content: "";position: absolute;background: #32a0fc;z-index: 9;}
.ind_box .row2 ul li:nth-child(1) .txtwrap:before,
.ind_box .row2 ul li:last-child .txtwrap:before{width: 225px;height: 14px;}
.ind_box .row2 ul li:nth-child(1) .txtwrap:after,
.ind_box .row2 ul li:last-child .txtwrap:after{width: 14px;height: 95px;}
.ind_box .row2 ul li:nth-child(1) .txtwrap:before,
.ind_box .row2 ul li:nth-child(1) .txtwrap:after{top: 0;right: 0;}
.ind_box .row2 ul li:last-child .txtwrap:after,
.ind_box .row2 ul li:last-child .txtwrap:before{bottom: 0;left: 0;}
.ind_box .row2 ul li:hover,
.ind_box .row2 ul li:hover h4{color: #fff;}
.ind_box .row2 ul li:hover .box{background: #32a0fc;}
.ind_box .row2 ul li:hover .line{background: #fff;}
.ind_box .row2 ul li:hover .pic span{-webkit-transform: scale(1.02);-moz-transform: scale(1.02);-o-transform: scale(1.02);-ms-transform: scale(1.02);transform: scale(1.02);}
.ind_box .row3{padding: 130px 0 80px 0;overflow: hidden;}
.ind_box .row3 li{width:20%;height: 120px;position: relative;float: left;text-align: center;background: #eaf0f5;}
.ind_box .row3 li .box{display: block;position: relative;z-index:9;color: #666;}
.ind_box .row3 li:hover .box{color: #fff;}
.ind_box .row3 li:after,
.ind_box .row3 li:before{content: "";position: absolute;top: 0;}
.ind_box .row3 li:before{right:0px;width: 2px;height: 100%;background: #cfd9e1;}
.ind_box .row3 li:after{width: 100%;height: 140px;left:0;top:-10px;}
.ind_box .row3 li:hover:after{;background: #32a0fc;}
.ind_box .row3 li.none:before{display: none;}
.ind_box .row3 li i{height: 70px;font-size:50px;line-height: 70px;display: block;margin: 10px 0;}
.ind_box .row3 li p{line-height: 1;font-size: 16px;}
.ind_box .row4 .commontit{text-align:center;}
.ind_box .row4 .nav{max-width: 1000px;margin: 0 auto;border-bottom: 1px solid #bbb;position: relative;overflow: hidden;}
.ind_box .row4 .nav .find_nav_left{position: relative;height: 50px;text-align: center;}
.ind_box .row4 .nav .find_nav_list{position: absolute;left: 0;height: 100%;}
.ind_box .row4 .nav ul{position: relative;white-space:nowrap;font-size: 0;}
.ind_box .row4 .nav li{min-width:200px; text-align: center;font-size: 16px;padding-bottom: 30px;cursor: pointer;display: inline-block;}
.ind_box .row4 .nav .moveline{bottom: 0;}
.ind_box .row4 .nav li .box{display: none;}
.ind_box .row4 .pic{height: 100%;}
.ind_box .row4 .txtwrap{height: 320px;margin:70px 0 110px 0;position: relative;}
.ind_box .row4 .txt{max-width: 550px;height: 350px;position: absolute;top:50%;margin-top: -165px; right:75px;background: #32a0fc;color: #fff;z-index: 9;line-height: 24px;}
.ind_box .row4 .tb_c{padding: 30px 45px;}
.ind_box .row4 .txt .line{width: 40px;height: 12px;background: #fff;margin-bottom: 30px;}
.ind_box .row4 .txt .more a{color: #fff;font-size: 18px;opacity: .8;margin-top: 15px;display: block;transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-ms-transition: all 0.2s ease-out;}
.ind_box .row4 .txt .more a:hover{opacity: 1;}
.ind_box .row5{text-align: center;background: #f1f7fc;overflow: hidden;padding: 75px 0;}
.ind_box .row5 ul{display: inline-block;}
.ind_box .row5 ul li{width: 260px;height:330px;margin: 0 50px;float: left;position: relative;}
.ind_box .row5 ul li a{display:block;height: 100%;}
.ind_box .row5 ul li:before{content: "";position: absolute;width: 100%;height: 100%;top: 0;left:0;background: #1f3345;opacity: 0.3;z-index: 1;}
.ind_box .row5 ul .picbg{height: 100%;position: relative;}
.ind_box .row5 ul .picbg:before{content: "";position: absolute;top: 0;left: 0;bottom:0;margin:auto;height:90px;width:100%;background:#279cff;opacity: 0;}
.ind_box .row5 ul .name{position: absolute;top:0;bottom:0;margin:auto;width: 100%;height: 90px;line-height: 90px;font-size: 19px;color: #fff;z-index: 2;}
.ind_box .row5 ul li:hover:before{opacity: 0;}
.ind_box .row5 ul li:hover .picbg:before{opacity: 0.6;}
.ind_box .row5 ul li:hover .picbg{-webkit-transform: scale(1.15);-moz-transform: scale(1.15);-o-transform: scale(1.15);-ms-transform: scale(1.15);transform: scale(1.15);}
.ind_box .row5 ul li:hover .name{font-size: 27px;}
.ind_box .row6{padding:0;overflow: hidden;}
.ind_box .row6 .formbox{display: inline-block;text-align: left;margin-top: 40px;}
.ind_box .row6 .input_txt,
.ind_box .row6 .input_btn{height: 50px;line-height: 50px;}
.ind_box .row6 .input_txt{width: 420px;background: #ededed;text-indent: 15px;font-size: 16px;}
.ind_box .row6 .input_btn{width: 160px;color: #fff;font-size: 28px;text-align: center;background: #32a0fc;cursor: pointer;margin-left: 10px;}
.ind_box .row6 .wrap{max-width: 600px;}
@media screen and (max-width: 600px) {
.ind_box .row6 .wrap{margin: 0 20px;}
}
.ind_box .row6 .md6{padding: 110px 0;}
.ind_box .row6 .formwrap{background-size: cover;background-position: center;}
.ind_box .row6 .commontit{position: relative;padding-bottom: 30px;margin-bottom: 30px;}
.ind_box .row6 .commontit:after{content:"";position: absolute;bottom: 0;left: 0;height: 4px;width: 60px; background: #32a0fc;}
.ind_box .row6 .formwrap .commontit{color: #fff;}
.ind_box .row6 .formwrap .commontit:after{content:"";position: absolute;bottom: 0;left: 0;background: #fff;}
.ind_box .row6 .formwrap .smalls{color: #fff;}
.ind_box .row6 .txtwrap ul i{float: left;font-size: 22px;color: #7389a4;margin-right: 20px;}
.ind_box .row6 .txtwrap ul li{color: #81878c;margin: 15px 0;}
.row{background-size: cover;background-position: center;}
/*about*/
.about_box .nav{background: #edf7ff;height: 75px;line-height: 75px;}
.about_box .nav .wrap{max-width: 1200px;}
.about_box .nav ul{border-left: 1px solid #d1d7dc;overflow: hidden;}
.about_box .nav li{width: 25%;float: left;}
.about_box .nav li a{display: block;color: #fff;font-size: 25px;color: #3da5fc;border-right: 1px solid #d1d7dc;text-align: center;text-transform: uppercase; }
.about_box .nav li.active,
.about_box .nav li:hover{background: #3da5fc;}
.about_box .nav li.active a{color:#fff;}
.about_box .nav li:hover a{color:#fff;transform:translateY(-5px);-o-transform:translateY(-5px);-ms-transform:translateY(-5px);-moz-transform:translateY(-5px);-webkit-transform:translateY(-5px);}
.about_box .row{padding: 80px 0;}
.about_box .row1 .txt{color: #737373;text-align: center;}
.about_box .row2{background: #edf7ff;overflow: hidden;}
.about_box .row2 .wrap,
.about_box .row3 .wrap{max-width: none;margin: 0 5%;}
.about_box .row2 ul li{width: 25%;float: left;margin-bottom: 20px;}
.about_box .row2 ul li .item{margin:0 1px;background: #fff;}
.about_box .row2 ul li .pic{height: 250px;overflow: hidden;}
.about_box .row2 ul li .picbg{height: 100%;}
.about_box .row2 ul li .txtwrap{padding: 30px;}
.about_box .row2 ul li h4{font-size: 24px;line-height: 1.5;padding-bottom: 25px;margin-bottom: 25px;position: relative;}
.about_box .row2 ul li h4:after{width:40px;height: 8px;position: absolute;bottom: 0;left: 0;background: #32a0fc;content: "";}
.about_box .row2 ul li .txt{height: 144px;overflow: hidden;color: #737373;}
.about_box .row2 ul li .picbg{transition: all 1s ease-out;-webkit-transition: all 1s ease-out;-o-transition: all 1s ease-out;-moz-transition: all 1s ease-out;-ms-transition: all 1s ease-out;}
.about_box .row2 ul li h4:after{transition: all 0.5s ease-out;-webkit-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-ms-transition: all 0.5s ease-out;}
.about_box .row2 ul li:hover .picbg{-webkit-transform: scale(1.05);-moz-transform: scale(1.05);-o-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}
.about_box .row2 ul li:hover h4:after{width: 100%;}
.about_box .row3 .wrap{background: rgba(255,255,255,0.8);padding: 120px 0;}
.about_box .row3 .txt{margin: 0 7.5%;color: #737373;}
.about_box .row4 .wrap{max-width: 1450px;}
.about_box .row4 ul{overflow: hidden;}
.about_box .row4 ul li{width: 25%;float: left;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.about_box .row4 ul .item{text-align: center;padding: 40px;border-right: 1px solid #dcdcdc;border-left: 1px solid #dcdcdc;}
.about_box .row4 ul li i{font-size: 50px;line-height: 1;color: #30a0fb;}
.about_box .row4 ul li h4{font-size: 24px;margin: 15px 0 30px;text-transform: uppercase;}
.about_box .row4 ul li .txt{color: #737373;text-align: left;height:72px;overflow: hidden;}
.about_box .row4 ul li:nth-child(1){border-left: 1px solid #dcdcdc;}
.about_box .row4 ul li:nth-child(4n){border-right: 1px solid #dcdcdc;}
/*quality*/
.quality_box{overflow: hidden; color: #737373;}
.quality_box .innerbanner .content{width: auto;height: auto;top: auto;bottom: 140px;right:90px;text-align: left;font-size: 60px;line-height: 1.3;}
.quality_box .row1{padding: 80px 0 200px 0;}
.quality_box .innertit{font-size: 30px;color: #000;text-align: left;margin-bottom: 30px;}
.quality_box .style2 .innertit,
.quality_box .style3 .innertit{padding-bottom: 0;}
.quality_box .innertit .smalls{color: #545454;}
.quality_box .innertit:after{right: auto;-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);display: none;}
.quality_box .row1 .wrap{max-width: inherit;}
.quality_box .row1 .txt{max-width: 78%;margin: 0 auto;}
.quality_box .row1 li{padding: 80px 0;}
.quality_box .row1 li:nth-child(2n) .md6{float: right;}
.quality_box .row1 .pic,
.quality_box .row1 .picbg img{background-color: #fff;box-shadow: 0 0 6px 2px rgba(0,0,0,0.15);display: inline-block;position: relative;z-index: 9;}
.quality_box .row1 .txt p,
.quality_box .row1 dl dd{font-size: 20px;line-height:30px;}
.quality_box .row1 .picwrap{position: relative;t}
.quality_box .row1 .picwrap:after{content: "";position: absolute;top:70px;z-index: 1;border:15px solid #30a0fc;width:100%;height: 100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.quality_box .row1 .style1 .picwrap{width: 405px;height: 550px;overflow: hidden;padding: 55px;border: 15px solid #30a0fc;margin: 0 auto;}
.quality_box .row1 .style1 .picwrap:after{display: none;}
.quality_box .row1 .style1 .innertit:after{display: block;}
.quality_box .row1 .style1 .txtwrap{height: 690px;}
.quality_box .row1 .style2 .box{height: 580px;}
.quality_box .row1 .style2 .picwrap:after{left:30px;}
.quality_box .row1 .style2 .picwrap{text-align: right;}
.quality_box .row1 .style2 .picbg{display: inline-block;}
.quality_box .row1 .picbg{background: none !important;}
.quality_box .row1 .picbg img{display: block;}
.quality_box .row1 .style2 img{float: right;}
.quality_box .row1 .style3 .box{height: 445px;}
.quality_box .row1 .style3 .picbg{width:86.5%;}
.quality_box .row1 .style3 .picwrap:after{width: 90%;left:6%;}
.quality_box .row1 dl dd{position: relative;padding-left: 20px;}
.quality_box .row1 dl dd:after{content: "";position: absolute;left: 0;top: 8px;width: 7px;height: 7px;background: #33a0fc;}
.quality_box .row2{text-align: center;}
.quality_box .row2 .wrap{max-width: 1130px;}
.quality_box .row2 .pic{position: relative;top: -90px;display: inline-block;}
.quality_box .row2 .pic img{max-width: 80%;}
.innerbanner .content{position: absolute;top:0;width: 100%;height: 100%;z-index: 9;text-align: center;color: #fff;}
.innerbanner h3,
.innerbanner .smalls{display: inline-block;line-height: 1.5;overflow: hidden;padding: 10px 0;}
.innerbanner h3{font-size:150px; }
.innerbanner .smalls{font-size: 44px;}
.innerbanner font{display: block;float: left;}
/*Photochromic*/
.windowH .picbg{height: 100%;}
.photo_box{overflow: hidden;}
.innerbanner font.none{width: 20px;height: 12px;}
.photo_box .innerbanner h3{font-size: 100px;}
.photo_box .row1{position: relative;}
.photo_box .row1 .innertit{margin-bottom: 40px;}
.photo_box .row1 .bg{position: relative;}
.photo_box .row1 .bg img{display: block;width: 100%;}
.photo_box .row1 .shadebg{position: absolute;top: 0;}
.photo_box .row1 .bg.animated .shadebg{-webkit-animation: colorChange 3s infinite linear 0.3s; -o-animation: colorChange 3s infinite linear 0.3s; -moz-animation: colorChange 3s infinite linear 0.3s; animation: colorChange 3s infinite linear 0.3s;}
.photo_box .row1 .content{content: "";position: absolute;top: 0; bottom: 120px; left: 0; right: 0;margin: auto;max-width: 700px;max-height: 280px; z-index: 9;color: #595959;}
.photo_box .row2 .content{margin: 0 5%;}
.photo_box .row2 .pic{position: relative;z-index: 9;}
.photo_box .row2 .hd,
.photo_box .row2 .bd{position: relative;}
.photo_box .row2 .hd .pic,
.photo_box .row2 .bd .txtwrap{width: 60%;}
.photo_box .row2 .hd .pic img{width: 100%;}
.photo_box .row2 .txtwrap{box-shadow:0 25px 55px 8px rgba(199,214,227,0.65);}
.photo_box .row2 .hd .txtwrap,
.photo_box .row2 .bd .pic{width: 40%;}
.photo_box .row2 .hd .txtwrap,
.photo_box .row2 .bd .txtwrap{position: absolute;height: 100%;font-size: 18px;line-height: 30px;}
.photo_box .row2 .hd .txtwrap{top: 0;right: 0;color: #fff;background: #33a0fc;}
.photo_box .row2 .txt{position: relative;padding: 0 80px 45px 80px;}
.photo_box .row2 .txt:after{content: "";position: absolute;bottom: 0;width: 280px;height: 1px;background: #fff;opacity: 0.5;z-index: 10;}
.photo_box .row2 .hd .txt:after{content: "";position: absolute;bottom: 0;left: -55px;height: 1px;background: #fff;opacity: 0.5;z-index: 10;}
.photo_box .row2 .bd .pic{margin-left: 60%;}
.photo_box .row2 .bd .txtwrap{width: 48%;left:3%;color: #595959;padding-top: 50px;top: -50px;background: rgba(255,255,255,0.75);}
.photo_box .row2 .bd .txt:after{width: 72%;left: 50%;background: rgba(0,0,0,.2);}
.photo_box .row3{padding: 110px 0;background-size: 100% auto;background-position: center bottom;background-repeat: no-repeat;}
.photo_box .row3 .hd ul{overflow: hidden;margin-right: -2px;margin-left: -2px;height: 317px;}
.photo_box .row3 .hd ul li{width: 20%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 44px 15px;height: 160px; border: 1px solid #eaeaea;float: left;margin-top: -1px; color: #5f5f5f;}
.photo_box .row3 .hd ul li .item{line-height: 24px;max-width: 250px;margin: 0 auto;padding: 0 10px;text-align: center;}
.photo_box .row3 .hd ul li:hover{color: #fff;background: #33a0fc;}
.photo_box .row3 .bd{margin-top: 130px;}
.photo_box .row3 .bd .pic{max-width: 1360px;margin:0 auto;text-align: center;}
.photo_box .row3 .bd .pic .mobile{display: none;}
.photo_box .row4 ul{width: 100.1%;}
.photo_box .row4 ul li{width: 33.333%;float: left;height: 460px;position: relative;overflow: hidden;}
.photo_box .row4 ul li:after{width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: #000;opacity:.25;z-index: 0;content: "";}
.photo_box .row4 ul li .picbg{height: 100%;transition: all 2s ease-out;-webkit-transition: all 2s ease-out;-o-transition: all 2s ease-out;-moz-transition: all 2s ease-out;-ms-transition: all 2s ease-out;}
.photo_box .row4 ul li .content{position: absolute;top: 0;text-align: center;color: #fff;font-size: 24px;line-height: 32px;z-index: 1;}
.photo_box .row4 ul li:hover:after{opacity: 0;}
.photo_box .row4 ul li:hover .picbg{-webkit-transform: scale(1.05);-moz-transform: scale(1.05);-o-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}
/*polarized*/
.polarized_box .innerbanner .content{top:53%; height:auto;}
.polarized_box .row{position: relative;color: #5f5f5f;}
.polarized_box .innertit{margin-bottom:25px;padding-bottom:25px;}
.polarized_box .row1 .mobile{display: none;}
.polarized_box .row1 .content{position: absolute;top: 0; bottom: 0; left: 0; right: 0;margin: auto;}
.polarized_box .row1 .txtwrap{margin-left: 6%;max-width: 680px;}
.polarized_box .row1 .innertit{text-align: left;}
.polarized_box .row1 .innertit:after{right: auto;transform-origin:0 0;-o-transform-origin:0 0;-moz-transform-origin:0 0;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;}
.polarized_box .row2{height: 550px;}
.polarized_box .row2 .btnwrap{position: absolute;bottom:45px;left: 0;width: 100%;}
.polarized_box .row2 .btnwrap .txt{display: none;}
.polarized_box .row2 .btnwrap .innertit{text-align: center;}
.polarized_box .row2 .btnwrap .btn{width: 190px;height: 45px;text-align: center;line-height: 45px;border: 2px solid #c3c1c2;color: #c3c1c2;font-size: 24px;margin: 0 auto;border-radius: 15px;cursor: pointer;}
.polarized_box .row2 .btnwrap .innertit{color: #fff;margin-bottom: 0;}
.polarized_box .row2 .btnwrap .innertit:after{display: none;}
.polarized_box .row2 .pop{max-width: 1290px;height: 420px;position: absolute;top: 0; bottom: 0; left: 0; right: 0;margin: auto;background: rgba(255,255,255,.85);overflow: auto;display: none;}
.polarized_box .row2 .pop .txtwrap{max-width: 950px;margin: 0 auto;overflow: auto;}
.polarized_box .row2 .pop .tb_c{padding: 50px;}
.polarized_box .row2 .pop .closebtn{font-size: 30px;position: absolute;top: 25px;right:25px;color: #b0b0b0;cursor: pointer;}
.polarized_box .row3{overflow: hidden;}
.polarized_box .row3 .txtwrap{ height: 540px;max-width: 855px;margin: 0 auto;}
.polarized_box .row3 .randomBg { position: absolute; top: 50%; height: 100%; margin-top: -270px;left: 0; right: 0; }
.polarized_box .row3 .randomBg .circleBg { position: absolute;width:1300px; height: 1300px; top: 50%; margin-top: -650px; left: 50%; margin-left: -650px; background-size: auto; background-position: center; background-repeat: no-repeat; transition: all 3s linear;-webkit-transition: all 3s linear;-o-transition: all 3s linear;-moz-transition: all 3s linear;-ms-transition: all 3s linear; }
.polarized_box .row4{overflow: hidden;text-align: center;}
.polarized_box .row4 .md6{padding: 150px 0;}
.polarized_box .row4 .lt{background: #ffe57f;}
.polarized_box .row4 .rt{background: #dae7f2;}
.polarized_box .row4 .box{position: relative;margin: 0 15px;display: inline-block;}
.polarized_box .row4 .imgs{width: 30%;position: absolute;top: 0; bottom: 0; left: 0; right: 0;margin:auto;z-index: 9;}
.polarized_box .row4 .mobile{display: none;}
.polarized_box .row4 .hovers{opacity: 0;}
.polarized_box .row4 .lt .hovers{transform:translateX(80px);-o-transform:translateX(80px);-ms-transform:translateX(80px);-moz-transform:translateX(80px);-webkit-transform:translateX(80px);}
.polarized_box .row4 .rt .hovers{transform:translateX(-80px);-o-transform:translateX(-80px);-ms-transform:translateX(-80px);-moz-transform:translateX(-80px);-webkit-transform:translateX(-80px);}
.polarized_box .row4 .box:hover .hovers{opacity: 1;transform:translateX(0px);-o-transform:translateX(0px);-ms-transform:translateX(0px);-moz-transform:translateX(0px);-webkit-transform:translateX(0px);transition: all 0.5s ease-out 0.3s;-webkit-transition: all 0.5s ease-out 0.3s;-o-transition: all 0.5s ease-out 0.3s;-moz-transition: all 0.5s ease-out 0.3s;-ms-transition: all 0.5s ease-out 0.3s;}
.polarized_box .row4 .lt .box:hover .imgs{left: 70%;}
.polarized_box .row4 .rt .box:hover .imgs{left: -70%;}
.polarized_box .row5,
.polarized_box .row6{padding: 70px 0;}
.polarized_box .row5{padding-bottom: 0;}
.polarized_box .hd .wrap{max-width: 1120px;border-bottom: 1px solid #c4c4c4;height: 100px;}
.polarized_box .hd ul li{float: left;text-align: center;cursor: pointer;}
.polarized_box .hd ul li span{display: inline-block;padding: 0 5px;font-size: 24px;color: #c4c4c4;line-height:94px;}
.polarized_box .hd ul li.active span{border-bottom: 6px solid #33a0fc;color: #000;}
.polarized_box .hd img{display: none;}
.polarized_box .bd{position: relative;}
.polarized_box .bd .contrast{height: 55px;background: rgba(0,0,0,.5);text-align: center;color:#fff;line-height: 55px;position: absolute;top: 0;left: 0;width: 100%;z-index: 99;font-size: 24px;}
/*materials*/
.innerbanner font{text-shadow:0px 3px 4px rgba(20,124,188,.5);}
.materials_box .innerbanner font{text-shadow:0px 3px 4px rgba(20,124,188,.5);}
.materials_box .row ul li{overflow: hidden;}
.materials_box .row .pic{text-align: center;color: #fff;background: #ff9a00;padding:80px 0 70px 0;overflow: hidden;}
.materials_box .row .pic img{display: inline-block;}
.materials_box .row .pic .posa{width: 100%;left: 0;}
.materials_box .row .pic .tit{top: 0;background:rgba(255,255,255,.6);height: 55px;line-height: 55px;font-size:20px;text-transform: uppercase;}
.materials_box .row .pic .smalls{bottom: 0;background: rgba(0,0,0,0.2);height: 40px;line-height: 40px;font-size: 14px;}
.materials_box .row .tb_c{padding: 30px 95px;}
.materials_box .row .txt p{font-size: 18px;color: #5f5f5f;}
.materials_box .row li:nth-child(2n) .md6{float: right;}
.materials_box .row li:nth-child(2) .pic{background: #5797ff;}
.materials_box .row li:nth-child(3) .pic{background: #ffd12b;}
.materials_box .row li:nth-child(4) .pic{background: #28befe;}
.materials_box .row li:nth-child(5) .pic{background: #fe1d42;}
.materials_box .row .pic .tit.animated{-webkit-animation-name:fadeInDown;animation-name:fadeInDown;}
.materials_box .row .pic .smalls.animated{-webkit-animation-name:fadeInUp;animation-name:fadeInUp;}
/*coatings*/
.coatings_box .innerbanner .content{top: 77.5%;height: auto;color: #000;text-transform: uppercase;}
.coatings_box .innerbanner h3{font-size:85px;}
.coatings_box .nav{position: relative;}
.coatings_box .nav .mobile{display: none;}
.coatings_box .nav li{position: absolute;height: 12%;z-index: 9;}
.coatings_box .nav li a{height: 100%;display: block;line-height: 9999;overflow: hidden;}
.coatings_box .nav li.Nano{width: 11.5%;top: 5.6%;left: 25.8%;}
.coatings_box .nav li.Clear{width: 11.5%;top: 24.1%;left: 23.2%;}
.coatings_box .nav li.Anti-Reflective{width: 14.5%;top:43.9%;left:18.6%;}
.coatings_box .nav li.Anti-Fog{width: 11.5%;top: 64.4%;left: 21.5%;}
.coatings_box .nav li.Mirrored{width: 11.5%;top:83.5%;left: 21.1%;}
.coatings_box .row{padding-top: 70px;}
.coatings_box .row .pic{margin-top: 70px;position: relative;}
.coatings_box .row .wrap{overflow: hidden;}
.coatings_box .list li{width: 33.333%;margin: 0 0 20px 0;float: left; }
.coatings_box .list li span{display: block;position: relative;padding:0 40px;color: #5f5f5f;font-size: 14px;line-height: 1.5 }
.coatings_box .list li span:after{content: "";width: 10px;height: 10px;background: #229bfc; position: absolute;top:6px; left: 10px;}
.coatings_box .row .txtwrap{width: 38.5%;position: absolute;bottom: 30px;right: 0;background: rgba(255,255,255,.95);padding: 30px 0;z-index: 9;}
.coatings_box .row .txt{padding: 0 70px;position: relative;}
.coatings_box .row .txt:after{content: "";position: absolute;top: 10px;left: 25px;background: #229bfc;width: 25px;height: 2px;}
.coatings_box .row .txt p{color: #808080;}
.coatings_box .row5 .list li{width: 50%;}
/*colorfit*/
.colorfit_box .innerbanner .content{height: 100%;top: 0;}
.colorfit_box .hd{margin: 45px 0;}
.colorfit_box .row{padding-top: 70px;}
.colorfit_box .row1 .wrap{max-width: 930px;padding: 0 30px;}
.colorfit_box .row1 .innertit{text-align: center;}
.colorfit_box .row1 .innertit:after{right: 0;transform-origin: 50% 50%;-o-transform-origin: 50% 50%;-moz-transform-origin: 50% 50%;-webkit-transform-origin: 50% 50%;-ms-transform-origin: 50% 50%;}
.colorfit_box .row2{height: auto;}
.colorfit_box .row2 .innertit:after{-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
.colorfit_box .row2 ul{overflow: hidden;}
.colorfit_box .row2 li{width: 25%;float: left;position: relative;}
.colorfit_box .row2 .picbg{background-size: auto;height: 735px;}
.colorfit_box .row2 .item{position: absolute;left: 50px;right: 50px;top: 50%;margin: 0 auto;transform:translate(0,-50%);-o-transform:translate(0,-50%);-ms-transform:translate(0,-50%);-moz-transform:translate(0,-50%);-webkit-transform:translate(0,-50%);}
.colorfit_box .row2 .txtwrap{background: rgba(0,0,0,0);padding:90px 35px;color: #fff;}
.colorfit_box .row2 .box{position: relative;padding-top:50px;}
.colorfit_box .row2 .tit{font-size: 22px;text-align: center;position: absolute;top:50%;width: 100%;transform:translate(0,-50%);-o-transform:translate(0,-50%);-ms-transform:translate(0,-50%);-moz-transform:translate(0,-50%);-webkit-transform:translate(0,-50%);transition: all 0.3s ease-out .3s;-webkit-transition: all 0.3s ease-out .3s;-o-transition: all 0.3s ease-out .3s;-moz-transition: all 0.3s ease-out .3s;-ms-transition: all 0.3s ease-out .3s;}
.colorfit_box .row2 .txt{opacity: 0;transform:translateY(-30px);-o-transform:translateY(-30px);-ms-transform:translateY(-30px);-moz-transform:translateY(-30px);-webkit-transform:translateY(-30px);}
.colorfit_box .row2 li{position: relative; transform-origin: 50% 50%;-o-transform-origin: 50% 50%;-moz-transform-origin: 50% 50%;-webkit-transform-origin: 50% 50%;-ms-transform-origin: 50% 50%;transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-ms-transition: all 0.2s ease-out;}
.colorfit_box .row2 li:after{content: "";width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: #000;opacity: 0;transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-ms-transition: all 0.2s ease-out;}
.colorfit_box .row2 li.leave{width: 23%;}
.colorfit_box .row2 li.active{width: 31%;}
.colorfit_box .row2 li.active .txtwrap{background: rgba(0,0,0,.3);transition: all 0.2s ease-out .2s;-webkit-transition: all 0.2s ease-out .2s;-o-transition: all 0.2s ease-out .2s;-moz-transition: all 0.2s ease-out .2s;-ms-transition: all 0.2s ease-out .2s;}
.colorfit_box .row2 li.active .tit{top: -10%;}
.colorfit_box .row2 li.active .txt{opacity: 1;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);transition: all 0.3s ease-out .75s;-webkit-transition: all 0.3s ease-out .75s;-o-transition: all 0.3s ease-out .75s;-moz-transition: all 0.3s ease-out .75s;-ms-transition: all 0.3s ease-out .75s;}
.colorfit_box .row2 li.leave:after{opacity:.4;}
.colorfit_box .row2 li.active:after{opacity: 0;}
/*博客*/
.blog_box{overflow: hidden;}
.blog_box .list{margin:0 -100px 0 -3px;}
.blog_box .list li{margin: 0 3px 6px 3px;height: 640px;overflow: hidden;position: relative;float: left;cursor: pointer;}
.blog_box .list li .content{position: absolute;bottom: 45px;left: 45px;right:45px;color: #fff;z-index: 9;max-width: 530px;font-size: 16px;}
.blog_box .list li .picbg{height: 100%;position: relative;transition: all 2s ease-out;-webkit-transition: all 2s ease-out;-o-transition: all 2s ease-out;-moz-transition: all 2s ease-out;-ms-transition: all 2s ease-out;}
.blog_box .list li .picbg:after{content: "";position: absolute;top: 0; bottom: 0; left: 0; right: 0;margin: auto;background: #000;opacity: .3;}
.blog_box .list li .content .txt{height: 48px;overflow: hidden;margin: 15px 0;}
.blog_box .content .tit{font-size: 24px;line-height: 1.2;}
.blog_box .list li:hover .picbg{-webkit-transform: scale(1.03);-moz-transform: scale(1.03);-o-transform: scale(1.03);-ms-transform: scale(1.03);transform: scale(1.03);}
.blog_box .list li:hover .picbg:after{opacity: 0;}
.blog_box .pop{position: fixed;width: 100%;height: 100%;top: 0;left: 0;z-index: 999;background: #fff;display: none;}
.blog_box .pop .row,
.blog_box .pop .md6,
.blog_box .pop .picbg,
.blog_box .pop .content{height: 100%;}
.blog_box .pop .md6{position: relative;}
.blog_box .pop .content{overflow: auto;padding:0 40px;height: 79%;}
.blog_box .pop .txt{padding: 115px 0 0 0;}
.blog_box .pop .txt p{font-size: 16px; color: #737373;}
.blog_box .pop .txt .tit{text-align: center;font-size: 34px;padding-bottom: 40px;white-space: normal;line-height: 1.5;}
.blog_box .pop .btnwrap{width: 100%;height: 20%;position: absolute;bottom: 0;left: 0;text-align: center;background: #fff;-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
.blog_box .pop .btn{width:80px;display: inline-block;margin: 0 30px;position: relative;top: 50%;transform:translateY(-50%);-o-transform:translateY(-50%);-ms-transform:translateY(-50%);-moz-transform:translateY(-50%);-webkit-transform:translateY(-50%);}
.blog_box .pop .btn i{height: 80px;border-radius: 50%;border: 1px solid #c8c8c8;text-align: center;line-height: 80px;font-size: 34px;color: #c8c8c8;cursor: pointer;display: block;}
.blog_box .pop .btn span{display: block;color: #c8c8c8;font-size: 14px;margin-top: 20px;}
.blog_box .pop .btn:hover i{background: #30a0fc;border-color: #30a0fc;color: #fff;}
.blog_box .pop .btn:hover span{color: #30a0fc;}
.blog_box .mCustomScrollBox{padding: 0 40px;}
.blog_box .mCSB_scrollTools{right: 0;width: 2px;}
.blog_box .mCSB_scrollTools .mCSB_draggerRail{width: 2px;background: #e3e3e3;}
.blog_box .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:2px;background: #30a0fc;}
.blog_box .mCSB_inside>.mCSB_container{margin-right: 0;}
/*news*/
.new_box .innerbanner font{text-shadow:0px 3px 4px rgba(0,0,0,.5);}
.new_box .wrap{overflow: hidden;padding: 105px 30px;}
.new_box .list{}
.new_box .list li{margin-bottom: 40px;box-shadow:0px 0px 12px 4px rgba(0,0,0,.1);overflow: hidden;width: 100.5%;}
.new_box .list .item{width: 33.333333333333%;float: left;background: #fff;display: block;position: relative; color: #000;}
.new_box .list li .item:after{content: "";position: absolute;top:0;left:0;width: 100%;height: 100%;border:1px solid #eaeaea;z-index: 1; }
.new_box .list .pic{height: 275px;width: 100.5%;overflow: hidden;}
.new_box .list .picbg{height: 100%;transition: all 2s ease-out;-webkit-transition: all 2s ease-out;-o-transition: all 2s ease-out;-moz-transition: all 2s ease-out;-ms-transition: all 2s ease-out;}
.new_box .list .txt{padding: 40px 25px;}
.new_box .list .name{font-size: 18px;height:60px;line-height: 30px;margin-bottom: 25px;margin-top: 15px;}
.new_box .list .con,
.new_box .list .time{color: #929292;}
.new_box .list .more{text-align: right;font-size: 16px;}
.new_box .list .con{height: 168px;line-height: 24px;}
.new_box .list .item:hover .picbg{-webkit-transform: scale(1.05);-moz-transform: scale(1.05);-o-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}
.new_box .list .item:hover .name{color: #33a0fc;}
.newdetail_box .wrap{max-width: 1200px;position: relative;}
@media screen and (max-width: 1200px) {
.newdetail_box .wrap{padding: 0 30px;}
}
.newdetail_box{color: #696969;}
.newdetail_box .name{font-size: 24px;color: #000;line-height: 32px;margin-bottom: 45px;text-align: center;}
.newdetail_box .row{position: relative;}
.newdetail_box .btnwrap{text-align: center;padding: 105px 0;border-bottom: 1px solid #e3e3e3;}
.newdetail_box .btnwrap .btn{display: inline-block;color:#b2b2b2;background: #fff; margin: 0 8px;font-size: 16px;width: 150px;line-height: 40px;border-radius: 40px;
background: -moz-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(255,255,255,0.5) 100%);
background: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%,rgba(255,255,255,0.5) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%,rgba(255,255,255,0.5) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a000000', endColorstr='#80ffffff',GradientType=0 );}
.newdetail_box .btnwrap .btn:hover{color:#fff;background:#30a0fc;
background: -moz-linear-gradient(top, rgba(49,160,252,1) 0%, rgba(49,160,252,0.8) 100%);
background: -webkit-linear-gradient(top, rgba(49,160,252,1) 0%,rgba(49,160,252,0.8) 100%);
background: linear-gradient(to bottom, rgba(49,160,252,1) 0%,rgba(49,160,252,0.8) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#31a0fc', endColorstr='#cc31a0fc',GradientType=0 ); box-shadow: 0 10px 28px 0 rgba(48,160,252,0.4);}
.newdetail_box .listwrap{width: 50%;float: right;}
.newdetail_box .listwrap .innertit{text-align: left;margin:45px 0 20px 3%;padding-bottom: 20px;font-size: 24px;}
.newdetail_box .listwrap .innertit:after{right: auto;transform-origin: 0 50%;-o-transform-origin: 0 50%;-moz-transform-origin: 0 50%;-webkit-transform-origin: 0 50%;-ms-transform-origin: 0 50%;}
.newdetail_box .list_box li{width:44%;float: left;margin: 0 3%;}
.newdetail_box .list_box .pic{height: 205px;}
.newdetail_box .list_box .picbg{height: 100%;}
.newdetail_box .list_box .name{font-size: 14px;color: #737373;line-height: 24px;text-align: left;margin-top: 15px;}
.newdetail_box .bdsharebuttonbox{width: 60px; position: fixed;top: 50%;left: 0;transform:translateY(-50%);-o-transform:translateY(-50%);-ms-transform:translateY(-50%);-moz-transform:translateY(-50%);-webkit-transform:translateY(-50%);z-index: 9999;}
.newdetail_box .bdsharebuttonbox a{margin: 0;width: 60px;height: 60px;line-height: 60px;background: none;text-indent: inherit;text-align: center;color: #fff;transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-ms-transition: all 0.2s ease-out;display: block;cursor: pointer;}
.newdetail_box .bdsharebuttonbox a i{font-size: 30px;display: block;height: 100%;}
.newdetail_box .bdsharebuttonbox .bds_fbook{background: #3d5192;}
.newdetail_box .bdsharebuttonbox .bds_twi{background: #38a8e1;}
.newdetail_box .bdsharebuttonbox .bds_linkedin{background: #0078b6;}
.newdetail_box .bdsharebuttonbox .bds_weixin{background: #47b809;}
.newdetail_box .bdsharebuttonbox a:hover{color: #fff;}
/*gallery*/
.gallery_box{overflow: hidden;padding-bottom: 120px;}
.gallery_box .picbg{position: absolute;top: 0;left: 0;width: 100%;}
.gallery_box .innerbanner:after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #000;opacity: 0.5;z-index: 0;}
.gallery_box .innerbanner .btn{width: 70px;height: 70px;text-align: center;line-height: 70px;margin: 0 auto;font-size:26px;cursor: pointer;position: relative;}
.gallery_box .innerbanner .btn:after{content: "";position: absolute;top: 0; bottom: 0; left: 0; right: 0; border: 2px solid #fff;border-left-color: #3695e6;border-radius: 50%; -webkit-animation: borderMove 2s infinite linear; -o-animation: borderMove 2s infinite linear; -moz-animation: borderMove 2s infinite linear; animation: borderMove 2s infinite linear;}
.gallery_box .innerbanner .name{font-size: 18px;text-align: center;margin-top: 25px;}
.gallery_box .innerbanner .name span{position: relative;padding: 0 15px;height: 20px;line-height: 20px;}
.gallery_box .innerbanner .name span:after,
.gallery_box .innerbanner .name span:before{content: "";position: absolute;top:50%;height: 1px;width: 50px;background: #fff;}
.gallery_box .innerbanner .name span:before{right: 100%;}
.gallery_box .innerbanner .name span:after{left: 100%;}
.gallery_box .row{height: 445px;position: relative;margin: 120px 0;}
.gallery_box .row:nth-child(2n+1):after{content: "";height: 100%;width: 110%;position: absolute;top:50%;left:0;background: #eaf5ff;transform:rotate(-7deg);-ms-transform:rotate(-7deg);-moz-transform:rotate(-7deg);-webkit-transform:rotate(-7deg);-o-transform:rotate(-10deg);transform-origin: 0 100%;-o-transform-origin: 0 100%;-moz-transform-origin: 0 100%;-webkit-transform-origin: 0 100%;-ms-transform-origin: 0 100%;}
.gallery_box .row .name{display: none;}
.gallery_box .row .tit{width: 33%;height: 445px;line-height: 445px;background: #31a0fc;position: absolute;top: 0;left: 53.5%;z-index: 9;}
.gallery_box .row .tit span{margin-left: 60%;color: #fff;font-size: 40px;text-shadow:0px 3px 4px rgba(20,124,188,.5);}
.gallery_box .nav{text-align: center;padding-top: 70px;}
.gallery_box .nav li{min-width: 165px;height: 60px;line-height: 60px;display: inline-block;padding: 0 15px;text-align: center;font-size: 24px;text-transform: uppercase;border: 2px solid #efefef;margin: 0 35px;position: relative;}
.gallery_box .nav li .line{position: absolute;background: #31a0fc;transition: all 0.5s ease-out;-webkit-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-ms-transition: all 0.5s ease-out;}
.gallery_box .nav li .tp,
.gallery_box .nav li .bt{height: 4px;width: 60px;-webkit-transform: scale(0,1);-moz-transform: scale(0,1);-o-transform: scale(0,1);-ms-transform: scale(0,1);transform: scale(0,1);}
.gallery_box .nav li .rt,
.gallery_box .nav li .lt{width: 4px;height: 35px;-webkit-transform: scale(1,0);-moz-transform: scale(1,0);-o-transform: scale(1,0);-ms-transform: scale(1,0);transform: scale(1,0);}
.gallery_box .nav li .tp{top:-2px;right:-2px;transform-origin: 100% 50%;-o-transform-origin: 100% 50%;-moz-transform-origin: 100% 50%;-webkit-transform-origin: 100% 50%;-ms-transform-origin: 100% 50%;}
.gallery_box .nav li .rt{top:-2px;right:-3px;transform-origin: 50% 0;-o-transform-origin: 50% 0;-moz-transform-origin: 50% 0;-webkit-transform-origin: 50% 0;-ms-transform-origin: 50% 0;}
.gallery_box .nav li .bt{bottom:-2px;left:-2px;transform-origin: 0 50%;-o-transform-origin: 0 50%;-moz-transform-origin: 0 50%;-webkit-transform-origin: 0 50%;-ms-transform-origin: 0 50%;}
.gallery_box .nav li .lt{bottom:-2px;left:-3px;transform-origin: 50% 100%;-o-transform-origin: 50% 100%;-moz-transform-origin: 50% 100%;-webkit-transform-origin: 50% 100%;-ms-transform-origin: 50% 100%;}
.gallery_box .nav li:hover .line{-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
.gallery_box .row .swiper{position: relative;z-index: 9;}
.gallery_box .row .swiper{width: 58%;margin-left: 6%;margin-top: 60px;position: relative;float: left;}
.gallery_box .row .swiper li{height: 325px;overflow: hidden;float:left;position: relative;cursor: pointer;}
.gallery_box .row .swiper li:after{content: "";width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: #000;opacity: 0.3;}
.gallery_box .row .swiper li .picbg{height: 100%;transition: all 2s ease-out;-webkit-transition: all 2s ease-out;-o-transition: all 2s ease-out;-moz-transition: all 2s ease-out;-ms-transition: all 2s ease-out;}
.gallery_box .row .swiper li:hover:after{opacity: 0;}
.gallery_box .row .swiper li:hover .picbg{-webkit-transform: scale(1.05);-moz-transform: scale(1.05);-o-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}
.gallery_box .row .swiper .btn{background:#fff;width: 45px;height: 65px;text-align: center;line-height: 65px;font-size: 30px;color: #ccc;margin-top: -32px;}
.gallery_box .swiper-button-next{right: 0;}
.gallery_box .swiper-button-prev{left: 0; }
.gallery_box .row:nth-child(2n) .swiper{margin-left: 34.6%;}
.gallery_box .row:nth-child(2n) .tit{left: 13%;}
.gallery_box .row:nth-child(2n) .tit span{margin-left: 40px;}
.gallery_box .pop{width: 100%;height: 100%;position: fixed;top: 0;left: 0;z-index: 999;background: rgba(0,0,0,0.8);display: none;}
.gallery_box .pop .swiper-container{width:58.8%;height:72%;margin: 0 auto;position:absolute;top: 0; bottom: 0; left: 0; right: 0;margin:auto;}
.gallery_box .pop .swiper-container .picbg{height: 90%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;background-size: contain;background-repeat: no-repeat;}
.gallery_box .pop .name{display: block;position: absolute;bottom: 0;left: 0;width: 100%;/*background: #31a0fc;*/color: #fff;text-align: center;line-height: 45px;font-size: 20px;}
.gallery_box .pop .btn{width:94px;height:94px;text-align: center;line-height: 95px;position: absolute;top: 50%;margin-top:-27px;border-radius: 50%;border: 1px solid #fff; font-size:40px;color: #fff;background: none;}
.gallery_box .pop .swiper-button-prev{left: 7%;}
.gallery_box .pop .swiper-button-next{left:87%;}
.gallery_box .pop .closebtn{border:0;top:0;margin-top: 0;right: 0;cursor: pointer; }
.gallery_box .pop .closebtn:hover{color: #31a0fc;}
.gallery_box .playvideo{height: 100%; width: 100%;}
.gallery_box video{width: 100%;position: absolute;left: 0;top: 0;}
/*图片拖动*/
.swipe-container .twentytwenty-handle{height:28px;width:28px;position:absolute;left:50%;top:50%;margin-left:-14px;margin-top:-14px;border:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;z-index:40;cursor:pointer;background:url("../images/slider-grip.png") no-repeat;}
.swipe-container .twentytwenty-handle .twentytwenty-left-arrow,.swipe-container .twentytwenty-handle .twentytwenty-right-arrow{display:none}
/*@media only screen and (max-width:800px){.sliderDemo .landing-bottom-container{margin:50px 20px}
.sliderDemo .landing-bottom-container .container{margin:0;padding-bottom:0}
}
@media only screen and (max-width:767px){.sliderDemo .landing-bottom-container{margin:50px 20px}
.sliderDemo .landing-bottom-container .container{margin:0}
.sliderDemo .landing-bottom-container .container .row-fluid .span6{width:50%;float:left}
}
@media only screen and (max-width:600px){.sliderDemo{max-width:524px}
.sliderDemo .landing-bottom-container{margin:50px 20px}
.sliderDemo .landing-bottom-container .container{margin:0}
.sliderDemo .landing-bottom-container .container .row-fluid .span6{width:50%;float:left}
}*/
.twentytwenty-horizontal .twentytwenty-handle:before,.twentytwenty-horizontal .twentytwenty-handle:after,.twentytwenty-vertical .twentytwenty-handle:before,.twentytwenty-vertical .twentytwenty-handle:after{content:" ";display:block;background:white;position:absolute;z-index:30;-webkit-box-shadow:0 0 12px rgba(51,51,51,0.5);-moz-box-shadow:0 0 12px rgba(51,51,51,0.5);box-shadow:0 0 12px rgba(51,51,51,0.5)}
.twentytwenty-horizontal .twentytwenty-handle:before,.twentytwenty-horizontal .twentytwenty-handle:after{width:4px;height:9999px;left:50%;margin-left:-1.5px}
.twentytwenty-vertical .twentytwenty-handle:before,.twentytwenty-vertical .twentytwenty-handle:after{width:9999px;height:3px;top:50%;margin-top:-1.5px}
.twentytwenty-before-label,.twentytwenty-after-label,.twentytwenty-overlay{position:absolute;top:0;width:100%;height:100%}
.twentytwenty-before-label,.twentytwenty-after-label,.twentytwenty-overlay{-webkit-transition-duration:.5s;-moz-transition-duration:.5s;transition-duration:.5s}
.twentytwenty-before-label,.twentytwenty-after-label{-webkit-transition-property:opacity;-moz-transition-property:opacity;transition-property:opacity}
.twentytwenty-before-label:before,.twentytwenty-after-label:before{color:white;font-size:13px;letter-spacing:.1em}
.twentytwenty-before-label:before,.twentytwenty-after-label:before{position:absolute;background:rgba(255,255,255,0.2);line-height:38px;padding:0 20px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}
.twentytwenty-horizontal .twentytwenty-before-label:before,.twentytwenty-horizontal .twentytwenty-after-label:before{top:50%;margin-top:-19px}
.twentytwenty-vertical .twentytwenty-before-label:before,.twentytwenty-vertical .twentytwenty-after-label:before{left:50%;margin-left:-45px;text-align:center;width:90px}
.twentytwenty-left-arrow,.twentytwenty-right-arrow,.twentytwenty-up-arrow,.twentytwenty-down-arrow{width:0;height:0;border:6px inset transparent;position:absolute}
.twentytwenty-left-arrow,.twentytwenty-right-arrow{top:50%;margin-top:-6px}
.twentytwenty-up-arrow,.twentytwenty-down-arrow{left:50%;margin-left:-6px}
.twentytwenty-container{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;z-index:0;overflow:hidden;position:relative;-webkit-user-select:none;-moz-user-select:none}
.twentytwenty-container img{max-width:100%;position:absolute;top:0;display:block}
.twentytwenty-container.active .twentytwenty-overlay,.twentytwenty-container.active :hover.twentytwenty-overlay{background:transparent}
.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-before-label,.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-after-label,.twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-before-label,.twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-after-label{opacity:0}
.twentytwenty-container *{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}
.twentytwenty-before-label{opacity:0}
.twentytwenty-before-label:before{content:"Before"}
.twentytwenty-after-label{opacity:0}
.twentytwenty-after-label:before{content:"After"}
.twentytwenty-horizontal .twentytwenty-before-label:before{left:10px}
.twentytwenty-horizontal .twentytwenty-after-label:before{right:10px}
.twentytwenty-vertical .twentytwenty-before-label:before{top:10px}
.twentytwenty-vertical .twentytwenty-after-label:before{bottom:10px}
.twentytwenty-overlay{-webkit-transition-property:background;-moz-transition-property:background;transition-property:background;background:transparent;z-index:25}
.twentytwenty-overlay:hover{background:rgba(0,0,0,0.5)}
.twentytwenty-overlay:hover .twentytwenty-after-label{opacity:1}
.twentytwenty-overlay:hover .twentytwenty-before-label{opacity:1}
.twentytwenty-before{z-index:20}
.twentytwenty-after{z-index:10}
.twentytwenty-handle{height:38px;width:38px;position:absolute;left:50%;top:50%;margin-left:-22px;margin-top:-22px;border:3px solid white;-webkit-border-radius:1000px;-moz-border-radius:1000px;border-radius:1000px;-webkit-box-shadow:0 0 12px rgba(51,51,51,0.5);-moz-box-shadow:0 0 12px rgba(51,51,51,0.5);box-shadow:0 0 12px rgba(51,51,51,0.5);z-index:40;cursor:pointer}
.twentytwenty-horizontal .twentytwenty-handle:before{bottom:50%;margin-bottom:22px;-webkit-box-shadow:0 3px 0 white,0 0 12px rgba(51,51,51,0.5);-moz-box-shadow:0 3px 0 white,0 0 12px rgba(51,51,51,0.5);box-shadow:0 3px 0 white,0 0 12px rgba(51,51,51,0.5)}
.twentytwenty-horizontal .twentytwenty-handle:after{top:50%;margin-top:22px;-webkit-box-shadow:0 -3px 0 white,0 0 12px rgba(51,51,51,0.5);-moz-box-shadow:0 -3px 0 white,0 0 12px rgba(51,51,51,0.5);box-shadow:0 -3px 0 white,0 0 12px rgba(51,51,51,0.5)}
.twentytwenty-vertical .twentytwenty-handle:before{left:50%;margin-left:22px;-webkit-box-shadow:3px 0 0 white,0 0 12px rgba(51,51,51,0.5);-moz-box-shadow:3px 0 0 white,0 0 12px rgba(51,51,51,0.5);box-shadow:3px 0 0 white,0 0 12px rgba(51,51,51,0.5)}
.twentytwenty-vertical .twentytwenty-handle:after{right:50%;margin-right:22px;-webkit-box-shadow:-3px 0 0 white,0 0 12px rgba(51,51,51,0.5);-moz-box-shadow:-3px 0 0 white,0 0 12px rgba(51,51,51,0.5);box-shadow:-3px 0 0 white,0 0 12px rgba(51,51,51,0.5)}
.twentytwenty-left-arrow{border-right:6px solid white;left:50%;margin-left:-17px}
.twentytwenty-right-arrow{border-left:6px solid white;right:50%;margin-right:-17px}
.twentytwenty-up-arrow{border-bottom:6px solid white;top:50%;margin-top:-17px}
.twentytwenty-down-arrow{border-top:6px solid white;bottom:50%;margin-bottom:-17px}
.swipe-container .twentytwenty-handle:before{bottom:50%;margin-bottom:13px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background:#33a0fc}
.swipe-container .twentytwenty-handle:after{top:50%;margin-top:13px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background:#33a0fc}
.coatings_box .scroll_down{display: none;}
#particle{width:100%;height:100%;position:absolute;top:0px;left:0px;pointer-events:none;z-index:20;}
.ani,
.header_box a,
.header_box .head_rt,
.footer_box .links li a,
.ind_box .banner .page span,
.ind_box .row3 li:after,
.ind_box .row5 ul li:before,
.ind_box .row5 ul .picbg:before,
.header_box .menu .down a,
.about_box .nav li a,
.about_box .nav li,
.photo_box .row3 .hd ul li,
.photo_box .row4 ul li:after,
.blog_box .list li .picbg:after,
.new_box .list .name,
.gallery_box .row .swiper li:after{transition: all 0.3s ease-out;-webkit-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;}
/*.SourceE{ font-family: 'SourceE', Arial, "Helvetica Neue", Helvetica, sans-serif;}*/
/*.SourceN{ font-family: 'SourceN', Arial, "Helvetica Neue", Helvetica, sans-serif;}*/
.common_hover{position: relative;overflow: hidden;z-index: 1;}
.common_hover:before{content: "";position: absolute;z-index: -1;top: 0;left: 0;right: 0;bottom: 0;background: #33a0fc;-webkit-transform: scaleY(0);transform: scaleY(0);-webkit-transform-origin: 50% 0;transform-origin: 50% 0;-webkit-transition-property: transform;transition-property: transform;-webkit-transition-duration: 0.5s;transition-duration: 0.5s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.common_hover:hover{color: #fff;}
.common_hover:hover:before{webkit-transform: scaleY(1); transform: scaleY(1);-webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}
@media screen and (max-width: 1600px) {
.quality_box .row1 li{padding: 40px 0;}
.quality_box .innertit{font-size: 24px;}
.quality_box .row1 .txt p, .quality_box .row1 dl dd{font-size: 14px;line-height: 24px;}
}
@media screen and (max-width: 1444px) {
p{line-height: 20px;}
body{font-size: 13px;}
.wrap_header,
.header_box .head_lt .logo,
.header_box{height: 60px;}
.wrap_header{width: 220px;}
.header_box .head_lt{width: 135px;}
.header_box{line-height: 60px;}
.header_box .menu,
.header_box .lang,
.header_box .menu .down a{font-size: 16px;}
.header_box .menu li{padding: 0 16px;}
.header_box .moveline span{width: 40px;}
.header_box .head_lt i{width: 20px;font-size: 20px;}
.header_box .head_lt .logo{width: 70px;}
.header_box .menu .down a{height: 40px;line-height: 40px;padding: 0 15px;}
.ind_box .banner h3{font-size: 44px;height: 44px;}
.ind_box .banner p{font-size: 20px;}
.ind_box .banner .line{height: 5px;}
.commontit{font-size: 30px;margin-bottom: 30px;}
.ind_box .row2 ul li h4{font-size: 24px;}
.ind_box .row2 ul li .line{height: 4px;margin: 20px 0;}
.about_box .nav li a{font-size: 18px;}
.about_box .nav{height: 55px;line-height: 55px;}
.innertit{font-size: 28px;padding-bottom: 30px;}
.innertit .smalls{font-size: 18px;}
.about_box .row2 ul li h4{font-size: 16px;padding-bottom: 20px;margin-bottom: 20px;}
.about_box .row2 ul li h4:after{height: 2px;}
.about_box .row4 ul li h4{font-size: 20px;}
.quality_box .row1 .txt p, .quality_box .row1 dl dd{font-size: 13px;line-height: 24px;}
.quality_box .row1 .txt{max-width: 90%;}
.quality_box .row1{padding: 20px 0 200px 0;}
.quality_box .innertit{font-size: 24px;}
.quality_box .innertit .smalls{font-size: 16px;}
.innerbanner h3{font-size: 100px;}
.innerbanner .smalls{font-size: 30px;}
.photo_box .row2 .hd .txtwrap, .photo_box .row2 .bd .txtwrap{font-size: 13px;line-height: 24px;}
.photo_box .row2 .txt{padding: 0 40px 35px 40px;}
.photo_box .row3 .hd ul li .item{line-height: 20px;}
.photo_box .row4 ul li .content{font-size:20px;}
.polarized_box .bd .contrast{font-size: 18px;height: 45px;line-height: 45px;}
.polarized_box .hd .wrap{height: 60px;}
.polarized_box .hd ul li span{line-height: 77px;font-size: 18px;}
.polarized_box .hd ul li.active span{border-bottom-width: 3px;}
.polarized_box .row2 .btnwrap .btn{font-size: 18px;}
.materials_box .row .txt p{font-size: 16px;line-height: 28px;}
.materials_box .row .tb_c{padding: 30px 50px;}
.colorfit_box .row2 .item{right: 30px;left: 30px;}
.colorfit_box .row2 .tit{font-size: 18px;}
.colorfit_box .row2 .txtwrap{padding: 80px 25px;}
.blog_box .content .tit{font-size: 20px;}
.blog_box .list li .content{font-size: 13px;}
.blog_box .list li .content .txt{height: 40px;}
.blog_box .pop .btnwrap{padding: 0;height: 17%;}
.blog_box .pop .content{height: 82%;}
.blog_box .pop .btn i{width: 45px;height: 45px;line-height: 45px;margin: 0 auto;font-size: 20px;}
.blog_box .pop .btn span{font-size: 13px;margin-top: 5px;}
.blog_box .pop .txt .tit{font-size: 24px;padding-bottom: 30px;}
.blog_box .pop .txt p{font-size: 13px;}
.blog_box .mCustomScrollBox,
.blog_box .pop .content{padding: 0 20px;}
.gallery_box .nav li{font-size: 18px;}
.new_box .list .name{font-size: 16px;line-height: 26px;height: 52px;}
.new_box .list .more{font-size: 13px;}
.new_box .list .con{line-height: 20px;height: 140px;}
.ind_box .row4 .txtwrap{height: 240px;}
}
@media screen and (max-width: 1280px) {
.ind_box .banner .con{top: 45%;}
.about_box .row2 .wrap, .about_box .row3 .wrap{margin: 0 2%;}
.photo_box .row1 .content{max-width: 650px;}
.coatings_box .innerbanner .content{top: 72%;}
.coatings_box .innerbanner h3{font-size: 70px;}
.coatings_box .row{padding-top: 35px;}
.coatings_box .row .pic{margin-top: 35px;}
.coatings_box .list li{margin-bottom: 10px;}
.coatings_box .innertit{margin-bottom: 35px;}
.innertit{font-size: 24px;}
.innerbanner h3{font-size: 90px;}
.innerbanner .smalls{font-size: 24px;}
.gallery_box .row .swiper{width: 70%;margin-left: 3%;}
.gallery_box .row:nth-child(2n) .swiper{margin-left: 26%;}
.gallery_box .row:nth-child(2n) .tit{left: 3%;}
.gallery_box .row .tit{left: 58%;}
.gallery_box .row .tit span{font-size: 34px;margin-left: 55%;}
.gallery_box .row:nth-child(2n) .tit span{margin-left: 25px;}
}
@media screen and (max-width: 1024px) {
.commontit{font-size: 24px;margin-bottom: 20px;}
.ind_box .row1 .more{height: 40px;border-width: 1px;line-height: 40px;}
.ind_box .row1 .txtwrap{width: 55%;}
.ind_box .row2{margin-top: 40px;}
.ind_box .row5 ul li{margin: 0 15px;width: 240px;height: 300px;}
.ind_box .row4 .txt .line,
.ind_box .row2 ul li .line{height:2px;}
.header_box{margin: 0 15px;}
.header_box .head_lt{width: 120px;}
.header_box .menu_box{padding-left: 170px;padding-right: 80px;}
.header_box .menu, .header_box .lang, .header_box .menu .down a{font-size: 14px;}
.header_box .moveline{display: none;}
.header_box .menu li.active{border-bottom: 2px solid #fff;}
.ind_box .row2 ul li:nth-child(1) .txtwrap:before, .ind_box .row2 ul li:last-child .txtwrap:before{width: 200px;height: 4px;}
.ind_box .row2 ul li:nth-child(1) .txtwrap:after, .ind_box .row2 ul li:last-child .txtwrap:after{width: 4px;height: 80px;}
.ind_box .row2 ul li h4{font-size: 18px;}
.about_box .nav li a{font-size: 16px;}
.about_box .nav .wrap{margin: 0;}
.about_box .row{padding: 60px 0;}
.innertit{margin-bottom: 40px;}
.about_box .row2 ul li{width: 50%;}
.about_box .row2 .wrap, .about_box .row3 .wrap{margin: 0 5%;}
.about_box .row3 .wrap{padding: 60px 0;}
.about_box .row4 ul .item{padding: 30px 10px;}
.quality_box .row1 .style1 .picwrap{width: 100%;border: 0;padding: 10px;}
.quality_box .row1 .style1 .txtwrap{height: 570px;}
.quality_box .row1 .picwrap:after{display: none;}
.quality_box .row1 .style2 .box{height: 400px;}
.quality_box .row1 .style3 .box{height: 380px;}
.quality_box .row1 .txt{width: 100%;}
.photo_box .row1 .content{max-width:420px;}
.photo_box .row1 .innertit{margin-bottom: 10px;font-size: 16px;padding-bottom: 15px;}
.photo_box .row1 p{font-size: 12px;}
.photo_box .row3 .hd ul li{width: 50%;}
.photo_box .row3 .hd ul{height: auto;}
.polarized_box .row1 .txtwrap{margin-left: 20px;max-width: 500px;font-size: 12px;}
.polarized_box .row3 .randomBg{display: none;}
.polarized_box .row3 .txtwrap{height: auto;padding: 80px 20px;}
.coatings_box .list li span{font-size: 13px;}
.colorfit_box .row2 li{width: 50%;}
.colorfit_box .row2 .picbg{height: 420px;}
.colorfit_box .row2 .tit{top: 0;}
.colorfit_box .row2 .txt{opacity: 1; transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
.colorfit_box .row2 .txtwrap{background: rgba(0,0,0,.3);}
.blog_box .list li{height: 420px;}
.blog_box .list li .content{left: 25px;bottom: 25px;}
.gallery_box .row .swiper li{height: 220px;}
.gallery_box .row,
.gallery_box .row .tit{height: 320px;}
.gallery_box .row .tit{line-height: 320px;}
.gallery_box .row .swiper{margin-top: 50px;}
.gallery_box .row:nth-child(2n+1):after{height: 70%;}
.new_box .list .item{width: 50%;}
.new_box .list li{box-shadow: none;}
.new_box .list li .item:after{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.ind_box .banner .page span{display: inline-block;width:10px;height:10px;}
.ind_box .row6 .formbox{width: 100%;}
.ind_box .row6 .input_txt{width: 70%;}
.ind_box .row6 .input_btn{width: 30%;margin-left: 0;font-size: 20px;}
.quality_box .innerbanner .content{font-size: 50px;right: 50px;bottom: 100px;}
}
.photo_box .row4 .mobile{display: none;}
.polarized_box .row2 .mobile{display: none;}
.polarized_box .innerbanner img,
.photo_box .innerbanner img,
.coatings_box .innerbanner img,
.materials_box .innerbanner img{display: block;opacity: 0;}
@media screen and (max-width: 640px) {
.about_box .row1 .txt{text-align: left;}
.ind_box .row4 .nav{border:0;}
.colorfit_box .row1 .innertit{font-size: 18px;}
.polarized_box .innerbanner img,
.photo_box .innerbanner img,
.coatings_box .innerbanner img,
.materials_box .innerbanner img{opacity: 1;}
.polarized_box .row2{background: none !important;height: auto;}
.photo_box .row4 .pc,
.polarized_box .row2 .pop .closebtn,
.polarized_box .row2 .btnwrap{display: none;}
.photo_box .row4 .mobile,
.polarized_box .row2 .mobile{display: block;}
.footer_box .links{float: none;}
.footer_box .links li{padding: 5px 10px;display: inline-block;float: left;}
.footer_box .copyright{width: 100%;text-align: center;padding: 10px 0;}
.footer_box .share a{font-size: 30px;}
.wrap_header, .header_box{width: 100%;}
.header_box{margin: 0;}
.header_box .head_lt{width:auto;position: relative;-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
.header_box .head_lt .category{float: right;margin-right: 0;}
.header_box .head_rt{-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);transition:none;-webkit-transition:none;-o-transition:none;-moz-transition:none;-ms-transition:none;transform-origin: 0 0;-o-transform-origin: 0 0;-moz-transform-origin: 0 0;-webkit-transform-origin: 0 0;-ms-transform-origin: 0 0;display: none;border-top: 1px solid #fff;}
.header_box .menu_box{padding: 0;border: 0;}
.header_box .lang{position: relative;right: 0;width: 100%;}
.header_box .lang a{width: 49%;text-align: center;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;}
.header_box .menu,
.header_box .menu li{width: 100%;}
.header_box .menu li{padding: 0;line-height: 40px;}
.header_box .menu li.active{border: 0;}
.header_box .menu .down{position: relative;}
.header_box .menu .down a{width: 100%;text-align: center;padding: 0;}
.ind_box .banner .con{height: auto;padding: 30px 0;}
.ind_box .banner h3{font-size:20px;height: auto;line-height: 30px;}
.ind_box .banner p{font-size: 15px;}
.ind_box .banner .wrap{margin: 0;display: block;}
.ind_box .banner .line{clear: both;}
.ind_box .banner .tb_c{padding: 0 15px;display: block;}
.ind_box .row1{height: auto;}
.ind_box .row1 .pic{width: 100%;margin-bottom: 30px;}
.ind_box .row1 .content{position: relative;clear: both;}
.ind_box .row1 .txtwrap{width: 100%;}
.ind_box .row2 ul li:hover, .ind_box .row2 ul li:hover h4{color:#494c4f;}
.ind_box .row2 ul li:hover .box{background: #fff;}
.ind_box .row2 ul li:hover .line{background: #32a0fc;}
.ind_box .row5 ul li:hover .name{font-size: 19px;}
.picbg{background: none !important;}
.picbg img{display: block;opacity: 1;}
.ind_box .row1 .more{margin: 25px auto 0 auto;}
.ind_box .row2 .commontit{text-align: center;}
.quality_box .row2 .pic{top: -20px;}
.quality_box .row2 .pic img{max-width: 100%;}
.ind_box .row2 ul li{height: auto;}
.ind_box .row2 ul li .md6{width: 100%;}
.ind_box .row2 ul li:nth-child(1) .txtwrap:before, .ind_box .row2 ul li:last-child .txtwrap:before,
.ind_box .row2 ul li:nth-child(1) .txtwrap:after, .ind_box .row2 ul li:last-child .txtwrap:after{display: none;}
.ind_box .row2 ul li .txt{padding: 20px 0;}
.ind_box .row3{padding: 60px 0;}
.ind_box .row3 li:after{height: 100%;top: 0;}
.ind_box .row3 li{width: 50%;border-bottom: 1px solid #cfd9e1;}
.ind_box .row3 li:nth-child(1),
.ind_box .row3 li:nth-child(2),
.ind_box .row3 li:nth-child(3){width: 33.333%;}
.ind_box .row3 li:before{width: 1px;}
.ind_box .row4 .nav li{min-width: inherit;padding: 0 15px 18px 15px;}
.ind_box .row4 .nav li.active{border-bottom: 2px solid #28abff;}
.ind_box .row4 .nav .moveline{display: none;}
.moveline{height: 2px;}
.ind_box .row4 .nav .find_nav_left{height: 42px;}
.ind_box .row4 .txtwrap{height: auto;margin: 30px 0;}
.ind_box .row4 .txt{position: relative;top: 0;right: 0;margin-top: 20px;height: auto;}
.ind_box .row4 .tb_c{padding: 50px 20px;}
.ind_box .row5{padding: 35px 15px;}
.ind_box .row5 ul{display: block;}
.ind_box .row5 ul li{width: 100%;margin:30px 0;float: none;height: auto;}
.ind_box .row5 ul li img{width: 100%;}
.ind_box .row5 ul li:hover .picbg{-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
.ind_box .row5 ul .picbg:before{opacity: 0.6;}
.ind_box .row5 ul li:before{opacity: 0;}
.about_box .nav li{width: 50%;}
.about_box .nav{height: auto;line-height: 35px;}
.about_box .nav li a{font-size: 14px;}
.about_box .nav li:hover{background: #edf7ff;}
.about_box .nav li:hover a{color: #3da5fc;}
.about_box .row2 ul li{width: 100%;}
.about_box .row2 ul li .pic,
.about_box .row2 ul li .txt{height: auto;}
.about_box .row2 ul li .txtwrap{padding: 30px 15px;}
.about_box .row2 .wrap, .about_box .row3 .wrap{margin: 0 15px;}
.about_box .row3 .txt{padding: 0 15px;margin: 0;font-size: 12px;}
.about_box .row4 ul li{width: 100%;}
.about_box .row4 ul .item,
.about_box .row4 ul li,
.about_box .row4 ul li:nth-child(1),
.about_box .row4 ul li:nth-child(4n){border: 0;}
.about_box .row4 ul .item{border-bottom: 1px solid #dcdcdc;}
.about_box .row4 ul li .txt,
.quality_box .row1 .style2 .box,
.quality_box .row1 .style3 .box,
.quality_box .row1 .style1 .txtwrap{height: auto;}
.quality_box .row .md6,
.quality_box .row1 .style3 .picbg{width: 100%;}
.quality_box .row1 li{padding: 30px 0 0 0;}
.quality_box .row1 .style1 .picwrap{padding: 0;height: auto;}
.quality_box .row1 .txt{max-width: 100%;}
.quality_box .innertit{font-size: 20px;line-height: 34px;margin-bottom: 5px;}
.quality_box .innertit .smalls{line-height: 24px;margin-top: 8px;}
.quality_box .row1 .txtwrap{padding: 30px 0 0 0;}
.quality_box .row1{padding-bottom: 80px;}
.body_box{margin-top: 60px;}
.ind_box{margin-top: 0;}
.windowH{height: auto !important;}
.innerbanner .scroll_down{display: none;}
.innerbanner font.none{width: 8px;}
.innerbanner h3{font-size:24px;}
.innerbanner .smalls{font-size: 13px;}
.innerbanner h3, .innerbanner .smalls{padding: 5px 0;}
.photo_box .row1 .content{position: relative;max-height:inherit;padding: 30px 15px;}
.photo_box .row2 .hd .pic, .photo_box .row2 .bd .txtwrap,
.photo_box .row2 .hd .txtwrap, .photo_box .row2 .bd .pic{width: 100%;}
.photo_box .row2 .hd .txtwrap, .photo_box .row2 .bd .txtwrap{position: relative;top: 0;left: 0;width: 100%;height: auto;}
.photo_box .row2 .bd .txtwrap{padding-top: 0;}
.photo_box .row2 .txt{padding: 30px 15px;}
.photo_box .row2 .hd .txt:after{display: none;}
.photo_box .row2 .bd .pic{margin-left: 0;}
.photo_box .row3 .hd ul li{padding: 30px 10px;}
.photo_box .row4 ul li{width: 100%;height: auto;}
.photo_box .row4 ul li .content{bottom: 0;margin: auto 0;}
.polarized_box .innerbanner .content{top: 50%;transform:translateY(-50%);-o-transform:translateY(-50%);-ms-transform:translateY(-50%);-moz-transform:translateY(-50%);-webkit-transform:translateY(-50%);}
.polarized_box .row1 .pc{display: none;}
.polarized_box .row1 .mobile{display: block;}
.polarized_box .row1 .content{position: relative;padding:40px 0;}
.polarized_box .row2{text-align: center;}
.polarized_box .row2 .innertit{font-size: 18px;}
.polarized_box .row2 .btnwrap .btn{border-width: 1px;font-size: 14px;width: auto;padding: 0 25px;display: inline-block;}
.polarized_box .row2 .pop{height: 100%;display: block;position: relative;}
.polarized_box .row2 .pop .tb_c{padding: 30px 15px;}
.polarized_box .row3 .txtwrap{padding:40px 0;}
.polarized_box .row4 .md6{width: 100%;padding: 60px 0;}
.polarized_box .row4 .imgs{position: relative;}
.polarized_box .row4 .hovers{display: none;}
.polarized_box .row4 .mobile{display: block;margin-top: 15px;}
.polarized_box .bd .contrast{position: relative;background: #000;font-size: 12px;height: 30px;line-height: 30px;}
.polarized_box .hd ul li span{line-height: 40px;font-size: 13px;}
.polarized_box .hd .wrap{height: 42px;}
.polarized_box .row4 .lt .box:hover .imgs{left: 0;}
.polarized_box .row4 .rt .box:hover .imgs{left: 0;}
.materials_box .row .md6{width: 100%;}
.materials_box .row .pic .tit{font-size: 18px;height: 50px;line-height: 50px;}
.materials_box .row .pic .smalls{font-size: 12px;height: 50px;line-height: 20px;display: table;white-space: normal;}
.materials_box .row .pic .smalls span{display: table-cell;vertical-align: middle;}
.materials_box .row .txt p{font-size: 13px;}
.materials_box .innerbanner .content{bottom: 0;margin: auto 0;}
.coatings_box .row .pic{margin-top: 20px;}
.coatings_box .row .txtwrap{position: relative;width: 100%;padding: 10px 0;margin-top:10px; bottom: 0;}
.coatings_box .innerbanner h3{font-size: 18px;}
.coatings_box .list li{width: 100%;}
.coatings_box .row .txt{padding: 0 15px 0 55px;}
.coatings_box .row .txt:after{width:15px;left: 15px;}
.coatings_box .list li span{font-size: 12px;padding: 0 0 0 15px;}
.coatings_box .list li span:after{width: 5px;height: 5px;left: 0;}
.colorfit_box .row1 .wrap{padding: 0;}
.colorfit_box .row{padding-top: 40px;}
.colorfit_box .row2 li{width: 100%;}
.colorfit_box .row2 .picbg{height: 180px;overflow: hidden;}
.colorfit_box .row2 .item{position: relative;top: 0;left: 0;right: 0;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
.colorfit_box .row2 .txtwrap{padding: 40px 15px;background: #fff;color: #000;}
.colorfit_box .row2 li:after{display: none;}
.colorfit_box .row2 .box{margin-top: 30px;}
.blog_box .list li{height: auto;margin: 0;}
.blog_box .list li .content{position: relative;color: #848484;left: 0;right: 0;bottom: 0;padding: 30px 15px;}
.blog_box .content .tit{color: #000;font-size: 18px;}
.blog_box .pop .md6{width: 100%;}
.blog_box .pop .pic{height: 20%;}
.blog_box .pop .txtwrap{height:78%;overflow: hidden;margin-top: 2%;}
.blog_box .list li .picbg:after{opacity: 0;}
.blog_box .pop .btn{width: 45px;}
.blog_box .pop .btn span{display: none;}
.blog_box .pop .txt{padding: 30px 0 0 0;}
.blog_box .mCustomScrollBox, .blog_box .pop .content{padding: 0 10px;}
.blog_box .pop .txt .tit{font-size: 18px;word-break:break-all;overflow: inherit;white-space:inherit;line-height: 36px;text-align: center;}
.gallery_box .nav{padding-top: 0;background: #31a0fc;overflow: hidden;}
.gallery_box .wrap{margin: 0;}
.gallery_box .nav li{min-width:inherit;font-size: 14px; width: 33.333%;margin: 0;padding: 0;text-align: center;float: left;display: block;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border: 0;}
.gallery_box .nav li a{color: #fff;}
.gallery_box .nav li .line{display: none;}
.gallery_box .row .tit,
.gallery_box .row:nth-child(2n) .tit{position: relative;left: 0;width: 100%;height: 50px;line-height: 50px;background: none;text-transform: uppercase;}
.gallery_box .row .tit span{margin-left: 0;text-align: center;display: block;color: #000;font-size: 24px;text-shadow: none;}
.gallery_box .row:nth-child(2n+1):after{display: none;}
.gallery_box .row{margin: 20px 0;overflow: hidden;}
.gallery_box .row .swiper li{height: auto;}
.gallery_box .row .swiper,
.gallery_box .row:nth-child(2n) .swiper{width: 100%;margin: 0;margin-top:20px;}
.gallery_box .row, .gallery_box .row .tit{height: auto;}
.gallery_box .row .swiper li:after{opacity:0;}
.gallery_box{padding-bottom: 0;}
.gallery_box .row .swiper .btn{width: 30px;height: 50px;margin-top: -25px;line-height: 50px;font-size: 20px;}
.gallery_box .pop .swiper-container{width: 95%;}
.gallery_box .row .name{display: block;position: absolute;bottom: 0;left: 0;width: 100%;text-align: center;height: 35px;line-height: 35px;color: #fff;background: #31a0fc;}
.new_box .wrap{padding: 50px 0;}
.new_box .list .item{width: 100%;margin-bottom: 30px;}
.new_box .list .pic{height: auto;}
.new_box .list li{width: 100%;margin: 0;}
.new_box .list .txt{padding: 30px 15px;}
.new_box .list .con{height: auto;}
.newdetail_box .bdsharebuttonbox{display: none;}
.newdetail_box .name{font-size: 18px;margin-bottom: 20px;}
.newdetail_box .btnwrap{padding: 50px 0;}
.newdetail_box .btnwrap .btn{width: 120px;font-size: 14px;}
.newdetail_box .listwrap{width: 100%;}
.newdetail_box .list_box li{width: 100%;margin: 0;}
.newdetail_box .list_box .pic{height: auto;}
.wrap_header:hover .header_box .menu, .wrap_header:hover .header_box .lang{transition:none;-webkit-transition:none;-o-transition:none;-moz-transition:none;-ms-transition:none;}
.ind_box .row6 .input_txt{width: 70%;}
.ind_box .row6 .input_btn{width: 30%;margin: 0;font-size: 14px;}
.ind_box .row6 .formbox{display: block;margin:20px 0 0 0;}
.coatings_box .nav .pc{display: none;}
.coatings_box .nav .mobile{display: block;}
.new_box .list .item:hover .name{color: #000;}
.header_box .menu, .header_box .lang, .header_box .menu .down a{font-size: 16px;}
.about_box .row2 ul li:hover h4:after{width: 40px;}
.about_box .row2 ul li:hover .picbg,
.ind_box .row2 ul li:hover .pic span,
.new_box .list .item:hover .picbg{-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
.ind_box .row1 .commontit{text-align: center;}
.ind_box .swiper-pagination{display: none;}
.scroll_down{border-width: 1px;}
.scroll_down span{width: 3px;height: 6px;-webkit-animation: scrollDownM 1.5s infinite linear; -o-animation: scrollDownM 1.5s infinite linear; -moz-animation: scrollDownM 1.5s infinite linear; animation: scrollDownM 1.5s infinite linear;}
.ind_box .banner .line{width: 100%;}
.coatings_box .positionNav{display: none;}
.header_box .head_rt:after, .header_box .menu .down:after{opacity: 1;}
.ind_box .row5 ul .picbg:before,.ind_box .row5 ul .name{height: 70px;}
.ind_box .row5 ul .name{line-height: 70px;}
.header_box .menu .down dl{background: #1a86e1;}
.photo_box .row3{padding: 40px 0 20px 0;background: none !important;}
.photo_box .row3 .bd{margin-top: 40px;}
.ind_box .row6 .md6{width: 100%;padding:40px 0;}
.ind_box .row6 .txtwrap ul li{font-size: 12px;}
.ind_box .row6 .txtwrap ul i{margin-right: 6px;}
.ind_box .row6 .commontit{padding-bottom: 20px;}
.ind_box .row6 .commontit:after{height: 2px;}
.gallery_box .innerbanner{height:240px !important;overflow: hidden;}
.gallery_box .picbg img{display:block;}
.gallery_box .picbg{height: 100%;height: auto;position: relative;}
.gallery_box .innerbanner .name{font-size: 14px;}
.coatings_box .row5 .list li{width: 100%;}
.quality_box .innerbanner .content{font-size: 24px;right:20px;text-align: center;bottom: 30px; line-height: 1.2;}
}
.gallery_box .innerbanner .pic{background-size: cover;background-position: center;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.gallery_box .innerbanner.active:after{display: none;}
/*.header_box,
.ind_box .row4 .nav li,
.ind_box .row3 li p{font-family: "Smith",sans-serif;}*/
@font-face {
font-family: 'SourceM';
src: url('font/SourceM.eot'); /* IE9*/
src: url('font/SourceM.eot?#iefix') format('embedded-opentype'),
url('font/SourceM.woff') format('woff'),
url('font/SourceM.ttf') format('truetype'),
url('font/SourceM.svg#SourceM') format('svg');
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
}
@font-face {
font-family: 'SourceE';
src: url('font/SourceE.eot'); /* IE9*/
src: url('font/SourceE.eot?#iefix') format('embedded-opentype'),
url('font/SourceE.woff') format('woff'),
url('font/SourceE.ttf') format('truetype'),
url('font/SourceE.svg#SourceE') format('svg');
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
}
@font-face {
font-family: 'SourceN';
src: url('font/SourceN.eot'); /* IE9*/
src: url('font/SourceN.eot?#iefix') format('embedded-opentype'),
url('font/SourceN.woff') format('woff'),
url('font/SourceN.ttf') format('truetype'),
url('font/SourceN.svg#SourceN') format('svg');
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
}
@font-face {
font-family: "Smith";
src: url("font/Smith-Medium-Web.eot");
src: url("font/Smith-Medium-Web.eot") format("embedded-opentype"),url("font/Smith-Medium-Web.ttf") format("truetype"),url("font/Smith-Medium-Web.woff") format("woff"),url("font/Smith-Medium-Web.svg") format("svg");
font-style: normal;
font-weight: 400;
}
@font-face {
font-family: 'iconfont'; /* project id："171235" */
src: url('//at.alicdn.com/t/font_gkqg8og60kck57b9.eot');
src: url('//at.alicdn.com/t/font_gkqg8og60kck57b9.eot?#iefix') format('embedded-opentype'),
url('//at.alicdn.com/t/font_gkqg8og60kck57b9.woff') format('woff'),
url('//at.alicdn.com/t/font_gkqg8og60kck57b9.ttf') format('truetype'),
url('//at.alicdn.com/t/font_gkqg8og60kck57b9.svg#iconfont') format('svg');
}
.iconfont {
font-family:"iconfont" !important;
font-style:normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@keyframes 'scrollDown' {
0%{opacity: 0;}
50%{opacity: 1;transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);}
100%{opacity: 0;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
}
@-webkit-keyframes 'scrollDown' {
0%{opacity: 0;}
50%{opacity: 1;transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);}
100%{opacity: 0;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
}
@-o-keyframes 'scrollDown' {
0%{opacity: 0;}
50%{opacity: 1;transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);}
100%{opacity: 0;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
}
@-moz-keyframes 'scrollDownM' {
0%{opacity: 1;transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);}
100%{opacity:0;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
}
@keyframes 'scrollDownM' {
0%{opacity: 1;transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);}
100%{opacity:0;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
}
@-webkit-keyframes 'scrollDownM' {
0%{opacity: 1;transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);}
100%{opacity:0;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
}
@-o-keyframes 'scrollDownM' {
0%{opacity: 1;transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);}
100%{opacity:0;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
}
@-moz-keyframes 'scrollDownM' {
0%{opacity: 1;transform:translateY(30px);-o-transform:translateY(30px);-ms-transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);}
100%{opacity:0;transform:translateY(0px);-o-transform:translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);}
}
@keyframes 'colorChange' {
50%{opacity: 0;}
100%{opacity: 1;}
}
@-webkit-keyframes 'colorChange' {
50%{opacity: 0;}
100%{opacity: 1;}
}
@-o-keyframes 'colorChange' {
50%{opacity: 0;}
100%{opacity: 1;}
}
@-moz-keyframes 'colorChange' {
50%{opacity: 0;}
100%{opacity: 1;}
}
@keyframes 'borderMove' {
0%{transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);}
100%{transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);}
}
@-webkit-keyframes 'borderMove' {
0%{transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);}
100%{transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);}
}
@-o-keyframes 'borderMove' {
0%{transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);}
100%{transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);}
}
@-moz-keyframes 'borderMove' {
0%{transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);}
100%{transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);}
}