/*# sourceURL=http://at.alicdn.com/t/font_843617_hszd3oec6k.css */ /*@ sourceURL=http://at.alicdn.com/t/font_843617_hszd3oec6k.css */ @font-face {font-family: "iconfont"; src: url("http://at.alicdn.com/t/font_843617_hszd3oec6k.eot?t=1539827607915"); /* IE9*/ src: url("http://at.alicdn.com/t/font_843617_hszd3oec6k.eot?t=1539827607915#iefix") format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAA2gAAsAAAAAE/QAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFY+d0zLY21hcAAAAYAAAADJAAAChJs+1IBnbHlmAAACTAAACJIAAAtkVTiYVWhlYWQAAArgAAAAMQAAADYr/1UraGhlYQAACxQAAAAgAAAAJCDjHJNobXR4AAALNAAAACgAAABQe7D//mxvY2EAAAtcAAAAKgAAACobXhiYbWF4cAAAC4gAAAAfAAAAIAEqAIZuYW1lAAALqAAAAUUAAAJtPlT+fXBvc3QAAAzwAAAAsAAAAUrrfL1reJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2Bk02ecwMDKwMHUyXSGgYGhH0IzvmYwYuRgYGBiYGVmwAoC0lxTGByeMTxbydzwv4EhhrWRqREozAiSAwD51QzDeJztks1RAlEQhL9dVlREUfdCEGSDvxwMiJMpIKiQWEfgHXq2CcN59W3NTL2dV9U9wAUwMgvTQfNJQ8Xa3Wboj5gM/Y4P1xOuaGmFZlrpcDzCkC+1qfwcje/VmTtvXV07v2HKLXfMuPfMzi+PufS0Bx7p/cuY/5gO379z1Ze2wSpa5VC+aBmsLHoK5ZOeg9VGL6Gm6jXYAfQW7AV6D9TsVbA/aBNqN/QVaj+0DbU32gX7iL6DHUU/wd6i32CX0T7Yb3QI9CekJUXtAAAAeJyFVntsFMcZn29mH/e+Xfv21nec77y3vt07nznOXt8dT5uHQ3k01CQBhVAeEsWoBApVQqAQBxMsRELUUv6oqtBGJKnaSm0FTaNIUCpB1RdpIYi0KVKbhCoJbUBKaUOTgG7X/WYxlCqquo9vvpn5Zne+3/caAoSM72NfZRtIlBC9R+0HHZIJGSTL3kTLbfQ3muZObSvTBWwkrUe9ubHJMW9uVE8TvCRO2CX6KmG4WicGKZMaIa2GaoDcsAdAb8i6jRxv48Dk2sRYwx/LgawXfDnOdbBTzdm0M0OLJdbWlU4eKmdb7axol2UhXSrRdCndZtmt2bImd1mid/zh4saxUnnvxiJ91d0E3+soK5FyZyjfuV/KWS25ciJQ9p7Ll+PRcj6cN8da7JxsdQW0cv+9I5+DkRFYMoJb57qPBggbJQHsyGBoBmovkUOQvPG4NOZdOURx8pB35ZjPEpnLt4u+fAvJkA7SRXrJdEIKNYepDhg2cNVVTgoq528RftvM0UzZCOJszbk15rex5158sQm/9h5bFt178+f0qLtU7Hdz9C+f/Nhb7L4L2+ETuPj3fm9/8Ifit56/usx7FM58dLJZv+I9FV7ddK56++e8Al+GtiY5zQa8jz3d+yeEaOSK+0daahK6290jkCYRiPe3iLf3ldO8A5Ud9KE7DbmNA1uCeqGGog22DA2Aew7Cr6Zv9t4+CldHD8HvZmyBzpe8+KflG9DQwQb6069706Z/CTqOetqn5d1RiYh7fJx1UB0Vf0A5zscgecjjIN8FuS+/G+V9u+B+VFNF66BdbluC20Qau/G4v9j3w/HrAmER3E+MpEmR9Pl+6MhOw2kYom22Oq0mM/JSIqkb/dBngSHJahYco7deUy0mmYZlq/WGkdTVD1cU19sPxbz34TvqsLP+yPpV3s8iihKBeUih0hw0AFIKe1lpgR5QmvsUAIXtRPrhW28NnTnjXYCKe0Vp48NtCn0bDPeIoqoKXWu4z6ug0HY+477DcQlwHAXufwx3HiZx0op77ybVWzHUiv5Y4z6JnlPDF/JWTe2r46aT7eD0JjU1IZm2o5rcyY5A1Tsv0Iz7Ln/hmYN4udfiqhpnHXF1lDOja9c2L9FLbge95H3fuzj70mx4EIkbQJlTXKCqxpsHYy2zWbV5HjdFRN/Ov0fWID1kHllGlqNxbMs08tYsRLEMeakdEtJEm8SdDUA/4N7qd00nQecz9UatArgyDlKioCUk2chPgQoMAMKeBY29NirI3gdyMCitQyK/xgkdk8TdArh/XidNjHv7d4sSHZMDAEHJfRynRXo9KLsnJGFIBHGpINN75CB94QkhKM/kn+BE+pcUFLaLkeY7Qfk6H0QCv9gh+Iw4IkaXfQM/KCwQo+ISASCAXu3rvpudRt2zpIJRvpJ8HvOjmbdsfvfVMFH6FtCSuu9HSbRFoQK3DcRtIxe4EW1L0mSOEWavesPpzUGS6+wk9daEbFpTwEJEZDNvXwOht8PSJwEkcho4rVlG++JaQnHfjGtanD7LqXuADrnHzuaBMUmcgiDQQJ9EHUarTJoRgHCwEqACpTaVUzIdDahaZ/esrR9ALK4l496p8yvnZ0KSltMOQ0JhkxRNU5rvKQlYRC94v11CAZ4RRCpDJADiDsa2iwCydz2I9JuMPSiBn+6DiMuT7CP2hO+tPM6mkYVkBfki+Qohjf946C3nxARXqPVVGEKWl+QY2BUqyVKnLUuaiaFYb5g86TY4rLV+mAHcsxOSYfr+Ved9XYsB/J/5fi3bnmRjWjarac3vsl3xlFnSQmExLN63oiUYSPY52733IwxVk9hhgYnNlyhz3Q16OAoQDevhWIzO5jSsh/BnMfcH/2umK6vRHyXbs5p7v5ZdQPe6I6ukzqEl86aERKBQvSarm9dI604u1dIpY+rUWTPgH8WtsfBgKBYLDfKv3Oaau2Khc3zgHB+4zRE6Pj5+WZBYmlhkGCPNMvNy3bIxbGIgVzDwJE77eeznoOG36HwYRPadx6o3shQHc2D3NVAqC34HhflT57W3H/v4PW6OODLsekJT41qwvW2oOndXV2nnYHlVLpMRcjsXzdzaEwr1bJ057+FCh+pp1pCZHTSnby4ouoR+EqrMyBUGlDSl7R223t2qZyWxVTdi0YyaNmiKJrdMS7Rkomqioz+fqG6AcxR615TyFixbtPgBgOJMRRNnzG/UQ6F6o6+3+zH3jdqiVLKgZubXUgu77c+0Jywj3lJIdE6OKpZVzSwsVlaWcqn2OUb71JSdmiQJVUzFUbMlncxV22K55bfqM+bTPeiTc8hicj9Zg375CEcSw8z2keQpybHVhsFjVca01IfpDEuBbqimXkOfzdt5PakjdMlexB5MXql7TF0zVccPctvha8qgYz8L6I4xMG3N4fkNPyWaXFAzNYc9FYos6J6kBKVQIBy7nE67wx3daTjLje2l6II6ffmv6VhYYnguiqfLw8FEHALNPwxjiX62b2Pvlp5pU52ZsyZlMun+15fbMw1jVtEwil1QKsLqbc7xfdvo2WBkblGPSqIYD19OuZCCssGG0/FkrLmnsQCYk8afUSpGdHu1rGiYXb174Sc3N4HpPFAtpaqZmwjH7GK8NJC/eaF3ijKld/cuMEvLScTHEf6rLumkzT/xdGJ16kFEsTRhWXYQH4chz/sFRzYbJhJ74gXMBYgjKiZZNdRrcHCQnUTSxKa5ny2afLxy4k+VE5MNZAxsYX5IuiHhE2KjE1KESw4O0hcGB9+YuNyPoREIsG8LqnCYBQL8fIFxc+cch+cRrJr8QELuPiWM3jlsEEJ5IhNOUAHlI7yiYVTYRq0EmlMDtXjgQPE+lmm+x57eCm9aT+4tfLZQKJBb68a/xvLskYl1Db5QdVKA5qbj5rZHjXmGYdDXzZERc6E7nf6yefELuOzf6YlV4AAAeJxjYGRgYADihr7kF/H8Nl8ZuFkYQOD6O47pMPr//7/1sqysjUAuBwMTSBQAZDwM/gAAAHicY2BkYGBu+N/AECPL8v///1+yrAxAERQgAgClmAaveJxjYWBgYIFiDiCWZUHlcyDJo+L//8E0I0jN//+soQwMIAwAWKsFJwAAAAAAHgB+AJYBAgEaATIBSgFiAb4CDgKMAxgDxgRmBQoFYgV6BZYFsgAAeJxjYGRgYBBhqGLgYQABJiDmAkIGhv9gPgMAF2QBsQB4nGWPTU7DMBCFX/oHpBKqqGCH5AViASj9EatuWFRq911036ZOmyqJI8et1ANwHo7ACTgC3IA78EgnmzaWx9+8eWNPANzgBx6O3y33kT1cMjtyDRe4F65TfxBukF+Em2jjVbhF/U3YxzOmwm10YXmD17hi9oR3YQ8dfAjXcI1P4Tr1L+EG+Vu4iTv8CrfQ8erCPuZeV7iNRy/2x1YvnF6p5UHFockikzm/gple75KFrdLqnGtbxCZTg6BfSVOdaVvdU+zXQ+ciFVmTqgmrOkmMyq3Z6tAFG+fyUa8XiR6EJuVYY/62xgKOcQWFJQ6MMUIYZIjK6Og7VWb0r7FDwl57Vj3N53RbFNT/c4UBAvTPXFO6stJ5Ok+BPV8bUnV0K27LnpQ0kV7NSRKyQl7WtlRC6gE2ZVeOEXpc0Yk/KGdI/wAJWm7IAAAAeJx1jt0KgkAUhHfU1NRSy6iX6MJ6iG6CnmH935JdwRbSp28zIZAcOIcz883FIRr5yiH/FUGDDgMLmLBgYwkHLjyssIaPACE22CLCjriJKCgvj6loOq2vnE7IO6P8KaRxvV1u6Kz+QUWSM/9HhnI08cOyMpW0FdurqdVZ9hXjOS8zyV4faytfy4ayw0whngOnOXDWm6wwFWwYDyY/xV4vRZqPUTj020qtMSHkDWQYYkc=') format('woff'), url("http://at.alicdn.com/t/font_843617_hszd3oec6k.ttf?t=1539827607915") format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/ url("http://at.alicdn.com/t/font_843617_hszd3oec6k.svg?t=1539827607915#iconfont") format('svg'); /* iOS 4.1- */ } .iconfont { font-family:"iconfont" !important; font-size:16px; font-style:normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-bofang-copy:before { content: "\e60f"; } .icon-zh:before { content: "\e600"; } .icon-youjiantou:before { content: "\e6a1"; } .icon-LOGO:before { content: "\e6a2"; } .icon-y:before { content: "\e6a3"; } .icon-zkaobei:before { content: "\e6a4"; } .icon-youjiantou-copy:before { content: "\e6a5"; } .icon-youjiantou-copy-copy:before { content: "\e6a6"; } .icon-dianshi:before { content: "\e653"; } .icon-shiliangzhinengduixiang:before { content: "\e654"; } .icon-zhilupai:before { content: "\e655"; } .icon-shiliangzhinengduixiang1:before { content: "\e656"; } .icon-shiliangzhinengduixiang2:before { content: "\e657"; } .icon-shiliangzhinengduixiang3:before { content: "\e658"; } .icon-pdf:before { content: "\e659"; } .icon-shipin:before { content: "\e65a"; } .icon-youjiantou-copy1:before { content: "\e6a7"; } .icon-zuocejiantou:before { content: "\e6a8"; } .icon-xiangshangjiantou:before { content: "\e6a9"; } /*# sourceURL=/templates/dist/css/fonts.css */ /*@ sourceURL=/templates/dist/css/fonts.css */ /** Generated by FG **/ @font-face { font-family: 'iconfont'; /* project id 843617 */ src: url("http://at.alicdn.com/t/font_843617_mgmzhfqqgdr.eot"); src: url("http://at.alicdn.com/t/font_843617_mgmzhfqqgdr.eot?#iefix") format('embedded-opentype'), url("http://at.alicdn.com/t/font_843617_mgmzhfqqgdr.woff") format('woff'), url("http://at.alicdn.com/t/font_843617_mgmzhfqqgdr.ttf") format('truetype'), url("http://at.alicdn.com/t/font_843617_mgmzhfqqgdr.svg#iconfont") format('svg'); } @font-face { font-family: 'Conv_Gotham-Black'; src: url("http://www.lilang.com/templates/dist/css/fonts/Gotham-Black.eot"); src: local('☺'), url("http://www.lilang.com/templates/dist/css/fonts/Gotham-Black.woff") format('woff'), url("http://www.lilang.com/templates/dist/css/fonts/Gotham-Black.ttf") format('truetype'), url("http://www.lilang.com/templates/dist/css/fonts/Gotham-Black.svg") format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Conv_Gotham-Light'; src: url("http://www.lilang.com/templates/dist/css/fonts/Gotham-Light.eot"); src: local('☺'), url("http://www.lilang.com/templates/dist/css/fonts/Gotham-Light.woff") format('woff'), url("http://www.lilang.com/templates/dist/css/fonts/Gotham-Light.ttf") format('truetype'), url("http://www.lilang.com/templates/dist/css/fonts/Gotham-Light.svg") format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Conv_NeoSans_0'; src: url("http://www.lilang.com/templates/dist/css/fonts/NeoSans_0.eot"); src: local('☺'), url("http://www.lilang.com/templates/dist/css/fonts/NeoSans_0.woff") format('woff'), url("http://www.lilang.com/templates/dist/css/fonts/NeoSans_0.ttf") format('truetype'), url("http://www.lilang.com/templates/dist/css/fonts/NeoSans_0.svg") format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Conv_Black'; src: url("http://www.lilang.com/templates/dist/css/fonts/Zona Pro Black.eot"); src: local('☺'), url("http://www.lilang.com/templates/dist/css/fonts/Zona Pro Black.woff") format('woff'), url("http://www.lilang.com/templates/dist/css/fonts/Zona Pro Black.ttf") format('truetype'), url("http://www.lilang.com/templates/dist/css/fonts/Zona Pro Black.svg") format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Conv_Zona Pro Extra Bold'; src: url("http://www.lilang.com/templates/dist/css/fonts/Zona Pro Extra Bold.eot"); src: local('☺'), url("http://www.lilang.com/templates/dist/css/fonts/Zona Pro Extra Bold.woff") format('woff'), url("http://www.lilang.com/templates/dist/css/fonts/Zona Pro Extra Bold.ttf") format('truetype'), url("http://www.lilang.com/templates/dist/css/fonts/Zona Pro Extra Bold.svg") format('svg'); font-weight: normal; font-style: normal; } /*# sourceURL=/templates/dist/css/animate.min.css */ /*@ sourceURL=/templates/dist/css/animate.min.css */ @charset "UTF-8"; /*! Animate.css - http://daneden.me/animate Licensed under the MIT license - http://opensource.org/licenses/MIT Copyright (c) 2013 Daniel Eden */ .animated { -webkit-animation-duration: 0.6s; animation-duration: 0.6s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } /*.scroll-animate .animated,.scroll-animate.animated{*/ /*visibility: hidden;*/ /*}*/ .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s } @-webkit-keyframes bounce { 0%, 100%, 20%, 53%, 80% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } 40%, 43% { -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060); transition-timing-function: cubic-bezier(0.755, .050, .855, .060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0) } 70% { -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060); transition-timing-function: cubic-bezier(0.755, .050, .855, .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%, 100%, 20%, 53%, 80% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1); -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } 40%, 43% { -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060); transition-timing-function: cubic-bezier(0.755, .050, .855, .060); -webkit-transform: translate3d(0, -30px, 0); -ms-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0) } 70% { -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060); transition-timing-function: cubic-bezier(0.755, .050, .855, .060); -webkit-transform: translate3d(0, -15px, 0); -ms-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0) } 90% { -webkit-transform: translate3d(0, -4px, 0); -ms-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%, 100%, 50% { opacity: 1 } 25%, 75% { opacity: 0 } } @keyframes flash { 0%, 100%, 50% { opacity: 1 } 25%, 75% { opacity: 0 } } .flash { -webkit-animation-name: flash; animation-name: flash } @-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); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1) } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); -ms-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05) } 100% { -webkit-transform: scale3d(1, 1, 1); -ms-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, .75, 1); transform: scale3d(1.25, .75, 1) } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1) } 50% { -webkit-transform: scale3d(1.15, .85, 1); transform: scale3d(1.15, .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); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1) } 30% { -webkit-transform: scale3d(1.25, .75, 1); -ms-transform: scale3d(1.25, .75, 1); transform: scale3d(1.25, .75, 1) } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); -ms-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1) } 50% { -webkit-transform: scale3d(1.15, .85, 1); -ms-transform: scale3d(1.15, .85, 1); transform: scale3d(1.15, .85, 1) } 65% { -webkit-transform: scale3d(.95, 1.05, 1); -ms-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1) } 75% { -webkit-transform: scale3d(1.05, .95, 1); -ms-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1) } 100% { -webkit-transform: scale3d(1, 1, 1); -ms-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); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); -ms-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0) } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); -ms-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); -ms-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg) } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); -ms-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg) } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); -ms-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg) } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); -ms-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg) } 100% { -webkit-transform: rotate3d(0, 0, 1, 0deg); -ms-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); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1) } 10%, 20% { -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); -ms-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); -ms-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); -ms-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); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1) } } .tada { -webkit-animation-name: tada; animation-name: tada } @-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; -ms-transform: none; transform: none } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); -ms-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); -ms-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); -ms-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); -ms-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); -ms-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg) } 100% { -webkit-transform: none; -ms-transform: none; transform: none } } .wobble { -webkit-animation-name: wobble; animation-name: wobble } @-webkit-keyframes bounceIn { 0%, 100%, 20%, 40%, 60%, 80% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 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%, 100%, 20%, 40%, 60%, 80% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); -ms-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3) } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); -ms-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1) } 40% { -webkit-transform: scale3d(.9, .9, .9); -ms-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9) } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); -ms-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03) } 80% { -webkit-transform: scale3d(.97, .97, .97); -ms-transform: scale3d(.97, .97, .97); transform: scale3d(.97, .97, .97) } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); -ms-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%, 100%, 60%, 75%, 90% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0) } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0) } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0) } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0) } 100% { -webkit-transform: none; transform: none } } @keyframes bounceInDown { 0%, 100%, 60%, 75%, 90% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); -ms-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0) } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); -ms-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0) } 75% { -webkit-transform: translate3d(0, -10px, 0); -ms-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0) } 90% { -webkit-transform: translate3d(0, 5px, 0); -ms-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0) } 100% { -webkit-transform: none; -ms-transform: none; transform: none } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown } @-webkit-keyframes bounceInLeft { 0%, 100%, 60%, 75%, 90% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0) } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0) } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0) } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0) } 100% { -webkit-transform: none; transform: none } } @keyframes bounceInLeft { 0%, 100%, 60%, 75%, 90% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); -ms-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0) } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); -ms-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0) } 75% { -webkit-transform: translate3d(-10px, 0, 0); -ms-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0) } 90% { -webkit-transform: translate3d(5px, 0, 0); -ms-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0) } 100% { -webkit-transform: none; -ms-transform: none; transform: none } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft } @-webkit-keyframes bounceInRight { 0%, 100%, 60%, 75%, 90% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0) } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0) } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0) } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0) } 100% { -webkit-transform: none; transform: none } } @keyframes bounceInRight { 0%, 100%, 60%, 75%, 90% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); -ms-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0) } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); -ms-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0) } 75% { -webkit-transform: translate3d(10px, 0, 0); -ms-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0) } 90% { -webkit-transform: translate3d(-5px, 0, 0); -ms-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0) } 100% { -webkit-transform: none; -ms-transform: none; transform: none } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight } @-webkit-keyframes bounceInUp { 0%, 100%, 60%, 75%, 90% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0) } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0) } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0) } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0) } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } } @keyframes bounceInUp { 0%, 100%, 60%, 75%, 90% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); -ms-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0) } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); -ms-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0) } 75% { -webkit-transform: translate3d(0, 10px, 0); -ms-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0) } 90% { -webkit-transform: translate3d(0, -5px, 0); -ms-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0) } 100% { -webkit-transform: translate3d(0, 0, 0); -ms-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); -ms-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9) } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); -ms-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); -ms-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); -ms-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0) } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); -ms-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0) } 100% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); -ms-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); -ms-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0) } 100% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); -ms-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); -ms-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0) } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); -ms-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); -ms-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0) } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); -ms-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0) } 100% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); -ms-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 fadeInDownSmall { 0% { opacity: 0; -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0) } 100% { opacity: 1; -webkit-transform: none; transform: none } } @keyframes fadeInDownSmall { 0% { opacity: 0; -webkit-transform: translate3d(0, -15px, 0); -ms-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } } .fadeInDownSmall { -webkit-animation-name: fadeInDownSmall; animation-name: fadeInDownSmall } @-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); -ms-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-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); -ms-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-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); -ms-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-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); -ms-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-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); -ms-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-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); -ms-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig } @-webkit-keyframes fadeInUpSmall { 0% { opacity: 0; -webkit-transform: translate3d(0, 15px, 0); transform: translate3d(0, 15px, 0) } 100% { opacity: 1; -webkit-transform: none; transform: none } } @keyframes fadeInUpSmall { 0% { opacity: 0; -webkit-transform: translate3d(0, 15px, 0); -ms-transform: translate3d(0, 15px, 0); transform: translate3d(0, 15px, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } } .fadeInUpSmall { -webkit-animation-name: fadeInUpSmall; animation-name: fadeInUpSmall } @-webkit-keyframes fadeInUpY { 0% { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0) } 100% { -webkit-transform: none; transform: none } } @keyframes fadeInUpY { 0% { -webkit-transform: translate3d(0, 100%, 0); -ms-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0) } 100% { -webkit-transform: none; -ms-transform: none; transform: none } } .fadeInUpY { -webkit-animation-name: fadeInUpY; animation-name: fadeInUpY; } @-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); -ms-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-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); -ms-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-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); -ms-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); -ms-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); -ms-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); -ms-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); -ms-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); -ms-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); -ms-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); -ms-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); -ms-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); -ms-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); -ms-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); -ms-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); -ms-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in } } .animated.flip { -webkit-backface-visibility: visible; -ms-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); -ms-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); -ms-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); -ms-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); -ms-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg) } 100% { -webkit-transform: perspective(400px); -ms-transform: perspective(400px); transform: perspective(400px) } } .flipInX { -webkit-backface-visibility: visible !important; -ms-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); -ms-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); -ms-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); -ms-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); -ms-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg) } 100% { -webkit-transform: perspective(400px); -ms-transform: perspective(400px); transform: perspective(400px) } } .flipInY { -webkit-backface-visibility: visible !important; -ms-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); -ms-transform: perspective(400px); transform: perspective(400px) } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -ms-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); -ms-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; -ms-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); -ms-transform: perspective(400px); transform: perspective(400px) } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); -ms-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); -ms-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0 } } .flipOutY { -webkit-backface-visibility: visible !important; -ms-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); -ms-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0 } 60% { -webkit-transform: skewX(20deg); -ms-transform: skewX(20deg); transform: skewX(20deg); opacity: 1 } 80% { -webkit-transform: skewX(-5deg); -ms-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1 } 100% { -webkit-transform: none; -ms-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); -ms-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; -ms-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); -ms-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0 } 100% { -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-transform: none; -ms-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; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); -ms-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0 } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; -ms-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; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); -ms-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0 } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; -ms-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; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); -ms-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0 } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; -ms-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; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); -ms-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0 } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; -ms-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; -ms-transform-origin: center; transform-origin: center; opacity: 1 } 100% { -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); -ms-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: rotate(0, 0, 1, 45deg); transform: rotate(0, 0, 1, 45deg); opacity: 0 } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; opacity: 1 } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0, 0, 1, 45deg); -ms-transform: rotate(0, 0, 1, 45deg); transform: rotate(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; -ms-transform-origin: right bottom; transform-origin: right bottom; opacity: 1 } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); -ms-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; -ms-transform-origin: left bottom; transform-origin: left bottom; opacity: 1 } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); -ms-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; -ms-transform-origin: right bottom; transform-origin: right bottom; opacity: 1 } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); -ms-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; -ms-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); -ms-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; -ms-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); -ms-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; -ms-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); -ms-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0 } } .hinge { -webkit-animation-name: hinge; animation-name: hinge } @-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); -ms-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; -ms-transform: none; transform: none } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn } @-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); -ms-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); -ms-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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 1) } } @keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -ms-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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -ms-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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 1) } } @keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -ms-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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -ms-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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 1) } } @keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -ms-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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -ms-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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 1) } } @keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -ms-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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -ms-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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 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); -ms-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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 1) } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -ms-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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -ms-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 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); -ms-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); -ms-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; -ms-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); -ms-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); -ms-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; -ms-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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 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, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 1) } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -ms-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.55, .055, .675, .19); animation-timing-function: cubic-bezier(0.55, .055, .675, .19) } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -ms-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1); animation-timing-function: cubic-bezier(0.175, .885, .32, 1) } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp } /*# sourceURL=/templates/dist/css/jquery.jscrollpane.css */ /*@ sourceURL=/templates/dist/css/jquery.jscrollpane.css */ /* * CSS Styles that are needed by jScrollPane for it to operate correctly. * * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane * may not operate correctly without them. */ .jspContainer { overflow: hidden; position: relative; } .jspPane { position: absolute; } .jspVerticalBar { position: absolute; top: 0; right: 0; width: 5px; height: 100%; background: red; } .jspHorizontalBar { position: absolute; bottom: 0; left: 0; width: 100%; height: 5px; background: red; } .jspCap { display: none; } .jspHorizontalBar .jspCap { float: left; } .jspTrack { background: #ccc; position: relative; } .jspDrag { background:#505050; position: relative; top: 0; left: 0; cursor: pointer; } .jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag { float: left; height: 100%; } .jspArrow { background: #50506d; text-indent: -20000px; display: block; cursor: pointer; padding: 0; margin: 0; } .jspArrow.jspDisabled { cursor: default; background: #80808d; } .jspVerticalBar .jspArrow { height: 16px; } .jspHorizontalBar .jspArrow { width: 5px; float: left; height: 100%; } .jspVerticalBar .jspArrow:focus { outline: none; } .jspCorner { background: #eeeef4; float: left; height: 100%; } /* Yuk! CSS Hack for IE6 3 pixel bug :( */ * html .jspCorner{ margin: 0 -3px 0 0;} /*# sourceURL=/templates/dist/css/swiper.min.css */ /*@ sourceURL=/templates/dist/css/swiper.min.css */ /** * Swiper 4.0.2 * Most modern mobile touch slider and framework with hardware accelerated transitions * http://www.idangero.us/swiper/ * * Copyright 2014-2017 Vladimir Kharlampidi * * Released under the MIT License * * Released on: October 18, 2017 */ .swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-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-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform}.swiper-invisible-blank-slide{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height,-webkit-transform;transition-property:height,-webkit-transform;-o-transition-property:transform,height;transition-property:transform,height;transition-property:transform,height,-webkit-transform}.swiper-container-3d{-webkit-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;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,right top,left 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:-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,left top,right 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:-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 bottom,left top,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:-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 top,left bottom,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:-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-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-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");left:10px;right:auto}.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");right:10px;left:auto}.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-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-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")}.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-pagination{position:absolute;text-align:center;-webkit-transition:.3s opacity;-o-transition:.3s opacity;transition:.3s opacity;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;-moz-appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:#007aff;}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:.2s top,.2s -webkit-transform;transition:.2s top,.2s -webkit-transform;-o-transition:.2s transform,.2s top;transition:.2s transform,.2s top;transition:.2s transform,.2s top,.2s -webkit-transform}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s left,.2s -webkit-transform;transition:.2s left,.2s -webkit-transform;-o-transition:.2s transform,.2s left;transition:.2s transform,.2s left;transition:.2s transform,.2s left,.2s -webkit-transform}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar{width:100%;height:4px;left:0;top:0}.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-progressbar.swiper-pagination-white{background:rgba(255,255,255,.25)}.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0,0,0,.25)}.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000}.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-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{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%;-ms-transform-origin:50%;transform-origin:50%;-webkit-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%;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);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-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;-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-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.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-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.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-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.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;backface-visibility:hidden}.swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px} /*# sourceURL=/templates/dist/css/respond.css */ /*@ sourceURL=/templates/dist/css/respond.css */ .app{display: none;} @media screen and (max-width:1500px){ .ie .layout-rowMain{ width: 1200px; } } @media screen and (max-width:1366px){ } @media screen and (max-width:1280px){ } @media screen and (max-width:1024px){ } @media screen and (max-width:800px){ .pc{display: none;} .app{display: inline-block;} } @media screen and (max-width:600px){ } /*# sourceURL=/templates/dist/css/fxfullwidth.css */ /*@ sourceURL=/templates/dist/css/fxfullwidth.css */ /* 4 classes: navInLeft, navInRight, navOutLeft, navOutRight */ /*****************************************/ /* Soft Scale */ /*****************************************/ .fxSoftScale .navOutNext { -webkit-animation: scaleUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: scaleUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxSoftScale .navInNext { -webkit-animation: scaleDownUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: scaleDownUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxSoftScale .navOutPrev { -webkit-animation: scaleDown 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: scaleDown 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxSoftScale .navInPrev { -webkit-animation: scaleUpDown 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: scaleUpDown 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } @-webkit-keyframes scaleUp { to { -webkit-transform: scale(1.2); opacity: 0; } } @keyframes scaleUp { to { transform: scale(1.2); opacity: 0; } } @-webkit-keyframes scaleDownUp { from { opacity: 0; -webkit-transform: scale(0.9); } to { opacity: 1; -webkit-transform: scale(1); } } @keyframes scaleDownUp { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } } @-webkit-keyframes scaleDown { to { opacity: 0; -webkit-transform: scale(0.9); } } @keyframes scaleDown { to { opacity: 0; transform: scale(0.9); } } @-webkit-keyframes scaleUpDown { from { -webkit-transform: scale(1.2); } to { opacity: 1; -webkit-transform: scale(1); } } @keyframes scaleUpDown { from { transform: scale(1.2); } to { opacity: 1; transform: scale(1); } } /*****************************************/ /* Press away */ /*****************************************/ .fxPressAway .navOutNext { -webkit-animation: slideOutScaleRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideOutScaleRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxPressAway .navInNext { opacity: 1; -webkit-animation: slideInFromLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideInFromLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxPressAway .navOutPrev { -webkit-animation: slideOutScaleLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideOutScaleLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxPressAway .navInPrev { opacity: 1; -webkit-animation: slideInFromRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideInFromRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); } @-webkit-keyframes slideOutScaleRight { to { -webkit-transform: translateX(100%) scale(0.9); opacity: 0; } } @keyframes slideOutScaleRight { to { transform: translateX(100%) scale(0.9); opacity: 0; } } @-webkit-keyframes slideInFromLeft { from { -webkit-transform: translateX(-100%); } to { -webkit-transform: translateX(0); } } @keyframes slideInFromLeft { from { transform: translateX(-100%); } to { transform: translateX(0); } } @-webkit-keyframes slideOutScaleLeft { to { -webkit-transform: translateX(-100%) scale(0.9); opacity: 0; } } @keyframes slideOutScaleLeft { to { transform: translateX(-100%) scale(0.9); opacity: 0; } } @-webkit-keyframes slideInFromRight { from { -webkit-transform: translateX(100%); } to { -webkit-transform: translateX(0); } } @keyframes slideInFromRight { from { transform: translateX(100%); } to { transform: translateX(0); } } /*****************************************/ /* Side Swing */ /*****************************************/ .fxSideSwing .navOutNext { -webkit-animation: slideOutScaleRight 1.2s forwards; animation: slideOutScaleRight 1.2s forwards; -webkit-animation-timing-function: cubic-bezier(1, 0, 0, 1); /* older webkit */ -webkit-animation-timing-function: cubic-bezier(1, -0.2, 0, 1); animation-timing-function: cubic-bezier(1, -0.2, 0, 1); } .fxSideSwing .navInNext { opacity: 1; -webkit-animation: slideInFromLeft 1.2s forwards; animation: slideInFromLeft 1.2s forwards; -webkit-animation-timing-function: cubic-bezier(1, 0, 0, 1); /* older webkit */ -webkit-animation-timing-function: cubic-bezier(1, -0.2, 0, 1); animation-timing-function: cubic-bezier(1, -0.2, 0, 1); } .fxSideSwing .navOutPrev { -webkit-animation: slideOutScaleLeft 1.2s forwards; animation: slideOutScaleLeft 1.2s forwards; -webkit-animation-timing-function: cubic-bezier(1, 0, 0, 1); /* older webkit */ -webkit-animation-timing-function: cubic-bezier(1, -0.2, 0, 1); animation-timing-function: cubic-bezier(1, -0.2, 0, 1); } .fxSideSwing .navInPrev { opacity: 1; -webkit-animation: slideInFromRight 1.2s forwards; animation: slideInFromRight 1.2s forwards; -webkit-animation-timing-function: cubic-bezier(1, 0, 0, 1); /* older webkit */ -webkit-animation-timing-function: cubic-bezier(1, -0.2, 0, 1); animation-timing-function: cubic-bezier(1, -0.2, 0, 1); } /*****************************************/ /* Fortune wheel */ /*****************************************/ .fxFortuneWheel .itemwrap { -webkit-perspective: 1600px; perspective: 1600px; } .fxFortuneWheel .navOutNext { -webkit-animation: slideOutScaleRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideOutScaleRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxFortuneWheel .navInNext { -webkit-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-animation: rotateInFromLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: rotateInFromLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxFortuneWheel .navOutPrev { -webkit-animation: slideOutScaleLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideOutScaleLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxFortuneWheel .navInPrev { -webkit-transform-origin: 0% 50%; transform-origin: 0% 50%; -webkit-animation: rotateInFromRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: rotateInFromRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1); } @-webkit-keyframes rotateInFromLeft { from { -webkit-transform: translateX(-100%) rotateY(-55deg); } to { -webkit-transform: translateX(0) rotateY(0deg); opacity: 1; } } @keyframes rotateInFromLeft { from { transform: translateX(-100%) rotateY(-55deg); } to { transform: translateX(0) rotateY(0deg); opacity: 1; } } @-webkit-keyframes rotateInFromRight { from { -webkit-transform: translateX(100%) rotateY(55deg); } to { -webkit-transform: translateX(0) rotateY(0deg); opacity: 1; } } @keyframes rotateInFromRight { from { transform: translateX(100%) rotateY(55deg); } to { transform: translateX(0) rotateY(0deg); opacity: 1; } } /*****************************************/ /* Swipe */ /*****************************************/ .fxSwipe .navOutNext { -webkit-animation: decreaseHeight 0.8s forwards ease-in-out; animation: decreaseHeight 0.8s forwards ease-in-out; } .fxSwipe .navInNext { -webkit-animation: show 0.8s forwards ease-in-out; animation: show 0.8s forwards ease-in-out; } .fxSwipe .navOutPrev { -webkit-animation: hide 0.8s forwards ease-in-out; animation: hide 0.8s forwards ease-in-out; } .fxSwipe .navInPrev { z-index: 1001; opacity: 1; -webkit-animation: increaseHeight 0.8s forwards ease-in-out; animation: increaseHeight 0.8s forwards ease-in-out; } @-webkit-keyframes decreaseHeight { to { height: 0; } } @keyframes decreaseHeight { to { height: 0; } } @-webkit-keyframes show { 0% { opacity: 0; } 1%,100% { opacity: 1; } } @keyframes show { 0% { opacity: 0; } 1%,100% { opacity: 1; } } @-webkit-keyframes hide { 0%,99% { opacity: 1; } 100% { opacity: 0; } } @keyframes hide { 0%,99% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes increaseHeight { from { height: 0; } to { height: 100%; } } @keyframes increaseHeight { from { height: 0; } to { height: 100%; } } /*****************************************/ /* Push reveal */ /*****************************************/ .fxPushReveal .navOutNext { opacity: 1; -webkit-animation: slideOutBottom 0.7s forwards ease-in-out; animation: slideOutBottom 0.7s forwards ease-in-out; } .fxPushReveal .navInNext { opacity: 1; -webkit-animation: slideInHalfFromTop 0.7s forwards ease-in-out; animation: slideInHalfFromTop 0.7s forwards ease-in-out; } .fxPushReveal .navOutPrev { opacity: 1; -webkit-animation: slideOutHalfTop 0.7s forwards ease-in-out; animation: slideOutHalfTop 0.7s forwards ease-in-out; } .fxPushReveal .navInPrev { opacity: 1; z-index: 1001; -webkit-animation: slideInFromBottom 0.7s forwards ease-in-out; animation: slideInFromBottom 0.7s forwards ease-in-out; } @-webkit-keyframes slideOutBottom { to { -webkit-transform: translateY(100%); } } @keyframes slideOutBottom { to { transform: translateY(100%); } } @-webkit-keyframes slideInHalfFromTop { from { -webkit-transform: translateY(-50%); } to { -webkit-transform: translateY(0); } } @keyframes slideInHalfFromTop { from { transform: translateY(-50%); } to { transform: translateY(0); } } @-webkit-keyframes slideOutHalfTop { to { -webkit-transform: translateY(-50%); } } @keyframes slideOutHalfTop { to { transform: translateY(-50%); filter:blur(2px); -webkit-filter:blur(2px); -moz-filter:blur(2px); -ms-filter:blur(2px); -o-filter:blur(2px); } } @-webkit-keyframes slideInFromBottom { from { -webkit-transform: translateY(100%); } to { -webkit-transform: translateY(0); } } @keyframes slideInFromBottom { from { transform: translateY(100%); } to { transform: translateY(0); } } /*****************************************/ /* Snap in */ /*****************************************/ .fxSnapIn .navOutNext { -webkit-animation: slideOutLeft 0.5s forwards ease-in; animation: slideOutLeft 0.5s forwards ease-in; } .fxSnapIn .navInNext { z-index: 1001; opacity: 1; -webkit-animation: slideFromRightFast 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideFromRightFast 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxSnapIn .navOutPrev { -webkit-animation: slideOutRight 0.5s forwards ease-in; animation: slideOutRight 0.5s forwards ease-in; } .fxSnapIn .navInPrev { z-index: 1001; opacity: 1; -webkit-animation: slideFromLeftFast 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideFromLeftFast 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxSnapIn li::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; background-color: rgba(0,0,0,0.8); -webkit-transition: opacity 0.4s 0.1s ease-in; transition: opacity 0.4s 0.1s ease-in; } .fxSnapIn .navOutPrev::after, .fxSnapIn .navOutNext::after { opacity: 1; } @-webkit-keyframes slideOutLeft { to { -webkit-transform: translateX(-10%); } } @keyframes slideOutLeft { to { transform: translateX(-10%); } } @-webkit-keyframes slideFromRightFast { 0%,50% { -webkit-transform: translateX(100%); } 100% { -webkit-transform: translateX(0%); } } @keyframes slideFromRightFast { 0%,50% { transform: translateX(100%); } 100% { transform: translateX(0%); } } @-webkit-keyframes slideOutRight { to { -webkit-transform: translateX(10%); } } @keyframes slideOutRight { to { transform: translateX(10%); } } @-webkit-keyframes slideFromLeftFast { 0%,50% { -webkit-transform: translateX(-100%); } 100% { -webkit-transform: translateX(0%); } } @keyframes slideFromLeftFast { 0%,50% { transform: translateX(-100%); } 100% { transform: translateX(0%); } } /*****************************************/ /* Let me in */ /*****************************************/ .fxLetMeIn .itemwrap { -webkit-perspective: 1600px; perspective: 1600px; } .fxLetMeIn .navOutNext { -webkit-transform-origin: 0% 50%; transform-origin: 0% 50%; -webkit-animation: rotateOutRight 0.5s forwards ease-in-out; animation: rotateOutRight 0.5s forwards ease-in-out; } .fxLetMeIn .navInNext { z-index: 1001; opacity: 1; -webkit-animation: slideFromRightFast 0.5s forwards ease; animation: slideFromRightFast 0.5s forwards ease; } .fxLetMeIn .navOutPrev { -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; -webkit-animation: rotateOutLeft 0.5s forwards ease-in-out; animation: rotateOutLeft 0.5s forwards ease-in-out; } .fxLetMeIn .navInPrev { z-index: 1001; opacity: 1; -webkit-animation: slideFromLeftFast 0.5s forwards ease; animation: slideFromLeftFast 0.5s forwards ease; } .fxLetMeIn li::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; background-color: rgba(0,0,0,0.6); -webkit-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; } .fxLetMeIn .navOutPrev::after, .fxLetMeIn .navOutNext::after { opacity: 1; } @-webkit-keyframes rotateOutRight { to { -webkit-transform: rotateY(10deg); } } @keyframes rotateOutRight { to { transform: rotateY(10deg); } } @-webkit-keyframes rotateOutLeft { to { -webkit-transform: rotateY(-10deg); } } @keyframes rotateOutLeft { to { transform: rotateY(-10deg); } } /*****************************************/ /* Stick it */ /*****************************************/ .fxStickIt .itemwrap { -webkit-perspective: 1600px; perspective: 1600px; } .fxStickIt .navOutNext { -webkit-transform-origin: 50% 0%; transform-origin: 50% 0%; -webkit-animation: rotateBottomSideOut 0.8s forwards ease-in; animation: rotateBottomSideOut 0.8s forwards ease-in; } .fxStickIt .navInNext { z-index: 1001; opacity: 1; -webkit-animation: slideInFromBottomDelayed 0.8s forwards; animation: slideInFromBottomDelayed 0.8s forwards; } .fxStickIt .navOutPrev { opacity: 1; -webkit-animation: slideOutToBottom 0.8s forwards; animation: slideOutToBottom 0.8s forwards; } .fxStickIt .navInPrev { -webkit-transform-origin: 50% 0%; transform-origin: 50% 0%; -webkit-animation: rotateBottomSideIn 0.8s 0.1s forwards ease-in; animation: rotateBottomSideIn 0.8s 0.1s forwards ease-in; } @-webkit-keyframes rotateBottomSideOut { 40% { -webkit-transform: rotateX(-15deg); -webkit-animation-timing-function: ease-out; } 100% { opacity: 0; -webkit-transform: scale(0.8) translateZ(-200px); } } @keyframes rotateBottomSideOut { 40% { transform: rotateX(-15deg); animation-timing-function: ease-out; } 100% { opacity: 0; transform: scale(0.8) translateZ(-200px); } } @-webkit-keyframes slideInFromBottomDelayed { 0%, 30% { -webkit-transform: translateY(100%); } 100% { -webkit-transform: translateY(0); } } @keyframes slideInFromBottomDelayed { 0%, 30% { transform: translateY(100%); } 100% { transform: translateY(0); } } @-webkit-keyframes rotateBottomSideIn { 0% { opacity: 0; -webkit-transform: scale(0.8) translateZ(-200px); } 60% { -webkit-transform: scale(1) translateZ(0) rotateX(-15deg); -webkit-animation-timing-function: ease-out; } 100% { opacity: 1; -webkit-transform: scale(1) translateZ(0) rotateX(0deg); } } @keyframes rotateBottomSideIn { 0% { opacity: 0; transform: scale(0.8) translateZ(-200px); } 60% { transform: scale(1) translateZ(0) rotateX(-15deg); animation-timing-function: ease-out; } 100% { opacity: 1; transform: scale(1) translateZ(0) rotateX(0deg); } } /*****************************************/ /* Archive me */ /*****************************************/ .fxArchiveMe .navOutNext { -webkit-animation: scaleHalfDown 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: scaleHalfDown 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxArchiveMe .navInNext { z-index: 1001; opacity: 1; -webkit-animation: slideInFromBottom 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideInFromBottom 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxArchiveMe .navOutPrev { -webkit-animation: slideOutToBottom 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: slideOutToBottom 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxArchiveMe .navInPrev { -webkit-animation: scaleHalfUp 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: scaleHalfUp 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxArchiveMe li::before, .fxArchiveMe li::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; background-color: rgba(0,0,0,0.7); -webkit-transition: opacity 0.7s cubic-bezier(0.7, 0, 0.3, 1); transition: opacity 0.7s cubic-bezier(0.7, 0, 0.3, 1); } .fxArchiveMe li::after, .fxArchiveMe .navOutNext::before { opacity: 1; } .fxArchiveMe li::before, .fxArchiveMe li.current::after, .fxArchiveMe .navInNext::after, .fxArchiveMe .navInPrev::after { opacity: 0; } .fxArchiveMe .navInNext::after { -webkit-transition: none; transition: none; } @-webkit-keyframes scaleHalfDown { to { -webkit-transform: scale(0.6); opacity: 0; } } @keyframes scaleHalfDown { to { transform: scale(0.6); opacity: 0; } } @-webkit-keyframes slideOutToBottom { to { -webkit-transform: translateY(100%); } } @keyframes slideOutToBottom { to { transform: translateY(100%); } } @-webkit-keyframes scaleHalfUp { from { opacity: 0; -webkit-transform: scale(0.6); } to { opacity: 1; -webkit-transform: scale(1); } } @keyframes scaleHalfUp { from { opacity: 0; transform: scale(0.6); } to { opacity: 1; transform: scale(1); } } /*****************************************/ /* Vertical growth */ /*****************************************/ .fxVGrowth .navOutNext { -webkit-animation: scaleDown 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1); animation: scaleDown 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1); } .fxVGrowth .navInNext { z-index: 1001; opacity: 1; -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; -webkit-animation: maximize 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1); animation: maximize 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1); } .fxVGrowth .navOutPrev { -webkit-animation: scaleDown 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1); animation: scaleDown 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1); } .fxVGrowth .navInPrev { z-index: 1001; opacity: 1; -webkit-transform-origin: 50% 0%; transform-origin: 50% 0%; -webkit-animation: maximize 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1); animation: maximize 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1); } @-webkit-keyframes maximize { from { -webkit-transform: scale(0); } to { -webkit-transform: scale(1); } } @keyframes maximize { from { transform: scale(0); } to { transform: scale(1); } } /*****************************************/ /* Slide Behind */ /* From https://github.com/hakimel/kontext by Hakim El Hattab, http://hakim.se */ /*****************************************/ .fxSlideBehind .itemwrap { -webkit-perspective: 1000px; perspective: 1000px; } .fxSlideBehind .navOutNext { -webkit-animation: hideLeft 0.8s forwards; animation: hideLeft 0.8s forwards; } .fxSlideBehind .navInNext { -webkit-animation: showRight 0.8s forwards; animation: showRight 0.8s forwards; } .fxSlideBehind .navOutPrev { -webkit-animation: hideRight 0.8s forwards; animation: hideRight 0.8s forwards; } .fxSlideBehind .navInPrev { -webkit-animation: showLeft 0.8s forwards; animation: showLeft 0.8s forwards; } @-webkit-keyframes hideLeft { 0% { -webkit-transform: translateZ( 0px ); } 40% { -webkit-transform: translate( 0, -40% ) scale( 0.8 ) rotateX( -20deg ); z-index: 9999; } 100% { opacity: 1; -webkit-transform: translateZ( -400px ); } } @keyframes hideLeft { 0% { transform: translateZ( 0px ); } 40% { transform: translate( 0, -40% ) scale( 0.8 ) rotateX( -20deg ); z-index: 9999; } 100% { opacity: 1; transform: translateZ( -400px ); } } @-webkit-keyframes showRight { 0% { -webkit-transform: translateZ( -400px ); opacity: 1; } 40% { -webkit-transform: translate( 0, 40% ) scale( 0.8 ) rotateX( 20deg ); opacity: 1; } 41% { -webkit-transform: translate( 0, 40% ) scale( 0.8 ) rotateX( 20deg ); opacity: 1; z-index: 9999; } 100% { -webkit-transform: translateZ( 0px ); opacity: 1; z-index: 9999; } } @keyframes showRight { 0% { transform: translateZ( -400px ); opacity: 1; } 40% { transform: translate( 0, 40% ) scale( 0.8 ) rotateX( 20deg ); opacity: 1; } 41% { transform: translate( 0, 40% ) scale( 0.8 ) rotateX( 20deg ); opacity: 1; z-index: 9999; } 100% { transform: translateZ( 0px ); opacity: 1; z-index: 9999; } } @-webkit-keyframes hideRight { 0% { -webkit-transform: translateZ( 0px ); } 40% { -webkit-transform: translate( 0, 40% ) scale( 0.8 ) rotateX( 20deg ); z-index: 9999; } 100% { opacity: 1; -webkit-transform: translateZ( -400px ); } } @keyframes hideRight { 0% { transform: translateZ( 0px ); } 40% { transform: translate( 0, 40% ) scale( 0.8 ) rotateX( 20deg ); z-index: 9999; } 100% { opacity: 1; transform: translateZ( -400px ); } } @-webkit-keyframes showLeft { 0% { -webkit-transform: translateZ( -400px ); opacity: 1; } 40% { -webkit-transform: translate( 0, -40% ) scale( 0.8 ) rotateX( -20deg ); opacity: 1; } 41% { -webkit-transform: translate( 0, -40% ) scale( 0.8 ) rotateX( -20deg ); opacity: 1; z-index: 9999; } 100% { -webkit-transform: translateZ( 0px ); opacity: 1; z-index: 9999; } } @keyframes showLeft { 0% { transform: translateZ( -400px ); opacity: 1; } 40% { transform: translate( 0, -40% ) scale( 0.8 ) rotateX( -20deg ); opacity: 1; } 41% { transform: translate( 0, -40% ) scale( 0.8 ) rotateX( -20deg ); opacity: 1; z-index: 9999; } 100% { transform: translateZ( 0px ); opacity: 1; z-index: 9999; } } /*****************************************/ /* Soft Pulse */ /*****************************************/ .fxSoftPulse .navOutPrev, .fxSoftPulse .navOutNext { -webkit-animation: scaleUpFadeOut 0.8s forwards ease-in; animation: scaleUpFadeOut 0.8s forwards ease-in; } .fxSoftPulse .navInPrev, .fxSoftPulse .navInNext { -webkit-animation: scaleDownFadeIn 0.8s forwards ease-out; animation: scaleDownFadeIn 0.8s forwards ease-out; } @-webkit-keyframes scaleUpFadeOut { 50% { -webkit-transform: scale(1.2); opacity: 1; } 75% { -webkit-transform: scale(1.1); opacity: 0; } 100% { -webkit-transform: scale(1); opacity: 0; } } @keyframes scaleUpFadeOut { 50% { transform: scale(1.2); opacity: 1; } 75% { transform: scale(1.1); opacity: 0; } 100% { transform: scale(1); opacity: 0; } } @-webkit-keyframes scaleDownFadeIn { 50% { opacity: 1; -webkit-transform: scale(1.2); } 100% { opacity: 1; -webkit-transform: scale(1); } } @keyframes scaleDownFadeIn { 50% { opacity: 1; transform: scale(1.2); } 100% { opacity: 1; transform: scale(1); } } /*****************************************/ /* Earthquake */ /* From http://elrumordelaluz.github.io/csshake/ by Lionel, http://t.co/thCECnx1Yg */ /*****************************************/ .fxEarthquake .navOutNext { opacity: 1; -webkit-animation: shakeSlideBottom 1s 0.1s forwards; animation: shakeSlideBottom 1s 0.1s forwards; } .fxEarthquake .navInNext { -webkit-animation: pushFromTop 1s 0.1s forwards; animation: pushFromTop 1s 0.1s forwards; } .fxEarthquake .navOutPrev { opacity: 1; -webkit-animation: shakeSlideTop 1s 0.1s forwards; animation: shakeSlideTop 1s 0.1s forwards; } .fxEarthquake .navInPrev{ opacity: 1; -webkit-animation: pushFromBottom 1s 0.1s forwards; animation: pushFromBottom 1s 0.1s forwards; } .fxEarthquake li::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; background-color: rgba(0,0,0,0.3); -webkit-transition: opacity 0.5s; transition: opacity 0.5s; } .fxEarthquake .navOutPrev::after, .fxEarthquake .navOutNext::after { opacity: 1; } @-webkit-keyframes shakeSlideBottom { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); } 2% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 4% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 6% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 8% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 10% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 12% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 14% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 16% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 18% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 20% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 22% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 24% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 26% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 28% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 30% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 32% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 34% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 36% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 38% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 40% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 42% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 44% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 46% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 48% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 50% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 52% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 54% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 56% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 58% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 60% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 62% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 64% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 66% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 68% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 70% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 100% { -webkit-transform: translateY(100%); } } @keyframes shakeSlideBottom { 0% { transform: translate(0px, 0px) rotate(0deg); } 2% { transform: translate(-1px, -1px) rotate(-0.5deg); } 4% { transform: translate(-1px, -1px) rotate(-0.5deg); } 6% { transform: translate(0px, 0px) rotate(-0.5deg); } 8% { transform: translate(-1px, -1px) rotate(-0.5deg); } 10% { transform: translate(-1px, -1px) rotate(-0.5deg); } 12% { transform: translate(0px, 0px) rotate(-0.5deg); } 14% { transform: translate(-1px, -1px) rotate(-0.5deg); } 16% { transform: translate(0px, 0px) rotate(-0.5deg); } 18% { transform: translate(0px, -1px) rotate(-0.5deg); } 20% { transform: translate(0px, -1px) rotate(-0.5deg); } 22% { transform: translate(0px, -1px) rotate(-0.5deg); } 24% { transform: translate(-1px, 0px) rotate(-0.5deg); } 26% { transform: translate(0px, 0px) rotate(-0.5deg); } 28% { transform: translate(-1px, 0px) rotate(-0.5deg); } 30% { transform: translate(0px, -1px) rotate(-0.5deg); } 32% { transform: translate(-1px, 0px) rotate(-0.5deg); } 34% { transform: translate(0px, -1px) rotate(-0.5deg); } 36% { transform: translate(0px, 0px) rotate(-0.5deg); } 38% { transform: translate(-1px, -1px) rotate(-0.5deg); } 40% { transform: translate(0px, 0px) rotate(-0.5deg); } 42% { transform: translate(-1px, 0px) rotate(-0.5deg); } 44% { transform: translate(0px, -1px) rotate(-0.5deg); } 46% { transform: translate(-1px, -1px) rotate(-0.5deg); } 48% { transform: translate(-1px, -1px) rotate(-0.5deg); } 50% { transform: translate(0px, -1px) rotate(-0.5deg); } 52% { transform: translate(-1px, 0px) rotate(-0.5deg); } 54% { transform: translate(0px, -1px) rotate(-0.5deg); } 56% { transform: translate(-1px, -1px) rotate(-0.5deg); } 58% { transform: translate(0px, 0px) rotate(-0.5deg); } 60% { transform: translate(-1px, 0px) rotate(-0.5deg); } 62% { transform: translate(-1px, -1px) rotate(-0.5deg); } 64% { transform: translate(0px, -1px) rotate(-0.5deg); } 66% { transform: translate(-1px, -1px) rotate(-0.5deg); } 68% { transform: translate(-1px, 0px) rotate(-0.5deg); } 70% { transform: translate(0px, 0px) rotate(-0.5deg); } 100% { transform: translateY(100%); } } @-webkit-keyframes pushFromTop { 0%, 70% { opacity: 0; -webkit-transform: translateY(-100%); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @keyframes pushFromTop { 0%, 70% { opacity: 0; transform: translateY(-100%); } 100% { opacity: 1; transform: translateY(0); } } @-webkit-keyframes shakeSlideTop { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); } 2% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 4% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 6% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 8% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 10% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 12% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 14% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 16% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 18% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 20% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 22% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 24% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 26% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 28% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 30% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 32% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 34% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 36% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 38% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 40% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 42% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 44% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 46% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 48% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 50% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 52% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 54% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 56% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 58% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 60% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 62% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 64% { -webkit-transform: translate(0px, -1px) rotate(-0.5deg); } 66% { -webkit-transform: translate(-1px, -1px) rotate(-0.5deg); } 68% { -webkit-transform: translate(-1px, 0px) rotate(-0.5deg); } 70% { -webkit-transform: translate(0px, 0px) rotate(-0.5deg); } 100% { -webkit-transform: translateY(-100%); } } @keyframes shakeSlideTop { 0% { transform: translate(0px, 0px) rotate(0deg); } 2% { transform: translate(-1px, -1px) rotate(-0.5deg); } 4% { transform: translate(-1px, -1px) rotate(-0.5deg); } 6% { transform: translate(0px, 0px) rotate(-0.5deg); } 8% { transform: translate(-1px, -1px) rotate(-0.5deg); } 10% { transform: translate(-1px, -1px) rotate(-0.5deg); } 12% { transform: translate(0px, 0px) rotate(-0.5deg); } 14% { transform: translate(-1px, -1px) rotate(-0.5deg); } 16% { transform: translate(0px, 0px) rotate(-0.5deg); } 18% { transform: translate(0px, -1px) rotate(-0.5deg); } 20% { transform: translate(0px, -1px) rotate(-0.5deg); } 22% { transform: translate(0px, -1px) rotate(-0.5deg); } 24% { transform: translate(-1px, 0px) rotate(-0.5deg); } 26% { transform: translate(0px, 0px) rotate(-0.5deg); } 28% { transform: translate(-1px, 0px) rotate(-0.5deg); } 30% { transform: translate(0px, -1px) rotate(-0.5deg); } 32% { transform: translate(-1px, 0px) rotate(-0.5deg); } 34% { transform: translate(0px, -1px) rotate(-0.5deg); } 36% { transform: translate(0px, 0px) rotate(-0.5deg); } 38% { transform: translate(-1px, -1px) rotate(-0.5deg); } 40% { transform: translate(0px, 0px) rotate(-0.5deg); } 42% { transform: translate(-1px, 0px) rotate(-0.5deg); } 44% { transform: translate(0px, -1px) rotate(-0.5deg); } 46% { transform: translate(-1px, -1px) rotate(-0.5deg); } 48% { transform: translate(-1px, -1px) rotate(-0.5deg); } 50% { transform: translate(0px, -1px) rotate(-0.5deg); } 52% { transform: translate(-1px, 0px) rotate(-0.5deg); } 54% { transform: translate(0px, -1px) rotate(-0.5deg); } 56% { transform: translate(-1px, -1px) rotate(-0.5deg); } 58% { transform: translate(0px, 0px) rotate(-0.5deg); } 60% { transform: translate(-1px, 0px) rotate(-0.5deg); } 62% { transform: translate(-1px, -1px) rotate(-0.5deg); } 64% { transform: translate(0px, -1px) rotate(-0.5deg); } 66% { transform: translate(-1px, -1px) rotate(-0.5deg); } 68% { transform: translate(-1px, 0px) rotate(-0.5deg); } 70% { transform: translate(0px, 0px) rotate(-0.5deg); } 100% { transform: translateY(-100%); } } @-webkit-keyframes pushFromBottom { 0%, 70% { opacity: 0; -webkit-transform: translateY(100%); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @keyframes pushFromBottom { 0%, 70% { opacity: 0; transform: translateY(100%); } 100% { opacity: 1; transform: translateY(0); } } /*****************************************/ /* Cliff diving */ /*****************************************/ .fxCliffDiving li { -webkit-transform-origin: 50% 400%; transform-origin: 50% 400%; } .fxCliffDiving .navOutNext { opacity: 1; -webkit-animation: rotateOutCircLeft 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: rotateOutCircLeft 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxCliffDiving .navInNext { opacity: 1; -webkit-animation: rotateInCircRight 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: rotateInCircRight 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxCliffDiving .navOutPrev { opacity: 1; -webkit-animation: rotateOutCircRight 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: rotateOutCircRight 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxCliffDiving .navInPrev { opacity: 1; -webkit-animation: rotateInCircLeft 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: rotateInCircLeft 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fxCliffDiving li::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; background-color: rgba(0,0,0,1); -webkit-transition: opacity 0.9s cubic-bezier(0.7, 0, 0.3, 1); transition: opacity 0.9s cubic-bezier(0.7, 0, 0.3, 1); } .fxCliffDiving .navOutPrev::after, .fxCliffDiving .navOutNext::after { opacity: 1; } @-webkit-keyframes rotateOutCircLeft { to { -webkit-transform: rotate(-20deg) translateX(-100%); } } @keyframes rotateOutCircLeft { to { transform: rotate(-20deg) translateX(-100%); } } @-webkit-keyframes rotateInCircRight { from { -webkit-transform: rotate(20deg) translateX(100%); } to { -webkit-transform: rotate(0deg) translateX(0); } } @keyframes rotateInCircRight { from { transform: rotate(20deg) translateX(100%); } to { transform: rotate(0deg) translateX(0); } } @-webkit-keyframes rotateOutCircRight { to { -webkit-transform: rotate(20deg) translateX(100%); } } @keyframes rotateOutCircRight { to { transform: rotate(20deg) translateX(100%); } } @-webkit-keyframes rotateInCircLeft { from { -webkit-transform: rotate(-20deg) translateX(-100%); } to { -webkit-transform: rotate(0deg) translateX(0); } } @keyframes rotateInCircLeft { from { transform: rotate(-20deg) translateX(-100%); } to { transform: rotate(0deg) translateX(0); } } /*****************************************/ /* 3d swing */ /*****************************************/ .fx3dSwing > ul > li{ transform-origin: 50% 50%; } .fx3dSwing .navOutNext { -webkit-animation: swingOutNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: swingOutNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fx3dSwing .navInNext { -webkit-animation: swingInNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: swingInNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); z-index: 1000; } .fx3dSwing .navOutPrev { -webkit-animation: swingOutPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: swingOutPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fx3dSwing .navInPrev { -webkit-animation: swingInPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: swingInPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } @keyframes swingOutNext { 80%{ opacity: 0; } 100% { opacity: 0; transform: perspective(600px) rotateX(5deg) rotateY(-10deg) scale(.8) translateX(-50%); } } @keyframes swingInNext { 0% { opacity: 0; transform: perspective(600px) rotateX(5deg) rotateY(-10deg) scale(.8) translateX(10%); } 80%{ opacity: 1;translateX(0%); } 100% { opacity: 1; transform: perspective(600px) rotateX(0deg) rotateY(0deg) scale(1) translateX(0%); } } @keyframes swingOutPrev { 80%{ opacity: 0; } 100% { opacity: 0; transform: perspective(600px) rotateX(-5deg) rotateY(10deg) scale(.8) translateX(50%); } } @keyframes swingInPrev { 0% { opacity: 0; transform: perspective(600px) rotateX(-5deg) rotateY(10deg) scale(.8) translateX(-10%); } 80%{ opacity: 1;translateX(0%); } 100% { opacity: 1; transform: perspective(600px) rotateX(0deg) rotateY(0deg) scale(1) translateX(0%); } } /*****************************************/ /* 3d reverse */ /*****************************************/ .fx3dReverse .itemwrap{ perspective : 1600px; } .fx3dReverse .navOutNext { -webkit-animation: reverseOutNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: reverseOutNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fx3dReverse .navInNext { -webkit-animation: reverseInNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: reverseInNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); z-index: 1000; } .fx3dReverse .navOutPrev { -webkit-animation: reverseOutPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: reverseOutPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fx3dReverse .navInPrev { -webkit-animation: reverseInPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: reverseInPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } @keyframes reverseOutNext { 0%{ -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg); opacity: 1; transform-origin: 50% 50%; } 100% { -webkit-transform: translateY(100%) translateZ(0px) rotateX(-90deg); opacity: 0; transform-origin: 50% 0%; } } @keyframes reverseInNext { from { -webkit-transform: translateY(-100%) translateZ(0px) rotateX(90deg); opacity: 0; transform-origin: 50% 100%; } to { -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg); opacity: 1; transform-origin: 50% 50%; } } @keyframes reverseOutPrev { 0%{ -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg); opacity: 1; transform-origin: 50% 50%; } 100% { -webkit-transform: translateY(-100%) translateZ(0px) rotateX(90deg); opacity: 0; transform-origin: 50% 100%; } } @keyframes reverseInPrev { from { -webkit-transform: translateY(100%) translateZ(0px) rotateX(-90deg); opacity: 0; transform-origin: 50% 100%; } to { -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg); opacity: 1; transform-origin: 50% 50%; } } /*****************************************/ /* 3d overthrow */ /*****************************************/ .fx3dOverthrow .itemwrap{ perspective : 1600px; } .fx3dOverthrow .navOutNext { -webkit-animation: overthrowOutNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: overthrowOutNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fx3dOverthrow .navInNext { -webkit-animation: overthrowInNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: overthrowInNext 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); z-index: 1000; } .fx3dOverthrow .navOutPrev { -webkit-animation: overthrowOutPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: overthrowOutPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } .fx3dOverthrow .navInPrev { -webkit-animation: overthrowInPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); animation: overthrowInPrev 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1); } @keyframes overthrowOutNext { 0%{ -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg); opacity: 1; transform-origin: 50% 50%; } 100% { -webkit-transform: translateY(100%) translateZ(0px) rotateX(90deg); opacity: 0; transform-origin: 50% 0%; } } @keyframes overthrowInNext { from { -webkit-transform: translateY(-100%) translateZ(0px) rotateX(-90deg); opacity: 0; transform-origin: 50% 100%; } to { -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg); opacity: 1; transform-origin: 50% 50%; } } @keyframes overthrowOutPrev { 0%{ -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg); opacity: 1; transform-origin: 50% 50%; } 100% { -webkit-transform: translateY(-100%) translateZ(0px) rotateX(-90deg); opacity: 0; transform-origin: 50% 100%; } } @keyframes overthrowInPrev { from { -webkit-transform: translateY(100%) translateZ(0px) rotateX(90deg); opacity: 0; transform-origin: 50% 0%; } to { -webkit-transform: translateY(0) translateZ(0px) rotateX(0deg); opacity: 1; transform-origin: 50% 50%; } } /*# sourceURL=/templates/dist/css/main.css */ /*@ sourceURL=/templates/dist/css/main.css */ @charset "UTF-8"; /* FONT SIZE HIERARCHY --------------------------- Default font-size for HTML : 16px blockquote : 1rem body : 1rem form : 0.875rem 14px h1 : 3.375rem 58px h2 : 2.375rem 38px h3 : 1.75rem 28px h4 : 1.25rem 20px h5 : 1rem h6 : 0.75rem 12px GLOBAL SPACING HIERARCHY WITH

--------------------------- Default : 6.5625rem Large : 11.375rem Small : 4.8125rem Default (mobile) : 4.265625rem Large (mobile) : 4.265625rem Small (mobile) : 2.625rem COLOR PALETTE --------------------------- Placeholder Text Color : #E6E6E8 Primary Background Color : transparent Highlight Color : #EC5E79, #E8588C Primary Text Color : #212121, #474747 Heading Text Color : #212121 Subordinate Text Color : #AEAEAE Dividing Line Color : #F4F4F4 Button Gradient Color : #EC5E79, #f60, #d83ba0 TABLE OF CONTENTS --------------------------- ${{TOC}} */ /* Ripple Effect */ @keyframes ripple { 0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1), 0 0 0 20px rgba(255, 255, 255, 0.1), 0 0 0 40px rgba(255, 255, 255, 0.1), 0 0 0 60px rgba(255, 255, 255, 0.1); } 100% { box-shadow: 0 0 0 20px rgba(255, 255, 255, 0.1), 0 0 0 40px rgba(255, 255, 255, 0.1), 0 0 0 60px rgba(255, 255, 255, 0.1), 0 0 0 80px rgba(255, 255, 255, 0); } } /* ====================================================== /* ====================================================== */ :-moz-placeholder { color: #E6E6E8; } :root { --blue: #007007; --indigo: #6610f2; --purple: #6f42c1; --pink: #e83e8c; --red: #dc3545; --orange: #fd7e14; --yellow: #ffc107; --green: #28a745; --teal: #20c997; --cyan: #17a2b8; --white: #fff; --gray: #868e96; --gray-dark: #343a40; --primary: #007bff; --secondary: #868e96; --success: #28a745; --info: #17a2b8; --warning: #ffc107; --danger: #dc3545; --light: #f8f9fa; --dark: #343a40; } ::-moz-selection, ::-moz-selection, ::-webkit-selection { background: #1f1f1f; color: #fff; } html, body { width: 100%; height: 100%; } html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-size: 16px; /* Required, global font size */ } *, h1, h2, h3, h4, h5, h6, p, ul, ol, a { margin: 0; padding: 0; } /* 初始化 */ body, div, span, ul, li, ol, h1, h2, h3, h4, h5, h6, input, textarea, select, p, dl, dt, dd, a, img, button, form, table, th, tr, td, tbody, article, span, aside, details, figcaption, figure, footer, header, menu, nav, section { margin: 0; padding: 0; border: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { font-size: 0.16rem; font-weight: 400; line-height: 1.71428571429; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: "Helvetica Neue", Helvetica, "Microsoft YaHei", STXihei, "PingFang SC", "Hiragino Sans GB", Arial, sans-serif; color: #212121; background-color: #ffffff; } :active, :focus { outline: none !important; } p, pre, table, blockquote { margin-bottom: 1.421875rem; } select { max-width: 100%; } ul, li { list-style-type: none; } blockquote { background: #fff; border: 1px solid #F8F8F8; border-left: 5px solid #EC5E79; padding: 0 1.75rem 1.25rem; margin-top: 1.421875rem; line-height: 2; font-size: 1rem; } blockquote::before { color: #EC5E79; content: open-quote; font-size: 5.25rem; line-height: 0.1; margin-right: 0.21875rem; vertical-align: -2.055rem; font-family: sans-serif; content: "\201C"; /*Unicode for Left Double Quote*/ } strong { font-weight: 600; } hr { margin: 1.421875rem 0; border-color: #F4F4F4; } hr.black { border-color: rgba(255, 255, 255, 0.1); } a img { border: none; } img { max-width: 100%; } iframe { border: none !important; } /* ====================================================== /* ====================================================== */ table.table-normal, .table-normal table { border: 1px solid black; border-collapse: collapse; width: 100%; } table.table-normal th, .table-normal table th { text-align: left; } table.table-normal td, table.table-normal th, .table-normal table td, .table-normal table th { border: 1px solid black; padding: 0.6875rem; } /* ====================================================== /* ====================================================== */ /* * 1. General * 2. Hyperlink * 3. Heading (h1,h2,h3,h4,h5,h6) * 4. Text Effect * 5. Table & List Effect by Default * 6. Drop Cap */ /* --------------------------- 1. General --------------------------- */ a, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { transition: all 0.3s ease; } /* --------------------------- 2. Hyperlink --------------------------- */ a { color: #474747; } a:hover, a:focus, a:active { text-decoration: none; outline: none; } a.link { text-decoration: underline; color: #EC5E79; } a.link:hover { color: #E8588C; } /* --------------------------- 3. Heading (h1,h2,h3,h4,h5,h6) --------------------------- */ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: #212121; font-weight: 700; font-variant-ligatures: common-ligatures; /*Ligatures and contextual forms are ways of combining glyphs to produce more harmonized forms.*/ margin-top: 0; margin-bottom: 0.625rem; padding: 0 0 0.546875rem; word-wrap: break-word; } h1 { font-size: 3.375rem; line-height: 1.14285714286; } h2 { font-size: 22.375rem; line-height: 1.2; } h3 { font-size: 1.75rem; line-height: 1.25; } h4 { font-size: 1.25rem; line-height: 1.33333333333; } h5 { font-size: 1rem; line-height: 1.5; font-weight: 600; } h6 { font-size: 0.75rem; line-height: 2; font-weight: 600; } .h1 { font-size: 3.375rem !important; line-height: 1.14285714286 !important; } .h2 { font-size: 22.375rem !important; line-height: 1.2 !important; } .h3 { font-size: 1.75rem !important; line-height: 1.25 !important; } .h4 { font-size: 1.25rem !important; line-height: 1.33333333333 !important; } .h5 { font-size: 1rem !important; line-height: 1.5 !important; font-weight: 600 !important; } .h6 { font-size: 0.75rem !important; line-height: 2 !important; font-weight: 600 !important; } .heading-space-none { margin: 0 !important; padding: 0 !important; } @media all and (max-width: 768px) { h1 { font-size: 2.41071rem; line-height: 1.15555556; } h2 { font-size: 15.6625rem; line-height: 1.421875; } h3 { font-size: 1.25rem; line-height: 1.625; } .h1 { font-size: 2.41071rem !important; line-height: 1.15555556 !important; } .h2 { font-size: 15.6625rem !important; line-height: 1.421875 !important; } .h3 { font-size: 1.25rem !important; line-height: 1.625 !important; } } @media all and (max-width: 480px) { h1 { font-size: 1.20536rem; line-height: 1.38461538462; } h2 { font-size: 13.425rem; line-height: 1.28571428571; } h3 { font-size: 1.25rem; line-height: 1.5; } .h1 { font-size: 1.20536rem !important; line-height: 1.38461538462 !important; } .h2 { font-size: 13.425rem !important; line-height: 1.28571428571 !important; } .h3 { font-size: 1.25rem !important; line-height: 1.5 !important; } } /* --------------------------- 4. Text Effect --------------------------- */ .font-normal { font-family: "Conv_AvantGardeITCbyBT-Medium", "Helvetica Neue", Helvetica, "Microsoft YaHei", STXihei, "PingFang SC", "Hiragino Sans GB", Arial, sans-serif; font-weight: 400 !important; } .font-uppercase { text-transform: uppercase !important; } .font-bold { font-weight: 800 !important; } .font-italic { font-style: italic !important; } .font-no-italic { font-style: normal !important; } .font-underline { text-decoration: underline !important; } .font-primary-color { color: #EC5E79 !important; } .font-sub-color { color: #AEAEAE !important; } .font-white { color: white; } .font-white p, .font-white h1, .font-white h2, .font-white h3, .font-white h4, .font-white h5, .font-white h6, .font-white .h1, .font-white .h2, .font-white .h3, .font-white .h4, .font-white .h5, .font-white .h6 { color: white; } /* --------------------------- 5. Table & List Effect by Default --------------------------- */ /* Compatible with Uix Shortcodes (WordPress Plugin) */ .list-normal a:not(.uix-sc-btn), .table-normal a:not(.uix-sc-btn) { color: #EC5E79; } .list-normal a:not(.uix-sc-btn):not(.button):hover, .table-normal a:not(.uix-sc-btn):not(.button):hover { color: #E8588C; text-decoration: underline; } .list-normal a:not(.uix-sc-btn):hover img, .table-normal a:not(.uix-sc-btn):hover img { text-decoration: none; } /* --------------------------- 6. Drop Cap --------------------------- */ .dropcap::first-letter, .dropcap > p:first-of-type::first-letter { display: block; margin-right: 10px; float: left; font-size: 3.5rem; line-height: 1; margin-bottom: -2px; } /* ====================================================== /* ====================================================== */ section, .section { position: relative; } section, .section { padding: 6.5625rem 0; } section.space-sm, .section.space-sm { padding: 4.8125rem 0; } section.space-lg, .section.space-lg { padding: 11.375rem 0; } section.space-none, .section.space-none { padding: 0 !important; } section.space-none-top, .section.space-none-top { padding-top: 0 !important; } section.space-none-bottom, .section.space-none-bottom { padding-bottom: 0 !important; } section.site-google-map, .section.site-google-map { padding-top: 0 !important; } @media all and (max-width: 768px) { section, .section { padding: 4.26563rem 0; } section.space-sm, .section.space-sm { padding: 2.625rem 0; } section.space-lg, .section.space-lg { padding: 4.26563rem 0; } section.space-none, .section.space-none { padding: 0; } section.space-none-top, .section.space-none-top { padding-top: 0; } section.space-none-bottom, .section.space-none-bottom { padding-bottom: 0; } section.site-google-map, .section.site-google-map { padding-top: 0; } } .pure:before, .pure:after { content: " "; display: table; } .pure:after { clear: both; } body { height: auto; overflow-x: hidden; } html { font-size: 100px; } .fl_l { float: left; } .fl_r { float: right; } @media screen and (max-width: 800px) { html { font-size: 90px; } } @media screen and (max-width: 600px) { html { font-size: 80px; } } a { text-decoration: none; } .newiconfont { font-family: "iconfont" !important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .bloc { position: relative; min-height: 100%; overflow: hidden; height: 100%; } .bloc .wrapper { width: 100vw; height: 100vh; overflow: hidden; } .bloc .wrapper .row { height: 100vh; background-color: #fff; position: absolute; width: 100vw; top: 0; left: 0; z-index: 3; opacity: 0; overflow: hidden; } .bloc .wrapper .row.on { z-index: 4; opacity: 1; } .bloc .wrapper .row.navInPrev { pointer-events: none; opacity: 1; -webkit-animation: slideInHalfFromTop 0.7s forwards ease-in-out; animation: slideInHalfFromTop 0.7s forwards ease-in-out; } .bloc .wrapper .row.navOutPrev { pointer-events: none; opacity: 1; -webkit-animation: slideOutBottom 0.7s forwards ease-in-out; animation: slideOutBottom 0.7s forwards ease-in-out; } .bloc .wrapper .row.navInNext { pointer-events: none; opacity: 1; z-index: 10; -webkit-animation: slideInFromBottom 0.7s forwards ease-in-out; animation: slideInFromBottom 0.7s forwards ease-in-out; } .bloc .wrapper .row.navOutNext { pointer-events: none; opacity: 1; -webkit-animation: slideOutHalfTop 0.7s forwards ease-in-out; animation: slideOutHalfTop 0.7s forwards ease-in-out; } .navClick { height: 15vh; width: 100%; cursor: pointer; position: absolute; left: 0; bottom: 0; z-index: 5; pointer-events: all; } .bloc .wrapper .claNext { z-index: 4; opacity: 1; transform: translateY(85%); animation: mhover .5s ease 1; } @keyframes mhover { 0% { transform: translateY(100%); } 100% { transform: translateY(85%); } } .bloc .wrapper .claOut { z-index: 4; opacity: 1; transform: translateY(100%); animation: mhover2 .5s ease 1; } @keyframes mhover2 { 0% { transform: translateY(90%); } 100% { transform: translateY(100%); } } .mess_img_case .swiper-wrapper { transition-timing-function: cubic-bezier(0.1, 0.7, 0.74, 0.3); /*transition-timing-function: ease;*/ } .ind_banner_box { height: 100%; } .ind_banner_box .swiper-container { height: 100%; } .banner_img_box { width: 100%; height: 100%; position: relative; } .banner_img_box .banner_img { width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; transform: scale(1.2); } .banner_img_box .banner_m { display: none; } .banner_img_box .banner_text_img_box { width: 35.833%; position: absolute; left: 54%; top: 49.5%; transform: translate(-50%, -50%); } .banner_img_box .banner_text_img_box img { width: 100%; display: block; } .banner_img_box video { width: 100%; height: 100%; object-fit: cover; } .logo_w{ display: block; transition: all .5s ease; } .logo_w:hover{ margin-top: -20px; } .logo_w img { width: 45.97%; } .ind_banner_box .swiper-button-prev, .ind_banner_box .swiper-button-next { background-image: none; font-size: 0; width: auto; height: auto; margin-top: 0; transform: translateY(-50%); } .ind_banner_box .swiper-button-prev:hover .swiper_preview, .ind_banner_box .swiper-button-next:hover .swiper_preview { opacity: 1; pointer-events: all; transform: translate(0, -50%); } .ind_banner_box .swiper-button-prev > div, .ind_banner_box .swiper-button-next > div { display: inline-block; vertical-align: middle; } .ind_banner_box .swiper-button-prev .icon_box, .ind_banner_box .swiper-button-next .icon_box { font-size: .16rem; color: #fff; text-align: center; line-height: .8rem; width: .5rem; } .ind_banner_box .swiper-button-prev .swiper_preview, .ind_banner_box .swiper-button-next .swiper_preview { position: absolute; top: 50%; width: 1.9rem; height: .8rem; overflow: hidden; opacity: 0; pointer-events: none; transition: all .5s ease; background: transparent; } .ind_banner_box .swiper-button-prev .swiper_preview .banner_img_box, .ind_banner_box .swiper-button-next .swiper_preview .banner_img_box { transform: scale(1); } .ind_banner_box .swiper-button-prev .swiper_preview .banner_text_img_box, .ind_banner_box .swiper-button-next .swiper_preview .banner_text_img_box { transform: translate(-50%, -50%); opacity: 1; } .ind_banner_box .swiper-button-prev { left: 274px; } .ind_banner_box .swiper-button-prev .swiper_preview { left: 100%; transform: translate(10%, -50%); } .ind_banner_box .swiper-button-next .swiper_preview { right: 100%; transform: translate(-10%, -50%); } .ind_banner_box .banner_img_box { transform: scale(1.5); transition: all .3s ease-in-out; } .ind_banner_box .banner_img_box .banner_text_img_box { transform: translate(-50%, -50%) scale(1.25); opacity: 0; transition: all 0s ease; } .ind_banner_box .active .banner_img_box { transform: scale(1); transition: all 0s ease; } .ind_banner_box .active .banner_img_box .banner_img { transform: scale(1); transition: all 3s ease; } .ind_banner_box .active .banner_img_box .banner_text_img_box { transform: translate(-50%, -50%) scale(1); opacity: 1; transition: all .3s ease; } .ind_banner_box .swiper-pagination { color: rgba(255, 255, 255, 0.2); font-size: .16rem; font-family: 'Conv_Gotham-Black'; } .ind_banner_box .swiper-pagination .on { color: white; } .ind_banner_box .swiper-pagination .ban_pag_sty { display: inline-block; vertical-align: middle; height: 2px; width: .7rem; margin: 0 .08rem; background-color: #fff; } .ind_bottom_box { color: #fff; position: absolute; left: 0; bottom: 8.333vh; text-align: center; font-size: 0; width: 100%; padding-left: 6.875%; z-index: 1; } .ind_bottom_box > div { display: inline-block; vertical-align: middle; margin: 0 0.08rem; font-size: .16rem; } .ind_bottom_box > div:first-child { margin-left: 0; } .ind_bottom_box > div:last-child { margin-right: 0; } .ind_bottom_box .swiper-pagination { position: relative; width: auto; bottom: 0; } .ind_bottom_box .ind_hint { font-family: 'Conv_Gotham-Black'; } .ind_bottom_box .ind_hint_icon { border: 2px solid #fff; height: 26px; width: 16px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; position: relative; padding: 4px 0; } .ind_bottom_box .ind_hint_icon > div { height: 6px; width: 2px; background-color: #fff; border-radius: 2px; position: absolute; top: 6px; left: 50%; margin-left: -1px; animation: gun0 1s ease infinite; } .ind_body .ind_src2 .ind_bottom_box { color: rgba(0, 0, 0, 0.35); } .ind_body .ind_src2 .ind_bottom_box .ind_hint_icon { border-color: rgba(0, 0, 0, 0.35); } .ind_body .ind_src2 .ind_bottom_box .ind_hint_icon div { background-color: rgba(0, 0, 0, 0.35); } @keyframes gun0 { 0% { top: 6px; } 50% { top: 14px; } 100% { top: 6px; } } .works__slider { cursor: url("http://www.lilang.com/templates/dist/css/../image/svgipsa_cursor_arrow.png") 52 23, move; } .works__slider a { cursor: url("http://www.lilang.com/templates/dist/css/../image/svgipsa_cursor_arrow.png") 52 23, move; } .works__slider a:active, .works__slider a:focus { cursor: url("http://www.lilang.com/templates/dist/css/../image/svgipsa_cursor_arrow_pushed.png") 52 23, move; } .works__slider:active, .works__slider:focus { cursor: url("http://www.lilang.com/templates/dist/css/../image/svgipsa_cursor_arrow_pushed.png") 52 23, move; } @media all and (min-width: 1025px){ .ind_body .nav { width: 240px; height: 1px; left: 50%; transform: translate(-50%, -50%); top: 52.9%; opacity: 0; pointer-events: none; transition: all .5s ease; box-shadow: none; } .ind_body .nav .nav_con { padding-top: 0; } .ind_body .nav.opact { opacity: 1; pointer-events: all; } .ind_body .nav.navLong { height: calc(100vh - 50px); top: 50%; transition: all .5s ease; } .ind_body .nav.navLong .nav_con { padding-top: 25vh; transition: all .5s ease; } .ind_body .nav.navSi { left: 144px; transition: left .5s ease; } .ind_body .nav.navsha { box-shadow: 20px 0 70px -18px rgba(0, 0, 0, 0.6); transition: all .5s ease; } } .nav { width: 240px; height: calc(100vh - 50px); background-color: #121212; background: #006811; box-shadow: 20px 0 70px -18px rgba(0, 0, 0, 0.6); position: fixed; z-index: 121; left: 24px; top: 50%; transform: translateY(-50%); padding-left: 60px; overflow: hidden; } .nav::after { content: ''; display: block; left: 100%; width: 0; height: 100%; position: absolute; top: 0; transition: width .5s ease; background-color: #ffffff; box-shadow: 20px 0 70px -18px rgba(0, 0, 0, 0.6); } .nav.on { overflow: visible; } .nav.on::after { width: 2rem; } .nav_con { margin-top: 0; position: relative; height: calc(100vh - 50px); padding-top: 25vh; } .language_box { font-family: 'Conv_Gotham-Black'; position: absolute; left: 0; bottom: 6vh; font-size: .14rem; } .language_box div { color: #fff; } .language_box span { color: rgba(255, 255, 255, 0.1); margin: 0 .1rem; } .language_box img { display: block; width: 100%; } .language_box a{ display: inline-block; width: .2rem; vertical-align: middle; opacity: 0; transition: all .5s ease; } .language_box > div:hover a{ opacity: .5; } .language_box a.on{ opacity: 1 !important; } .language_box> div a:hover{ opacity: 1; } .logo_box { display: inline-block; border-bottom: 1px solid rgba(255, 255, 255, 0.1); font-size: .165rem; color: #fff; line-height: 7.222vh; } .nav_name { letter-spacing: 1px; } .nav_name_en { height: 0; overflow: hidden; font-family: 'Conv_Gotham-Light'; } .item { padding-top: 4.35185vh; } .item > li:hover .childItem { display: block; } .item > li > a { display: block; color: rgba(255, 255, 255, 0.35); font-size: .14rem; line-height: 1.8; padding: .1rem 0; cursor: pointer; transition: all .5s ease; position: relative; } .item > li.on { padding-bottom: 1.8518vh; } .item > li.on .nav_name { color: white; font-weight: 700; } .item > li.on .nav_name_en { height: calc(.14rem * 1.8); transition: height .5s ease; } .btn_shop { width: .5rem; height: .5rem; background-color: #000000; text-align: center; cursor: pointer; line-height: .2rem; display: block; position: fixed; right: .4rem; top: .4rem; z-index: 116; overflow: hidden; padding-top: .05rem; transition: all .5s ease; } .btn_shop span { display: block; font-size: .1rem; color: #666666; transition: color .5s ease; } .btn_shop div { color: #fff; font-size: .12rem; font-family: 'Conv_Gotham-Black'; text-transform: uppercase; transition: opacity .5s ease; } .btn_shop .sho_det { position: absolute; top: .25rem; left: 50%; transform: translateX(-50%); } .btn_shop .sho_hov { opacity: 0; } .btn_shop:hover { width: 1.24rem; } .btn_shop:hover span { color: #f91a4f; } .btn_shop:hover .sho_det { opacity: 0; } .btn_shop:hover .sho_hov { opacity: 1; } .ind_src2 { height: 100%; width: 100%; position: relative; } .ind_src2 .ind_bottom_box { padding-left: 10%; } .ind_src2 .ind_show_box { width: 52%; height: 100%; float: left; } .ind_src2 .ind_show_link_box { display: block; width: 48%; height: 100%; position: relative; float: right; background-color: #fff; cursor: auto; } .ind_src2 .ind_show_link_box > div { width: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 0; text-align: center; } .ind_src2 .swiper-pagination { color: rgba(255, 255, 255, 0.2); font-size: .16rem; font-family: 'Conv_Gotham-Black'; } .ind_src2 .swiper-pagination .on { color: white; } .ind_src2 .swiper-pagination .ban_pag_sty { display: inline-block; vertical-align: middle; height: 2px; width: .7rem; margin: 0 .08rem; background-color: #fff; } .ind_src2 .swiper-button-prev, .ind_src2 .swiper-button-next { display: none; background-image: none; font-size: 0; width: auto; height: auto; margin-top: 0; transform: translateY(-50%); } .ind_src2 .swiper-button-prev:hover .swiper_preview, .ind_src2 .swiper-button-next:hover .swiper_preview { opacity: 1; pointer-events: all; transform: translate(0, -50%); } .ind_src2 .swiper-button-prev > div, .ind_src2 .swiper-button-next > div { display: inline-block; vertical-align: middle; } .ind_src2 .swiper-button-prev .icon_box, .ind_src2 .swiper-button-next .icon_box { font-size: .16rem; color: #fff; text-align: center; line-height: .8rem; width: .5rem; } .ind_src2 .swiper-button-prev .swiper_preview, .ind_src2 .swiper-button-next .swiper_preview { position: absolute; top: 50%; width: 1.9rem; height: .8rem; overflow: hidden; opacity: 0; pointer-events: none; transition: all .5s ease; background: transparent; } .ind_src2 .swiper-button-prev .swiper_preview .banner_img_box, .ind_src2 .swiper-button-next .swiper_preview .banner_img_box { transform: scale(1); } .ind_src2 .swiper-button-prev .swiper_preview .banner_text_img_box, .ind_src2 .swiper-button-next .swiper_preview .banner_text_img_box { transform: translate(-50%, -50%); opacity: 1; } .ind_src2 .swiper-button-prev { left: 274px; } .ind_src2 .swiper-button-prev .swiper_preview { left: 100%; transform: translate(10%, -50%); } .ind_src2 .swiper-button-next { right: 50px; } .ind_src2 .swiper-button-next .swiper_preview { right: 100%; transform: translate(-10%, -50%); } .ind_src2 .active .ind_btn_more > div { transform: scale(1) translateY(0); opacity: 1; } .src2_logo_img { display: inline-block; vertical-align: top; width: 20.533%; padding-right: 5.7%; position: relative; } .src2_logo_img::before { content: ''; width: 1px; height: 74.07%; background-color: #bab9ba; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } .src2_logo_img img { width: 100%; display: block; } .src2_logo_text { display: inline-block; vertical-align: top; padding-left: 5.7%; width: 22.88%; position: relative; text-align: left; } .src2_logo_text > div { width: 100%; } .src2_logo_text > div img { display: block; width: 100%; } .ind_show_link_case { display: none; } .ind_btn_more { display: none; } .row.part.on .ind_show_link_case { display: block; } .row.part.on .ind_btn_more { display: block; } .row.part.on .ind_new_case { display: block; } .ind_pro_img_box { height: 100%; width: 100%; position: relative; } .ind_pro_img_box > div { height: 100%; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; transition: all .5s ease; } .ind_pro_img_box .ind_btn_more { position: absolute; right: 22%; top: 50%; transform: translateY(-48%); color: #fff; transition: margin-top .5s ease; opacity: 0; } .ind_pro_img_box .ind_btn_more > div { opacity: 0; transform: translateY(15px) scale(0.8); } .ind_pro_img_box .ind_btn_more > div:nth-child(2) { font-family: 'Conv_NeoSans_0'; font-size: .39rem; line-height: 1; margin-top: 3.7vh; letter-spacing: 7.5px; transition: all .5s ease 1.2s; } .ind_pro_img_box .ind_btn_more > div:first-child { font-size: .59rem; font-weight: 700; line-height: 1; transition: all .5s ease 1s; } .ind_pro_img_m { display: none; } .ind_show_box .swiper-container { height: 100%; } .ind_src3 { padding-left: 2.88rem; width: 100%; height: 100%; background-color: #fafbfc; } .ind_src3 > div { padding: 0 .4rem .25rem .24rem; width: 100%; height: 100%; position: relative; overflow: hidden; } .ind_src3 > div .swiper-pagination { width: 100%; left: 0; bottom: .25rem; z-index: 0; font-size: 0; } .ind_src3 > div .swiper-pagination > span { height: 2px; width: 2px; margin: 0 6px; position: relative; } .ind_src3 > div .swiper-pagination .swiper-pagination-bullet-active { background-color: #1b1b1b; } .ind_src3 > div .swiper-pagination .swiper-pagination-bullet-active::after { content: ''; position: absolute; left: -6px; top: -6px; width: 10px; height: 10px; border: 2px solid #494949; } .ind_src3 .title_box { position: absolute; left: calc(.24rem + 50%); transform: translateX(-50%); top: .4rem; padding-top: .05rem; z-index: 4; } .ind_src3 .title_box a{ transition: color .5s ease; } .ind_src3 .title_box a:hover{ color: #e70012; } .title_box { font-size: 0; line-height: 1; } .title_box > span { display: inline-block; vertical-align: middle; margin: 0 .07rem; font-size: .14rem; color: #1f1f1f; } .title_box > span:first-child { margin-left: 0; } .title_box > span:last-child { font-family: 'Conv_Gotham-Black'; margin-right: 0; } .ind_new_hot_bos { width: 19%; float: left; height: 100%; position: relative; z-index: 4; } .ind_new_hot_bos .ind_new_con { position: relative; z-index: 1; } .ind_new_hot_bos::after { content: ''; display: block; width: .24rem; position: absolute; right: 100%; top: 0; height: 100%; background-color: #fff; z-index: 0; } .ind_new_con { display: block; height: 50%; transition: all .5s ease; padding: 0 .2rem; } .ind_new_time { text-align: center; font-size: .24rem; float: right; font-family: 'Conv_Gotham-Black'; line-height: .24rem; color: #333333; } .ind_new_time > span { color: #b2b2b2; font-size: .14rem; margin-left: .05rem; } .ind_new_tex_box { position: relative; border-top: 1px solid #e6e6e6; padding-top: 2.777vh; padding-bottom: 8vh; height: 100%; } .ind_new_tex_box > img { width: 100%; display: block; } .ind_new_hot_bos .ind_new_tex_box { background-color: #fff; } .ind_new_title { display: block; color: #404040; font-size: .16rem; font-weight: 700; line-height: 1.75; margin-top: 2.3148vh; margin-bottom: .16rem; transition: all .5s ease; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; max-height: 56px; } .ind_new_info { font-size: .13rem; color: #a6a6a6; line-height: 1.846; text-align: justify; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; max-height: 72px; } .ind_new_more { display: block; position: absolute; width: 100%; left: 0; bottom: 3vh; font-size: .12rem; line-height: 1; color: #acacac; transition: all .5s ease; font-family: 'Conv_Gotham-Black'; } .ind_new_more > span { float: left; margin-top: .15rem; transition: color .5s ease; } .ind_new_hint { background-color: #000000; color: #fff; text-transform: uppercase; transition: all .5s ease; } .active .ind_new_con:hover { margin-left: .12rem; margin-right: -.12rem; } .ind_new_box .swiper-slide:hover { z-index: 1; } .ind_new_case { position: relative; z-index: 3; height: 100%; padding: .95rem .9rem 0 .4rem;} .ind_new_case .swiper-container { height: 100%; overflow: initial; } .ind_new_case .swiper-container{ font-size: 0; } .ind_new_case .swiper-slide{ width: 33.33%; display: inline-block; vertical-align: top; } .ind_new_case .swiper-slide > div{ margin: 0 .2rem; height: 100%; } .ind_new_case1 { position: relative; z-index: 3; height: 100%; padding: .95rem .9rem 0 .4rem;} .ind_new_case1 .swiper-container { height: 100%; overflow: initial; } .ind_new_case1 .swiper-container{ font-size: 0; } .ind_new_case1 .swiper-slide{ width: 24.75%; display: inline-block; vertical-align: top; } .ind_new_case1 .swiper-slide > div{ margin: 0 .2rem; height: 100%; } .navDown .childItem { display: none; } .childItem { width: 2rem; height: calc(100vh - 50px); position: absolute; top: 0; left: 100%; padding-left: .56rem; color: rgba(255, 255, 255, 0.25); z-index: 1; } .childItem > ul { position: relative; top: 50%; transform: translateY(-50%); } .childItem > ul:first-child { display: block; } .childItem > ul li { padding: 1.85vh 0; cursor: pointer; } .childItem > ul li.thisNav a{ font-weight: 700; color: #000; } .childItem > ul li.thisNav a::after{ width: calc(100% + 1.5em); } .childItem > ul a { font-size: .15rem; color: #808080; transition: all .5s ease; position: relative; line-height: 1; } .childItem > ul a::after { content: ''; display: block; left: -.5em; bottom: -3px; position: absolute; width: 0; height: 6px; background-color: #f2f2f2; z-index: -1; transition: width .5s ease; } .navBox > .childItem { width: 2rem; height: calc(100vh - 50px); position: fixed; top: 25px; left: 240px; padding-left: .48rem; background-color: #000000; } .navBox > .childItem > ul { display: none; position: relative; top: 50%; transform: translateY(-50%); } .navBox > .childItem > ul:first-child { display: block; } .navBox > .childItem > ul li { padding: 1.85vh 0; cursor: pointer; } .navBox > .childItem > ul li.thisNav a, .navBox > .childItem > ul li:hover a { color: white; } .navBox > .childItem > ul li.thisNav a::after, .navBox > .childItem > ul li:hover a::after { width: calc(100% + 1.5em); } .navBox > .childItem > ul a { font-size: .13rem; color: rgba(255, 255, 255, 0.25); transition: all .5s ease; position: relative; line-height: 1; } .navBox > .childItem > ul a::after { content: ''; display: block; left: -.5em; bottom: -3px; position: absolute; width: 0; height: 6px; background-color: #292929; } .pace { -webkit-pointer-events: none; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -moz-user-select: none; } .pace_bg_ant { background-color: #fff; position: fixed; width: 100vw; height: 100vh; left: 50%; top: 50%; transform: translate(-50%, -50%) translateZ(0); z-index: 120; } .pace_bg_ant.on .load_box { transform: translateY(100%); } .pace_bg_ant.on .loading_box { width: 240px; transition: width .5s ease; } .pace_bg_ant.on .loading_num { transform: translateY(150%); opacity: 0; transition: all .5s ease; } .pace_copy_right { position: absolute; width: 100%; left: 0; text-align: center; bottom: 8.796vh; line-height: 1; color: #404040; font-family: 'Conv_Gotham-Black'; transition: all .5s ease; font-size: 0; } .pace_copy_right img { display: inline-block; width: 17.708%; } .pace_copy_right span { font-family: 'Conv_Gotham-Light'; } .pace_copy_right.on { transform: translateY(100%); opacity: 0; } .pace_text_box { width: 100%; font-size: 0; text-align: center; position: absolute; top: 50%; left: 0; transform: translateY(-130%); transition: all .5s ease; } .pace_text_box > span { font-family: 'Conv_Gotham-Light'; display: inline-block; vertical-align: bottom; font-size: .36rem; color: #808080; transition: all .5s ease; } .pace_text_box .pace_p { opacity: 0; } .pace_text_box .pace_p.on { opacity: 1; } .pace_text_box .pace_p.on.out { opacity: 0; } .pace_text_box .pace_f { opacity: 0; } .pace_text_box .pace_f.on { opacity: 1; } .pace_text_box .pace_f.on.out { opacity: 0; } .pace_text_box .com_name { font-size: .60rem; color: #000000; margin: 0 .3rem; opacity: 0; transition: all .5s ease; } .pace_text_box .com_name.on { opacity: 1; } .pace.pace-inactive .pace-progress { display: none; } .pace .pace-progress { position: fixed; z-index: 2000; top: 50%; left: 50%; /*height: 5rem;*/ /*width: 5rem;*/ } .pace .pace-progress:after { display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-progress-text); font-family: "Helvetica Neue", sans-serif; font-weight: 100; font-size: 5rem; line-height: 1; text-align: center; color: rgba(0, 0, 0, 0.2); } .load_box { position: absolute; left: 0; width: 100%; top: 50%; transform: translateY(50%); text-align: center; transition: all .2s ease; } .load_box .loading_box { overflow: hidden; width: 86.4583%; margin: 0 auto; height: 1px; background-color: #e6e6e6; position: relative; } .loading_num { margin-top: .2rem; } .load_at { width: 0; height: 100%; background-color: #121212; position: absolute; left: 0; top: 0; } .ind_new_box .swiper-button-prev, .ind_new_box .swiper-button-next { display: none; } .dyn_body .title_box { z-index: 5; } .dyn_body .ind_src3 > div::before { display: none; } .dyn_body .ind_src3 > div { padding-top: .4rem; } .dyn_time_title_box { overflow: hidden; width: 52%; float: left; padding-right: 15px; background-image: linear-gradient(to bottom, #656565 0, #656565 30%, transparent 20%); background-size: 1px 8px; background-repeat: repeat-y; background-position: right; margin-top: -.15rem; position: relative; height: 100%; } .dyn_time_title_box::before { content: ''; display: block; height: 100%; width: 1px; background-image: linear-gradient(to bottom, #656565 0, #656565 30%, transparent 20%); background-size: 1px 8px; background-repeat: repeat-y; position: absolute; left: 24%; top: 0; } .dyn_time_title_box::after { content: ''; display: block; height: 100%; width: 1px; background-image: linear-gradient(to bottom, #656565 0, #656565 30%, transparent 20%); background-size: 1px 8px; background-repeat: repeat-y; position: absolute; left: 48%; top: 0; } .dyn_time_title { position: absolute; left: 0; top: 0; padding-left: 24%; width: 100%; z-index: 1; transition: top .5s ease; } .dyn_time_title_num { color: #1c1c1c; line-height: 1.5; margin-left: 31.8%; transition: all .5s ease; position: relative; padding: 5vh 0; cursor: pointer; } .dyn_time_title_num .dyn_img_box { font-size: 0; width: 36%; position: relative; transition: all .5s ease; } .dyn_time_title_num .dyn_img_box img { display: inline-block; opacity: 0; transition: all .5s ease; max-width: 100%; } .dyn_time_title_num .dyn_img_box .det_img { opacity: 1; position: absolute; left: 0; top: 0; } .dyn_time_title_num.on { padding: 3.5vh 0; margin-left: 0; cursor: auto; } .dyn_time_title_num.on .dyn_img_box { width: 45%; } .dyn_time_title_num.on .dyn_img_box img { opacity: 1; } .dyn_time_title_num.on .dyn_img_box .det_img { opacity: 0; } .dyn_time_title_num.on .dyn_time_year { font-size: 2.10rem; text-indent: -17px; text-shadow: 36px 25px 24px rgba(0,0,0,.12); } .dyn_time_title_num.on .dyn_title { font-size: .22rem; margin-top: .15rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .dyn_time_title_num.dyn_time_prev { padding-left: 30%; } .dyn_time_title_num.dyn_time_prev .dyn_img_box { position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .dyn_time_title_num.dyn_time_next { padding-right: 30%; text-align: right; } .dyn_time_title_num.dyn_time_next .dyn_img_box { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .dyn_time_title_num.dyn_time_next .dyn_img_box .det_img { left: auto; right: 0; } .dyn_time_year { font-size: .2rem; font-family: 'Conv_NeoSans_0'; transition: all .5s ease; } .dyn_title { font-size: .14rem; transition: all .5s ease; } .dyn_time_con_box { width: 48%; float: right; position: relative; height: 100%; } .dyn_time_con_case { position: absolute; left: 0; top: 50%; transform: translateY(-50%); font-size: .14rem; line-height: 1.8; color: #404040; padding-left: 20.5%; width: 100%; } .dyn_time_con_case > div { display: none; } .dyn_time_con .dyn_time_title_num { display: none; } .dyn_time_con > div { padding: .1rem; } .dyn_btn_Prev, .dyn_btn_Next { font-size: 0; cursor: pointer; position: absolute; left: 50%; transform: translateX(-50%); opacity: .65; transition: opacity .5s ease; } .dyn_btn_Prev:hover, .dyn_btn_Next:hover { opacity: 1; } .dyn_btn_Prev > span, .dyn_btn_Next > span { display: inline-block; vertical-align: middle; font-size: .14rem; line-height: 1; color: rgba(31, 31, 31, 0.3); } .dyn_btn_Prev .newiconfont, .dyn_btn_Next .newiconfont { color: #1f1f1f; } .dyn_btn_Prev { top: 11.11vh; } .dyn_btn_Next { bottom: 11.11vh; } .disab { pointer-events: none; opacity: 0.4; } .fin_fixed_img { position: fixed; width: 13%; height: 100%; right: 0; top: 0; background: url("../images/fin_fiexd.jpg") no-repeat top left; background-size: cover; } .ins_box { padding: .4rem 13% .25rem 2.88rem; } .ins_box > div { padding: 5.78% 5.06% 0 4.338%; padding: 2% 5.06% 0 4.338%; } .ins_body_tab { width:15vw; } .time_year{ position: relative; } .time_year::after{ content: ''; display: block; position: absolute; left: calc(100% + 20px); top: 50%; transform: translateY(-50%); background-color: #121212; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; height: 3px; width: 0; transition: all .5s ease; } .ins_tab_btn.on .time_year::after{ width: 250%; } .ins_body_con { float: left; width: 100%; } .fin_title { font-size: .4rem; line-height: 1; font-weight: 700; color: #121212; margin-bottom: .4rem; } .fin_describe { display: block; position: relative; font-size: .16rem; font-weight: lighter; color: #404040; padding-left: .35rem; line-height: 1.5; margin-bottom: .55rem; margin-bottom: .2rem; } .fin_describe::before { content: ''; display: block; width: 3px; height: 24px; background-color: #1983fc; background: #006811; transform: skewX(-20deg); position: absolute; left: 5px; top: 0; } .fin_body .ind_bottom_box { color: #1f1f1f; position: relative; text-align: right; bottom: 0; } .fin_body .ind_bottom_box .ind_hint_icon { border-color: #1f1f1f; } .fin_body .ind_bottom_box .ind_hint_icon > div { background-color: #1f1f1f; } .ins_header { padding-bottom: .3rem; position: relative; } .ins_header::after { content: ''; display: block; left: 0; bottom: 0; position: absolute; width: 150%; height: 2px; background-color: rgba(0, 0, 0, 0.05); } .fin_time_box { position: relative; color: #1f1f1f; font-size: .26rem; font-family: 'Conv_Gotham-Black'; padding: .4rem 0 .3rem 0; } .fin_time_box::before { content: ''; display: inline-block; vertical-align: middle; margin-right: .2rem; width: 23%; height: 1px; background-color: #1f1f1f; } .btn_operate { width: 48%; margin-right: 2%; display: block; float: left; padding: .3rem 0; } @media all and (min-width: 1441px){ .btn_operate{ max-width: 350px; } .scr_body .btn_operate{ max-width: none; } .fin_con_box > .btn_operate:nth-child(even){ margin-left: calc(50% - 350px); } .scr_body .fin_con_box > .btn_operate:nth-child(even){ margin-left: 0; } } .fin_name { font-size: .17rem; font-weight: 700; color: #1f1f1f; line-height: 1.8; padding: 5px 0; max-width: 400px; display: block; transition: all .5s ease; } .fin_name span{ font-weight: 400; } .fin_name i { font-size: .22rem; line-height: 1; vertical-align: middle; margin-left: .15rem; font-weight: 400; color: #1f1f1f; } .fin_con_time { font-size: .13rem; line-height: 22px; color: #a6a6a6; padding: .06rem 0; } .fin_con_time i { font-size: .22rem; vertical-align: middle; margin-left: .15rem; color: #1f1f1f; } .fin_con_box > a:nth-child(2n + 1) { clear: left; float: left; } .ins_tab_btn { position: relative; width: 15px; font-size: 0; text-align: right; cursor: pointer; } .ins_tab_btn span { display: inline-block; height: 1px; width: 8px; background-color: #d4d4d4; margin: 5px 0; } .ins_tab_btn .ins_mark { width: 15px; position: relative; } .ins_tab_btn .ins_mark::after { content: ''; display: block; height: 3px; width: 0; background-color: #1f1f1f; position: absolute; right: 0; top: -1px; border-radius: 2px; transition: width .5s ease; } .ins_tab_btn .time_year { font-size: .16rem; color: #979ba0; transition: all .5s ease; font-family: 'Conv_Gotham-Black'; position: absolute; left: 30px; top: 50%; transform: translateY(-50%); } .ins_tab_btn.on { cursor: auto; } .ins_tab_btn.on .ins_mark::after { width: 200%; } .ins_tab_btn.on .time_year { font-size: .26rem; color: #1f1f1f; } .scr_body .ins_body{ position: relative; } .ins_body_tab { position: absolute; overflow: hidden; height: 40vh; padding-right: 15px; margin-top: .94rem; float: none; left: 20px; top: 0; } .ins_tab_fa { top: 0; left: 15px; position: absolute; transition: all .5s ease; } .ins_tab_fa > div:first-child span:first-child { opacity: 0; } .ins_tab_fa > div:first-child span:nth-child(2) { opacity: 0; } .ins_tab_fa > div:last-child span:nth-child(4) { opacity: 0; } .ins_tab_fa > div:last-child span:nth-child(5) { opacity: 0; } .ins_body_con > div { display: none; } .ins_body_con > div:first-child { display: block; } .fin_o_body .ins_header { margin-bottom: .3rem; } .fin_o_body .ins_body_con { width: 100%; } .fin_o_body .fin_name { max-width: 350px; } .fin_con_box > div { width: 48%; float: left; margin-right: 2%; } .fin_con_box > div > a, .fin_con_box > div > div { width: 100%; } .btn_cor { display: inline-block; background-color: #d9d9d9; border-radius: 3px; font-size: .13rem; line-height: 34px; color: #121212; font-weight: 700; padding-left: .25rem; padding-right: .25rem; margin-top: .24rem; transition: all .5s ease; } .btn_cor i { margin-left: .2rem; vertical-align: middle; } .cor_gov { font-size: 0; } .cor_gov > a, .cor_gov > span { display: inline-block; vertical-align: middle; font-size: .22rem; line-height: 1; color: #121212; } .cor_gov span { margin: 0 10px; height: 1px; width: .4rem; background-color: #bfbfbf; } .cor_gov .cor_down { border-radius: 4px; text-align: center; color: #fff; line-height: 20px; font-size: .12rem; font-weight: 700; background-color: #1985ff; width: 42px; } .cor_right .fin_dd { padding-top: 0; padding-bottom: .2rem; } .fin_describe .cor_gov { display: inline-block; vertical-align: middle; margin-left: .08rem; } .int_body .bloc { padding-top: .25rem; } .int_case { padding: 0 .25rem 0 2.88rem; } .int_case > div { padding: 0 3.75%; } .int_title { margin-top: 8.333vh; padding: 20px 0; font-size: .17rem; font-weight: 700; color: #121212; line-height: 1.764; text-align: center; position: relative; } .int_title img { display: block; width: 1em; position: absolute; } .int_title .icon_t_01 { right: calc(50% + 5px); top: 0; } .int_title .icon_t_02 { left: calc(50% + 5px); bottom: 0; } .int_info { font-size: .14rem; line-height: 2.2857; color: #808080; text-align: center; padding: .5rem 0; letter-spacing: .5px; } .int_info p { margin-bottom: 0; } .int_video_box { position: relative; overflow: hidden; display: block; } .int_video_box video { display: block; width: 100%; height: 45vh; object-fit: cover; } .int_video_box .int_btn_sty { font-size: 0; position: absolute; top: 50%; left: calc(50% + 1.44rem); transform: translate(-50%, -50%); } .int_video_box .int_btn_sty > div { display: inline-block; vertical-align: middle; } .int_play { -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: #ffffff; color: #1c1c1e; text-align: center; line-height: .4rem; width: .4rem; margin-right: .2rem; font-size: .16rem; } .int_play i { margin-left: .03rem; } .int_vid_hint { color: #fff; line-height: 1.8; } .int_vid_hint:first-child { font-size: .14rem; } .int_vid_hint:last-child { font-size: .18rem; font-family: 'Conv_Gotham-Black'; } .int_pre_sty { font-size: 0; } .int_pre_sty > div { margin-top: .45rem; display: inline-block; vertical-align: middle; } .int_pre_sty .ind_bottom_box { width: 240px; padding: 0; bottom: 0; position: relative; text-align: right; color: #1f1f1f; } .int_pre_sty .ind_bottom_box .ind_hint_icon { border-color: #1f1f1f; } .int_pre_sty .ind_bottom_box .ind_hint_icon > div { background-color: #1f1f1f; } .int_pre_sty .int_provenance { width: calc(100% - 240px); font-size: 0; } .int_pre_sty .int_provenance > img { display: inline-block; vertical-align: middle; margin: 0 .2rem; } .int_pre_sty .int_provenance > div { display: inline-block; vertical-align: middle; } .int_pre_sty .int_provenance > div > div { padding-left: .15rem; line-height: 1; } .int_pro_cn { font-size: .18rem; color: #1f1f1f; font-weight: 700; position: relative; padding-right: 20px; margin-bottom: .2rem; } .int_pro_cn::after { content: ''; display: block; width: 0; height: 0; border-width: 6px 0 6px 6px; border-style: solid; border-color: transparent transparent transparent #1f1f1f; transform: rotate(-45deg); position: absolute; right: 0; top: -4px; } .int_pro_en { font-size: .12rem; color: #bfbfbf; } .marT_180 { margin-top: 1.8rem; } .int_src2_box { position: relative; } .int_src2_box .int_src2_bg { padding: 0; padding-left: 2.28rem; width: 100%; position: absolute; top: 0; left: 0; } .int_src2_box .int_src2_bg .int_src2_bg_img { overflow: hidden; } .int_src2_box .int_src2_bg .int_src2_bg_img.go > img { transform: scale(1); } .int_src2_box .int_src2_bg .int_src2_bg_img > img { transform: scale(1.2); display: block; width: 100%; transition: all 3s ease; } .int_src2_box .int_title { color: #fff; } .int_src2_box .int_src2_case { position: relative; width: 100%; padding-top: 4.2%; z-index: 1; } .int_src2_box .int_src2_case .int_info { padding-top: .4rem; } .int_src2_info { color: #fff; line-height: 2; padding-top: .2rem; font-size: .32rem; text-align: center; } .int_src2_info_en { font-family: 'Conv_Gotham-Light'; } .int_src2_info_cn { font-family: '宋体'; } .int_src2_time_box { text-align: center; font-size: 0; width: 100%; padding-top: 1.3rem; } .int_src2_time_box img { display: inline-block; vertical-align: middle; width: 43.75%; } .int_src3_case { margin-top: 13.4vh; } .int_src3_case > div { width: 70%; margin: 0 auto; } .int_zb_text { float: left; font-size: .14rem; color: #808080; line-height: .32rem; width: 43%; } .int_zb_text span { color: #333333; font-weight: 700; } .fz_z { font-size: .17rem; } .fz_b { font-size: .32rem; } .int_zb_img { float: right; width: 45%; position: relative; } .int_zb_img > img { display: block; } .int_zb_img .int_zb_st { transition: width 1.5s ease; position: absolute; left: 14.5%; width: 0; bottom: -8%; overflow: hidden; } .int_zb_img .int_zb_st img { width: 13.85vw; display: block; } .int_zb_img .int_zb_st.go { width: 100%; } .int_src3_ren_box .int_zb_text { float: right; margin-top: 1.7rem; } .int_src3_ren_box .int_zb_img { float: left; font-size: 0; text-align: center; } .int_src3_ren_box .int_zb_img > img { display: inline-block; vertical-align: middle; width: 72.76%; } .int_zb_name { color: #333333; font-size: .2rem; font-weight: bold; line-height: 1.5; } .int_banner_box { padding-top: 7.4vh; padding-left: 2.25rem; position: relative; } .int_banner_box .ind_bottom_box { text-align: right; bottom: .45rem; padding-right: .55rem; font-family: 'Conv_Gotham-Black'; } .int_banner_box .ind_bottom_box .swiper-pagination { color: rgba(255, 255, 255, 0.2); font-size: .16rem; } .int_banner_box .ind_bottom_box .ban_pag_sty { display: inline-block; vertical-align: middle; height: 2px; width: .7rem; margin: 0 .08rem; background-color: #fff; } .int_banner_box .ind_bottom_box .swiper-pagination .on { color: #fff; } .int_banner_img { width: 100%; position: relative; } .int_banner_img > img { width: 100%; display: block; } .int_banner_img .int_lb_tex { font-size: .24rem; font-weight: 700; position: absolute; left: 1.14rem; bottom: .4rem; color: #fff; transform: translateY(-50%); opacity: 0; transition: all .5s ease .5s; } .int_banner_box .active .int_banner_img .int_lb_tex { transform: translateY(0); opacity: 1; } .int_banner_m { display: none; } .int_src4_text { width: 39.8%; padding: 0; padding-top: .32rem; text-align: left; } .int_src4_text_left { float: left; } .int_src4_text_right { float: right; } .int_src4_case { padding-top: 5.555vh; } .int_src4_case > div { position: relative; } .int_src4_case .int_title { position: absolute; top: 0; left: 0; width: 100%; } .int_src5_case { padding-top: 15.74vh; } .int_src5_bfb { width: 100%; font-size: 0; text-align: center; padding-top: 8.8vh; } .int_src5_bfb > img { display: inline-block; width: 32.1%; } .int_pro_box { margin-top: .45rem; font-size: 0; } .int_pro_box > div { display: inline-block; vertical-align: middle; width: calc((100% - 1rem - 1px) / 6); margin-right: .2rem; position: relative; text-align: center; font-size: 0; } .int_pro_box > div:last-child { margin-right: 0; } .int_pro_box > div::after { content: ''; display: block; width: 100%; height: 14px; background-color: #f2f2f2; position: absolute; left: 0; top: 50%; } .int_pro_box > div > img { display: inline-block; max-width: 100%; vertical-align: middle; position: relative; z-index: 1; } .int_src5_case .int_info { padding: 0; } .int_src5_case .int_info span { color: #333333; font-weight: 700; } .int_src6_case { margin-top: 18vh; } .int_src6_case .int_info span { color: #333333; font-weight: 700; } .int_src6_case > div { position: relative; } .int_src6_case .int_src6_box { position: relative; z-index: 1; } .int_src6_img { width: 100%; display: block; margin-top: -2.9rem; } .new_body .bloc .wrapper .row { opacity: 1; position: relative; height: auto; } .new_body .ind_new_case { font-size: 0; height: auto; } .new_body .bloc .wrapper { height: auto; } .new_body .ind_new_case .swiper-slide{ height: calc((100vh - .95rem - .25rem) / 2); } .new_body .ind_new_con{ height: 100%; } .ind_new_con:hover .ind_new_title { color: #1f1f1f; } .hots_time { margin-top: .15rem; padding: 0 .1rem; font-size: 12px; line-height: 1.5; color: #242424; font-family: Conv_Gotham-Light; } .hots_time span { font-family: Conv_Gotham-Black; } .new_title_bg { background-repeat: no-repeat; background-position: center; background-size: cover; transform: scale(1.4); -webkit-filter: blur(40px); filter: blur(40px); width: 100%; height: 100%; } .new_title_box { position: relative; } .new_title_box .new_title_bg_box { position: absolute; width: 100%; height: 100%; overflow: hidden; z-index: 0; } .new_title_case { margin-left: 3.46rem; margin-right: .4rem; padding-top: .7rem; padding-bottom: .2rem; position: relative; z-index: 1; } .new_title_case > div { margin: 0 auto; max-width: 850px; } .new_title { font-size: .32rem; color: #fff; line-height: 1.5; margin-bottom: .3rem; } .new_time { line-height: 1; color: #fff; font-size: .22rem; font-family: 'Conv_NeoSans_0'; margin-bottom: .1rem; } .new_time > span { font-size: .16rem; } .new_time .col_5 { color: rgba(255, 255, 255, 0.5); } .new_tab { text-align: right; color: rgba(255, 255, 255, 0.4); font-size: .14rem; font-weight: 700; line-height: 2.5; font-family: 'Conv_Gotham-Black'; } .new_tab > a { display: inline-block; vertical-align: middle; color: #fff; letter-spacing: .5px; } .new_tab .btn_forbidden { color: rgba(255, 255, 255, 0.4); pointer-events: none; } .new_go_list { background-color: #ffffff; position: absolute; display: block; bottom: 0; left: 5px; color: #1f1f1f; font-size: .14rem; text-align: center; line-height: 4; width: 200px; box-shadow: 0 0 40px 0px rgba(0, 0, 0, 0.1); } .new_go_list i { font-size: .24rem; line-height: 1; margin-left: .45rem; vertical-align: middle; transition: margin-left .5s ease; } .new_go_list:hover i { margin-left: .25rem; } .new_det_con { padding-left: 3.46rem; padding-right: .4rem; } .new_det_con > div { margin: 0 auto; max-width: 850px; } .new_det_con > div p { font-size: .15rem; line-height: 2; color: #595959; margin: .35rem 0; padding-top: .1rem; } .new_det_con > div p img { max-width: 100%; width: 100% !important; height: auto !important; display: block; margin-top: -.1rem; } .new_det_con .new_end_hint { max-width: 100%; position: relative; text-align: center; line-height: 1; margin-bottom: .4rem; margin-top: .2rem; } .new_det_con .new_end_hint::after { content: ''; height: 1px; width: 100%; background-color: #e0e0e0; position: absolute; left: 0; bottom: 50%; } .new_det_con .new_end_hint span { background-color: #fff; padding: .1rem .15rem; font-size: .14rem; font-weight: 700; font-family: 'Conv_Gotham-Black'; position: relative; z-index: 1; } .go_top { font-size: 0; position: fixed; right: 6.145%; bottom: .5rem; cursor: pointer; display: none; } .go_top > div { display: inline-block; vertical-align: middle; font-size: .14rem; line-height: 1; color: #1f1f1f; } .go_top .go_top_text { margin-right: .2rem; opacity: 0; pointer-events: none; transition: opacity .5s ease; } .go_top:hover .go_top_text{ opacity: 1; pointer-events: all; } .go_top .go_top_icon { width: .55rem; height: .55rem; text-align: center; line-height: .55rem; background-color: #f2f2f2; font-size: .24rem; } .show_body { background-color: #000000; } .show_body .bloc .wrapper .row { opacity: 1; } .btn_nav { display: none; } .up_nav .nav { height: 98px; height: 140px; padding-top: 20px; top: 25px; transform: translateY(0); transition: height .5s ease; } .up_nav .nav.down_nav { height: calc(100vh - 50px); } .up_nav .nav.down_nav .nav_con { padding-top: 25vh; } .up_nav .nav.down_nav .logo_box { border-color: rgba(255, 255, 255, 0.1); } .up_nav .nav_con { padding-top: 0; transition: padding-top .5s ease; } .up_nav .logo_box { border-color: transparent; } .up_nav .btn_nav { display: block; position: absolute; left: 0; bottom: 0; width: 100%; line-height: 1.5; font-size: .28rem; cursor: pointer; text-align: center; color: #5a5a5a; color: #f0f0f0; background-color: #121212; background: #006811; } .sho_tab_box { height: 12vh; width: 72.5%; position: absolute; left: 50%; transform: translateX(-50%); bottom: 3vh; z-index: 1; } .sho_tab_box .swiper-container { height: 100%; } .sho_tab_box .swiper-wrapper { height: 100%; } .sho_tab_box .swiper-slide { height: 100%; } .sho_tab_box .banner_img_box { height: 100%; overflow: hidden; position: relative; cursor: pointer; } .sho_tab_box .banner_img_box > div { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); height: 33.33%; width: 100%; transition: all .5s ease; overflow: hidden; } .sho_tab_box .banner_img_box > div > div { height: 12vh; margin-top: -4vh; transition: all .5s ease; } .sho_tab_box .banner_img_box:hover > div { height: 100%; } .sho_tab_box .banner_img_box:hover > div > div { margin-top: 0; } .sho_tab_box .swiper-slide-thumb-active .banner_img_box { cursor: auto; } .sho_tab_box .swiper-slide-thumb-active .banner_img_box > div { height: 100%; } .sho_tab_box .swiper-slide-thumb-active .banner_img_box > div > div { margin-top: 0; } .show_body .banner_img { background-size: auto 100%; background-color: #000; } .show_body .ind_banner_box .swiper-button-prev { left: 4.375%; } .show_body .ind_banner_box .swiper-button-next { right: 4.375%; } .show_body .ind_banner_box .swiper-button-prev, .show_body .ind_banner_box .swiper-button-next { top: auto; bottom: 9vh; transform: translateY(50%); } .show_series_box { position: absolute; padding-left: 13.75%; width: 100%; left: 0; top: 50%; transform: translateY(-40%); z-index: 5; } .show_series_box > a { display: block; font-size: .2rem; line-height: 2; position: absolute; left: 24%; } .show_series_box > a i { color: #fff; } .show_series_box .show_prev { bottom: 110%; } .show_series_box .show_next { top: 110%; } .btn_forbidden { color: rgba(255, 255, 255, 0.4) !important; pointer-events: none !important; cursor: auto !important; opacity: .4; } .show_ser_name { color: #fff; font-weight: 700; line-height: 1.2857; font-size: .56rem; text-shadow: 0 0 1px transparent,0 0 5px rgba(0,0,0,.8); } .show_ser_num_box { position: absolute; right: 13.75%; bottom: 50%; color: rgba(255, 255, 255, 0.2); font-family: Conv_Gotham-Black; font-size: .16rem; transform: translateY(50%); } .show_ser_num_box .on { color: #fff; } .ban_pag_sty { display: inline-block; vertical-align: middle; height: 2px; width: .7rem; margin: 0 .08rem; background-color: #fff; } .sto_body .bloc .wrapper .row { opacity: 1; background-color: #121212; padding: .9rem 0 0 2.65rem; } .sto_title { font-weight: 700; font-size: .48rem; line-height: 1; display: block; margin-right: .4rem; border-bottom: 2px solid #292929; position: relative; padding-bottom: .38rem; color: #fff; margin-left: 7%; } .sto_show_box { position: relative; cursor: pointer; } .sto_show_img_box { position: relative; opacity: .15; transition: opacity .5s ease; pointer-events: none; height: 50vh; overflow: hidden; } .sto_show_img_box img { min-width: 100%; min-height: 100%; display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); } .sto_show_img_box .btn_big { position: absolute; right: 0; top: 0; background-color: #dd0211; font-size: .2rem; line-height: .4rem; text-align: center; width: .4rem; cursor: pointer; opacity: 0; pointer-events: none; color: #fff; } .sto_num { position: absolute; top: 50%; left: 0; width: 100%; text-align: center; transform: translateY(-50%); color: #fff; font-family: 'Conv_Gotham-Light'; line-height: 2; transition: all .5s ease; display: none; } .sto_num::after { content: ''; display: block; width: 1em; height: 4px; background-color: #fff; position: absolute; bottom: 0; left: 50%; margin-left: -.5em; } .sto_add { font-size: .17rem; font-weight: 700; color: #fff; position: absolute; width: 100%; text-align: center; bottom: 40%; transform: translateY(50%); transition: all .5s ease; display: none; } .sto_banner_box .ind_bottom_box .swiper-pagination { color: rgba(255, 255, 255, 0.2); font-size: .16rem; font-family: Conv_Gotham-Black; } .sto_banner_box .ind_bottom_box .swiper-pagination .on { color: #fff; } .sto_banner_box .swiper-container { padding-top: 8.5vh; padding-bottom: 14.8vh; } .sto_banner_box .sto_show_box{ transform: scale(0.8); } .sto_banner_box .active .sto_show_box { /*transform: translateY(-0.45rem);*/ transform:scale(1.1); cursor: auto; } .sto_banner_box .active .sto_show_img_box { opacity: 1; cursor: pointer; pointer-events: all; } .sto_banner_box .active .sto_show_img_box .btn_big { opacity: 1; pointer-events: auto; } .sto_banner_box .active .sto_num { font-size: 3.6rem; line-height: 1; top: 106%; pointer-events: none; } .sto_banner_box .active .sto_num::after { opacity: 0; } .sto_banner_box .active .sto_add { bottom: 110%; } .sto_banner_box .swiper-slide:hover .sto_show_img_box{ opacity: 1; } .btn_close { position: absolute; top: calc(100% + .3rem); left: 50%; transform: translateX(-50%); font-size: 0; text-align: center; cursor: pointer; } .btn_close > span { display: inline-block; vertical-align: middle; font-size: .14rem; color: #fff; line-height: 1; } .btn_close > span:first-child { font-weight: lighter; } .btn_close > span:last-child { font-family: 'Conv_Gotham-Black'; } .btn_close .clo_z { margin: 0 .25rem; height: .5rem; width: .5rem; text-align: center; line-height: .5rem; color: #333333; background-color: #fff; } .sha_box { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); z-index: 50; } .sha_sto_con { display: none; position: fixed; width: 65%; left: calc(50% + 1.125rem); top: 50%; transform: translate(-50%, -50%); z-index: 51; } .sto_add_title { line-height: 3; font-size: .17rem; text-align: center; font-weight: 700; color: #fff; display: none; } .sto_body .ind_bottom_box{ padding-left: 2.65rem; } .sto_big_img{ text-align: center; font-size: 0; height: 70vh; } .sto_big_img img { display:inline-block; vertical-align: middle; max-width: 100%; max-height: 100%; } .lar_body .bloc .wrapper .row { opacity: 1; background-color: #121212; padding-left: 2.65rem; } .lar_body .sto_title { width: 0.74rem; position: absolute; top: 0.9rem; left: 2.65rem; z-index: 11; } .lar_body .sto_title::after { width: .2rem; height: calc(100% + 2.5em); bottom: auto; top: -.5em; left: auto; right: -.12rem; } .lar_show_box { font-size: 0; text-align: left; height: 100%; opacity: 0.25; transition: all .5s ease; transform: scale(0.8); } .lar_show_box > div, .lar_show_box > a { display: inline-block; vertical-align: middle; } .lar_show_box .lar_hint_box { width: 31.847%; text-align: right; color: #fff; } .lar_show_box .sto_show_vid_box { width: 46.1%; margin-left: 9.5%; height: 100%; overflow: hidden; position: relative; pointer-events: none; } .lar_show_box .sto_show_vid_box > video { cursor: pointer; width: 100%; height: 100%; display: block; object-fit: cover; transition: all .5s ease; } .lar_show_box .sto_show_vid_box .btn_play { webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: #dd0211; color: #fff; line-height: .4rem; width: .4rem; margin-right: .2rem; font-size: .16rem; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: all .5s ease; text-align: center; } .lar_show_box .sto_show_vid_box .btn_play i { margin-left: .03rem; } .lar_show_box .sto_show_vid_box:hover .btn_play { transform: translate(-50%, -50%) scale(1.8); } .lar_banner_box { padding: 29.4vh 0; height: 100%; } .lar_banner_box .swiper-container { height: 100%; overflow: initial; } .lar_banner_box .swiper-slide { cursor: pointer; } .lar_banner_box .swiper-slide:hover .lar_show_box{ opacity: 1; } .lar_banner_box .active { cursor: auto; } .lar_banner_box .active .lar_show_box { opacity: 1; transform: scale(1); } .lar_banner_box .active .sto_show_vid_box { pointer-events: all; cursor: pointer; } .lar_v_num { font-size: .6rem; font-family: 'Conv_Gotham-Black'; line-height: 1; } .lar_v_hint { font-size: .22rem; line-height: 1.5; font-weight: 700; } .lar_v_cc { font-size: .17rem; font-weight: 700; color: rgba(255, 255, 255, 0.2); } .dyn_body .bloc .wrapper .row { opacity: 1; } .fin_con_lable { font-size: .16rem; font-weight: 700; color: #949699; } .fin_info_text { font-size: .22rem; font-family: 'Conv_Gotham-Black'; } .con_body .ins_body_con > div { position: relative; padding-top: 1rem; } .con_body .ins_body_con { width: 100%; } .con_body .btn_operate { width: 37%; } .con_body .btn_operate > div { max-width: 3.3rem; } .con_bg { font-size: 1.4rem; line-height: 1; position: absolute; z-index: -1; color: #f6f6f6; right: 0; top: 7vh; text-transform: uppercase; font-family: 'Conv_Gotham-Black'; } .con_bg_img { position: fixed; bottom: 0; right: 16.5%; width: 20%; } .con_bg_img img { display: block; width: 100%; } .join_con_box .join_tab_box { font-size: 0; padding: 11vh 0; } .join_con_box .join_tab_box > a { display: inline-block; vertical-align: middle; border-bottom: 1px solid #d3d3d3; font-weight: 700; color: #929292; font-size: .2rem; line-height: 3; text-align: center; width: 28%; margin-right: 8%; transition: all .5s ease; cursor: pointer; position: relative; top: 0; } .join_con_box .join_tab_box > a:hover, .join_con_box .join_tab_box > a.on { border-color: transparent; background-color: #222222; background: #006811; color: #fff; top: -.1rem; box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.35); } .join_con_box .join_tab_box > a.on { cursor: auto; } .join_con_box .join_tab_box > a:last-child { margin-right: 0; } .join_banner_box { position: relative; overflow: hidden; } .join_banner_box > img { width: 100%; display: block; transition: all 2s ease; transform: scale(1.2); } .join_banner_box.go > img { transform: scale(1); transition: all 2s ease;} .join_banner_box > div { position: absolute; padding: 0 4.7%; width: 100%; left: 0; bottom: 18%; font-size: 0; } .join_banner_box > div > div { display: inline-block; vertical-align: middle; } .join_title_cn { color: #fff; font-size: .3rem; font-weight: 700; width: 190px; line-height: 1.6; } .join_line { width: 0; height: 1px; background-color: rgba(255, 255, 255, 0.4); transition: width .5s ease; } .join_line.go { width: calc(100% - 191px); } .join_title_en { line-height: 1.2; color: rgba(255, 255, 255, 0.4); font-size: .2rem; font-family: 'Conv_Gotham-Black'; width: 100%; } .join_id_box { padding-top: 11.29vh; font-size: 0; text-align: center; } .join_id_box > div { display: inline-block; vertical-align: middle; width: 25%; border-bottom: 1px solid #e8e8e8; position: relative; overflow: hidden; } .join_id_box > div:hover .die_num { opacity: 1; } .ide_img_box { font-size: 0; } .ide_img_box img { display: inline-block; max-width: 100%; } .ide_text { font-size: .18rem; font-weight: 700; color: #121212; line-height: 1.5; padding-top: 4.68vh; padding-bottom: 9.36vh; } .die_num { font-size: 1.2rem; line-height: 1; color: #f2f2f2; font-family: 'Conv_Gotham-Black'; position: absolute; left: 0; width: 100%; bottom: 0; transform: translateY(45%); opacity: 0; transition: opacity .5s ease; } .join_body .fin_describe { max-width: 742px; } .join_con_case > div { display: none; } .join_con_case > div:first-child { display: block; } .join_condition > div:nth-child(odd) { background-color: #f6f6f6; } .join_condition > div:nth-child(even) { background-color: #fff; } .join_condition > div.on, .join_condition > div:hover { background-color: #fff; box-shadow: 0 0 80px 0 rgba(0, 0, 0, 0.2); position: relative; } .join_condition > div.on .join_condition_n > div span, .join_condition > div:hover .join_condition_n > div span { color: #222222; } .join_condition > div:hover { z-index: 2; } .join_condition > div.on { z-index: 1; } .join_condition > div.on .join_btn::after { opacity: 1; } .join_condition > div.on .join_btn .join_icon span { opacity: 1; } .join_condition > div.on .join_btn .join_icon i { transform: rotate(90deg); } .join_condition > div.on .join_con_texx_box { padding-top: .7rem; padding-bottom: .9rem; max-height: 99999px; transition-timing-function: cubic-bezier(0.5, 0, 1, 0); transition-delay: 0s; } .join_btn { padding: 40px 13% 30px 4%; position: relative; cursor: pointer; } .join_btn::after { content: ''; display: block; width: calc(92% - 60px); left: 50%; bottom: 0; height: 1px; background-color: #d3d3d3; position: absolute; transform: translateX(-50%); opacity: 0; transition: all .5s ease; } .join_btn .join_icon { position: absolute; right: 4%; top: 50%; transform: translateY(-50%); line-height: 1; padding-right: 12px; } .join_btn .join_icon span { font-size: .14rem; margin-right: 20px; color: #222222; transition: all .5s ease; opacity: 0; } .join_btn .join_icon i { color: #434343; font-size: .12rem; position: absolute; right: 0; transition: all .5s ease; } .join_btn > div { padding-left: 30px; } .join_btn .join_name { line-height: 1; position: relative; font-size: .18rem; font-weight: 700; color: #434343; } .join_btn .join_name::after { display: block; content: ''; left: 0; top: 0; height: 18px; width: 4px; background-color: #222222; position: absolute; } .join_condition_n { margin-top: .3rem; font-size: 0; } .join_condition_n > div { display: inline-block; vertical-align: middle; color: #3a3a3e; line-height: 1.857; font-size: .14rem; width: 255px; } .join_condition_n > div span { color: #919199; transition: opacity .5s ease; } .join_con_texx_box { max-height: 0; overflow: hidden; padding-left: calc(4% + 30px); padding-right: calc(4% + 30px); font-size: .14rem; line-height: 1.857; color: #919191; transition: all .5s ease; } .join_con_texx_box > p { margin-bottom: 0; max-width: 900px; padding: .35rem 0 .55rem 0; } .join_con_texx_box > div { color: #222222; font-weight: 700; } .jo_describe { font-size: .18rem; } .pro_con { padding-left: 2.88rem; } .pro_list_box { padding-left: 4.338%; padding-right: calc(4.338% + .4rem); padding-top: 1.8rem; padding-bottom: 1rem; } .pro_list_box > a { display: block; float: left; margin: 5% 2.5% 0 2.5%; width: 21.25%; position: relative; box-shadow: 0 0 80px 0 rgba(0, 0, 0, 0.2); transition: all .5s ease; } .pro_list_box > a > img { width: 100%; display: block; transition: all .5s ease; } .pro_hover{ opacity: 0; position: absolute; left: 0; top: 0; } .pro_list_box > a:hover .pro_hover{ opacity: 1; } .pro_list_box > a:hover { transform: translateY(-10px); } .pro_list_box > a:nth-child(4n) { margin-right: 0; } .pro_list_box > a:nth-child(4n +1) { margin-left: 0; clear: left; float: left; } .pro_mess { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 35%); background-color: #fff; padding: 10px 20px; width: calc(100% - 28px); line-height: 1.5; transition: all .5s ease; } .pro_name { font-size: .13rem; color: #000000; } .pro_name_en { font-size: .12rem; color: #787878; font-family: 'Conv_Gotham-Light'; } .pro_con > div { display: none; } .pro_con > div:first-child { display: block; } .pro_tab_box { background-color: rgba(255, 255, 255, 0.96); padding-left: calc( 2.88rem + 3.5%); position: fixed; z-index: 1; width: 100%; left: 0; top: 0; } .sea_nav_box { padding: .6rem 0 .2rem 0; transition: all .5s ease; } .sea_nav_box.on{ padding: 0; } .sea_nav_box a { display: inline-block; text-align: center; border-bottom: 1px solid #e6e6e6; min-width: 3.1rem; line-height: 1rem; font-size: .24rem; font-family: 'Conv_Gotham-Light'; transition: all .5s ease; margin-right: .4rem; padding-left: 1em; padding-right: 1em; cursor: pointer; } .sea_nav_box a.on { font-family: 'Conv_Gotham-Black'; border-bottom: 3px solid #000; color: #000000; padding-right: 2em; padding-left: 0; text-align: left; cursor: auto; } .sea_nav_box .swiper-slide { width: auto; } .pro_det { padding: .65rem .4rem .25rem 2.88rem; min-height: 100vh; } .pro_det > div { padding: 0 5.06% 0 4.338%; } .pro_det_lb { float: left; width: 38%; position: relative; box-shadow: 0 0 80px 0 rgba(0, 0, 0, 0.2); } .pro_det_lb .pro_img_box { width: 100%; } .pro_det_lb .pro_img_box > img { display: block; width: 100%; } .pro_det_lb .swiper-pagination { background-color: #ffffff; width: calc(100% - 50px); bottom: 0; left: 25px; transform: translateY(30%); box-shadow: 0 0 80px 0 rgba(0, 0, 0, 0.2); line-height: 4.5; } .pro_det_lb .swiper-pagination span { font-size: .24rem; font-family: 'Conv_Gotham-Light'; color: #000; color: #006811; width: auto; height: auto; background-color: transparent; min-width: 20%; text-align: center; transition: all .5s ease; } .pro_det_lb .swiper-pagination span.swiper-pagination-bullet-active { font-family: 'Conv_Gotham-Black'; } .pro_det_xq { width: 50%; float: left; margin-left: 8.6%; padding-top: 10vh; } .pro_det_xq > div { line-height: 3.57; color: #000; font-family: 'Conv_Gotham-Light'; font-size: 0; } .pro_det_xq > div > span { display: inline-block; vertical-align: middle; font-size: .14rem; width: calc(100% - 155px); padding-right: 1px; } .pro_det_xq > div > span > div { float: left; margin-right: .3rem; } .pro_det_xq > div > span.pro_cf { font-size: .15rem; } .pro_det_xq > div > span.pro_cf span { font-size: .2rem; font-weight: lighter; } .pro_det_xq > div > span.pro_sz span { display: inline-block; vertical-align: middle; height: 12px; width: .5rem; margin-right: .2rem; } .pro_det_xq > div .pro_name_z { font-size: .62rem; margin-bottom: .3rem; font-weight: lighter; line-height: 1.8; } .pro_det_xq > div .pro_name_box { font-family: 'Conv_Gotham-Black'; width: 155px; min-height: 14px; } .btn_back { background-color: #f2f2f2; margin-top: 1rem; padding: .4rem .8rem .4rem .7rem; font-size: .18rem; font-weight: 700; color: #3e3e3e; display: block; transition: all .5s ease; } .btn_back:hover{ background-color: #121212; background: #006811; color: #fff; } .pro_det_lb .swiper-pagination span:hover{ font-family: 'Conv_Gotham-Black'; } .btn_back i { float: left; } .btn_back div { float: right; } .content { width: 100%; } .grid { margin: 0 auto; height: 620px; width: 100%; background: #f0f0f0; float: left;} .item1 {float: left; width: 28%; height: 260px; margin: 30px 2% 0 2%; transition: all .5s ease; position: static !important } .item1 a { display: block; } .item1 a img { width: 100%; display: block; } /*----------video-open----start------------*/ .video{position: relative; width: 100%; height: 200px; overflow: hidden;} .videoContainer {position: absolute; height: 100%; width: 100%; top: 0; left: 0;} #background_video {position: absolute; height: 100%; width: 100%; top: 0; left: 0; object-fit: cover;} .video .shipin_bt {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-align: center; font-size: 36px; color: #fff; line-height: 50px; display: inline-block;} .video .shipin_bt img {margin: 0 auto; width: 40px; height: 40px;} .video .shipin_bt .close {display: none;} .video .shipin_bt.open .close {display: none;} /*.video .shipin_bt.open .close {display: inline-block;}*/ .video:hover .shipin_bt.open .close {display: inline-block;} .video .shipin_bt.open .open {display: none;} .video .shipin_bt.open span {display: none;} /*----------video-open----end------------*/ .opt_0 { opacity: 0; transform: translateY(30%); } .pre_title { font-weight: 700; font-size: .16rem; margin-top: .3rem; line-height: 1.5; color: #1f1f1f; transition: all .5s ease; } .pre_time { line-height: 2; font-size: .13rem; padding-bottom: .3rem; color: #a6a6a6; } .pre_btn { font-size: 0; } .pre_btn > a { display: inline-block; vertical-align: middle; color: #000000; font-size: .12rem; font-weight: 700; margin-right: .3rem; cursor: pointer; } .pre_btn > a i { font-size: .2rem; margin-right: .1rem; font-weight: 400; } .com_pci:hover .pre_title{ color: #1983fc; color: #006811; } .abo_src1 { padding: 1.4rem 0 1.2rem 0; padding: 0.8rem 0 1rem 0; border-bottom: 1px solid #e9e9e9; } .abo_src1 > div { width: 50%; float: left; } .abo_src1 .abo_title_con > span { margin-left: 0; display: block; } .abo_src1_text { padding-right: 30px; } .abo_src1_img { padding-left: 30px; } .abo_src1_img > img { display: block; width: 100%; } .abo_title { position: relative; } .abo_title .abo_num { font-size: .9rem; color: #f6f6f6; line-height: 1; position: absolute; z-index: -1; left: .8rem; top: -.25rem; font-family: 'Conv_Gotham-Black'; } .abo_title .abo_title_con { color: #1f1f1f; font-weight: 700; font-size: .3rem; line-height: 1.5; } .abo_title .abo_title_con > span { font-weight: 400; color: #999999; font-size: .16rem; margin-left: .15rem; margin-left: 0;} .abo_src1_info { font-weight: 700; font-size: .16rem; line-height: 1.857; color: #1f1f1f; margin-top: .6rem; } .abo_src2 .abo_title { margin: 1rem 0; } .abo_src2_fl > div { width: 45%; float: left; position: relative; height: 540px; } .abo_src2_fl > div img { display: block; width: 100%; height: auto;} .abo_src2_fl > div .abo_bg { width: 100%; position: absolute; z-index: -1; } .abo_src2_fl > div .abo_bt { width: 47.7%; margin-left: 35%; } .abo_src2_fl > div .abo_zt { width: 26%; position: absolute; left: 0; } .abo_pro_zpp { margin-right: 5%; } .abo_pro_zpp .abo_bg { top: 0; left: 0; } .abo_pro_zpp .abo_zt { top: 50%; } .abo_pro_qsw {margin-left: 5%; /* padding-bottom: 11.15%; margin-top: -.4rem;*/} .abo_pro_qsw .abo_zt { top: 50%; } .abo_pro_qsw .abo_bg { /*bottom: 0; right: 0;*/ top: 0; left: 0; } .abo_src2_con_box { margin-top: .85rem; margin-bottom: 1rem; } .abo_src2_con_box p { margin-bottom: 0; font-size: .16rem; line-height: 1.857; color: #1f1f1f; text-align: left; } .abo_src3_fl { background-color: #f7f7f7; margin-top: .55rem; } .abo_src3_fl > div { width: 50%; float: left; } .abo_src3_banner .abo_src2_img { width: 100%; position: relative; } .abo_src3_banner .abo_src2_img > img { display: block; width: 100%; } .abo_src3_banner .abo_src2_img > div { color: #fff; font-weight: 700; position: absolute; font-size: .18rem; width: 100%; padding: 0 .3rem; left: 0; bottom: .2rem; text-align: right; } .abo_src3_banner .swiper-pagination { text-align: left; padding-left: .35rem; } .abo_src3_banner .swiper-pagination span { height: 3px; width: 20px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background-color: #fff; transition: all .5s ease; } .abo_src3_banner .swiper-pagination .swiper-pagination-bullet-active { width: 30px; } .abo_pro_yy { position: relative; height: 100%; } .abo_pro_yy > img { width: 100%; display: block; } .abo_btn_ry { position: absolute; width: 400px; bottom: 0; left: 50%; transform: translate(-50%, 50%); box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.2); } .abo_btn_ry > a { text-align: center; display: block; float: left; width: 50%; color: #fff; line-height: 45px; font-size: .14rem; background-color: #1f1f1f; } .abo_btn_ry > a:first-child { font-size: .16rem; font-weight: 700; background-color: #dc0011; } .abo_btn_ry > a i { margin-left: .3rem; color: rgba(255, 255, 255, 0.4); transition: all .5s ease; } .abo_v_btn:hover i{ color: rgba(255,255,255,1); margin-left: .2rem; } .abo_src3_data { padding-top: 9vh; } .abo_src3_data > div { margin-right: 8%; width: 46%; background-color: #f7f7f7; padding: .3rem; line-height: 1.857; color: #1f1f1f; font-weight: 700; font-size: .14rem; min-height: 1.2rem; float: left; margin-top: 10vh; } .abo_src3_data > div:nth-child(2n) { margin-right: 0; } .abo_src3_data > div:nth-child(2n +1){ clear: left; float: left; } .abo_src3_ry { margin-top: .15rem; } .abo_src3_year { font-size: .2rem; font-weight: 700; line-height: 1; margin-top: -100px; } .abo_src3_year .timer { font-size: .9rem; font-family: 'Conv_Gotham-Black'; margin: 0 .3rem; } .abo_src3_text_box { width: 100%; margin-top: 1rem; position: relative; padding-left: 34.4%; line-height: 1.857; font-size: .16rem; color: #1f1f1f; } .abo_src3_text_box::before { content: ''; width: 27.6%; height: 1px; background-color: #1f1f1f; position: absolute; left: 0; top: 50%; } .abo_src3_text_box > p { margin-bottom: 0; } .abo_src4 { padding-top: 12.03vh; padding-bottom: 13.888vh; } .abo_src4 > div { width: 50%; float: left; } .abo_src5 { background: url("http://www.lilang.com/templates/dist/css/../image/abo_011.png") no-repeat center; background-size: cover; padding: .7rem 5.6% .5rem 5.6%; color: #fff; text-align: center; } .abo_title_con { line-height: 2; font-size: .3rem; font-weight: 700; margin-bottom: .2rem; } .abo_src5_info { font-size: .16rem; line-height: 1.857; max-width: 768px; margin: 0 auto; } .abo_src5_icon_box { border-top: 1px solid rgba(255, 255, 255, 0.2); padding-top: .5rem; margin-top: .7rem; } .abo_src5_icon_box > div { float: left; width: 16.666%; margin-bottom: .2rem; } .abo_src5_icon_box > div i { font-size: .5rem; } .abo_src5_icon_box > div > div { font-size: .18rem; font-weight: 700; margin-top: .3rem; } .abo_src6 { padding-top: 1.1rem; } .abo_src6_sty_box { height: .8rem; position: relative; text-transform: uppercase; font-size: 1.6rem; color: #f6f6f6; line-height: 1; font-family: 'Conv_Gotham-Black'; text-align: right; } .abo_src6_sty_box:after { content: ''; height: 1px; width: 100%; background-color: #e9e9e9; position: absolute; left: 0; bottom: 0; } .abo_src6_sty_box > img { position: absolute; width: 17.76%; right: .5em; top: -65%; z-index: 2; } .abo_src6_con { width: 50%; float: left; padding-right: 4%; margin-top: 1.3rem; } .abo_src6_name { font-size: .2rem; line-height: 2.8; color: #999999; } .abo_src6_num { color: #1f1f1f; font-size: .4rem; line-height: 1.5; font-family: 'Conv_Gotham-Black'; } .abo_src6_num span { font-size: .3rem; } .abo_src6_info { width: 50%; float: left; line-height: 2; font-size: .16rem; color: #1f1f1f; padding: 2rem 0; padding: 2rem 0 1rem; padding-left: 4%; } .header_m { display: none; } .load_wat { position: relative; width: 100%; } .disable-hover { pointer-events: none; } .new_sha{ position: absolute; z-index: 2; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,.2); } .logo_img_m{ display: none; } .ind_btn_more_m{ display: none; } .ind_bottom_box_src2_m{ display: none; } .show_this{ border: 2px solid #ffffff; color: #fffefe; position: relative; transition: all .5s ease; line-height: 50px; cursor: pointer; padding-left:.28rem; } .show_this span{ font-weight: bold; font-size: .17rem; } .show_this i{ position: absolute; right: .15rem; font-size: .12rem; top: 50%; transform: translateY(-50%); transition: all .5s ease; } .show_this.on{ background-color: #ffffff; color: #000; } .show_this.on{ background-color: #f5f5f5; color: rgba(0,0,0,.3); border-color: transparent; } .show_this.on i{ transform: translateY(-50%) rotate(180deg); color: #000; } .show_list_sel_box{ position: relative; width: 200px; margin-top: .15rem; } .show_sel_box{ display: none; position: absolute; width: 100%; left: 0; top: 50px; background-color: #fff; padding: .2rem .2rem .3rem .3rem; } .show_sel_box > div{ max-height: 210px; overflow-y: auto; } .show_sel_box a{ display: block; font-size: 12px; line-height: 1.5; padding: 6px 0; color: #999999; transition: color .5s ease; } .show_sel_box a:hover,.show_sel_box a.on{ color: #000; } .show_sel_box a.on{ font-weight: 700; } /*新品牌简介*/ .nbar_body{ height: 100%; } .nbar_src1{ height: 100%; background-repeat: no-repeat; background-position: center top; background-color: #fff; } .nbar_body .int_video_box{ position: absolute; left: 0; width: 100%; height: 25vh; bottom: 0; cursor: pointer; background-size: cover; background-repeat: no-repeat; background-position: center; } .nbar_vid_tex_box{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 71.25%; color: #fff; } .nbar_vid_tex_box > div{ /*border-bottom: 3px solid #fff;*/ width: 46.8%; line-height: .8rem; } .nbar_vid_left{ float: left; font-size: .14rem; font-weight: 700; } .nbar_vid_left span{ font-size: .16rem; font-family: 'Conv_Gotham-Light'; } .nbar_vid_left i{ float: right; font-size: .16rem; } .nbar_vid_right{ float: right; font-weight: 700; font-size: .17rem; } .nbar_vid_right span{ font-weight: 400; float: right; font-size: 12px; color: rgba(255,255,255,.5); } .nbar_body .swiper-container,.nbar_body .swiper-slide{ height: 100%; } .nbar_src1_con_box{ height: 1px; background-color: #e6e6e6; position: absolute; top: 45%; width: calc(100% - 280px); left: 280px; padding-right: 220px; } .nbar_src1_con_box::before{ content: ''; position: absolute; right: 100%; width: 280px; top: 0; height: 1px; background-color: #e6e6e6; } .nbar_body .swiper-slide:first-child .nbar_src1_con_box::before{ display: none; } .nbar_src1_left,.nbar_src1_right{ position: relative; } .nbar_src1_left{ width: 52%; float: left; } .nbar_src1_right{ width: 45.8%; float: right; } .nbar_num_box{ background-color: #fff; padding: .2rem; position: absolute; top: 0; left: -.2rem; transform: translateY(-50%); } .nbar_num_box > div{ font-size: .24rem; width: .42rem; height: .42rem; line-height: .42rem; text-align: center; box-shadow: 0 0 40px -5px rgba(0,0,0,.22); font-family: '宋体'; } .nbar_title{ font-weight: 700; line-height: 1; bottom: .9rem; position: absolute; left: 0; } .nbar_title > div{ font-size: 0; height: .42rem; overflow: hidden; min-height: 12px; } .nbar_title font{ display: inline-block; font-size: .42rem; } .nbar_src1_text{ font-family: '宋体'; position: absolute; top: .42rem; left: 0; line-height: 2.66; font-size: 12px; color: #8c8c8c; } .nbar_body .ind_bottom_box{ color: #1f1f1f; text-align: left; padding-left: 0; bottom: .95rem; } .nbar_body .ind_bottom_box .ind_hint_icon{ border-color: #1f1f1f; } .nbar_body .ind_bottom_box .ind_hint_icon > div{ background-color: #1f1f1f; } .nbar_src1_right .nbar_src1_text{ text-align: justify; padding-right: 9%; } .nbar_src1_left .nbar_src1_text{ text-align: justify; padding-right: 4%; } .nbra_tab_box{ padding: .2rem; position: absolute; right: .48rem; background-color: #fff; top: 45%; transform: translateY(-50%); z-index: 1; } .nbra_tab_box .swiper-pagination{ width: auto; line-height: 0.8; position: relative; font-size: 0; color: #272727; overflow: hidden; bottom: 5px; font-family: 'Conv_Gotham-Black'; } .nbra_tab_box .swiper-pagination span{ font-size: .2rem; vertical-align: top; } .nbra_tab_box .swiper-pagination span:nth-child(2){ margin: 0 .15rem; } .nbra_tab_box .swiper-pagination .on{ font-size: .7rem; margin-left: -.37em; } .nbar_title > div{ margin-bottom: .2rem; } .nbar_title > div:last-child{ margin-bottom: 0; } .nbar_src2 .nbar_src1_text{ width: 62.8%; position: absolute; top: auto; left: auto; bottom: .72rem; right: 220px; } .nbra_pro_img{ font-size: 0; position: relative; left: 0; top: .5rem; margin: 0 -.45rem 0 -.7rem; } .nbra_img_box{ display: inline-block; vertical-align: middle; width: calc((100% - .9rem) / 4); margin: 0 .15rem; position: relative; } .nbra_pro_img> .nbra_img_box:first-child{ margin-left: 0; } .nbra_pro_img> .nbra_img_box:last-child{ margin-right: 0; } .nbar_body .swiper-slide{ background-color: #fff; } .nbar_body .active{ pointer-events: auto; } .nbra_img{ display: block; position: relative; z-index: 1; width: 100%; } .nbra_img_y{ position: absolute; display: block; width: calc(100% + .3rem); top: 27.1%; left: 11%; max-width: none; } .nbar_src3{ height: 100%; background-repeat: no-repeat; background-position: center top; background-size: 100%; } .nbar_src3 .nbar_title{ text-align: center; width: 100%; margin-left: -1.4rem; bottom: 1.75rem; } .nbar_src3 .nbar_src1_text{ text-align: center; position: relative; top: 0; left: 0; margin-top: .5rem; } .nbar_src3_info{ position: relative; } .nbar_src3_left,.nbar_src3_right{ width: 24.5%; margin-top: .77rem; } .nbar_src3_left img,.nbar_src3_right img{ width: 100%; display: block; } .nbar_src3_left> div,.nbar_src3_right > div{ font-size: .17rem; line-height: 1; margin-top: .24rem; font-weight: 700; } .nbar_src3_left> div i,.nbar_src3_right > div i{ float: right; } .nbar_src3_left{ float: left; } .nbar_src3_right{ float: right; } .nbar_src3_bl{ width: 51%; padding: 0 4.4% 0 8.8%; margin-top: -8%; float: left; } .nbar_src3_bl img{ display: block; width: 100%; } .font-fadeIn{ position: relative; z-index: 1; } .nbar_tit_bg{ font-size: 1.7rem; font-weight: 700; color: rgba(0,0,0,.07); } .nbar_src4_info > img{ width: 11.4%; display: block; float: left; margin-left: 4%; box-shadow: 30px 30px 66px 5px rgba(0,0,0,.1); } .nbar_src4_info > img:nth-child(odd){ margin-top: 4.6%; } .nbar_src4_info > img:nth-child(even){ margin-top: -5%; } .nbar_src4 .nbar_title{ bottom: 1.1rem; } .nbar_src4 .font-fadeIn{ margin-top: -.3rem; } .nbar_src5_info { font-size: 0; padding-left: .62rem; } .nbar_src5_info > a{ display: inline-block; vertical-align: top; position: relative; margin: 0 3.2%; width: 16%; } .nbra_time{ position: absolute; width: 100%; left: 0; bottom: calc( 100% - 2px); border-bottom: 3px solid #000000; padding-bottom: .3rem; line-height: 0.8; font-size: .2rem; color: #000000; font-family: 'Conv_Gotham-Black'; } .nbar_src5_info > a img{ width: 100%; display: block; margin-top: 16%; margin-bottom: 28.8%; box-shadow: 30px 30px 80px 5px rgba(0,0,0,.1); } .nbar_src5_text{ font-size: 12px; color: #8c8c8c; line-height: 2; text-align: justify; } .nbar_title .nbar_tit_l{ font-size: .4rem; color:#595959; font-weight: lighter; } .nbar_src5 .nbar_src1_text{ width: 43%; left: auto; top: auto; bottom: 1.2rem; right: calc(220px + 10.56%); text-align: right; } .nbar_src6{ height: 100%; background-size: 100%; background-position: center bottom; background-repeat: no-repeat; } .nbar_src6 .nbar_src1_text{ width: 38.5%; right: calc(220px + 4%); } .nbar_text_mo .nbar_src1_text{ position: relative; top: 0; left: 0; margin-top: .7rem; width: 100% !important; text-align: center; } .nbar_src6_info{ padding-right: 1.2rem; } .nbar_src6_info img{ margin: 0 auto; width: 46%; margin-top: -8%; display: block; } .ind_banner_box .swiper-container .swiper-slide.active{ pointer-events: all; } .sto_tab{ font-size: 0; margin-left: 7%; padding-top: .38rem; position: relative; } .sto_tab > a{ display: inline-block; vertical-align: middle; color: rgba(255,255,255,.25); font-size: .17rem; font-weight: 700; margin-right: .3rem; margin-left: .3rem; transition: all .5s ease; cursor: pointer; } .sto_tab > a:last-child{ margin-right: 0; } .sto_tab > a:first-child{ margin-left: 0; } .sto_tab > a.on{ color: #fff; font-size: .24rem; cursor: auto; } .sto_lb_box > div{ display: none; } .sto_lb_box > div:first-child{ display: block; } body.has .sto_tab{ opacity: 0; pointer-events: none; } body.has > .sto_tab{ opacity: 1; pointer-events: all; position: fixed; left: 0; top: 80px; z-index: 4; width: 100%; margin-left: 0; padding-left: 7%; background-color: #212121; padding-top: .19rem; padding-bottom: .19rem; } .sto_lb_box{ position: relative; } .tac_body .fin_describe{ margin-bottom: 0; } .tac_body .fin_describe div{ display: inline-block; vertical-align: middle; font-size: .18rem; font-weight: 700; color: #1f1f1f; background-color: #fff; position: relative; } .tac_body .fin_describe div::after{ content: ''; display: block; left: 100%; top: 50%; position: absolute; height: 1px; width: 70vw; background-color: #d9d9d9; } .tac_body .fin_describe div span{ display: inline-block; vertical-align: middle; width: 1.05rem; text-align: center; font-size: .12rem; font-family: 'Conv_Gotham-Light'; text-transform: uppercase; } .tac_body .ins_header::after{ display: none; } .tac_body .ins_header{ padding-bottom: 0; } .tac_body .fin_describe{ overflow: hidden; display: block !important; } .tac_body.con_body .ins_body_con > div{ padding-top: .5rem; padding-left: .35rem; } .tac_body .fin_con_lable{ font-size: .17rem; color: #333; font-weight: 700; } .con_body.tac_body .btn_operate{ width: 30%; max-width: none; } .con_body.tac_body .btn_operate:nth-child(3n+1){ width: 40%; clear: left; float: left; } .tac_body .fin_con_box > .btn_operate:nth-child(even){ margin-left: 0; } .tac_body .btn_operate{ margin-right: 0; } .tac_body .fin_con_box > a:nth-child(2n + 1) { clear: initial; } .tac_body .fin_info_text{ font-size: .18rem; font-family: 'Conv_Gotham-Light'; color: #999999; } .tac_body.con_body .ins_body_con > div{ display: block !important; } .tac_inp_box > form > div{ float: left; margin-right: 10px; width: calc((100% - 30px) / 4); border-radius: 4px; overflow: hidden; background-color: #f5f5f5; padding: .2rem .15rem; } .tac_inp_box > form > div input,.tac_inp_box > form > div textarea{ display: block; color: #808080; font-size: .14rem; line-height: 1.5; width: 100%; background-color: transparent; } .tac_inp_box > form > div input::-webkit-input-placeholder { /* WebKit, Blink, Edge */ color: #808080; } .tac_inp_box > form > div input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #808080; } .tac_inp_box > form > div input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #808080; } .tac_inp_box > form > div input:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #808080; } .tac_inp_box > form > div textarea{ height: 1.1rem; resize: none; font-size: .16rem; color: #808080; } .tac_inp_box > form > div textarea::-webkit-input-placeholder { /* WebKit, Blink, Edge */ color: #bfbfbf; font-style: italic; } .tac_inp_box > form > div textarea:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #bfbfbf; font-style: italic; } .tac_inp_box > form > div textarea::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #bfbfbf; font-style: italic; } .tac_inp_box > form > div textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #bfbfbf; font-style: italic; } .tac_inp_box > form > div:nth-child(4){ margin-right: 0; } .tac_inp_box > form > div:nth-child(5){ margin-right: 0; margin-top: .2rem; width: 100%; } .btn_sib{ border-radius: 6px; text-align: center; line-height: .42rem; width: 1.7rem; background-color: #000000; background: #006811; cursor: pointer; color: #fff; display: block; float: right; margin-top: .15rem; } .ins_body.pure .fin_describe{ margin-top: .5rem; } /*产品系列分页*/ .cat_banner_con{ padding: 0 5px; height: 100vh; cursor: pointer; display: block; } .cat_img_box{ height: 100%; width: 100%; overflow: hidden; position: relative; padding: 5vh 0; } .cat_img{ width: 100%; height: 90%; background-position: center; background-repeat: no-repeat; background-size: cover; transition: all 1s cubic-bezier(.26,0,.0,1); position: absolute; left: 0; top: 5%; } .cat_img_h{ -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; opacity: .25; } .swiper-slide .cat_text_box{ display: none; } .cat_text_box{ position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); pointer-events: none; } .cat_cn{ margin-left: 5px; font-size: .36rem; font-weight: 700; line-height: 1; color: #fff; text-shadow: 0 2px 0 rgba(0,0,0,.7); } .cat_en ,.cat_hint{ font-size: 1.36rem; font-family: 'Conv_Zona Pro Extra Bold'; color: #fff; line-height: 1; position: relative; white-space:nowrap; margin-top: -.05rem; text-shadow: 0 20px 80px rgba(0,0,0,.6); letter-spacing: -8px; } .cat_hint{ display: none; } .cat_en::after{ content: ''; display: block; width: 0; height: 6px; background-color: #fff; position: absolute; left: 0; bottom: 10px; } .cat_text_box.on .cat_en::after{ width: 100%; transition: all .3s cubic-bezier(.26,0,.0,1) .4s; } .cat_text_case{ overflow: hidden; transition: all .2s cubic-bezier(.26,0,.0,1); position: absolute; width: 0; height: 100%; right: 0; top: 0; } .cat_text_box.on .cat_text_case{ right: initial; left: 0; width: 100%; transition: all .3s cubic-bezier(.26,0,.0,1) .2s; } .cat_text_box_case{ z-index: 3; position: relative; } .cat_body .bloc .wrapper .row{ background-color: #000 ; } .cat_body .ind_bottom_box{ width: auto; text-align: right; padding: 0; bottom: 3.7vh; right: 3.645vw; pointer-events: none; } .cat_text_box.on .cat_text_w{ right: initial; left: 30px; } .cat_text_w{ position: absolute; right: 30px; top: 0; } .cat_banner_box{ padding: 0 .3rem; } .cat_banner_box .swiper-slide.on .cat_banner_con .cat_img_h{ -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -ms-filter: grayscale(0); -o-filter: grayscale(0); filter: grayscale(0); opacity: 1; transform: scale(1.3); } .cat_time_box_case{ pointer-events: none; position: fixed; left: 3.125vw; bottom: 3.7vh; z-index: 3; width: 60%; font-size: 0; overflow: hidden; } .cat_time_box_case > div{ display: inline-block; vertical-align: middle; } .cat_time_box{ position: absolute; top: 100%; transition: all .5s cubic-bezier(.26,0,.0,1); left: 0; } .cat_time{ font-size: 0; } .cat_time > div{ display: inline-block; vertical-align: middle; } .cat_time_d{ font-size: .32rem; font-weight: 700; color: #fff; line-height: .4rem; } .cat_time_x{ line-height: 0.2rem; font-size: .12rem; color: rgba(255,255,255,.5); margin-left: .13rem; } .cat_body .nbra_tab_box{ pointer-events: none; background-color: transparent; top: .10rem; transform: translateX(0); padding-left: 0; padding-right: 0; } .cat_body .nbra_tab_box .swiper-pagination{ color: #fff; } .cat_body .nbra_tab_box .swiper-pagination .on{ font-size: .5rem; } .cat_body .cat_banner_con{ visibility: hidden; } .cat_img > img{ display: none; } .pro_cat_body .pro_list_box{ padding: 0; position: relative; z-index: 1; } .pro_cat_body .pro_con{ width: 50%; margin-left: 50%; padding: 7.4vh 8.33vw 7.4vh 5.7vw; } .pro_cat_body .pro_list_box > a:nth-child(2n){ margin-right: 0; } .pro_cat_body .pro_list_box > a:nth-child(2n +1){ clear: left; float: left; margin-left: 0; } .pro_cat_body .pro_list_box > a{ width: 45%; margin: 0 5% 10% 5%; } .pro_cat_body{ position: relative; } .pro_cat_box_bg{ height: 100vh; width: 100vw; background-position: center; background-repeat: no-repeat; background-size: cover; position: fixed; left: 0; top: 0; pointer-events: none; /*filter: blur(500px);*/ opacity: .025; } .title_img{ position: fixed; top: .4rem; left: 90%; width: 5.88%; } .title_img img{ width: 100%; display: block; } .pro_cat_tex_box{ height: 100vh; width: 100%; position: fixed; left: 0; top: 0; background-color: #000; overflow: hidden; } .pro_cat_img_pc{ width: calc(100% + 60px); height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; opacity: .5; transition: all 3s ease; } .pro_cat_img{ display: none; width: 100%; } .pro_cat_text{ padding: 0 4.375%; transform: translateY(-50%); position: absolute; left: 0; top: 47.8%; color: #fff; width: 50%; } .pro_cat_title{ font-size: .6rem; font-weight: 700; line-height: 1.4; } .pro_cat_info{ font-size: .13rem; letter-spacing: .5px; line-height: 1.4; color:rgba(255,255,255,.8); text-align: justify; } .pro_cat_fl{ margin-top: .25rem; font-size: 0; } .pro_cat_fl > div{ display: inline-block; vertical-align: middle; } .pro_cat_fl .cat_time_d{ font-size: .36rem; font-family: 'Conv_NeoSans_0'; text-transform: uppercase; } .pro_cat_fl .cat_time_x{ color: rgba(255,255,255,.3); } .btn_pro_cat{ font-weight: 700; font-size: .14rem; line-height: 3.8; border-bottom: 1px solid rgba(255,255,255,.5); display: block; width: 21%; color: #fff; margin-top: 11.2vh; cursor: pointer; transition: all .5s ease; position: absolute; left: 4.375%; bottom: 22%; } .btn_pro_cat i{ float: right; font-weight: 400; } .scr_body .ins_body{ background-color: #fafafa; padding: 4.6vh 0; height: 60vh; } .scr_body .ins_header{ padding-bottom: 7.9vh; margin-bottom: 0; } .scr_body .fin_describe{ margin-bottom: 0; } .scr_body .fin_con_box > div{ width: 100%; border-bottom: 1px solid #e6e6e6; padding-bottom: .4rem; margin-bottom: .35rem; } .scr_body .fin_con_box > div:last-child{ border-bottom: none; margin-bottom: 0; } .scr_body .ins_header::after{ display: none; } .scr_body.fin_o_body .fin_name{ max-width: none; float: left; } .scr_body.fin_o_body .btn_cor{ float: right; margin-top: 0; } .scr_body .fin_con_time.fin_dd{ float: left; width: 100%; padding-bottom: 0; } .scr_body .btn_operate{ padding: .1rem 0; } .scr_body .fin_con_box{ padding: 0 2.6vw; } .scr_body .scroll_01{ height: 100%; } .jspTrack{ background-color: #f1f1f1; } .jspDrag{ background-color: #e0e0e0; } .scr_body .btn_operate{ width: 100%; margin: 0; padding-top: .3rem; border-bottom:1px solid #e6e6e6; } .scr_body .fin_con_time{ float: right; } .scr_body .fin_con_time{ color: #242424; } .scr_body .fin_con_time.fin_dd{ color: #a6a6a6; } .bor_con .btn_operate{ padding-top: .2rem; } .scr_body .pad_left{ padding-left: 16.6vw; } .scr_body .fin_time_box{ display: none; } .scr_body .fin_name { float: left; max-width: none; } .scr_body .ins_body_con{ height: 100%; } .scr_body .fin_con_box > .cor_left .btn_operate:last-child { border-bottom: none; } .pro_body .at_on,.pro_det_xq span{ visibility: hidden; } .nbar_body .nbar_src1_text,.nbar_body font,.nbar_body .at_on{ visibility: hidden; } .pro_list_box a{ visibility: hidden; } .sto_body .sto_title{ text-align: center; } .sto_tab{ text-align: center; } .sto_body .ind_bottom_box{ display: none; bottom: 4vh; } .com_name > img{ display: block; width: 100%; } .com_name_m{ display: none!important; } .pro_ad_text_box{ position: absolute; height: 100%; width: 100%; left: 0; top: 0; } @media all and (min-width: 1025px){ .ind_src2_img_sha{ background-color: rgba(0,0,0,.3); position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .5s ease; } .ind_pro_img_box:hover .ind_btn_more { opacity: 1; } .ind_pro_img_box:hover .ind_src2_img_sha { opacity: 1; } .show_this:hover{ background-color: #ffffff; color: #000; } .childItem > ul li:hover a { font-weight: 700; color: #000; } .childItem > ul li:hover a::after { width: calc(100% + 1.5em); } .ind_new_con:hover { box-shadow: 0 0 90px -18px rgba(0, 0, 0, 0.25); background-color: #fff; } .ind_new_con:hover > div{ border-color: transparent; } .ind_new_con:hover .ind_new_hint { background-color: transparent; color: #242424; } .ind_new_con:hover .ind_new_more > span{ color: #e70012; } .btn_operate:hover .fin_name{ color: #1983fc; } .btn_cor:hover { color: #fff; background-color: #121212; } .pro_list_box > a:hover .pro_mess{ transform: translate(-50%, 50%); background-color: #000; } .pro_list_box > a:hover img{ transform: scale(1.1); } .pro_list_box > a:hover .pro_name{ color: #fff; } .pro_list_box > a:hover .pro_name_en{ color: #fff; } .nbar_body .swiper-slide > div{ display: none; } .nbar_body .swiper-slide.active > div{ display: block; } .banner_text_img_box:hover{ margin-top: -30px; } .sto_tab > a:hover{ color: #fff; } .btn_pro_cat:hover{ background-color: #121212; border-color: transparent; } .pro_cat_tex_box:hover .pro_cat_img_pc{ transform: translateX(-50px); } .pro_cat_tex_box:hover .pro_cat_info{ display: block; } .btn_pro_cat:hover{ padding: 0 .1rem; } } @media all and (max-width: 1600px) { .dyn_time_title_num.on .dyn_time_year { font-size: 1.6rem; text-indent: -13px; } .int_src2_time_box { padding-top: .6rem; } .int_src3_case > div { width: 75%; } .int_src6_img { margin-top: -2.2rem; } .con_bg { font-size: 1.15rem; top: .9rem; } .pro_det_xq > div .pro_name_z { font-size: .5rem; } .btn_back { margin-top: .6rem; padding: .3rem .8rem .3rem .7rem; } .pro_det_xq > div { line-height: 3; } .abo_src5_icon_box { padding-top: .3rem; margin-top: .5rem; } .nbar_src1_con_box,.nbra_tab_box{ top: 40%; } .nbar_src2 .nbar_src1_text{ width: 55%; } .nbra_pro_img{ top: .8rem; } .nbar_src3 .nbar_title{ bottom: 1.35rem; } .nbar_src4 .nbar_title { bottom: .8rem !important; } .nbar_tit_bg { font-size: 1.3rem; } .nbar_src6 .nbar_src1_text { width: 39.5%; } .ind_pro_img_box .ind_btn_more{ right: 6%; } } @media all and (max-width: 1440px) { .pace_text_box > span{ font-size: .18rem; } .pace_text_box .com_name{ font-size: .3rem; } .pace_text_box { transform: translateY(-100%); } .int_src2_box .int_src2_case { padding-top: 1px; } .int_src6_img { margin-top: -1.8rem; } .int_src3_ren_box .int_zb_text { float: right; margin-top: 1.2rem; } .sto_banner_box .active .sto_num { font-size: 2.8rem; } .lar_show_box .sto_show_vid_box { width: 50%; margin-left: 9%; } .con_body .ins_body_con > div { padding-top: .6rem; } .con_bg { top: .5rem; } .join_condition > div.on .join_con_texx_box { padding-top: .5rem; padding-bottom: .6rem; } .join_con_texx_box > p { padding: .25rem 0 .4rem; } .pro_det_xq > div .pro_name_z { font-size: .48rem; } .pro_det_lb { margin-top: .5rem; } .abo_src6_sty_box > img { top: -18%; } .abo_src5_icon_box > div i { font-size: .4rem; } .item1 { padding: .5rem 6% 0 0; } .ind_new_case .swiper-slide > div { margin: 0 .1rem; } /*.nbar_src1_con_box,.nbra_tab_box{*/ /*top: 36%;*/ /*}*/ .nbar_src2 .nbar_src1_text { bottom: .5rem; line-height: 2; margin-right: -.8rem; } .nbra_pro_img{ top: 1rem; } .nbra_pro_img { margin-left:-1.4rem; margin-right:-1rem; } .nbar_src3 .nbar_title{ bottom: 1.1rem; } .nbar_tit_bg { font-size: 1rem; } .nbar_src3_info, .nbar_src3 .nbar_src1_text{ margin-left: -.8rem; margin-right: -.8rem; } .nbar_src5_info > a{ width: 18%; } .nbar_src5 .nbar_src1_text { width: 50%; right: calc(220px + 4%); } .nbar_src6_info img { width: 60%; } .ind_pro_img_box .ind_btn_more > div:first-child{ font-size: .5rem; } .ind_pro_img_box .ind_btn_more > div:nth-child(2){ font-size: .3rem; } } @media all and (max-width: 1366px) { .ind_new_case { padding: .95rem .4rem 0 .2rem; } .ind_new_tex_box { padding-top: 15px; } .ind_new_info { -webkit-line-clamp: 2; max-height: 48px; } .ind_src3 .title_box { padding-top: 0; } .dyn_time_title_num.on .dyn_time_year { font-size: 1.2rem; text-indent: -9px; } .int_src2_info { line-height: 1.8; } .int_src6_img { margin-top: -1.5rem; } .sha_sto_con { width: 58%; } .lar_body .sto_title { left: 2.4rem; } .con_bg_img { position: absolute; width: 27.6%; right: 0; bottom: -.25rem; } .con_bg { font-size: .8rem; top: .8rem; } .fin_info_text { font-size: .18rem; } .fin_con_lable { font-size: .13rem; } .pro_det_xq > div .pro_name_z { font-size: .4rem; } .pro_det_xq > div .pro_name_box { width: 120px; } .pro_det_xq > div > span { width: calc(100% - 120px); } .pro_det_lb { margin-top: 0; } .pro_det_xq { padding-top: 5vh; } .btn_back { margin-top: .4rem; padding: .2rem .6rem .2rem .5rem; } .pro_det_lb .swiper-pagination { line-height: 3; } .abo_src1_img { margin-top: .5rem; } .abo_btn_ry { width: 320px; } .abo_src3_year .timer { font-size: .7rem; margin-left: 0; } .abo_src3_year { margin-top: -80px; } .abo_src5 { padding: .5rem 5.6% .3rem; } .pre_btn > a { margin-right: 0.15rem; } .nbar_src1_text{ line-height: 2; } .nbar_src2 .nbar_src1_text { margin-right: -1rem; } .nbar_src3 .nbar_title{ bottom: 1rem; } .nbar_src5 .nbar_src1_text { width: 43%; right: 220px; } .nbar_src5_info > a { width: 21%; margin: 0 2%; } .ind_pro_img_box .ind_btn_more > div:first-child{ font-size: .4rem; } .ind_pro_img_box .ind_btn_more > div:nth-child(2){ font-size: .25rem; } .nav_con { padding-top: 17vh; } .lar_body .sto_title{ display: none; } .lar_v_num{ font-size: .5rem; } .lar_v_hint{ font-size: .18rem; } } @media all and (max-width: 1280px) { .int_src3_case > div { width: 85%; } .int_src2_info { font-size: .28rem; } .ind_new_case { padding: .85rem .4rem 0 0; } .new_body .ind_new_case .swiper-slide{ height: calc((100vh - .85rem - .25rem) / 2); } } /*# sourceURL=/templates/dist/css/main_m.css */ /*@ sourceURL=/templates/dist/css/main_m.css */ @charset "UTF-8"; @media all and (max-width: 1024px) { .pace_text_box .pace_p ,.pace_text_box .pace_f{ display: none; } .banner_img_box .banner_pc { display: none; } .banner_img_box .banner_m { display: block; } .ind_pro_img { display: none; } .ind_pro_img_m { display: block; } .banner_img_box video{ display: none; } .dyn_body .ind_src3 { padding-left: 0; } .dyn_body .ind_src3 > div { padding: 30px; } .dyn_body .bloc .wrapper, .dyn_body .bloc .wrapper .row { height: auto; } .dyn_body .bloc { overflow: initial; } .dyn_time_con_case > div { display: block; margin-bottom: .5rem; } .dyn_time_con_case > div .dyn_time_title_num { margin-left: 0; line-height: 2.5; } .dyn_time_con_box { width: 100%; float: none; } .dyn_time_con_case { top: 0; left: 0; transform: translateY(0); position: relative; padding-top: .5rem; } .dyn_time_title_box { display: none; } .ind_src3 .title_box { width: 100%; text-align: center; position: relative; border-bottom: none; padding-bottom: .15rem; left: 0; transform: translateX(0); } .ind_new_case{ padding-right: 0; padding-bottom: .5rem; } .dyn_btn_Next, .dyn_btn_Prev { display: none; } .dyn_time_title_num .dyn_img_box .det_img { opacity: 0; } .dyn_time_title_num .dyn_img_box img { opacity: 1; } .dyn_time_year { font-weight: 700; font-size: .32rem; } .dyn_time_title_num .dyn_img_box { width: 60%; } .ins_box { padding: 30px 120px 30px 30px; } .fin_fixed_img { width: 120px; } .int_banner_m { display: block; } .int_banner_pc { display: none; } .dyn_time_con .dyn_time_title_num, .dyn_time_con_case > div { display: block; } .int_body .bloc { padding-top: 0; } .int_case { padding: 0 30px; } .marT_180 { margin-top: .9rem; } .int_video_box .int_btn_sty { left: 50%; } .int_src2_box .int_src2_bg { padding: 0; } .int_src2_box .int_src2_case .int_info { padding-bottom: 0; } .int_src3_case { margin-top: 6vh; } .int_banner_box { padding-top: 0; padding-left: 0; } .int_src5_bfb { padding-top: 6vh; } .int_src6_case { margin-top: 0; } .new_title_case { margin: 0 30px; } .new_det_con { padding: 0 30px; } .go_top .go_top_text { display: none; } .show_body .banner_img { background-size: 100% auto; } .banner_img_box .banner_img { transform: scale(1.2); overflow: hidden; } .ind_banner_box .active .banner_img_box .banner_img{ transition: all 2s ease; } .sto_body .bloc .wrapper .row { padding: .9rem 0 0 0; } .sha_sto_con { width: 80%; left: 50%; } .sto_banner_box .swiper-container { margin-top: .5rem; padding: 0 30px; } .sto_banner_box .swiper-wrapper { display: block; } .sto_banner_box .swiper-wrapper .swiper-slide { margin-bottom: .5rem; } .sto_show_img_box { opacity: 1; } .sto_num, .sto_add { position: relative; transform: translateY(0); line-height: 2.5; } .lar_body .bloc .wrapper .row { padding-left: 0; } .lar_body .sto_title { left: 0; } .lar_banner_box { padding: 40vh 0; } .sto_body .bloc .wrapper .row { overflow: inherit; position: relative; height: auto; padding-top: .25rem; } .sto_body .bloc .wrapper, .sto_body .bloc .wrapper .row { height: auto; overflow: inherit; } .sto_body .bloc { overflow: inherit; } .sto_body .sto_show_img_box .btn_big { opacity: 1; pointer-events: auto; } .join_con_box .join_tab_box { padding: 8vh 0; } .pro_tab_box { padding: 0 30px; } .pro_list_box { padding-left: 30px; padding-right: 30px; } .pro_con { padding-left: 0; } .pro_list_box > a { width: 47%; margin-right: 6%; margin-left: 0; } .pro_list_box > a:nth-child(2n) { margin-right: 0; } .pro_list_box > a:nth-child(2n +1) { clear: both; float: left; } .pro_det { padding-left: 30px; padding-right: 30px; } .pro_det_lb { width: 100%; } .pro_det_xq { width: 100%; margin-left: 0; } .abo_src1 { padding: .7rem 0 .6rem; } .abo_src2 .abo_title { margin: .5rem 0; } .abo_src3_data { padding-top: .2rem } .abo_src4 { padding-top: .6rem; padding-bottom: .7rem; } .abo_src3_text_box { margin-top: .5rem; } body { padding-top: 80px; } .btn_shop { display: none; } .header_m { display: block; height: 80px; padding: 0 30px; background-color: #000000; background: #006811; color: #fff; line-height: 80px; position: fixed; left: 0; width: 100%; top: 0; z-index: 11; transition: all .5s ease; } body.show_body{ padding-top: 0; } .header_m.toul{ background-color: transparent; } .header_m.toul::after{ content: ''; display: block; width: calc(100% - 30px); bottom: 0; left: 15px; height: 1px; position: absolute; background-color: rgba(255,255,255,.3); } .header_m a { color: #fff; } .header_m > div { position: relative; } .header_m .btn_show_m { float: left; font-size: .22rem; font-weight: 700; } .header_m .logo_box_m { position: absolute; left: 0; top: 0; font-size: .2rem; /*transform: translateX(-50%);*/ } .header_m .logo_box_m img {width: 90px; height: auto; margin-top: 7px;} .btn_nav_m { height: 60px; width: 40px; float: right; margin-top: 10px; text-align: right; font-size: 0; line-height: 1; padding: 20px 0; } .btn_nav_m span { display: inline-block; height: 2px; background-color: #fff; margin: 5px 0; width: 15px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; transition: width .5s ease; } .btn_nav_m span:first-child { width: 30px; } .btn_nav_m.on span { width: 30px; } .btn_nav_m.on span:first-child { width: 15px; } .nav { height: calc(100vh - 80px); width: 100%; display: block; top: 80px; left: 100%; transition: all .5s ease; transform: translate(0, 0); padding-left: 30px; } .nav.on::after { left: calc(50% + 15px); width: calc((100% - 15px ) / 2); } .nav.on_m { left: 0; } .nav_con { padding-top: 0 !important; width: 50%; } .childItem > ul { top: 0; transform: translateY(0); padding-top: 4.35185vh; } .logo_box { display: none; } .pro_tab_box { top: 80px; } .ind_src3{ padding-top: 80px; padding-left: 30px; padding-right: 30px; } .ind_src3 > div{ padding: 0; overflow: initial; } .ind_new_box .swiper-button-prev, .ind_new_box .swiper-button-next { display: block; background-image: none; font-size: .3rem; display: none; } .ind_body .ind_new_more{ display: none; } .ind_new_case .swiper-slide > div { margin: 0 .2rem; } .ind_new_box .swiper-button-prev{ left: -10px; } .ind_new_box .swiper-button-next{ right: -10px; } .new_body .ind_src3{ padding-top: 0; } .new_body .ind_new_case .swiper-slide { height: auto; width: 100%; } .ind_banner_box .swiper-button-prev, .ind_banner_box .swiper-button-next{ display: none; } .banner_img_box .banner_text_img_box{ width: 100%; left: 50%; top: 45%; } .ind_bottom_box{ display: none; } .ind_bottom_box_m{ position: absolute; bottom: 5vh; width: 100%; font-size: .16rem; line-height: 1.5; color: #fff; font-family: 'Conv_Gotham-Black'; text-align: center; z-index: 1; } .hint_icon_down{ font-size: .2rem; position: relative; } .hint_icon_down i{ position: relative; } .ind_bottom_box_m > div{ position: relative; animation: gun0 1s ease infinite; } body.ind_body,body.his_body{ padding-top: 0; } .ind_src2 .ind_show_box{ width: 100%; } .ind_pro_img_box .ind_btn_more{ display: none; opacity: 0; pointer-events: none; } .ind_src2 .ind_show_link_box{ background-color: transparent; position: absolute; width: 49%; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 1; pointer-events: none; } .logo_w img{ display: none; } .logo_w .logo_img_m{ display: block; width: 100%; } .ind_src2 .ind_show_link_box > div{ top: 45%; } .ind_btn_more_m{ display: block; cursor: pointer; background-color: #ffffff; font-size: .16rem; line-height: 56px; padding: 0 30px; color: #1f1f1f; overflow: hidden; position: absolute; width: calc(100% - 30px); left: 15px; bottom: 18vh; z-index: 1; } .ind_btn_more_m span{ float: left; } .ind_btn_more_m i{ float: right; } .ind_bottom_box_src2_m{ display: block; cursor: pointer; font-size: .16rem; line-height: 56px; padding: 0 30px; color: #fff; overflow: hidden; position: absolute; border: 1px solid rgba(255,255,255,.2); width: calc(100% - 30px); left: 15px; bottom: 7vh; z-index: 1; } .ind_bottom_box_src2_m span{ float: left; font-family: 'Conv_Gotham-Black'; } .ind_bottom_box_src2_m i{ float: right; position: relative; animation: gun0 1s ease infinite; margin-top: -10px; } .show_ser_name{ width: 70%; } .show_ser_num_box { right: 15px; bottom: auto; top: 0; transform: translateY(0); } .sto_show_img_box{ height: auto; } .sto_show_img_box img { transform: translate(0); position: relative; left: 0; top: 0; } .nbar_body .swiper-wrapper, .nbar_body .swiper-slide, .nbar_body .swiper-slide > div{ height: auto; } .nbar_body .swiper-wrapper{ display: block; } .nbar_src1_con_box{ position: relative; width: 100%; left: 0; top: 0; padding: 0 30px; height: auto; background-color: transparent; } .nbar_num_box, .nbar_title, .nbar_src1_text, .nbar_body .int_video_box{ position: relative; } .nbar_num_box{ left: 0; transform: translateY(0); margin-top: .25rem; text-align: center; background-color: transparent; padding: 0; display: none; } .nbar_src1_left .nbar_src1_text, .nbar_src1_right .nbar_src1_text{ padding-right: 0; } .nbar_vid_tex_box > div{ border-bottom: none; } .nbar_title{ text-align: center; bottom: auto; margin-top: .4rem; } .nbar_src1_left,.nbar_src1_right{ width: 100%; } .nbar_src1_text{ top: 0; margin-top: .25rem; } .nbar_body .int_video_box{ margin-top: .25rem; } .nbar_vid_tex_box{ width: 90%; } .nbar_src2 .nbar_src1_text{ width: 100%; margin-right: 0; bottom: auto; right: auto; position: relative; } .nbar_body .bloc{ height: auto; } .nbra_pro_img{ margin-left: 0; margin-right: 0; top: 0; margin-top: .25rem; padding-bottom: .4rem; } .nbar_src3 .nbar_title{ bottom: auto !important; margin-right: 0; margin-left: 0; } .nbar_src3_info, .nbar_src3 .nbar_src1_text{ margin-left: 0; margin-right: 0; } .nbar_src3_left, .nbar_src3_right{ margin: .25rem 2% 0 2%; width: 46%; } .nbar_src3_info{ padding-top: .25rem; } .nbar_src3_bl{ float: none; margin: 0 auto; display: none; } .nbar_src4_info{ margin-top: .8rem; } .nbar_src5 .nbar_src1_text{ right: auto; width: 100%; position: relative; bottom: auto; text-align: center; } .nbar_src5_info{ padding-left: 0; margin-top: .25rem; } .nbra_time{ position: relative; bottom: auto; display: none; } .nbar_src6_info img{ margin-top: .4rem; } .nbar_src5_info > a img { margin-top: .15rem; margin-bottom: .15rem; box-shadow: none; } .nbar_text_mo .nbar_src1_text{ margin: .25rem auto 0 auto; width: 80% !important; padding-bottom: 1.3rem; } .nbar_src1_text{ text-align: left!important; } .show_series_box > a{ display: none; } .language_box a{ opacity: .5; } .ind_banner_box .swiper-container .swiper-slide{ overflow: hidden; } .sto_banner_box .sto_show_box { transform: scale(1); } .cat_body .nbra_tab_box,.cat_body .cat_time_box_case { display: none; } .cat_body .bloc { overflow: visible; } .cat_body .bloc .wrapper, .cat_body .bloc .wrapper .row{ height: auto; overflow: visible; } .cat_img_h { -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -ms-filter: grayscale(0); -o-filter: grayscale(0); filter: grayscale(0); opacity: 1; height: auto; } .cat_img > img{ display: block; width: 100%; } .cat_body .swiper-wrapper { display: block; } .cat_body .swiper-wrapper .swiper-slide { margin-bottom: .5rem; } .cat_banner_con .cat_text_box{ display: block; position: relative; left: 0; top: 0; transform: translate(0,0); } .cat_text_case{ position: relative; top: 0; width: 100%; overflow: visible; } .cat_banner_con{ height: auto; } .cat_img_box{ height: auto; padding: 0; } .cat_text_w{ position: relative; right: 0; } .cat_img{ position: relative; left: 0; top: 0; background-image: none !important; } .cat_text_box_case{ display: none; } .cat_body .bloc .wrapper .row{ position: relative; padding-top: .25rem; padding-bottom: 1px; } .cat_cn{ margin-top: .15rem; font-size: .28rem; margin-left: 0; } .cat_en, .cat_hint{ font-size: .6rem; margin-top: .1rem; letter-spacing: 0; } .cat_cn .cat_time_d{ font-size: inherit; float: right; line-height: 1; font-weight: 400; } .pro_cat_tex_box{ width: 100%; height: auto; position: relative; } .pro_cat_img_pc{ display: none; } .pro_cat_img{ display: block; opacity: .5; } .pro_cat_body .pro_con{ width: 100%; margin-left: 0; padding-left: 30px; padding-right: 30px; } .pro_cat_body .pro_list_box > a { width: 47%; margin-right: 6%; margin-left: 0; } .pro_cat_info{ display: block; } .btn_pro_cat,.title_img{ display: none; } .cat_body .cat_banner_con{ visibility: visible; } .cat_banner_con{ margin-bottom: .5rem; } .com_name_m{ display: inline-block!important; width: 50%; } .com_name_pc{ display: none !important; } } @media all and (max-width: 768px) { .int_src6_img { margin-top: -1rem; } .int_case > div { padding: 0; } .show_series_box { top: 140px; transform: translateY(0); } .abo_btn_ry { width: 90%; } .item1 { width: 50%; } .show_list_sel_box { width: 40px; margin-top: 0; } .sho_tab_box{ opacity: 0; pointer-events: none; } .show_this{ height: 40px; line-height: 40px; } .show_list_sel_box span{ display: none ; } .show_this i{ right: 50%; transform: translate(50%,-50%) rotate(180deg); } .show_this.on i { transform: translate(50%,-50%); } .show_sel_box { width: 200px; left: auto; right: 0; top: auto; bottom: 100%; } .int_info p{ text-align: left; } .int_video_box video { height: 20vh; } .ind_bottom_box{ display: none !important; } .int_vid_hint{ display: none !important; } .item > li > a { font-size: .20rem; line-height: 2; padding: .2rem 0; } .childItem > ul a { font-size: .18rem; } .int_banner_m .int_lb_tex{ text-align: center; left: 0; bottom: .2rem; width: 100%; } .int_src5_bfb { padding-top: 6vh; display: none; } .new_body .ind_new_case .swiper-slide> div .ind_new_tex_box{ border-color: transparent; } .ind_new_con { height: 45%; } .ind_new_tex_box{ border-color: transparent; } .new_go_list,.new_tab{ display: none; } .header_m .logo_box_m { font-size: .16rem; } .fin_fixed_img { display: none; } .ide_img_box img { width: 26px; } .die_num{ display: none; } .con_bg{ display: none; } .ide_text { padding-bottom: .25rem; } .pace_text_box ,.load_box{ top: 40%; } .pace_copy_right img { width: 60%; } .sea_nav_box a{ min-width: auto; } .sea_nav_box a.on{ padding-right: 1em; } .show_prev,.show_next{ display: none; } .nbar_vid_right{ display: none; } .nbar_vid_left{ float: none; margin: 0 auto; } .nbar_body .int_video_box{ height: auto; } } @media all and (max-width: 640px) { body { padding-top: 60px; } body.has > .sto_tab{ top: 60px; } .dyn_body .ind_src3 > div { padding: 15px; padding-top: 0; } .dyn_body .ind_src3 { padding-right: 0; } .dyn_time_title_num .dyn_img_box { width: 80%; } .show_series_box { top: auto; bottom: 100px; } .ins_box { padding: 15px 0 15px 15px; } .fin_fixed_img { width: 60px; } .ins_box > div { padding-left: 0; } .fin_title { font-size: .3rem; margin-bottom: .2rem; } .fin_describe { margin-bottom: .3rem; padding-left: .15rem; } .ins_header { padding-bottom: .2rem; } .fin_time_box { padding: .2rem 0 .15rem; } .btn_operate { width: 100%; margin-right: 0; padding: .15rem 0; } .ins_body_tab { display: none; } .ins_body_con { width: 100%; } .ins_body_con > div { display: block !important; } .btn_shop { right: 15px; top: 15px; } .fin_con_box > div { width: 100%; margin-right: 0; } .btn_cor { margin-top: .12rem; } .int_case { padding: 0 15px; } .int_title { margin-top: 6vh; } .int_info { padding: .3rem 0; } .int_pre_sty .int_provenance { width: 100%; } .int_pre_sty .int_provenance > img { margin: 0; width: 25%; } .int_pre_sty > div { margin-top: .25rem; } .int_pre_sty .ind_bottom_box { width: 100%; } .marT_180 { margin-top: .4rem; } .int_src2_info { color: #212121; padding-top: .6rem; } .int_src2_time_box { padding-top: .3rem; } .int_src3_case > div { width: 100%; } .int_zb_text { float: none; width: 100%; } .int_zb_img { float: none; width: 100%; margin-top: .3rem; } .int_zb_img .int_zb_st.go { width: 40%; left: 30%; } .int_zb_img .int_zb_st img { width: 100%; } .int_src3_ren_box .int_zb_text { float: none; margin-top: .8rem; } .int_src4_case .int_title { position: relative; } .int_src4_text_right, .int_src4_text_left { float: none; width: 100%; padding-bottom: 0; } .int_pro_box > div { /*width: calc((100% - .2rem - 1px)/ 2);*/ /*margin-right: .2rem; */ } .int_pro_box > div:nth-child(2n) { /*margin-right: 0;*/ } .new_title_case { margin: 0 15px; } .new_det_con { padding: 0 15px; } .new_go_list { padding: 0; text-align: center; } .go_top { right: 15px; bottom: 20px; } .new_title { font-size: .28rem; } .show_ser_name { font-size: .28rem; width: 100%; padding-right: 55px; } .show_series_box { padding-left: 30px; } /*.show_ser_num_box > div:first-child{*/ /*display: none;*/ /*}*/ .sto_banner_box .active .sto_num { font-size: 1.6rem; } .lar_body .sto_title { margin-left: 0; padding-left: 15px; } .lar_show_box .sto_show_vid_box { width: 100%; margin-left: 0; padding: 0 5%; } .lar_show_box .lar_hint_box { width: 100%; text-align: center; } .lar_v_num { font-size: 0; } .lar_banner_box { padding: 35vh 0; } .lar_show_box { padding-bottom: 10vh; position: relative; } .lar_show_box .lar_hint_box { position: absolute; bottom: 0; left: 0; } .con_body .ins_box { padding-right: 15px; } .con_body .ins_body_con > div { padding-top: .3rem; } .con_body .btn_operate { width: 100%; margin-right: 0; } .con_bg_img { position: fixed; width: 35%; right: 15px; bottom: 0; } .join_body .ins_box { padding-right: 15px; } .join_body .ins_box > div { padding-right: 0; } .join_con_box .join_tab_box { padding: 6vh 0; } .join_con_box .join_tab_box > a { width: calc((100% - 30px) / 3); margin-right: 15px; } .join_id_box { padding-top: 6vh; } .die_num { font-size: 0.5rem; transform: translateY(0); opacity: 1; } .pro_tab_box { padding: 0 15px; } .sea_nav_box { padding: 0; } .sea_nav_box a { line-height: 4; margin-right: 0; } .pro_list_box { padding-left: 15px; padding-right: 15px; padding-top: 78px; } .pro_list_box > a { margin-top: .5rem; text-align: left; padding-left: 0; } .pro_det_xq > div > span > div { margin-right: .15rem; } .pro_det_xq > div .pro_name_box { width: 85px; } .pro_det_xq > div > span { width: calc(100% - 85px); } .pro_det_xq > div { line-height: 1.5; } .pro_det_xq > div > span { padding: .1rem 0; } .pro_det_xq > div .pro_name_z { font-size: .28rem; } .abo_body .ins_header { margin-bottom: 0; } .abo_body .ins_box { padding-right: 15px; } .abo_body .ins_box > div { padding-right: 0; } .abo_src1 > div { width: 100%; } .abo_src2_fl > div { width: 100%; padding-right: 0; } .abo_pro_qsw { margin-left: 0; margin-top: .4rem; } .abo_src2_con_box { margin-top: .3rem; margin-bottom: .6rem; } .abo_src3_fl > div { width: 100%; } .abo_src3_data > div { width: 100%; margin-right: 0; } .abo_src3_data { margin-top: 0; } .abo_src3_data > div { margin-top: 1.2rem; } .abo_src3_text_box { padding-left: 0; padding-bottom: .5rem; } .abo_src3_text_box::before { top: auto; bottom: 0; } .abo_src4 > div { width: 100%; } .abo_src6 { padding-top: .6rem; } .abo_src6_sty_box > img { width: 31.76%; right: 0; } .abo_src6_con { width: 100%; margin-top: .8rem; } .abo_src6_info { width: 100%; padding-top: .3rem; padding-bottom: .6rem; } .abo_src6_num { font-size: .3rem; } .abo_src6_num span { font-size: .2rem; } .header_m { height: 60px; padding: 0 15px; line-height: 60px; } .btn_nav_m { margin-top: 0; } .nav { height: calc(100vh - 60px); top: 60px; left: 100%; } .pro_tab_box { top: 60px; } .item1 { padding-right: 15px; } .grid { margin-top: -.5rem; } pre_time { padding-bottom: .2rem; } .ind_src3 { padding-top: 60px; padding-left: 15px; padding-right: 15px; } .ind_new_case { padding-top: .5rem; } .new_body .ind_new_case .swiper-slide > div{ margin: 0; } .ind_new_more { bottom: 2vh; } .nbar_src1_con_box{ padding: 0 15px; } .nbar_vid_tex_box > div{ width: 80%; } .nbra_img_y{ display: none; } .nbra_pro_img{ padding-bottom: 0; } .nbar_src3_left, .nbar_src3_right{ width: 96%; } .nbar_tit_bg { font-size: .6rem; } .nbar_src4_info { margin-top: .4rem; } .nbar_src4_info > img{ width: 32%; margin-right: 2%; margin-top: 2%; margin-left: 0; box-shadow: none; } .nbar_src4_info > img:nth-child(odd){ margin-top: 2%; } .nbar_src4_info > img:nth-child(3n){ margin-right: 0; } .nbar_src4_info > img:nth-child(3n +1){ clear: left; float: left; } .nbar_src4_info > img:nth-child(even){ margin-top: 2%; } .nbar_src3 .nbar_src1_text{ margin-top: .3rem; } .nbar_src5_info > a{ width: 46%; margin-top: .25rem; } .nbar_src5_info > a:first-child,.nbar_src5_info > a:nth-child(2){ margin-top: 0; } .nbar_text_mo .nbar_src1_text{ width: 100% !important; padding-bottom: .8rem; } .nbar_src6_info{ padding-right: 0; } .sto_tab{ margin-left: 0; padding-top: .15rem; } body.has >.sto_tab{ padding-left: 0; } .sto_tab > a{ width: 33.33%; text-align: center; margin: 0; font-size: .14rem; line-height: 22px; } .sto_tab > a.on{ font-size: .16rem; } .tac_body.con_body .ins_body_con > div { padding-top: .25rem; padding-left: .15rem; } .con_body.tac_body .btn_operate{ width: 100%; } .con_body.tac_body .btn_operate:nth-child(3n+1){ width: 100%; } .tac_inp_box > form > div{ width: 100%; margin-top: 0; margin-right: 0; margin-bottom: .15rem; } .tac_inp_box > form > div:last-child{ margin-bottom: 0; margin-top: 0; } .tac_inp_box > form > div:nth-child(4){ margin-top: 0; } .ins_body.pure .fin_describe{ margin-top: .25rem; margin-bottom: .1rem; } .cat_banner_box{ padding: 0 15px; } .cat_banner_con{ padding: 0; } .cat_cn{ font-size: .16rem; } .cat_en, .cat_hint{ font-size: .26rem; } .pro_cat_body .pro_con{ padding: .25rem 15px; } .pro_cat_title{ font-size: .4rem; } .pro_cat_info{ font-size: .12rem; } .pro_cat_fl .cat_time_d { font-size: .25rem; } .btn_pro_cat{ width: 100%; margin-top: .3rem; } .pro_cat_text{ top: 50%; width: 100%; } .scr_body .ins_header{ padding-bottom: .3rem; } .scr_body .pad_left{ padding-left: 0; } .scr_body .ins_body{ height: auto; } .scr_body .fin_time_box{ display: block; } .scr_body .btn_operate{ padding-top: .15rem; } .scr_body .ins_body{ padding: .2rem; } } @media all and (max-width: 360px) { .int_pre_sty .int_provenance > img { width: 20%; } .show_series_box { padding-left: 15px; } .sto_tab > a{ font-size: .12rem; } .sto_tab > a.on{ font-size: .13rem; } .pro_cat_fl{ margin-top: .1rem; } .btn_pro_cat{ margin-top: .2rem; } } /*# sourceURL=http://www.lilang.com/templates/dist/js/layer/theme/default/layer.css?v=3.1.1 */ /*@ sourceURL=http://www.lilang.com/templates/dist/js/layer/theme/default/layer.css?v=3.1.1 */ .layui-layer-imgbar,.layui-layer-imgtit a,.layui-layer-tab .layui-layer-title span,.layui-layer-title{text-overflow:ellipsis;white-space:nowrap}html #layuicss-layer{display:none;position:absolute;width:1989px}.layui-layer,.layui-layer-shade{position:fixed;_position:absolute;pointer-events:auto}.layui-layer-shade{top:0;left:0;width:100%;height:100%;_height:expression(document.body.offsetHeight+"px")}.layui-layer{-webkit-overflow-scrolling:touch;top:150px;left:0;margin:0;padding:0;background-color:#fff;-webkit-background-clip:content;border-radius:2px;box-shadow:1px 1px 50px rgba(0,0,0,.3)}.layui-layer-close{position:absolute}.layui-layer-content{position:relative}.layui-layer-border{border:1px solid #B2B2B2;border:1px solid rgba(0,0,0,.1);box-shadow:1px 1px 5px rgba(0,0,0,.2)}.layui-layer-load{background:url("http://www.lilang.com/templates/dist/js/layer/theme/default/loading-1.gif") center center no-repeat #eee}.layui-layer-ico{background:url("http://www.lilang.com/templates/dist/js/layer/theme/default/icon.png") no-repeat}.layui-layer-btn a,.layui-layer-dialog .layui-layer-ico,.layui-layer-setwin a{display:inline-block;*display:inline;*zoom:1;vertical-align:top}.layui-layer-move{display:none;position:fixed;*position:absolute;left:0;top:0;width:100%;height:100%;cursor:move;opacity:0;filter:alpha(opacity=0);background-color:#fff;z-index:2147483647}.layui-layer-resize{position:absolute;width:15px;height:15px;right:0;bottom:0;cursor:se-resize}.layer-anim{-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.3s;animation-duration:.3s}@-webkit-keyframes layer-bounceIn{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes layer-bounceIn{0%{opacity:0;-webkit-transform:scale(.5);-ms-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.layer-anim-00{-webkit-animation-name:layer-bounceIn;animation-name:layer-bounceIn}@-webkit-keyframes layer-zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes layer-zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.layer-anim-01{-webkit-animation-name:layer-zoomInDown;animation-name:layer-zoomInDown}@-webkit-keyframes layer-fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes layer-fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.layer-anim-02{-webkit-animation-name:layer-fadeInUpBig;animation-name:layer-fadeInUpBig}@-webkit-keyframes layer-zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes layer-zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);-ms-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.layer-anim-03{-webkit-animation-name:layer-zoomInLeft;animation-name:layer-zoomInLeft}@-webkit-keyframes layer-rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0) rotate(0);transform:translateX(0) rotate(0)}}@keyframes layer-rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);-ms-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0) rotate(0);-ms-transform:translateX(0) rotate(0);transform:translateX(0) rotate(0)}}.layer-anim-04{-webkit-animation-name:layer-rollIn;animation-name:layer-rollIn}@keyframes layer-fadeIn{0%{opacity:0}100%{opacity:1}}.layer-anim-05{-webkit-animation-name:layer-fadeIn;animation-name:layer-fadeIn}@-webkit-keyframes layer-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes layer-shake{0%,100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}}.layer-anim-06{-webkit-animation-name:layer-shake;animation-name:layer-shake}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.layui-layer-title{padding:0 80px 0 20px;height:42px;line-height:42px;border-bottom:1px solid #eee;font-size:14px;color:#333;overflow:hidden;background-color:#F8F8F8;border-radius:2px 2px 0 0}.layui-layer-setwin{position:absolute;right:15px;*right:0;top:15px;font-size:0;line-height:initial}.layui-layer-setwin a{position:relative;width:16px;height:16px;margin-left:10px;font-size:12px;_overflow:hidden}.layui-layer-setwin .layui-layer-min cite{position:absolute;width:14px;height:2px;left:0;top:50%;margin-top:-1px;background-color:#2E2D3C;cursor:pointer;_overflow:hidden}.layui-layer-setwin .layui-layer-min:hover cite{background-color:#2D93CA}.layui-layer-setwin .layui-layer-max{background-position:-32px -40px}.layui-layer-setwin .layui-layer-max:hover{background-position:-16px -40px}.layui-layer-setwin .layui-layer-maxmin{background-position:-65px -40px}.layui-layer-setwin .layui-layer-maxmin:hover{background-position:-49px -40px}.layui-layer-setwin .layui-layer-close1{background-position:1px -40px;cursor:pointer}.layui-layer-setwin .layui-layer-close1:hover{opacity:.7}.layui-layer-setwin .layui-layer-close2{position:absolute;right:-28px;top:-28px;width:30px;height:30px;margin-left:0;background-position:-149px -31px;*right:-18px;_display:none}.layui-layer-setwin .layui-layer-close2:hover{background-position:-180px -31px}.layui-layer-btn{text-align:right;padding:0 15px 12px;pointer-events:auto;-moz-user-select:none;-webkit-user-select:none}.layui-layer-btn a{height:28px;line-height:28px;margin:5px 5px 0;padding:0 15px;border:1px solid #dedede;background-color:#fff;color:#333;border-radius:2px;font-weight:400;cursor:pointer;text-decoration:none}.layui-layer-btn a:hover{opacity:.9;text-decoration:none}.layui-layer-btn a:active{opacity:.8}.layui-layer-btn .layui-layer-btn0{border-color:#1E9FFF;background-color:#1E9FFF;color:#fff}.layui-layer-btn-l{text-align:left}.layui-layer-btn-c{text-align:center}.layui-layer-dialog{min-width:260px}.layui-layer-dialog .layui-layer-content{position:relative;padding:20px;line-height:24px;word-break:break-all;overflow:hidden;font-size:14px;overflow-x:hidden;overflow-y:auto}.layui-layer-dialog .layui-layer-content .layui-layer-ico{position:absolute;top:16px;left:15px;_left:-40px;width:30px;height:30px}.layui-layer-ico1{background-position:-30px 0}.layui-layer-ico2{background-position:-60px 0}.layui-layer-ico3{background-position:-90px 0}.layui-layer-ico4{background-position:-120px 0}.layui-layer-ico5{background-position:-150px 0}.layui-layer-ico6{background-position:-180px 0}.layui-layer-rim{border:6px solid #8D8D8D;border:6px solid rgba(0,0,0,.3);border-radius:5px;box-shadow:none}.layui-layer-msg{min-width:180px;border:1px solid #D3D4D3;box-shadow:none}.layui-layer-hui{min-width:100px;background-color:#000;filter:alpha(opacity=60);background-color:rgba(0,0,0,.6);color:#fff;border:none}.layui-layer-hui .layui-layer-content{padding:12px 25px;text-align:center}.layui-layer-dialog .layui-layer-padding{padding:20px 20px 20px 55px;text-align:left}.layui-layer-page .layui-layer-content{position:relative;overflow:auto}.layui-layer-iframe .layui-layer-btn,.layui-layer-page .layui-layer-btn{padding-top:10px}.layui-layer-nobg{background:0 0}.layui-layer-iframe iframe{display:block;width:100%}.layui-layer-loading{border-radius:100%;background:0 0;box-shadow:none;border:none}.layui-layer-loading .layui-layer-content{width:60px;height:24px;background:url("http://www.lilang.com/templates/dist/js/layer/theme/default/loading-0.gif") no-repeat}.layui-layer-loading .layui-layer-loading1{width:37px;height:37px;background:url("http://www.lilang.com/templates/dist/js/layer/theme/default/loading-1.gif") no-repeat}.layui-layer-ico16,.layui-layer-loading .layui-layer-loading2{width:32px;height:32px;background:url("http://www.lilang.com/templates/dist/js/layer/theme/default/loading-2.gif") no-repeat}.layui-layer-tips{background:0 0;box-shadow:none;border:none}.layui-layer-tips .layui-layer-content{position:relative;line-height:22px;min-width:12px;padding:8px 15px;font-size:12px;_float:left;border-radius:2px;box-shadow:1px 1px 3px rgba(0,0,0,.2);background-color:#000;color:#fff}.layui-layer-tips .layui-layer-close{right:-2px;top:-1px}.layui-layer-tips i.layui-layer-TipsG{position:absolute;width:0;height:0;border-width:8px;border-color:transparent;border-style:dashed;*overflow:hidden}.layui-layer-tips i.layui-layer-TipsB,.layui-layer-tips i.layui-layer-TipsT{left:5px;border-right-style:solid;border-right-color:#000}.layui-layer-tips i.layui-layer-TipsT{bottom:-8px}.layui-layer-tips i.layui-layer-TipsB{top:-8px}.layui-layer-tips i.layui-layer-TipsL,.layui-layer-tips i.layui-layer-TipsR{top:5px;border-bottom-style:solid;border-bottom-color:#000}.layui-layer-tips i.layui-layer-TipsR{left:-8px}.layui-layer-tips i.layui-layer-TipsL{right:-8px}.layui-layer-lan[type=dialog]{min-width:280px}.layui-layer-lan .layui-layer-title{background:#4476A7;color:#fff;border:none}.layui-layer-lan .layui-layer-btn{padding:5px 10px 10px;text-align:right;border-top:1px solid #E9E7E7}.layui-layer-lan .layui-layer-btn a{background:#fff;border-color:#E9E7E7;color:#333}.layui-layer-lan .layui-layer-btn .layui-layer-btn1{background:#C9C5C5}.layui-layer-molv .layui-layer-title{background:#009f95;color:#fff;border:none}.layui-layer-molv .layui-layer-btn a{background:#009f95;border-color:#009f95}.layui-layer-molv .layui-layer-btn .layui-layer-btn1{background:#92B8B1}.layui-layer-iconext{background:url("http://www.lilang.com/templates/dist/js/layer/theme/default/icon-ext.png") no-repeat}.layui-layer-prompt .layui-layer-input{display:block;width:230px;height:36px;margin:0 auto;line-height:30px;padding-left:10px;border:1px solid #e6e6e6;color:#333}.layui-layer-prompt textarea.layui-layer-input{width:300px;height:100px;line-height:20px;padding:6px 10px}.layui-layer-prompt .layui-layer-content{padding:20px}.layui-layer-prompt .layui-layer-btn{padding-top:0}.layui-layer-tab{box-shadow:1px 1px 50px rgba(0,0,0,.4)}.layui-layer-tab .layui-layer-title{padding-left:0;overflow:visible}.layui-layer-tab .layui-layer-title span{position:relative;float:left;min-width:80px;max-width:260px;padding:0 20px;text-align:center;overflow:hidden;cursor:pointer}.layui-layer-tab .layui-layer-title span.layui-this{height:43px;border-left:1px solid #eee;border-right:1px solid #eee;background-color:#fff;z-index:10}.layui-layer-tab .layui-layer-title span:first-child{border-left:none}.layui-layer-tabmain{line-height:24px;clear:both}.layui-layer-tabmain .layui-layer-tabli{display:none}.layui-layer-tabmain .layui-layer-tabli.layui-this{display:block}.layui-layer-photos{-webkit-animation-duration:.8s;animation-duration:.8s}.layui-layer-photos .layui-layer-content{overflow:hidden;text-align:center}.layui-layer-photos .layui-layer-phimg img{position:relative;width:100%;display:inline-block;*display:inline;*zoom:1;vertical-align:top}.layui-layer-imgbar,.layui-layer-imguide{display:none}.layui-layer-imgnext,.layui-layer-imgprev{position:absolute;top:50%;width:27px;_width:44px;height:44px;margin-top:-22px;outline:0;blr:expression(this.onFocus=this.blur())}.layui-layer-imgprev{left:10px;background-position:-5px -5px;_background-position:-70px -5px}.layui-layer-imgprev:hover{background-position:-33px -5px;_background-position:-120px -5px}.layui-layer-imgnext{right:10px;_right:8px;background-position:-5px -50px;_background-position:-70px -50px}.layui-layer-imgnext:hover{background-position:-33px -50px;_background-position:-120px -50px}.layui-layer-imgbar{position:absolute;left:0;bottom:0;width:100%;height:32px;line-height:32px;background-color:rgba(0,0,0,.8);background-color:#000\9;filter:Alpha(opacity=80);color:#fff;overflow:hidden;font-size:0}.layui-layer-imgtit *{display:inline-block;*display:inline;*zoom:1;vertical-align:top;font-size:12px}.layui-layer-imgtit a{max-width:65%;overflow:hidden;color:#fff}.layui-layer-imgtit a:hover{color:#fff;text-decoration:underline}.layui-layer-imgtit em{padding-left:10px;font-style:normal}@-webkit-keyframes layer-bounceOut{100%{opacity:0;-webkit-transform:scale(.7);transform:scale(.7)}30%{-webkit-transform:scale(1.05);transform:scale(1.05)}0%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes layer-bounceOut{100%{opacity:0;-webkit-transform:scale(.7);-ms-transform:scale(.7);transform:scale(.7)}30%{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.layer-anim-close{-webkit-animation-name:layer-bounceOut;animation-name:layer-bounceOut;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.2s;animation-duration:.2s}@media screen and (max-width:1100px){.layui-layer-iframe{overflow-y:auto;-webkit-overflow-scrolling:touch}}