# leo - lightbox--audio, #leo - lightbox--msg# msg - left, .leo - app canvas, .leo - app img { -webkit - user - select: none; - webkit - user - drag: none }.leo - comp, .leo - comp--img > img, .leo - loading: before { position: absolute;top: 0;left: 0 }.leo - center - wrapper, .leo - lightbox { text - align: center }.leo - app, .leo - app * { box - sizing: border - box;text - rendering: optimizeLegibility; - webkit - font - smoothing: antialiased }.leo - app canvas, .leo - app img { -ms - user - select: none; user - select: none }.leo - app audio, .leo - app canvas, .leo - app video { display: inline - block;vertical - align: baseline }.leo - app audio: not([controls]) { display: none;height: 0 }.leo - app a { background - color: transparent }.leo - app a: active, .leo - app a: hover { outline: 0 }.leo - app a img { border: 0 }.leo - app svg: not(: root) { overflow: hidden }.leo - app button { color: inherit;font: inherit;margin: 0;overflow: visible;text - transform: none; - webkit - appearance: button }.leo - app button[disabled] { cursor: not - allowed }.leo - action - trigger, .leo - lightbox { cursor: pointer }.leo - app button::-moz - focus - inner { border: 0;padding: 0 }.leo - comp { bottom: auto;right: auto }.leo - comp--link { -webkit - transition: background - color .3 s ease; transition: background - color .3 s ease }.leo - comp--txt { word - break: break -word; word - wrap: break -word; border: 0 solid }.leo - comp--img > img, .leo - comp--txt__content p { padding: 0;margin: 0;border: 0 }.leo - center - wrapper::before { content: " ";width: 0;height: 100 % ;display: inline - block;visibility: hidden;vertical - align: middle }.leo - center - wrapper.leo - center - target { display: inline - block;vertical - align: middle }# leo - lightbox--msg, #leo - lightbox--msg# msg - mark, .audio - message, .leo - lightbox, .lg--controls.control--muted, .lg--controls.control--replay, .lg--controls.control--unmuted { display: none }.leo - loading: before { content: url(loading.gif);bottom: 0;right: 0;margin: auto;width: 32 px;height: 32 px;border - radius: 5 px;padding: 5 px;z - index: 9999999999;opacity: 0; - webkit - animation: loading - delay .5 s .5 s forwards;animation: loading - delay .5 s .5 s forwards } @ - webkit - keyframes loading - delay { 0 % { opacity: 0 } 100 % { opacity: 1 } } @keyframes loading - delay { 0 % { opacity: 0 } 100 % { opacity: 1 } }.leo - lightbox { position: fixed;top: 0;right: 0;bottom: 0;left: 0;z - index: 999999;background - color: rgba(0, 0, 0, .85);font - size: 0 }.lg--stage { position: absolute;cursor: auto }.lg--controls { height: 30 px;position: absolute;right: 20 px;top: 20 px;z - index: 2 }.lg--controls li { position: relative;float: right;width: 30 px;height: 100 % ;background: rgba(0, 0, 0, .2);border - radius: 3 px;border - right: 1 px solid #0F1014;border-top:1px solid # 53575 C;border - left: 1 px solid #53575C;cursor:pointer;box-sizing:border-box;-webkit-transition:background .3s;transition:background .3s}# leo - lightbox--audio div, .LB_AudioMiniPlayer, .lg--controls b { position: absolute }.lg--controls li: active, .lg--controls li: hover { background: rgba(95, 95, 95, .5) }.audio - bg, .lg--controls.control--close b, .lg--controls.control--muted b, .lg--controls.control--replay b, .lg--controls.control--unmuted b { background - image: url(assets.png) }.lg--controls b { left: 0;top: 0;bottom: 0;right: 0;margin: auto }.lg--controls.control--close b { background - position: -472 px - 198 px }.lg--controls.control--muted b { background - position: -457 px - 251 px }.lg--controls.control--unmuted b { background - position: -414 px - 288 px }.lg--controls.control--replay b { -webkit - transform: rotate(60 deg); - ms - transform: rotate(60 deg); transform: rotate(60 deg); background - position: -385 px - 290 px }# leo - lightbox--audio { position: absolute;color: gray;width: 308 px;height: 120 px;white - space: nowrap;font - size: 12 px;font - family: sans - serif; - ms - user - select: none;user - select: none }.audio - bg { background - repeat: no - repeat }.audio - progress { top: 82 px;left: 96 px;z - index: 2;width: 158 px;height: 9 px;background - color: #929292;border-bottom:1px solid # fff;border - radius: 12 px;cursor: pointer }.audio - message { top: 12 px;left: 11 px;z - index: 2;width: 77 px;height: 67 px;border - radius: 6 px }.audio - time { top: 93 px;left: 224 px;z - index: 2 }.audio - title { top: 90 px;left: 15 px;z - index: 2;overflow: hidden }.audio - loading { background: url(audio - loading.gif) 12 px 9 px no - repeat# fff }# leo - lightbox--gallery.controls, #leo - lightbox--msg.msg - next div, #leo - lightbox--msg.msg - prev div, .LB_AudioMiniPlayer > div { background - image: url(assets.png) }.audio - error { background - color: #fff; background - position: -253 px - 135 px }.audio - playPause { top: 16 px;left: 148 px;z - index: 2;width: 56 px;height: 57 px;cursor: pointer }.audio - pause { background - position: -104 px - 132 px }.audio - play { background - position: -47 px - 132 px }.audio - played { top: 0;left: 0;width: 10 % ;height: 100 % ;background - position: -7 px - 218 px }.audio - cursor { top: -5 px;right: 0;width: 16 px;height: 18 px;background - position: -337 px - 83 px }.audio - buffered { top: 0;left: 0;width: 0;height: 100 % ;background - position: -6 px - 206 px }.audio - volume { top: 11 px;left: 269 px;z - index: 2;width: 17 px;height: 62 px;overflow: hidden;cursor: pointer;background - position: -337 px - 11 px }.audio - volume - fg { bottom: 0;width: 100 % ;height: 100 % ;overflow: hidden }.audio - volume - fg - p { bottom: -178 px;left: -358 px;width: 400 px;height: 250 px }.audio - volume - cursor { width: 100 % ;height: 18 px;background - position: -337 px - 84 px }.audio - volume - switch { top: 75 px;left: 270 px;z - index: 2;width: 23 px;height: 21 px;cursor: pointer }.audio - unmuted { background - position: -221 px - 132 px }.audio - muted { background - position: -221 px - 156 px }.audio - time: hover, .audio - title: hover { color: #000}.audio-controls{top:23px;z-index:2;width:43px;height:44px;cursor:default}.audio-prev{left:99px;background-position:0 -132px}.audio-next{left:209px;background-position:-167px -132px}.LB_AudioMiniPlayer{width:100%;height:100%;left:0;top:0}# leo - lightbox--gallery# control - bar, #leo - lightbox--gallery# gallery - wrap { background - color: #fff; border: 6 px solid# fff; left: -6 px; width: 100 % ; position: absolute; overflow: hidden }.LB_AudioMiniPlayer > div { width: 100 % ;height: 100 % ;background - repeat: no - repeat }.LB_AudioMiniPlayer.unmute { background - position: -401 px - 1 px }.LB_AudioMiniPlayer.muted { background - position: -401 px - 102 px }# leo - lightbox--gallery { position: absolute;left: 0;top: -23 px;width: 100 % ;height: 100 % }# leo - lightbox--gallery# gallery - wrap { height: 100 % ;top: -6 px }# leo - lightbox--gallery# img - wrap { position: absolute;width: 100 % ;height: 100 % ;top: 0;right: 0;bottom: 0;left: 0;margin: auto;z - index: 1 }# leo - lightbox--gallery# img - wrap img { position: absolute;top: 0;left: 0;width: 100 % ;height: 100 % }# leo - lightbox--gallery# control - bar { top: 100 % ;height: 40 px }# leo - lightbox--gallery input { position: absolute;border: 1 px solid #727272;text-align:center;border-radius:0;width:60px;height:16px;top:12px;left:50%;padding:0;margin:0 0 0 -30px}# leo - lightbox--gallery.controls { position: absolute;width: 30 px;height: 30 px;top: 6 px;left: 50 % }# leo - lightbox--gallery# to - first { margin - left: -100 px; background - position: -60 px - 378 px }# leo - lightbox--gallery# to - first: hover { background - position: -60 px - 408 px }# leo - lightbox--gallery# to - last { margin - left: 72 px; background - position: -90 px - 378 px }# leo - lightbox--gallery# to - last: hover { background - position: -90 px - 408 px }# leo - lightbox--gallery# to - prev { margin - left: -65 px; background - position: 0 - 378 px }# leo - lightbox--gallery# to - prev: hover { background - position: 0 - 408 px }# leo - lightbox--gallery# to - next { margin - left: 37 px; background - position: -30 px - 378 px }# leo - lightbox--gallery# to - next: hover { background - position: -30 px - 408 px }# leo - lightbox--msg { position: absolute;width: 700 px;height: 350 px;border - radius: 5 px }# leo - lightbox--msg.msg - part { width: 310 px;height: 334 px;float: left }# leo - lightbox--msg# msg - left { margin: 16 px 8 px 0 32 px; - ms - user - select: none;user - select: none }# leo - lightbox--msg# msg - right { margin: 0 32 px 0 8 px }# leo - lightbox--msg# msg - gallery { position: relative;height: 250 px;margin - bottom: 16 px }# leo - lightbox--msg# msg - gallery > img { position: absolute;max - width: 310 px;max - height: 250 px;min - width: 25 px;min - height: 25 px;opacity: 0 }# leo - lightbox--msg# msg - mark { position: absolute;top: 0;left: 0;z - index: 2;width: 50 px;height: 50 px;overflow: hidden;border: 1 px solid #3181E7}# leo - lightbox--msg# msg - mark img { position: absolute }# leo - lightbox--msg# msg - mark div { position: absolute;top: 0;left: 0;z - index: 2;width: 100 % ;height: 100 % }# leo - lightbox--msg# msg - gallery - cover { position: absolute;z - index: 1;background - color: #000;opacity:0}# leo - lightbox--msg# msg - thumbnail { width: 272 px;height: 50 px;float: left;margin - left: 2 px;overflow: hidden; - webkit - user - select: none; - ms - user - select: none;user - select: none }# leo - lightbox--msg.msg - thumbnail - wrap { -webkit - transition: all .3 s; transition: all .3 s; margin: 2 px }# leo - lightbox--msg.msg - thumbnail - wrap > div { float: left;margin - right: 12 px;cursor: pointer;overflow: hidden;height: 40 px;width: 40 px;border: 2 px solid# fff;outline: #919191 solid 2px;position:relative}# leo - lightbox--msg.msg - thumbnail - wrap > div: hover { outline: #317ee7 solid 1px}# leo - lightbox--msg.msg - thumbnail - wrap img { position: absolute;left: 0;top: 0 }# leo - lightbox--msg.msg - button { cursor: pointer;float: left;width: 18 px;height: 50 px;margin - top: -2 px;position: relative;box - shadow: inset 0 1 px 0 rgba(255, 255, 255, .5), 0 2 px 3 px rgba(0, 0, 0, .3), 0 2 px 3 px rgba(255, 255, 255, .3);display: none;background - color: rgba(0, 0, 0, .2) }# leo - lightbox--msg.msg - button div { top: 17 px;position: absolute;left: 0;width: 18 px;height: 20 px }# leo - lightbox--msg.msg - button: active { box - shadow: inset 0 1 px 3 px rgba(0, 0, 0, .3), 0 1 px 1 px# fff }# leo - lightbox--msg.msg - prev { margin - left: -2 px }# leo - lightbox--msg.msg - prev div { background - position: -478 px - 287 px }# leo - lightbox--msg.msg - next { margin - left: 2 px }# leo - lightbox--msg.msg - next div { background - position: -464 px - 317 px }# leo - lightbox--msg# msg - content { margin - top: 32 px; font - family: Arial, sans - serif; text - rendering: optimizeLegibility; text - align: left }# leo - lightbox--msg# msg - title { font - size: 18 px; line - height: 1.2; word - break: break -word; white - space: pre - wrap; max - height: 63 px; overflow: hidden }# leo - lightbox--msg# msg - body - container { position: relative;height: 151 px;overflow: hidden;padding - right: 4 px;margin - top: 20 px;text - align: left }# leo - lightbox--msg# msg - body { position: absolute;top: 0;width: 306 px;font - size: 13 px;line - height: 15 px;word - wrap: break -word;white - space: pre - wrap }# leo - lightbox--msg.msg - scroll - bar { position: absolute;top: 0;right: 0;width: 4 px;height: 100 % ;cursor: pointer;border - radius: 5 px;background - color: #ddd }# leo - lightbox--msg.msg - scroll - bar div { position: absolute;top: 0;width: 4 px;border - radius: 5 px;background - color: #aaa }# leo - lightbox--msg# msg - origin, #leo - lightbox--paypal { position: absolute;background - color: #fff;display: none }# leo - lightbox--msg# msg - scroll - bar: hover { background - color: #ccc }# leo - lightbox--msg# msg - scroll - bar: hover div { background - color: #999}# leo - lightbox--msg# msg - learn - more { width: 130 px;height: 26 px;margin - top: 20 px;cursor: pointer;text - align: center;font - size: 14 px;line - height: 26 px;border: 1 px solid; - webkit - user - select: none; - ms - user - select: none;user - select: none }# leo - lightbox--msg# msg - learn - more: active { background - image: none; box - shadow: inset 0 1 px 3 px rgba(0, 0, 0, .3), 0 1 px 0# fff; text - shadow: 0 1 px 0 rgba(255, 255, 255, .4); color: rgba(0, 0, 0, .5) !important }# leo - lightbox--msg# msg - origin { top: 1 px;z - index: 3;width: 337 px;height: 344 px;overflow: hidden;border: 2 px solid #317ee7}# leo - lightbox--msg# msg - origin img { position: absolute }# leo - lightbox--paypal { width: 700 px;height: 350 px;border - radius: 5 px }# leo - lightbox--paypal.paypal - part { width: 310 px;height: 334 px;float: left }# leo - lightbox--paypal.paypal - left { margin: 16 px 8 px 0 32 px; - webkit - user - select: none; - ms - user - select: none;user - select: none; - webkit - user - drag: none }# leo - lightbox--paypal.paypal - right { margin: 0 32 px 0 8 px }# leo - lightbox--paypal.paypal - gallery { position: relative;height: 250 px;margin - bottom: 16 px }# leo - lightbox--paypal.paypal - gallery > img { position: absolute;display: none;max - width: 310 px;max - height: 250 px;min - width: 25 px;min - height: 25 px }# leo - lightbox--paypal.paypal - mark { position: absolute;z - index: 2;display: none;overflow: hidden;border: 1 px solid #3181E7}# leo - lightbox--paypal.paypal - mark img { position: absolute }# leo - lightbox--paypal.paypal - mark div { position: absolute;top: 0;left: 0;z - index: 2;width: 100 % ;height: 100 % }# leo - lightbox--paypal.paypal - gallery - cover { position: absolute;z - index: 1;background - color: #000;opacity:0}# leo - lightbox--paypal.paypal - thumbnail { width: 272 px;height: 50 px;float: left;margin - left: 2 px;overflow: hidden; - webkit - user - select: none; - ms - user - select: none;user - select: none }# leo - lightbox--paypal.paypal - thumbnail > div { -webkit - transition: all .3 s; transition: all .3 s; margin: 2 px }# leo - lightbox--paypal.paypal - thumbnail - li { float: left;margin - right: 12 px;cursor: pointer;overflow: hidden;height: 40 px;width: 40 px;border: 2 px solid# fff;outline: #919191 solid 2px;position:relative;-webkit-transition:outline .3s;transition:outline .3s}# leo - lightbox--paypal.paypal - thumbnail - li: hover { outline: #317ee7 solid 1px}# leo - lightbox--paypal.paypal - thumbnail - li img { position: absolute;left: 0;top: 0 }# leo - lightbox--paypal.paypal - button { font - weight: bolder; font - family: sans - serif; text - align: center; font - size: 30 px; color: #fff; line - height: 50 px; cursor: pointer; float: left; width: 18 px; height: 50 px; margin - top: -2 px; position: relative; background: center no - repeat# D4D4D4; box - shadow: inset 0 1 px 0 rgba(255, 255, 255, .5), 0 1 px 2 px rgba(0, 0, 0, .2); text - shadow: 0 - 1 px 1 px rgba(0, 40, 50, .35); display: none }# leo - lightbox--paypal.paypal - button div { top: 17 px;position: absolute;left: 0 }# leo - lightbox--paypal.paypal - button: active { box - shadow: inset 0 1 px 3 px rgba(0, 0, 0, .3), 0 1 px 0# fff; text - shadow: 0 1 px 0 rgba(255, 255, 255, .4) }# leo - lightbox--paypal.paypal - prev { margin - left: -2 px }# leo - lightbox--paypal.paypal - prev div { background - image: url(assets.png); background - position: -476 px - 287 px; width: 20 px; height: 20 px }# leo - lightbox--paypal.paypal - next { margin - left: 2 px }# leo - lightbox--paypal.paypal - next div { background - image: url(assets.png); background - position: -464 px - 317 px; width: 20 px; height: 20 px }# leo - lightbox--paypal.paypal - content { font - family: Arial, sans - serif; text - rendering: optimizeLegibility; text - align: left }# leo - lightbox--paypal.paypal - content label { font - style: italic; font - size: 14 px; font - weight: 700 }# leo - lightbox--paypal.paypal - title { font - size: 18 px; line - height: 1.2; font - family: Arial, sans - serif; word - break: break -all; max - height: 64 px; display: block; min - height: 32 px }# leo - lightbox--paypal.paypal - price - wrap { margin: 6 px 0 0;font - size: 15 px;color: #888;white-space:nowrap}# leo - lightbox--paypal.paypal - price - wrap span { font - size: 17 px; font - family: Arial, sans - serif; color: #b12704 }# leo - lightbox--paypal.paypal - in -stock { margin: 2 px 0 5 px;font - size: 14 px;color: #179975}# leo - lightbox--paypal.paypal - body - container { position: relative;height: 105 px;overflow: hidden;padding - right: 4 px }# leo - lightbox--paypal.paypal - body { position: absolute;top: 0;width: 306 px;font - size: 13 px;line - height: 15 px;word - wrap: break -word;white - space: pre - wrap;text - align: left }# leo - lightbox--paypal.paypal - scroll - bar { position: absolute;top: 0;right: 0;width: 4 px;height: 100 % ;cursor: pointer;border - radius: 5 px;background - color: #ddd }# leo - lightbox--paypal.paypal - scroll - bar div { position: absolute;top: 0;width: 4 px;border - radius: 5 px;background - color: #aaa }# leo - lightbox--paypal.paypal - scroll - bar: hover { background - color: #ccc }# leo - lightbox--paypal.paypal - scroll - bar: hover div { background - color: #999}# leo - lightbox--paypal# paypal - quantity { outline: 0;margin: 8 px;width: 42 px;border: 1 px groove# b1b1b1;text - align: center;color: #000;font-weight:700;font-size:15px;background-color:# dfdfdf }# leo - lightbox--paypal.paypal - msg { font - size: 12 px; font - style: italic; color: red; display: none }# leo - lightbox--paypal.paypal - shipping - cost { margin: 0;font - size: 13 px;color: #179975;font-style:italic}.menu--btn,.slide--btn{color:# fff;text - align: center }# leo - lightbox--paypal.paypal - learn - more { width: 130 px;height: 26 px;margin - top: 20 px;cursor: pointer;text - align: center;font - size: 14 px;line - height: 26 px;border: 1 px solid; - webkit - user - select: none; - ms - user - select: none;user - select: none }# leo - lightbox--paypal.paypal - buy { cursor: pointer;float: right; - webkit - user - select: none; - ms - user - select: none;user - select: none; - webkit - transform: scale(1.02); - ms - transform: scale(1.02);transform: scale(1.02);background - image: url(assets.png);background - position: -150 px - 378 px;width: 150 px;height: 30 px }.leo - comp--audio - player, .leo - lightbox--video { -webkit - user - select: none; - ms - user - select: none }# leo - lightbox--paypal.paypal - email, #leo - lightbox--paypal.paypal - fb, #leo - lightbox--paypal.paypal - gg, #leo - lightbox--paypal.paypal - other, #leo - lightbox--paypal.paypal - tw { background - image: url(assets.png); width: 20 px; height: 20 px }# leo - lightbox--paypal.paypal - buy: hover { -webkit - transform: none; - ms - transform: none; transform: none }# leo - lightbox--paypal.paypal - share { margin - top: 7 px; display: inline - block }# leo - lightbox--paypal.paypal - share div { display: inline - block;cursor: pointer;margin - right: 5 px }# leo - lightbox--paypal.paypal - fb { background - position: -384 px - 337 px }# leo - lightbox--paypal.paypal - tw { background - position: -444 px - 317 px }# leo - lightbox--paypal.paypal - gg { background - position: -384 px - 317 px }# leo - lightbox--paypal.paypal - other { background - position: -404 px - 317 px }# leo - lightbox--paypal.paypal - email { background - position: -424 px - 317 px }# leo - lightbox--paypal.paypal - origin { position: absolute;top: 1 px;z - index: 3;width: 337 px;height: 344 px;overflow: hidden;border: 2 px solid #317ee7;background-color:# fff;display: none }.leo - phone - msg - box, .leo - phone - msg - box - bg { z - index: 99999; left: 0; right: 0; top: 0; bottom: 0 }# leo - lightbox--paypal.paypal - origin img { position: absolute }.leo - phone - msg - box - bg { position: fixed;background - color: rgba(0, 0, 0, .5);cursor: pointer }.leo - phone - msg - box { position: absolute;font - family: "Helvetica Neue", Helvetica, Arial, sans - serif;margin: auto;border - radius: 2 px;overflow: hidden;background - color: #fff;box - shadow: 0 0 8 px #1b1b1b}.leo-phone-msg-box--menu{position:relative;height:30px;line-height:30px;padding:10px}.menu--btn{position:absolute;top:9px;width:48px;height:8px;line-height:10px;padding:10px;z-index:2;border-radius:4px;text-decoration:none;overflow:hidden;border:1px solid # 2e6 da4;background - color: #337ab7;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;font-weight:400;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-ms-user-select:none;user-select:none;background-image:none;text-overflow:ellipsis}.menu--return-btn{left:10px}.menu--more-btn{left:90px}.leo-phone-msg-box--scroll{position:absolute;width:100%;overflow:hidden;overflow-y:scroll}.leo-phone-msg-box--slide{position:relative;margin:auto}.leo-comp--slide{z-index:1}.slide--btn{width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.3);position:absolute;line-height:30px;z-index:2;top:16px}.slide--muted div,.slide--replay div,.slide--unmuted div{background-image:url(assets.png)}.slide--btn div{position:absolute;cursor:pointer;background-position:center center;left:5px;top:6px;width:21px;height:23px}.slide--index{right:10px}.slide--replay{right:81px}.slide--replay div{background-position:-403px -337px}.slide--muted,.slide--unmuted{right:45px}.slide--muted div{background-position:-222px -157px}.slide--unmuted div{background-position:-222px -133px}.slide--index span:first-child{font-size:20px}.slide--index span:last-child{font-size:14px}.slide--images{list-style:none;width:100%;margin:0;padding:0;font-size:0}.slide--images img{width:100%;height:100%;height:auto}.slide--images li{width:100%;height:100%;float:left}.clear{clear:both}.leo-phone-msg-box--content{padding:0 20px 20px;position:relative;overflow:hidden}.content--title{color:# 575757;margin: 17 px 0 10 px;font - size: 16 px;font - weight: 700;text - align: center }.content--separator { border - color: rgba(0, 0, 0, .2); border - style: solid; margin: 0; position: absolute; left: 10 px; right: 10 px; border - width: 1 px 0 0 }.content--body { color: #000;font-size:14px;line-height:22px;margin:20px 0 0}.leo-phone-msg-box--content{font-family:Arial,sans-serif;text-align:left;padding-bottom:20px}.leo-phone-msg-box--content label{font-style:italic;font-size:14px;font-weight:700}.leo-phone-msg-box--content # paypal - quantity { outline: 0;margin: 8 px;width: 60 px;height: 25 px;text - align: center;font - weight: 700;font - size: 17 px;line - height: 25 px;color: #555;background-color:# fff;background - image: none;border: 1 px solid# ccc;border - radius: 4 px;box - shadow: inset 0 1 px 1 px rgba(0, 0, 0, .075); - webkit - transition: border - color ease - in -out .15 s, box - shadow ease - in -out .15 s;transition: border - color ease - in -out .15 s, box - shadow ease - in -out .15 s }.leo - phone - msg - box--content.paypal - email, .leo - phone - msg - box--content.paypal - fb, .leo - phone - msg - box--content.paypal - gg, .leo - phone - msg - box--content.paypal - other, .leo - phone - msg - box--content.paypal - tw { background - image: url(assets.png); width: 20 px; height: 20 px }.leo - phone - msg - box--content# paypal - quantity: active, .leo - phone - msg - box--content# paypal - quantity: focus { border - color: #66afe9;outline:0;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)}.leo-phone-msg-box--content .paypal-msg{font-size:12px;font-style:italic;color:red;display:none}.leo-phone-msg-box--content .paypal-shipping-cost{margin:0;font-size:13px;color:# 179975; font - style: italic; line - height: 23 px }.leo - phone - msg - box--content.paypal - title { margin - top: 15 px; font - size: 18 px; line - height: 25 px; text - align: center; display: inline - block }.leo - phone - msg - box--content.paypal - price - wrap { margin: 6 px 0;font - size: 15 px;white - space: nowrap }.leo - phone - msg - box--content.paypal - price - wrap span { color: #b12704;font - size: 14 px;padding - left: 7 px }.leo - phone - msg - box--content.paypal - in -stock { margin: 2 px 0 5 px;font - size: 14 px;color: #179975}.leo-phone-msg-box--content .paypal-body{font-size:14px;line-height:20px;word-wrap:break-word;white-space:pre-wrap;text-align:left}.leo-phone-msg-box--content .paypal-share{margin-top:7px;display:inline-block}.leo-phone-msg-box--content .paypal-share div{display:inline-block;cursor:pointer;margin-right:5px}.leo-phone-msg-box--content .paypal-fb{background-position:-384px -337px}.leo-phone-msg-box--content .paypal-tw{background-position:-444px -317px}.leo-phone-msg-box--content .paypal-gg{background-position:-384px -317px}.leo-phone-msg-box--content .paypal-other{background-position:-404px -317px}.leo-phone-msg-box--content .paypal-email{background-position:-424px -317px}.leo-lightbox--video,.leo-lightbox--website,.leo-lightbox--website iframe{height:100%;width:100%;position:absolute}.leo-lightbox--video{display:none;user-select:none;-webkit-user-drag:none;box-sizing:border-box;box-shadow:2px 3px 10px # 000;border: 4 px solid #000}.leo-lightbox--video iframe,.leo-lightbox--video video{position:absolute;width:100%;height:100%;left:0;top:0;z-index:201}.leo-lightbox--website{left:0;top:0;box-sizing:border-box;border:2px solid # FFF;border - radius: 2 px;border - top - width: 35 px;background - color: #eee }.leo - lightbox--website iframe { top: 0;left: 0;opacity: 0; - webkit - transition: opacity 1 s;transition: opacity 1 s }.website--title { position: absolute;top: -32 px;height: 30 px;width: 100 % ;font - family: "Open Sans", helvetica, arial, sans - serif }.website--address { padding - left: 5 px; float: left; padding - top: 5 px; border - radius: 2 px; border: none; font - weight: 700; font - size: 14 px; color: #222}.website--button{position:absolute;right:0;color:# 00 a1cb; font - size: 12 px; line - height: 28 px; padding: 0 20 px }.website--button: hover { color: #ff7474 }.leo - comp--bubble - dialog { z - index: 999999 }.leo - comp--bubble - dialog.dialog - close { width: 20 px;height: 20 px;position: absolute;border - radius: 50 % ;right: -5 px;top: -5 px;line - height: 20 px;text - align: center;color: #d55;box - shadow: 0 3 px 3 px #000;font-size:18px;cursor:pointer;z-index:11}.leo-comp--bubble-dialog .dialog-close:hover{color:red}.leo-animation-container{position:absolute}.leo-animation-container .leo-animation-block{position:absolute;overflow:hidden}.leo-animation-container .leo-animation-block .leo-animation-clone{margin:0!important;outline:0!important;-webkit-transform:none!important;-ms-transform:none!important;transform:none!important;box-shadow:none!important}.leo-animation-canvas{position:absolute;left:0;top:0;display:none}.leo-splitText-el{-webkit-perspective:400px;perspective:400px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.leo-splitText-el *{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.leo-char{text-indent:initial;text-align:center}.leo-temp-show{display:block!important}.classical .cursor,.mini .progressbar,.mini .time,.mini .volumebar,.simple .cursor{display:none}.leo-comp--audio-player{user-select:none;border-radius:2px}.leo-comp--btn>button,.leo-comp--paypalprice{text-align:center;-webkit-user-select:none;-ms-user-select:none}.leo-comp--audio-player>div{position:absolute;border-radius:2px;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0}.leo-comp--audio-player .time{position:absolute;color:# fff;cursor: default;font - family: 'Segoe UI', Arial, 'Microsoft Yahei', Simsun, sans - serif }.leo - comp--audio - player.bar { position: absolute;border: 1 px solid# f3f3f3;cursor: pointer }.leo - comp--audio - player.bg { height: 100 % ;background - color: #d3d3d3;width: 0 }.leo - comp--audio - player.fg { height: 100 % ;background - color: #fff;position: absolute;top: 0;width: 0 }.leo - comp--audio - player.cursor { position: absolute;background - color: #fff;border: 1 px solid# b3b3b3;left: -1 % }.leo - comp--audio - player.loadButton, .leo - comp--audio - player.pauseButton, .leo - comp--audio - player.playButton, .leo - comp--audio - player.volumeIcon { position: absolute;cursor: pointer;width: 30 px;height: 30 px }.leo - comp--audio - player.playButton > div { border - style: solid; border - color: transparent transparent transparent# fff; position: absolute }.leo - comp--audio - player.pauseButton > div { position: absolute;border - color: #fff;border - style: solid;border - width: 0 3 px }.leo - comp--audio - player.loadButton > div { position: absolute;border - radius: 50 % ;border: 1 px solid;border - color: transparent# fff# fff; - webkit - animation: leo - comp--audio - loading 1 s linear infinite;animation: leo - comp--audio - loading 1 s linear infinite }.leo - comp--audio - player.volume, .leo - comp--audio - player.volume33, .leo - comp--audio - player.volume66, .leo - comp--audio - player.volumeMute { border - style: solid; border - width: 5 px 5 px 5 px 0; border - color: transparent# fff; position: absolute }.leo - comp--audio - player.volume33 > div: nth - child(1), .leo - comp--audio - player.volume66 > div: nth - child(1), .leo - comp--audio - player.volume > div: nth - child(1), .leo - comp--audio - player.volumeMute > div: nth - child(1) { width: 3 px;background: #fff;left: 10 px }.leo - comp--audio - player.volume33 > div: nth - child(2), .leo - comp--audio - player.volume66 > div: nth - child(2), .leo - comp--audio - player.volume > div: nth - child(2) { position: absolute;left: 6 px;width: 6 px;height: 6 px;border - radius: 50 % ;border - right: 1 px solid# fff }.leo - comp--audio - player.volume33 > div: nth - child(3), .leo - comp--audio - player.volume66 > div: nth - child(3) { position: absolute;left: 5 px;width: 10 px;height: 10 px;border - radius: 50 % ;border - right: 1 px solid# fff }.leo - comp--audio - player.volume66 > div: nth - child(4) { position: absolute;width: 14 px;height: 14 px;border - radius: 50 % ;border - right: 2 px solid# fff }.default.bar, .default.bg, .default.fg { border - radius: 20 px }.leo - comp--audio - player.volumeIcon: hover.volume, .leo - comp--audio - player.volumeIcon: hover.volume33, .leo - comp--audio - player.volumeIcon: hover.volume66, .leo - comp--audio - player.volumeIcon: hover.volumeMute { border - color: transparent# e1e1e1 }.leo - comp--audio - player.volumeIcon: hover.volume33 > div: nth - child(1), .leo - comp--audio - player.volumeIcon: hover.volume66 > div: nth - child(1), .leo - comp--audio - player.volumeIcon: hover.volume > div: nth - child(1), .leo - comp--audio - player.volumeIcon: hover.volumeMute > div: nth - child(1) { background: #e1e1e1 }.leo - comp--btn > button, .leo - comp--sprite - text { background - repeat: no - repeat; background - size: 100 % 100 % }.leo - comp--audio - player.volumeIcon: hover.volume33 > div: nth - child(2), .leo - comp--audio - player.volumeIcon: hover.volume66 > div: nth - child(2), .leo - comp--audio - player.volumeIcon: hover.volume > div: nth - child(2) { border - color: #e1e1e1 }.leo - comp--audio - player.volumeIcon: hover.volume33 > div: nth - child(3), .leo - comp--audio - player.volumeIcon: hover.volume66 > div: nth - child(3), .leo - comp--audio - player.volumeIcon: hover.volume66 > div: nth - child(4) { border - right - color: #e1e1e1 }.leo - comp--audio - player.bar: hover { border - color: #fff }.leo - comp--audio - player.bar.cursor: hover, .leo - comp--audio - player.bar: hover.cursor { background - color: #e1e1e1 }.leo - comp--audio - player.playButton > div: hover { border - left - color: #e1e1e1 }.leo - comp--audio - player.pauseButton > div: hover { border - color: #e1e1e1 }.leo - comp--audio - player.loadButton > div: hover { border - color: transparent# e1e1e1# e1e1e1 } @ - webkit - keyframes leo - comp--audio - loading { from { -webkit - transform: rotate(0); transform: rotate(0) } to { -webkit - transform: rotate(360 deg); transform: rotate(360 deg) } } @keyframes leo - comp--audio - loading { from { -webkit - transform: rotate(0); transform: rotate(0) } to { -webkit - transform: rotate(360 deg); transform: rotate(360 deg) } }.default { width: 400 px;height: 30 px }.default.time { left: 250 px;font - size: 15 px;line - height: 30 px }.default.bar { height: 10 px;top: 10 px }.default.cursor { height: 14 px;top: -3 px }.default.progressbar { left: 40 px;width: 200 px }.default.progressbar.cursor { width: 10 % ;border - radius: 50 px }.default.volumebar { left: 325 px;width: 60 px }.default.volumebar.cursor { width: 14 px;border - radius: 50 % }.default.loadButton, .default.pauseButton, .default.playButton { left: 7 px }.default.playButton > div { border - width: 8 px 0 8 px 14 px; top: 7 px; left: 9 px }.default.pauseButton > div { width: 12 px;height: 14 px;top: 8 px;left: 8 px }.default.loadButton > div { height: 14 px;width: 14 px;left: 8 px;top: 8 px }.default.volumeIcon { left: 290 px }.default.volume, .default.volume33, .default.volume66, .default.volumeMute { width: 9 px;height: 18 px;left: 5 px;top: 6 px }.default.volume33 > div: nth - child(1), .default.volume66 > div: nth - child(1), .default.volume > div: nth - child(1), .default.volumeMute > div: nth - child(1) { height: 8 px }.default.volume33 > div: nth - child(2), .default.volume66 > div: nth - child(2), .default.volume > div: nth - child(2) { top: 1 px }.default.volume33 > div: nth - child(3), .default.volume66 > div: nth - child(3) { top: -1 px }.default.volume66 > div: nth - child(4) { top: -3 px;left: 6 px }.mini { width: 62 px;height: 30 px;box - shadow: inset 0 16 px 20 px rgba(188, 188, 188, .3), inset 0 1 px 1 px - 1 px# a0a0a0;border: 1 px solid #202020}.mini .loadButton,.mini .pauseButton,.mini .playButton{width:29px;height:29px;border-right:1px solid rgba(0,0,0,.39);box-shadow:2px 0 1px -1px rgba(255,255,255,.28)}.mini .loadButton:hover,.mini .pauseButton:hover,.mini .playButton:hover,.mini .volumeIcon:hover{background-color:rgba(255,255,255,.3)}.mini .playButton>div{border-width:7px 0 7px 8px;top:7px;left:12px}.mini .pauseButton>div{width:10px;height:12px;top:8px;left:10px}.mini .loadButton>div{height:12px;width:12px;left:9px;top:9px}.mini .volumeIcon{left:29px;height:28px;width:31px}.mini .volume,.mini .volume33,.mini .volume66,.mini .volumeMute{width:9px;height:16px;top:6px;left:5px}.mini .volume33>div:nth-child(1),.mini .volume66>div:nth-child(1),.mini .volume>div:nth-child(1),.mini .volumeMute>div:nth-child(1){height:6px}.mini .volume33>div:nth-child(2),.mini .volume66>div:nth-child(2),.mini .volume>div:nth-child(2){top:0}.mini .volume33>div:nth-child(3),.mini .volume66>div:nth-child(3){top:-2px}.mini .volume66>div:nth-child(4){top:-4px;left:5px}.simple{height:60px;width:200px}.simple .time{top:14px;right:10px;font-size:13px;line-height:20px}.simple .progressbar{top:9px;left:10px;width:180px;height:5px}.simple .volumebar{top:33px;left:86px;height:7px;width:60px}.simple .loadButton,.simple .pauseButton,.simple .playButton,.simple .volumeIcon{border:1px solid # fff;top: 21 px;left: 10 px;border - radius: 50 % }.simple.playButton > div { left: 10 px;border - width: 8 px 0 8 px 10 px;top: 6 px }.simple.pauseButton > div { width: 10 px;height: 12 px;top: 8 px;left: 9 px }.simple.loadButton > div { height: 12 px;width: 12 px;left: 8 px;top: 8 px }.simple.volumeIcon { top: 21 px;left: 48 px }.simple.volume, .simple.volume33, .simple.volume66, .simple.volumeMute { width: 9 px;height: 16 px;top: 6 px;left: 5 px }.simple.volume33 > div: nth - child(1), .simple.volume66 > div: nth - child(1), .simple.volume > div: nth - child(1), .simple.volumeMute > div: nth - child(1) { height: 6 px }.simple.volume33 > div: nth - child(2), .simple.volume66 > div: nth - child(2), .simple.volume > div: nth - child(2) { top: 0 }.simple.volume33 > div: nth - child(3), .simple.volume66 > div: nth - child(3) { top: -2 px }.simple.volume66 > div: nth - child(4) { top: -4 px;left: 5 px }.classical { box - shadow: inset 0 16 px 20 px rgba(188, 188, 188, .3), inset 0 1 px 1 px - 1 px# a0a0a0; border: 1 px solid #202020;width:400px;height:32px}.classical .time{left:250px;line-height:30px;border-right:1px solid rgba(0,0,0,.39);box-shadow:2px 0 1px -1px rgba(255,255,255,.28);padding:0 6px;font-size:14px}.classical .bar{border-radius:3px;border:0;box-shadow:inset 0 1px 1px # 0 C0C0C, inset - 1 px - 1 px 1 px #747474;top:10px;overflow:hidden}.classical .bg,.classical .fg{border-top-left-radius:3px;border-bottom-left-radius:3px}.classical .bg{box-shadow:inset 0 1px 1px # 242424, inset - 1 px - 1 px 1 px #909090}.classical .fg{background-color:# 00 daff; background - image: -webkit - linear - gradient(right, #6B52FF,# 00 daff, #aef2ff); background - image: linear - gradient(to left, #6B52FF,# 00 daff, #aef2ff); height: 9 px; top: 1 px }.classical.progressbar { left: 40 px;width: 210 px;height: 10 px }.classical.volumebar { left: 328 px;width: 56 px;height: 10 px }.classical.loadButton, .classical.pauseButton, .classical.playButton { width: 30 px;height: 31 px;border - right: 1 px solid rgba(0, 0, 0, .39);box - shadow: 2 px 0 1 px - 1 px rgba(255, 255, 255, .28) }.classical.playButton > div { border - width: 8 px 0 8 px 10 px; left: 11 px; top: 7 px }.classical.pauseButton > div { width: 10 px;height: 12 px;top: 9 px;left: 10 px }.classical.loadButton > div { height: 12 px;width: 12 px;left: 9 px;top: 9 px }.classical.volumeIcon { left: 300 px }.classical.volume, .classical.volume33, .classical.volume66, .classical.volumeMute { width: 9 px;height: 16 px;top: 7 px;left: 5 px }.classical.volume33 > div: nth - child(1), .classical.volume66 > div: nth - child(1), .classical.volume > div: nth - child(1), .classical.volumeMute > div: nth - child(1) { height: 6 px }.classical.volume33 > div: nth - child(2), .classical.volume66 > div: nth - child(2), .classical.volume > div: nth - child(2) { top: 0 }.classical.volume33 > div: nth - child(3), .classical.volume66 > div: nth - child(3) { top: -2 px }.classical.volume66 > div: nth - child(4) { top: -4 px;left: 5 px }.leo - comp--BGM { display: none!important }.leo - comp--btn { border: 0 }.leo - comp--btn > button { position: absolute;left: 0;top: 0;padding: 0;margin: 0;line - height: 1.42857143;border - style: solid;white - space: nowrap;background - image: none;background - color: transparent;user - select: none; - ms - touch - action: manipulation;touch - action: manipulation;cursor: inherit }.leo - comp--btn > button[disable] { pointer - events: none; box - shadow: none }.leo - comp--btn: not(.leo - com--btn__has - bg) > button: active { box - shadow: inset 0 3 px 5 px rgba(0, 0, 0, .125) }.leo - comp--btn.leo - comp--btn__has - bg > button { border - style: none!important; background - color: transparent!important }.leo - comp--btn.leo - comp--btn__has - bg > button: active { -webkit - transform: translate(1 px, 1 px); - ms - transform: translate(1 px, 1 px); transform: translate(1 px, 1 px) }.leo - comp--btn.leo - comp--btn__has - bg > button::before { content: "";position: absolute;left: 0;top: 0;right: 0;bottom: 0;background - color: rgba(255, 255, 255, .08); - webkit - transition: all .2 s ease - in -out;transition: all .2 s ease - in -out;width: 0;margin: auto }.leo - comp--btn.leo - comp--btn__has - bg > button: hover::before { width: 100 % }.leo - comp--html - embed - box { background - color: #fff }.embed - web--container { position: absolute;width: 100 % ;height: 100 % ;overflow: hidden;left: 0;top: 0;z - index: 999999;background - color: #ccc }.embed - web--iframe { position: absolute;top: 0;left: 0;width: 100 % ;height: 100 % ;border: 0;z - index: 1;zoom: 1 }.embed - web--toolbar, .embed - web--toolbar - cover { width: 100 % ;height: 50 px;z - index: 2;position: absolute;left: 0;bottom: 0 }.embed - web--toolbar { background - color: rgba(0, 0, 0, .8); - webkit - transition: all .3 s; transition: all .3 s }.toolbar--fs { position: absolute;cursor: pointer;width: 32 px;height: 28 px;right: 30 px;top: 11 px;background - image: url(assets.png);background - position: -444 px - 287 px }.leo - comp - flash { overflow: hidden }.leo - comp - flash object { position: absolute;left: 0;top: 0;zoom: 1 }.leo - comp--img { border: 0 solid;overflow: hidden }.leo - comp--img img { position: absolute;opacity: 0;z - index: -1 }.leo_reflection { position: absolute;left: 0;top: 0;pointer - events: none }.leo - comp--media, .leo - lightbox--html5video, .leo - lightbox--vimeo, .leo - lightbox--youtube { background - color: #2d2d2d}.leo-comp--media:before,.leo-lightbox--html5video:before,.leo-lightbox--vimeo:before,.leo-lightbox--youtube:before{content:"";position:absolute;left:0;top:0;right:0;bottom:0;margin:auto;background-repeat:no-repeat;background-position:center center;z-index:1}.leo-comp--media iframe,.leo-comp--media video,.leo-lightbox--html5video iframe,.leo-lightbox--html5video video,.leo-lightbox--vimeo iframe,.leo-lightbox--vimeo video,.leo-lightbox--youtube iframe,.leo-lightbox--youtube video{position:absolute;width:100%;height:100%;left:0;top:0;z-index:2}.leo-comp--youtube:before,.leo-lightbox--youtube:before{background-image:url(assets.png);background-position:0 -250px;width:128px;height:128px}.leo-comp--vimeo:before,.leo-lightbox--vimeo:before{background-image:url(assets.png);background-position:-128px -250px;width:128px;height:128px}.leo-comp--html5video:before,.leo-lightbox--html5video:before{background-image:url(assets.png);background-position:-256px -250px;width:128px;height:128px}.leo-comp--movingbackground{overflow:hidden}.leo-comp--movingbackground canvas{width:100%;height:100%;-webkit-transform:translateZ(0);transform:translateZ(0)}.leo-comp--moving-object-img{position:absolute;left:0;top:0;width:100%;height:100%}.leo-comp--paypaldiscount{text-align:center}.leo-comp--paypaldiscount>img{position:absolute;left:0;top:0;height:100%;width:100%}.leo-comp--paypaldiscount>div{position:relative;top:0;height:100%;text-align:center;white-space:nowrap;text-rendering:optimizeLegibility;text-shadow:1px 1px 1px # 000 }.leo - comp--paypaldiscount > span { margin: 6 px }.leo - comp--paypalprice { user - select: none; - webkit - user - drag: none }.leo - comp--slide, .ppproduct--thumbnail { -webkit - user - select: none; - ms - user - select: none; - webkit - user - drag: none }.leo - comp--paypalprice p { margin: 0 }.leo - comp--paypalprice > img { position: absolute;top: 0;left: 0;width: 100 % ;height: 100 % ; - webkit - animation: paypalpricerotate 40 s infinite linear;animation: paypalpricerotate 40 s infinite linear;z - index: 1 }.leo - comp--paypalprice > div { white - space: nowrap; text - shadow: 1 px 1 px 1 px #000;position:absolute;z-index:2}@-webkit-keyframes paypalpricerotate{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes paypalpricerotate{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.leo-comp--paypalproductbox>img{position:absolute;top:-1px;right:-1px;z-index:702;display:none}.ppproduct--slide{position:absolute;top:0;left:0;width:100%;height:80%;border:10px solid}.ppproduct--slide>div{position:relative;width:100%;height:100%;left:0;top:0;overflow:hidden}.ppproduct--slide>div img{position:absolute;width:100%;height:100%;left:0;top:0}.ppproduct--thumbnail{position:absolute;bottom:0;z-index:5;width:100%;height:20%;overflow:hidden;user-select:none}.ppproduct--thumbnail>div{position:absolute;height:100%;width:999999px;box-sizing:border-box;border-top:10px solid transparent;-webkit-transition:all .3s ease;transition:all .3s ease}.ppproduct--thumbnail .active{border:2px solid # 317e e7 }.ppproduct--li { height: 100 % ;box - sizing: border - box;overflow: hidden;vertical - align: top;border: 1 px solid #919191;margin-right:10px;cursor:pointer;display:inline-block;background-color:# fff }.ppproduct--li > img { position: relative;width: 100 % ;height: 100 % }.leo - comp--paypalstar img { width: 20 % ;height: 100 % ;float: left }.leo - comp--paypalstar canvas { position: absolute;left: 0;top: 0 }.leo - comp--shape > svg { position: absolute }.leo - comp--shape__text { position: absolute;left: 0;top: 0;width: 100 % ;height: 100 % ;overflow: hidden;z - index: 10;word - break: break -word }.leo - comp--shape - rect { border - style: solid }.leo - comp--shape.shortcut { overflow: hidden; - webkit - transition: background .3 s;transition: background .3 s }.shortcut.shortcut--earth svg { -webkit - transform - origin: center; - ms - transform - origin: center; transform - origin: center; - webkit - transform: rotate(0); - ms - transform: rotate(0); transform: rotate(0); - webkit - transition: -webkit - transform .6 s; transition: transform .6 s }.shortcut.shortcut--earth: hover svg { -webkit - transform: rotate(360 deg); - ms - transform: rotate(360 deg); transform: rotate(360 deg) }.shortcut.shortcut--mail path: nth - child(1) { -webkit - transform - origin: top; - ms - transform - origin: top; transform - origin: top; - webkit - transform: rotate(0); - ms - transform: rotate(0); transform: rotate(0); - webkit - transition: -webkit - transform .3 s; transition: transform .3 s }.shortcut.shortcut--mail: hover path: nth - child(1) { -webkit - transform: rotateX(180 deg); transform: rotateX(180 deg) }.shortcut.shortcut--first path: nth - child(2) { -webkit - transform: translateX(0); - ms - transform: translateX(0); transform: translateX(0) }.shortcut.shortcut--first: hover path: nth - child(2) { -webkit - animation: shortcut--arrow - left .3 s; animation: shortcut--arrow - left .3 s }.shortcut.shortcut--last path: nth - child(2) { -webkit - transform: translateX(0); - ms - transform: translateX(0); transform: translateX(0) }.shortcut.shortcut--last: hover path: nth - child(2) { -webkit - animation: shortcut--arrow - right .3 s; animation: shortcut--arrow - right .3 s }.shortcut.shortcut--download path: nth - child(2) { -webkit - transform: translateY(0); - ms - transform: translateY(0); transform: translateY(0) }.shortcut.shortcut--download: hover path: nth - child(2) { -webkit - animation: shortcut--download .3 s; animation: shortcut--download .3 s } @ - webkit - keyframes shortcut--download { from { -webkit - transform: translateY(-100 px); transform: translateY(-100 px) } } @keyframes shortcut--download { from { -webkit - transform: translateY(-100 px); transform: translateY(-100 px) } }.shortcut.shortcut--arrow - left g { -webkit - transform: translateX(0); - ms - transform: translateX(0); transform: translateX(0) }.shortcut.shortcut--arrow - left: hover g { -webkit - animation: shortcut--arrow - left .3 s cubic - bezier(.18, .89, .32, 1.28); animation: shortcut--arrow - left .3 s cubic - bezier(.18, .89, .32, 1.28) } @ - webkit - keyframes shortcut--arrow - left { from { -webkit - transform: translateX(100 px); transform: translateX(100 px) } } @keyframes shortcut--arrow - left { from { -webkit - transform: translateX(100 px); transform: translateX(100 px) } }.shortcut.shortcut--arrow - right g { -webkit - transform: translateX(0); - ms - transform: translateX(0); transform: translateX(0) }.shortcut.shortcut--arrow - right: hover g { -webkit - animation: shortcut--arrow - right .3 s cubic - bezier(.18, .89, .32, 1.28); animation: shortcut--arrow - right .3 s cubic - bezier(.18, .89, .32, 1.28) } @ - webkit - keyframes shortcut--arrow - right { from { -webkit - transform: translateX(-100 px); transform: translateX(-100 px) } } @keyframes shortcut--arrow - right { from { -webkit - transform: translateX(-100 px); transform: translateX(-100 px) } }.shortcut.shortcut--share path: nth - child(2) { -webkit - transform: scale(1) translateX(0); - ms - transform: scale(1) translateX(0); transform: scale(1) translateX(0); - webkit - transform - origin: bottom; - ms - transform - origin: bottom; transform - origin: bottom }.shortcut.shortcut--share: hover path: nth - child(2) { -webkit - animation: shortcut--share .3 s cubic - bezier(.18, .89, .32, 1.28); animation: shortcut--share .3 s cubic - bezier(.18, .89, .32, 1.28) } @ - webkit - keyframes shortcut--share { from { -webkit - transform: scale(0) translateX(-35 px); transform: scale(0) translateX(-35 px) } } @keyframes shortcut--share { from { -webkit - transform: scale(0) translateX(-35 px); transform: scale(0) translateX(-35 px) } }.shortcut.shortcut--page { -webkit - perspective: 100 px; perspective: 100 px }.shortcut.shortcut--page > svg { -webkit - transform: rotateY(0); transform: rotateY(0); - webkit - transform - origin: 6 px 0 0; - ms - transform - origin: 6 px 0 0; transform - origin: 6 px 0 0 }.shortcut.shortcut--page: hover > svg { -webkit - animation: shortcut--page 1 s; animation: shortcut--page 1 s } @ - webkit - keyframes shortcut--page { 0 % , 100 % , 30 % {-webkit - transform: rotateY(0);transform: rotateY(0) } 15 % {-webkit - transform: rotateY(-10 deg);transform: rotateY(-10 deg) } 65 % {-webkit - transform: rotateY(-25 deg);transform: rotateY(-25 deg) } } @keyframes shortcut--page { 0 % , 100 % , 30 % {-webkit - transform: rotateY(0);transform: rotateY(0) } 15 % {-webkit - transform: rotateY(-10 deg);transform: rotateY(-10 deg) } 65 % {-webkit - transform: rotateY(-25 deg);transform: rotateY(-25 deg) } }.leo - comp--slide { user - select: none }.leo - comp--slide.slide--page { position: absolute;width: 100 % ;height: 100 % ;left: 0;top: 0;z - index: 1 }.leo - comp--slide.page--image { width: 100 % ;height: 100 % ;opacity: 0;z - index: 1 }.leo - slide--flow - 3 D { overflow: hidden; - webkit - user - select: none; - ms - user - select: none;user - select: none }.flow - 3 D--image - container { position: absolute;height: 100 % ;width: 100 % ; - webkit - perspective: 500 px;perspective: 500 px; - webkit - transform - style: preserve - 3 d;transform - style: preserve - 3 d;left: 0;top: 0 }.flow - 3 D--image { width: 50 % ;height: 80 % ;left: 0;top: 0;margin: auto;right: 0;bottom: 0 }.album--page, .album--page - out { position: absolute;width: 100 % ;height: 100 % ;left: 0;top: 0;border: 0 solid# fff;background - color: #fff }.album--page img, .album--page - out img { width: 100 % ;height: 100 % ;opacity: 0; - webkit - transition: opacity .5 s;transition: opacity .5 s }.leo - comp--base - slide { overflow: hidden;border: 0 solid }.leo - comp--base - slide.slide - ul { position: absolute;width: 9999999 px;height: 100 % }.leo - comp--base - slide.slide - li { position: relative;height: 100 % ;overflow: hidden;float: left }.leo - comp--base - slide.slide - li img { position: absolute;left: 0;top: 0;bottom: 0;right: 0;margin: auto }.leo - comp--base - slide.drag - cover { position: absolute;width: 100 % ;height: 100 % ;z - index: 1 }.slide--touch - controls.control { opacity: 1!important }.slide--controls > .control { position: absolute;height: 100 % ;z - index: 2;opacity: .5; - webkit - transition: opacity .3 s;transition: opacity .3 s;top: 0 }.slide--controls > .control: before { content: "";position: absolute;right: 0;left: 0;top: 0;bottom: 0;margin: auto;cursor: pointer }.slide--controls: hover.control { opacity: 1 }.slide--controls.control--prev { left: 0; - webkit - transform - origin: 0 50 % ; - ms - transform - origin: 0 50 % ;transform - origin: 0 50 % }.slide--controls.control--prev: before { width: 37 px;height: 37 px;background - image: url(assets.png);background - position: -384 px - 250 px }.slide--controls.control--prev: active: before, .slide--controls.control--prev: hover: before { background - image: url(assets.png); background - position: -400 px - 200 px }.slide--controls.control--next { right: 0; - webkit - transform - origin: 100 % 50 % ; - ms - transform - origin: 100 % 50 % ;transform - origin: 100 % 50 % }.slide--controls.control--next: before { left: -37 px;width: 37 px;height: 37 px;background - image: url(assets.png);background - position: -437 px - 200 px }.slide--controls.control--next: active: before, .slide--controls.control--next: hover: before { background - image: url(assets.png); background - position: -421 px - 250 px }.drag - slide { overflow: hidden }.drag - slide.slide--page, .fade - slide { border - style: solid }.flip - slide { -webkit - perspective: 600 px; perspective: 600 px }.flip - slide.slide--page { border - style: solid; - webkit - transform - style: preserve - 3 d; transform - style: preserve - 3 d; - webkit - backface - visibility: hidden; backface - visibility: hidden }.flip - slide.transform - stage { position: absolute;left: 0;top: 0;width: 100 % ;height: 100 % ; - webkit - transform - style: preserve - 3 d;transform - style: preserve - 3 d; - webkit - backface - visibility: hidden;backface - visibility: hidden }.moving - slide img { height: 100 % ;float: left;border: 0 solid }.swipe - slide.slide--page, .zoom - slide { border - style: solid }.swipe - slide { overflow: hidden }.zoom - slide { overflow: hidden }.leo - comp--sprite - text { position: absolute; - webkit - transform - origin: 0 0; - ms - transform - origin: 0 0;transform - origin: 0 0; - webkit - transform: scale(0); - ms - transform: scale(0);transform: scale(0); - webkit - transition: -webkit - transform .5 s ease - out;transition: transform .5 s ease - out;z - index: 3 }.leo - comp--sprite - text p { margin: 0;padding: 0;border: 0 }.leo - comp--sprite - text.inside { width: 100 % ;height: 100 % ;position: absolute;overflow: hidden;box - sizing: border - box;border - style: solid;border - color: transparent }.leo - comp--sprite - text.content { position: absolute;bottom: 0;margin: 0;min - height: 80 % ;width: 100 % ;word - wrap: break -word;word - break: break -word }.leo - comp--sprite - text.masking { position: absolute;width: 100 % ;height: 50 % ;z - index: 1 }.leo - comp--sprite - text.rect.black { background - image: -webkit - linear - gradient(top, #c9c8c8, rgba(201, 200, 200, 0)); background - image: linear - gradient(to bottom, #c9c8c8, rgba(201, 200, 200, 0)) }.leo - comp--sprite - text.rect.blue { background - image: -webkit - linear - gradient(top, #ddf8fe, rgba(221, 248, 254, 0)); background - image: linear - gradient(to bottom, #ddf8fe, rgba(221, 248, 254, 0)) }.leo - comp--sprite - text.rect.yellow { background - image: -webkit - linear - gradient(top, #fef8c9, rgba(254, 248, 201, 0)); background - image: linear - gradient(to bottom, #fef8c9, rgba(254, 248, 201, 0)) }.leo - comp--sprite - text.cloud.white { background - image: -webkit - linear - gradient(top, #f9f9f9, rgba(249, 249, 249, 0)); background - image: linear - gradient(to bottom, #f9f9f9, rgba(249, 249, 249, 0)) }.leo - comp--sprite - text.cloud.yellow { background - image: -webkit - linear - gradient(top, #fffee8, rgba(255, 254, 232, 0)); background - image: linear - gradient(to bottom, #fffee8, rgba(255, 254, 232, 0)) }.leo - comp--sprite - text.circle.blue { background - image: -webkit - linear - gradient(top, #d3eef4, rgba(211, 238, 244, 0)); background - image: linear - gradient(to bottom, #d3eef4, rgba(211, 238, 244, 0)) }.leo - comp--sprite - text.circle.yellow { background - image: -webkit - linear - gradient(top, #fffce4, rgba(255, 252, 228, 0)); background - image: linear - gradient(to bottom, #fffce4, rgba(255, 252, 228, 0)) }.leo - progress - wrapper { position: absolute;left: 0;top: 0;width: 100 % ;height: 0;z - index: 999;pointer - events: none;text - rendering: optimizeLegibility; - webkit - font - smoothing: antialiased }.leo - progress - bar, .leo - progress - spin { position: absolute }.leo - progress - bar { left: 0;top: 0;width: 0;height: 2 px;background - color: #29d}.leo-progress-bar>.leo-progress-bar--inner{position:absolute;right:0;top:0;width:100px;height:100%;-webkit-transform:rotate(3deg) translate(0,-4px);-ms-transform:rotate(3deg) translate(0,-4px);transform:rotate(3deg) translate(0,-4px);box-shadow:0 0 10px # 29 d, 0 0 5 px #29d}.leo-progress-spin{top:15px;right:15px}.leo-progress-spin>.leo-progress-spin--inner{width:18px;height:18px;box-sizing:border-box;border:2px solid transparent;border-top-color:# 29 d;border - left - color: #29d;border-radius:50%}.leo-comp--scene,.leo-comp--stage{width:0!important;height:0!important}